Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-11 00:08:30 +01:00
Code Issues Projects Releases Wiki Activity

Make accordion expand dependent on text width

Browse Source
This commit is contained in:
andreas-unleash 2022-07-20 13:01:25 +03:00
parent ffc0c0a229
commit e33ed6b8e7
2 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/component/common/ConstraintAccordion/ConstraintAccordionView/ConstraintAccordionView.tsx
View File

@ -35,26 +35,30 @@ export const ConstraintAccordionView = ({
constraint.operator
);
const handleChange =
() => (event: React.SyntheticEvent, isExpanded: boolean) => {
setExpanded((!isExpanded && expandable));
};
const handleClick = () => {
console.log('click')
if (expandable) {
setExpanded(!expanded);
}
};
return (
<Accordion
className={styles.accordion}
classes={{ root: styles.accordionRoot }}
expanded={expanded}
onChange={handleChange}
>
<AccordionSummary className={styles.summary} expandIcon={null}>
<AccordionSummary className={styles.summary} expandIcon={null} onClick={handleClick}>
<ConstraintAccordionViewHeader
compact={compact}
constraint={constraint}
onEdit={onEdit}
onDelete={onDelete}
singleValue={singleValue}
allowExpand={(shouldExpand) => setExpandable(shouldExpand)}
allowExpand={(shouldExpand) => {
console.log(shouldExpand)
setExpandable(shouldExpand)
}}
/>
</AccordionSummary>

4
frontend/src/component/common/ConstraintAccordion/ConstraintAccordionView/ConstraintAccordionViewHeader/ConstraintAccordionViewHeader.tsx
View File

@ -89,13 +89,13 @@ export const ConstraintAccordionViewHeader = ({
useEffect(() => {
if (elementRef && elementRef.current != null) {
console.log(elementRef.current.clientHeight);
console.log(elementRef.current.clientWidth);
setTextWidth(
Math.round(getTextWidth(elementRef.current.innerText) / 2) // 2 lines
);
setHeight(elementRef.current.clientHeight);
setWidth(elementRef.current.clientWidth);
console.log(textWidth)
console.log(width)
allowExpand(textWidth > width)
}
}, []);