From fff9c4c09b410a41a84a252eaaab64626a1127b3 Mon Sep 17 00:00:00 2001
From: David Sheldrick <d.j.sheldrick@gmail.com>
Date: Mon, 15 May 2023 11:02:24 +0100
Subject: [PATCH] [perf] deleteShapes  (#1373)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This PR extracts a static query for the page states that are used when
deleting a shape.

### Change Type

<!-- 💡 Indicate the type of change your pull request is. -->
<!-- 🤷‍♀️ If you're not sure, don't select anything -->
<!-- ✂️ Feel free to delete unselected options -->

<!-- To select one, put an x in the box: [x] -->

- [x] `patch` — Bug Fix

### Release Notes

- Perf improvement for deleting shapes in a document with lots of pages.
---
 packages/editor/src/lib/app/App.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/editor/src/lib/app/App.ts b/packages/editor/src/lib/app/App.ts
index f01dd9370..f4afba600 100644
--- a/packages/editor/src/lib/app/App.ts
+++ b/packages/editor/src/lib/app/App.ts
@@ -1296,6 +1296,10 @@ export class App extends EventEmitter<TLEventMap> {
 	// 	const update = this.getShapeUtil(next).onUpdate?.(prev, next)
 	// 	return update ?? next
 	// }
+	@computed
+	private get _allPageStates() {
+		return this.store.query.records('instance_page_state')
+	}
 
 	/** @internal */
 	private _shapeWillBeDeleted(deletedShape: TLShape) {
@@ -1312,8 +1316,8 @@ export class App extends EventEmitter<TLEventMap> {
 				this._unbindArrowTerminal(arrow, handleId)
 			}
 		}
+		const pageStates = this._allPageStates.value
 
-		const pageStates = this.store.query.records('instance_page_state').value
 		const deletedIds = new Set([deletedShape.id])
 		const updates = compact(
 			pageStates.map((pageState) => {