diff --git a/remix/app/components/Thingtime/Thingtime.tsx b/remix/app/components/Thingtime/Thingtime.tsx index 0447cd7..3b78eba 100644 --- a/remix/app/components/Thingtime/Thingtime.tsx +++ b/remix/app/components/Thingtime/Thingtime.tsx @@ -222,7 +222,7 @@ export const Thingtime = (props) => { return props?.path?.human || "" }, [props?.path]) - const path = React.useMemo(() => { + const renderedPath = React.useMemo(() => { if (humanPath?.includes?.("hidden")) { return null } @@ -230,6 +230,11 @@ export const Thingtime = (props) => { // take only path from before the string unique return humanPath.split?.("unique")?.[0] } + + return humanPath + }, [humanPath]) + + const path = React.useMemo(() => { return ( { fontSize="12px" wordBreak="break-all" > - {humanPath} + {renderedPath} ) - }, [humanPath, pl, props?.pathPl]) + }, [renderedPath, pl, props?.pathPl]) const handleMouseEvent = React.useCallback( (e) => { diff --git a/remix/app/components/Thingtime/ThingtimeDemo.tsx b/remix/app/components/Thingtime/ThingtimeDemo.tsx index cedd101..8b07928 100644 --- a/remix/app/components/Thingtime/ThingtimeDemo.tsx +++ b/remix/app/components/Thingtime/ThingtimeDemo.tsx @@ -39,9 +39,9 @@ export const ThingtimeDemo = (props) => { name: "three", }, ], - "...unique1": "I'm unique", - "...unique2": "I'm unique", - "...unique3": "I'm unique", + "Identical Keys unique1": "I'm unique 1", + "Identical Keys unique2": "I'm unique 2", + "Identical Keys unique3": "I'm unique 3", } const [demoThing, setDemoThing] = React.useState(thing)