Browse Source

fix: shape deserialize issue

Peng Xiao 3 years ago
parent
commit
eaba28e7ca

+ 1 - 1
src/main/frontend/extensions/tldraw.cljs

@@ -83,7 +83,7 @@
      (fn []
        (when (and tln name)
          (when-let [^js api (gobj/get tln "api")]
-           (when block-id
+           (when (parse-uuid block-id)
              (. api selectShapes block-id)
              (. api zoomToSelection))))
        nil) [name block-id tln])

+ 2 - 1
tldraw/packages/core/src/lib/TLHistory.ts

@@ -132,7 +132,8 @@ export class TLHistory<S extends TLShape = TLShape, K extends TLEventMap = TLEve
               } else {
                 // Create the shape
                 const ShapeClass = this.app.getShapeClass(serializedShape.type)
-                shapesToAdd.push(new ShapeClass(serializedShape))
+                const newShape = new ShapeClass(serializedShape)
+                shapesToAdd.push(newShape)
               }
             }
 

+ 8 - 5
tldraw/packages/core/src/lib/TLPage/TLPage.ts

@@ -36,10 +36,11 @@ export class TLPage<S extends TLShape = TLShape, E extends TLEventMap = TLEventM
     makeObservable(this)
 
     autorun(() => {
-      const newShapesNouncesMap = Object.fromEntries(
-        this.shapes.map(shape => [shape.id, shape.nonce])
-      )
-      if (this.lastShapesNounces) {
+      const newShapesNouncesMap =
+        this.shapes.length > 0
+          ? Object.fromEntries(this.shapes.map(shape => [shape.id, shape.nonce]))
+          : null
+      if (this.lastShapesNounces && newShapesNouncesMap) {
         const lastShapesNounces = this.lastShapesNounces
         const allIds = new Set([
           ...Object.keys(newShapesNouncesMap),
@@ -52,7 +53,9 @@ export class TLPage<S extends TLShape = TLShape, E extends TLEventMap = TLEventM
           this.cleanup(changedShapeIds)
         })
       }
-      this.lastShapesNounces = newShapesNouncesMap
+      if (newShapesNouncesMap) {
+        this.lastShapesNounces = newShapesNouncesMap
+      }
     })
   }
 

+ 8 - 3
tldraw/packages/core/src/lib/shapes/TLShape/TLShape.tsx

@@ -70,7 +70,7 @@ export interface TLHandleChangeInfo {
 }
 
 export abstract class TLShape<P extends TLShapeProps = TLShapeProps, M = any> {
-  constructor(props: Partial<P>) {
+  constructor(props: Partial<TLShapeModel<P>>) {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
     const type = this.constructor['id']
@@ -79,6 +79,7 @@ export abstract class TLShape<P extends TLShapeProps = TLShapeProps, M = any> {
     const defaultProps = this.constructor['defaultProps'] ?? {}
     this.type = type
     this.props = { scale: [1, 1], ...defaultProps, ...props }
+    this.nonce = props.nonce ?? Date.now()
     makeObservable(this)
   }
 
@@ -103,7 +104,7 @@ export abstract class TLShape<P extends TLShapeProps = TLShapeProps, M = any> {
   canEdit: TLFlag = false
   canBind: TLFlag = false
 
-  @observable nonce = Date.now()
+  @observable nonce: number
 
   bindingDistance = BINDING_DISTANCE
 
@@ -300,7 +301,11 @@ export abstract class TLShape<P extends TLShapeProps = TLShapeProps, M = any> {
     return props
   }
 
-  @action update = (props: Partial<TLShapeProps & P & any>, isDeserializing = false, skipNounce = false) => {
+  @action update = (
+    props: Partial<TLShapeProps & P & any>,
+    isDeserializing = false,
+    skipNounce = false
+  ) => {
     if (!(isDeserializing || this.isDirty)) this.setIsDirty(true)
     if (!isDeserializing && !skipNounce) this.incNonce()
     Object.assign(this.props, this.validateProps(props as Partial<TLShapeProps> & Partial<P>))