diff --git a/packages/tldraw/src/Tldraw.tsx b/packages/tldraw/src/Tldraw.tsx index a80ad2205..3548ceff6 100644 --- a/packages/tldraw/src/Tldraw.tsx +++ b/packages/tldraw/src/Tldraw.tsx @@ -178,6 +178,7 @@ export function Tldraw({ onAssetCreate, onExport, }) + setSId(id) setApp(newApp) @@ -187,6 +188,7 @@ export function Tldraw({ // are the same, or else load a new document if the ids are different. React.useEffect(() => { if (!document) return + if (document.id === app.document.id) { app.updateDocument(document) } else { diff --git a/packages/tldraw/src/state/StateManager/StateManager.ts b/packages/tldraw/src/state/StateManager/StateManager.ts index da2b53de5..87db0de2e 100644 --- a/packages/tldraw/src/state/StateManager/StateManager.ts +++ b/packages/tldraw/src/state/StateManager/StateManager.ts @@ -98,6 +98,8 @@ export class StateManager> { // why is this necessary? but it is... const prevEmpty = this._state.appState.isEmptyCanvas + next = this.migrate(next) + this._state = deepCopy(next) this._snapshot = deepCopy(next) @@ -160,6 +162,10 @@ export class StateManager> { // Internal API --------------------------------- + protected migrate = (next: T): T => { + return next + } + /** * Perform any last changes to the state before updating. * Override this on your extending class. diff --git a/packages/tldraw/src/state/TldrawApp.ts b/packages/tldraw/src/state/TldrawApp.ts index 558f23598..007b16796 100644 --- a/packages/tldraw/src/state/TldrawApp.ts +++ b/packages/tldraw/src/state/TldrawApp.ts @@ -265,6 +265,13 @@ export class TldrawApp extends StateManager { /* -------------------- Internal -------------------- */ + protected migrate = (state: TDSnapshot): TDSnapshot => { + return { + ...state, + document: migrate(state.document, TldrawApp.version), + } + } + protected onReady = () => { this.loadDocument(this.document) diff --git a/packages/tldraw/src/state/data/migrate.ts b/packages/tldraw/src/state/data/migrate.ts index 47158f0b0..dfa069f92 100644 --- a/packages/tldraw/src/state/data/migrate.ts +++ b/packages/tldraw/src/state/data/migrate.ts @@ -25,13 +25,15 @@ export function migrate(document: TDDocument, newVersion: number): TDDocument { shape.parentId = page.id } - if (children) { + if (shape.type === TDShapeType.Group && children) { children.forEach((childId) => { if (!page.shapes[childId]) { console.warn('Encountered a parent with a missing child!', shape.id, childId) children?.splice(children.indexOf(childId), 1) } }) + + // TODO: Remove the shape if it has no children } }) )