From 47070ec10916f4fb03cd30acc1c4efbe22c6a056 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mitja=20Bezen=C5=A1ek?= <mitja.bezensek@gmail.com>
Date: Thu, 18 Apr 2024 10:01:46 +0200
Subject: [PATCH] Use computed cache for getting the parent child relationships
 (#3508)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Use the existing computed cache for parent child relationships instead
of creating it.

Tiny bit faster, less memory, and simpler.

### Change Type

<!-- ❗ Please select a 'Scope' label ❗️ -->

- [ ] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [x] `internal` — Does not affect user-facing stuff

<!-- ❗ Please select a 'Type' label ❗️ -->

- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [x] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
---
 packages/editor/src/lib/editor/Editor.ts | 37 +++++-------------------
 1 file changed, 8 insertions(+), 29 deletions(-)

diff --git a/packages/editor/src/lib/editor/Editor.ts b/packages/editor/src/lib/editor/Editor.ts
index 8a0ae7235..e4e9fa1bf 100644
--- a/packages/editor/src/lib/editor/Editor.ts
+++ b/packages/editor/src/lib/editor/Editor.ts
@@ -4556,28 +4556,11 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 * @public
 	 */
 	@computed getCurrentPageShapesSorted(): TLShape[] {
-		const shapes = this.getCurrentPageShapes().sort(sortByIndex)
-		const parentChildMap = new Map<TLShapeId, TLShape[]>()
 		const result: TLShape[] = []
-		const topLevelShapes: TLShape[] = []
-		let shape: TLShape, parent: TLShape | undefined
-
-		for (let i = 0, n = shapes.length; i < n; i++) {
-			shape = shapes[i]
-			parent = this.getShape(shape.parentId)
-			if (parent) {
-				if (!parentChildMap.has(parent.id)) {
-					parentChildMap.set(parent.id, [])
-				}
-				parentChildMap.get(parent.id)!.push(shape)
-			} else {
-				// undefined if parent is a shape
-				topLevelShapes.push(shape)
-			}
-		}
+		const topLevelShapes = this.getSortedChildIdsForParent(this.getCurrentPageId())
 
 		for (let i = 0, n = topLevelShapes.length; i < n; i++) {
-			pushShapeWithDescendants(topLevelShapes[i], parentChildMap, result)
+			pushShapeWithDescendants(this, topLevelShapes[i], result)
 		}
 
 		return result
@@ -8875,16 +8858,12 @@ function applyPartialToShape<T extends TLShape>(prev: T, partial?: TLShapePartia
 	return next
 }
 
-function pushShapeWithDescendants(
-	shape: TLShape,
-	parentChildMap: Map<TLShapeId, TLShape[]>,
-	result: TLShape[]
-): void {
+function pushShapeWithDescendants(editor: Editor, id: TLShapeId, result: TLShape[]): void {
+	const shape = editor.getShape(id)
+	if (!shape) return
 	result.push(shape)
-	const children = parentChildMap.get(shape.id)
-	if (children) {
-		for (let i = 0, n = children.length; i < n; i++) {
-			pushShapeWithDescendants(children[i], parentChildMap, result)
-		}
+	const childIds = editor.getSortedChildIdsForParent(id)
+	for (let i = 0, n = childIds.length; i < n; i++) {
+		pushShapeWithDescendants(editor, childIds[i], result)
 	}
 }