run prettier

This commit is contained in:
lucataglia 2023-05-22 12:47:55 +02:00
parent 4574eb0c62
commit a4aac76d5a
4 changed files with 44 additions and 22 deletions

View File

@ -118,37 +118,46 @@ export default function JSONNestedNode(props: Props) {
const [defaultExpanded] = useState<boolean>( const [defaultExpanded] = useState<boolean>(
// calculate individual node expansion if necessary // calculate individual node expansion if necessary
isCircular isCircular
? false ? false
: (function getDefault(){ : (function getDefault() {
switch (shouldExpandNode) { switch (shouldExpandNode) {
case 'expand': return true; case 'expand':
case 'collapse': return false; return true;
default: return shouldExpandNodeInitially(keyPath, data, level); case 'collapse':
} return false;
})() default:
return shouldExpandNodeInitially(keyPath, data, level);
}
})()
); );
const [, setTriggerReRender] = useState<boolean>(defaultExpanded); const [, setTriggerReRender] = useState<boolean>(defaultExpanded);
/** /**
* Used the useRef to handle expanded because calling a setState in a recursive implementation * Used the useRef to handle expanded because calling a setState in a recursive implementation
* could lead to a "Maximum update depth exceeded" error */ * could lead to a "Maximum update depth exceeded" error */
const expandedRef = useRef<boolean>(defaultExpanded) const expandedRef = useRef<boolean>(defaultExpanded);
switch (shouldExpandNode) { switch (shouldExpandNode) {
case 'expand': expandedRef.current = isCircular ? false : true; break; case 'expand':
case 'collapse': expandedRef.current = false; break; expandedRef.current = isCircular ? false : true;
case 'default': expandedRef.current = defaultExpanded; break; break;
case 'collapse':
expandedRef.current = false;
break;
case 'default':
expandedRef.current = defaultExpanded;
break;
default: //Do nothing; default: //Do nothing;
} }
const handleClick = useCallback(() => { const handleClick = useCallback(() => {
if (expandable) { if (expandable) {
expandedRef.current = !expandedRef.current expandedRef.current = !expandedRef.current;
setTriggerReRender((e) => !e) setTriggerReRender((e) => !e);
setEnableDefaultButton(true); setEnableDefaultButton(true);
setShouldExpandNode(undefined) setShouldExpandNode(undefined);
} }
}, [expandable, setEnableDefaultButton, setShouldExpandNode]); }, [expandable, setEnableDefaultButton, setShouldExpandNode]);
@ -169,7 +178,12 @@ export default function JSONNestedNode(props: Props) {
createItemString(data, collectionLimit), createItemString(data, collectionLimit),
keyPath keyPath
); );
const stylingArgs = [keyPath, nodeType, expandedRef.current, expandable] as const; const stylingArgs = [
keyPath,
nodeType,
expandedRef.current,
expandable,
] as const;
return hideRoot ? ( return hideRoot ? (
<li {...styling('rootNode', ...stylingArgs)}> <li {...styling('rootNode', ...stylingArgs)}>

View File

@ -58,7 +58,7 @@ const getDefaultThemeStyling = (theme: Base16Theme): StylingConfig => {
WebkitUserSelect: 'none', WebkitUserSelect: 'none',
backgroundColor: colors.BACKGROUND_COLOR, backgroundColor: colors.BACKGROUND_COLOR,
}, },
expandable: { expandable: {
color: colors.TEXT_COLOR, color: colors.TEXT_COLOR,
backgroundColor: colors.BACKGROUND_COLOR, backgroundColor: colors.BACKGROUND_COLOR,

View File

@ -24,7 +24,11 @@ interface Props {
const ExpandableButtonsContext = createContext<Context>({} as Context); const ExpandableButtonsContext = createContext<Context>({} as Context);
function ExpandableButtonsContextProvider({ expandable, children, styling }: Props) { function ExpandableButtonsContextProvider({
expandable,
children,
styling,
}: Props) {
const [enableDefaultButton, setEnableDefaultButton] = useState(false); const [enableDefaultButton, setEnableDefaultButton] = useState(false);
const [shouldExpandNode, setShouldExpandNode] = useState(); const [shouldExpandNode, setShouldExpandNode] = useState();
@ -41,7 +45,9 @@ function ExpandableButtonsContextProvider({ expandable, children, styling }: Pro
return ( return (
<ExpandableButtonsContext.Provider value={value}> <ExpandableButtonsContext.Provider value={value}>
{children} {children}
{expandable && <ExpandableButtons expandable={expandable} styling={styling} />} {expandable && (
<ExpandableButtons expandable={expandable} styling={styling} />
)}
</ExpandableButtonsContext.Provider> </ExpandableButtonsContext.Provider>
); );
} }

View File

@ -17,6 +17,8 @@ describe('JSONTree', () => {
const result = render(<JSONTree data={BASIC_DATA} />); const result = render(<JSONTree data={BASIC_DATA} />);
expect(result.type).toBe('ul'); expect(result.type).toBe('ul');
expect(result.props.children.type.name).toBe(ExpandableButtonsContextProvider.name); expect(result.props.children.type.name).toBe(
ExpandableButtonsContextProvider.name
);
}); });
}); });