Use computed cache for getting the parent child relationships (#3508)

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

@@ -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[] = []
+		const topLevelShapes = this.getSortedChildIdsForParent(this.getCurrentPageId())
-		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)
-			}
-		}
 
 		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(
+function pushShapeWithDescendants(editor: Editor, id: TLShapeId, result: TLShape[]): void {
-	shape: TLShape,
+	const shape = editor.getShape(id)
-	parentChildMap: Map<TLShapeId, TLShape[]>,
+	if (!shape) return
-	result: TLShape[]
-): void {
 	result.push(shape)
-	const children = parentChildMap.get(shape.id)
+	const childIds = editor.getSortedChildIdsForParent(id)
-	if (children) {
+	for (let i = 0, n = childIds.length; i < n; i++) {
-		for (let i = 0, n = children.length; i < n; i++) {
+		pushShapeWithDescendants(editor, childIds[i], result)
-			pushShapeWithDescendants(children[i], parentChildMap, result)
-		}
 	}
 }