feat: feature/999

This commit is contained in:
Nikolaj Frey 2023-08-17 20:41:40 +10:00
parent d8343fdd40
commit 2a7995c363
3 changed files with 44 additions and 85 deletions

View File

@ -82,33 +82,6 @@ Content.Nested Content = New Nested Content!
// const initialThingtime = createInitialThingtime()
const initialThingtime = smarts.merge(initialValues, force)
// TODO: Make localStorage be loaded first before initialValues if local version exists
// and is valid
// Issue seems to be server id is different to client hydration
// let thingtimeToUse = initialThingtime
// try {
// const thingtimeFromLocalStorage = window.localStorage.getItem("thingtime")
// if (thingtimeFromLocalStorage) {
// const parsed = parse(thingtimeFromLocalStorage)
// if (parsed) {
// const localIsValid = !parsed.version || parsed.version >= force.version
// if (localIsValid) {
// const newThingtime = smarts.merge(force, parsed)
// thingtimeToUse = newThingtime
// } else {
// const withVersionUpdates = smarts.merge(newVersionData, parsed)
// const newThingtime = smarts.merge(force, withVersionUpdates)
// thingtimeToUse = newThingtime
// }
// }
// }
// } catch (err) {
// console.error("Caught error restoring thingtime from localstorage", err)
// }
// initialise thingtime
initialThingtime.thingtime = initialThingtime
initialThingtime.tt = initialThingtime
@ -151,20 +124,8 @@ export const ThingtimeProvider = (props: any): JSX.Element => {
// nothing
}
// if last undoHistory does not equal new undo history
// console.log(
// "ThingtimeProvider saving to undo history undoHistory[undoHistory.length - 1]?.value",
// undoHistory[undoHistory.length - 1]?.value
// )
// console.log(
// "ThingtimeProvider saving to undo history stringified",
// stringified
// )
if (undoHistory[undoHistory.length - 1]?.value !== stringified) {
try {
// console.log(
// "ThingtimeProvider saving to undo history undoHistory",
// undoHistory
// )
const limit = newThingtimeReference?.settings?.undoLimit || 999
if (undoHistory?.length > limit) {
@ -181,8 +142,6 @@ export const ThingtimeProvider = (props: any): JSX.Element => {
// nothing
}
}
// window.localStorage.setItem("thingtime", stringified)
// }, 600)
} catch (err) {
console.error("There was an error saving thingtime to localStorage")
}
@ -205,21 +164,8 @@ export const ThingtimeProvider = (props: any): JSX.Element => {
} catch {
// nothing
}
// if last redoHistory does not equal new redo history
// console.log(
// "ThingtimeProvider saving to redo history redoHistory[redoHistory.length - 1]?.value",
// redoHistory[redoHistory.length - 1]?.value
// )
// console.log(
// "ThingtimeProvider saving to redo history stringified",
// stringified
// )
if (redoHistory[redoHistory.length - 1]?.value !== stringified) {
try {
// console.log(
// "ThingtimeProvider saving to redo history redoHistory",
// redoHistory
// )
const limit = newThingtimeReference?.settings?.redoLimit || 999
if (redoHistory?.length > limit) {
@ -236,8 +182,6 @@ export const ThingtimeProvider = (props: any): JSX.Element => {
// nothing
}
}
// window.localStorage.setItem("thingtime", stringified)
// }, 600)
} catch (err) {
console.error("There was an error saving thingtime to localStorage")
}

View File

@ -287,13 +287,24 @@ export const Thingtime = (props) => {
}
}, [thing, thingDep, type, chakras, keys])
const hasChakraChildren = React.useMemo(() => {
return !props?.edit && chakra && render && thing?.children
}, [chakra, props?.edit, render, thing?.children])
const renderChakra = React.useMemo(() => {
if (!props?.edit && chakra && render) {
return true
}
return false
}, [chakra, props?.edit, render])
const keysToUse = React.useMemo(() => {
if (!props?.edit && chakra) {
if (renderChakra) {
return ["children"]
}
return keys
}, [chakra, keys, props?.edit])
}, [hasChakraChildren, keys])
// const keysToUse = flattenedKeys
const template1Modes = React.useMemo(() => {
@ -357,7 +368,7 @@ export const Thingtime = (props) => {
notRoot
fullPath={fullPath + "." + key?.key}
path={key}
chakra={chakra}
chakraChildren={chakra}
thing={nextThing}
// thing={{ infinite: { yes: true } }}
valuePl={pl}
@ -383,11 +394,9 @@ export const Thingtime = (props) => {
console.log("Thingtime found thing?.props", fullPath, thing?.props)
const ret = (
<Safe {...props}>
<ChakraComponent {...(thing?.props || {})}>
{inner}
</ChakraComponent>
</Safe>
)
return ret
}
@ -396,22 +405,27 @@ export const Thingtime = (props) => {
}
}
// TODO: Is it safe to spread props
// because having props as a dependency will cause a re-render every time
if (props?.chakraChildren) {
return inner
}
return (
<Safe {...props}>
<Flex
className="nested-things"
position="relative"
flexDirection="column"
rowGap={9}
rowGap={!chakra ? 9 : 0}
// w={'500px'}
// w={['200px', '500px']}
maxWidth="100%"
paddingLeft={valuePl}
paddingY={props?.path ? 4 : 0}
paddingY={!chakra && props?.path ? 4 : 0}
>
{inner}
</Flex>
</Safe>
)
}
}, [
@ -420,13 +434,15 @@ export const Thingtime = (props) => {
circular,
seen,
type,
props?.chakraChildren,
props?.path,
props?.edit,
chakra,
fullPath,
render,
depth,
thing,
thingDep,
props,
valuePl,
pl,
keys,
@ -697,9 +713,9 @@ export const Thingtime = (props) => {
const [showContextIcon, setShowContextIcon] = React.useState(false)
// if (render && depth >= 1) {
// return thingtimeChildren
// }
if (props?.chakraChildren) {
return thingtimeChildren
}
return (
<Safe {...props} depth={depth} uuid={uuid}>
@ -720,7 +736,7 @@ export const Thingtime = (props) => {
data-path={props?.path}
>
{/* {uuid?.current} */}
{!chakras && (
{!chakras && !chakra && (
<Flex position="relative" flexDirection="row">
<Flex
alignItems="center"

View File

@ -70,7 +70,6 @@ export const ThingtimeURL = (props) => {
path={path}
thing={thing}
render
chakra
chakras={{ marginY: 200 }}
width="600px"
></Thingtime>