Unwrap the Layout enum to replace it with the WidgetLayout struct now called Layout (#3448)

frontend/src/state-providers/dialog.ts

@@ -2,25 +2,17 @@ import { writable } from "svelte/store";
 
 import { type Editor } from "@graphite/editor";
 import { type IconName } from "@graphite/icons";
-import {
-	DisplayDialog,
-	DisplayDialogDismiss,
-	UpdateDialogButtons,
-	UpdateDialogColumn1,
-	UpdateDialogColumn2,
-	patchWidgetLayout,
-	TriggerDisplayThirdPartyLicensesDialog,
-	type LayoutGroup,
-} from "@graphite/messages";
+import { DisplayDialog, DisplayDialogDismiss, UpdateDialogButtons, UpdateDialogColumn1, UpdateDialogColumn2, patchLayout, TriggerDisplayThirdPartyLicensesDialog } from "@graphite/messages";
+import type { Layout } from "@graphite/messages";
 
 export function createDialogState(editor: Editor) {
 	const { subscribe, update } = writable({
 		visible: false,
 		title: "",
 		icon: "" as IconName,
-		buttons: [] as LayoutGroup[],
-		column1: [] as LayoutGroup[],
-		column2: [] as LayoutGroup[],
+		buttons: [] as Layout,
+		column1: [] as Layout,
+		column2: [] as Layout,
 		// Special case for the crash dialog because we cannot handle button widget callbacks from Rust once the editor has panicked
 		panicDetails: "",
 	});
@@ -65,21 +57,21 @@ export function createDialogState(editor: Editor) {
 	});
 	editor.subscriptions.subscribeJsMessage(UpdateDialogButtons, (updateDialogButtons) => {
 		update((state) => {
-			patchWidgetLayout(state.buttons, updateDialogButtons);
+			patchLayout(state.buttons, updateDialogButtons);
 
 			return state;
 		});
 	});
 	editor.subscriptions.subscribeJsMessage(UpdateDialogColumn1, (updateDialogColumn1) => {
 		update((state) => {
-			patchWidgetLayout(state.column1, updateDialogColumn1);
+			patchLayout(state.column1, updateDialogColumn1);
 
 			return state;
 		});
 	});
 	editor.subscriptions.subscribeJsMessage(UpdateDialogColumn2, (updateDialogColumn2) => {
 		update((state) => {
-			patchWidgetLayout(state.column2, updateDialogColumn2);
+			patchLayout(state.column2, updateDialogColumn2);
 
 			return state;
 		});

frontend/src/state-providers/document.ts

@@ -4,7 +4,7 @@ import { writable } from "svelte/store";
 import { type Editor } from "@graphite/editor";
 
 import {
-	patchWidgetLayout,
+	patchLayout,
 	UpdateDocumentBarLayout,
 	UpdateDocumentModeLayout,
 	UpdateToolOptionsLayout,
@@ -13,18 +13,18 @@ import {
 	UpdateNodeGraphControlBarLayout,
 	UpdateGraphViewOverlay,
 	UpdateGraphFadeArtwork,
-	type LayoutGroup,
 } from "@graphite/messages";
+import type { Layout } from "@graphite/messages";
 
 export function createDocumentState(editor: Editor) {
 	const state = writable({
 		// Layouts
-		documentModeLayout: [] as LayoutGroup[],
-		toolOptionsLayout: [] as LayoutGroup[],
-		documentBarLayout: [] as LayoutGroup[],
-		toolShelfLayout: [] as LayoutGroup[],
-		workingColorsLayout: [] as LayoutGroup[],
-		nodeGraphControlBarLayout: [] as LayoutGroup[],
+		documentModeLayout: [] as Layout,
+		toolOptionsLayout: [] as Layout,
+		documentBarLayout: [] as Layout,
+		toolShelfLayout: [] as Layout,
+		workingColorsLayout: [] as Layout,
+		nodeGraphControlBarLayout: [] as Layout,
 		// Graph view overlay
 		graphViewOverlayOpen: false,
 		fadeArtwork: 100,
@@ -42,7 +42,7 @@ export function createDocumentState(editor: Editor) {
 		await tick();
 
 		update((state) => {
-			patchWidgetLayout(state.documentModeLayout, updateDocumentModeLayout);
+			patchLayout(state.documentModeLayout, updateDocumentModeLayout);
 			return state;
 		});
 	});
@@ -50,7 +50,7 @@ export function createDocumentState(editor: Editor) {
 		await tick();
 
 		update((state) => {
-			patchWidgetLayout(state.toolOptionsLayout, updateToolOptionsLayout);
+			patchLayout(state.toolOptionsLayout, updateToolOptionsLayout);
 			return state;
 		});
 	});
@@ -58,7 +58,7 @@ export function createDocumentState(editor: Editor) {
 		await tick();
 
 		update((state) => {
-			patchWidgetLayout(state.documentBarLayout, updateDocumentBarLayout);
+			patchLayout(state.documentBarLayout, updateDocumentBarLayout);
 			return state;
 		});
 	});
@@ -66,7 +66,7 @@ export function createDocumentState(editor: Editor) {
 		await tick();
 
 		update((state) => {
-			patchWidgetLayout(state.toolShelfLayout, updateToolShelfLayout);
+			patchLayout(state.toolShelfLayout, updateToolShelfLayout);
 			return state;
 		});
 	});
@@ -74,13 +74,13 @@ export function createDocumentState(editor: Editor) {
 		await tick();
 
 		update((state) => {
-			patchWidgetLayout(state.workingColorsLayout, updateWorkingColorsLayout);
+			patchLayout(state.workingColorsLayout, updateWorkingColorsLayout);
 			return state;
 		});
 	});
 	editor.subscriptions.subscribeJsMessage(UpdateNodeGraphControlBarLayout, (updateNodeGraphControlBarLayout) => {
 		update((state) => {
-			patchWidgetLayout(state.nodeGraphControlBarLayout, updateNodeGraphControlBarLayout);
+			patchLayout(state.nodeGraphControlBarLayout, updateNodeGraphControlBarLayout);
 			return state;
 		});
 	});