diff --git a/components/canvas/shape.tsx b/components/canvas/shape.tsx index 6c614b943..3fe958282 100644 --- a/components/canvas/shape.tsx +++ b/components/canvas/shape.tsx @@ -1,4 +1,4 @@ -import React, { useRef, memo, useEffect, useState } from 'react' +import React, { useRef, memo, useEffect } from 'react' import state, { useSelector } from 'state' import styled from 'styles' import { getShapeUtils } from 'state/shape-utils' @@ -14,12 +14,6 @@ interface ShapeProps { isSelecting: boolean } -function ShapeGuard(props: ShapeProps): JSX.Element { - const hasShape = useMissingShapeTest(props.id) - if (!hasShape) return null - return -} - function Shape({ id, isSelecting }: ShapeProps): JSX.Element { const rGroup = useRef(null) @@ -97,6 +91,21 @@ function Shape({ id, isSelecting }: ShapeProps): JSX.Element { ) } +function ShapeGuard(props: ShapeProps): JSX.Element { + const hasShape = useSelector( + (s) => tld.getShape(s.data, props.id) !== undefined + ) + + if (!hasShape) { + console.warn('missing shape!') + return null + } + + return +} + +export default memo(ShapeGuard) + interface RealShapeProps { id: string isParent: boolean @@ -197,19 +206,3 @@ const EventSoak = styled('use', { const StyledGroup = styled('g', { outline: 'none', }) - -export default memo(ShapeGuard) - -function useMissingShapeTest(id: string) { - const [isShape, setIsShape] = useState(true) - - useEffect(() => { - return state.onUpdate((s) => { - if (isShape && !tld.getShape(s.data, id)) { - setIsShape(false) - } - }) - }, [isShape, id]) - - return isShape -} diff --git a/state/sessions/transform-session.ts b/state/sessions/transform-session.ts index 3f4e475bd..899aea220 100644 --- a/state/sessions/transform-session.ts +++ b/state/sessions/transform-session.ts @@ -69,7 +69,7 @@ export default class TransformSession extends BaseSession { transformOrigin, }) - shapes[id] = { ...shape } + shapes[id] = deepClone(shape) } tld.updateParents(data, Object.keys(shapeBounds)) diff --git a/state/sessions/transform-single-session.ts b/state/sessions/transform-single-session.ts index d98a110ef..cf865e42b 100644 --- a/state/sessions/transform-single-session.ts +++ b/state/sessions/transform-single-session.ts @@ -53,7 +53,7 @@ export default class TransformSingleSession extends BaseSession { transformOrigin: [0.5, 0.5], }) - data.document.pages[data.currentPageId].shapes[shape.id] = { ...shape } + data.document.pages[data.currentPageId].shapes[shape.id] = deepClone(shape) tld.updateParents(data, [id]) }