Add deterministic widget ids

Author: TrueDoctor

editor/src/messages/layout/layout_message_handler.rs

@@ -5,6 +5,7 @@ use graphene_std::raster::color::Color;
 use graphene_std::text::Font;
 use graphene_std::vector::style::{FillChoice, GradientStops};
 use serde_json::Value;
+use std::collections::HashMap;
 
 #[derive(ExtractField)]
 pub struct LayoutMessageContext<'a> {
@@ -470,10 +471,18 @@ impl LayoutMessageHandler {
 	fn diff_and_send_layout_to_frontend(
 		&mut self,
 		layout_target: LayoutTarget,
-		new_layout: Layout,
+		mut new_layout: Layout,
 		responses: &mut VecDeque<Message>,
 		action_input_mapping: &impl Fn(&MessageDiscriminant) -> Option<KeysGroup>,
 	) {
+		// Step 1: Collect CheckboxId mappings from new layout
+		let mut checkbox_map = HashMap::new();
+		new_layout.collect_checkbox_ids(layout_target, &mut Vec::new(), &mut checkbox_map);
+
+		// Step 2: Replace all IDs in new layout with deterministic ones
+		new_layout.replace_widget_ids(layout_target, &mut Vec::new(), &checkbox_map);
+
+		// Step 3: Diff with deterministic IDs
 		let mut widget_diffs = Vec::new();
 
 		self.layouts[layout_target as usize].diff(new_layout, &mut Vec::new(), &mut widget_diffs);

editor/src/messages/layout/utility_types/layout_widget.rs

@@ -4,6 +4,9 @@ use super::widgets::label_widgets::*;
 use crate::application::generate_uuid;
 use crate::messages::input_mapper::utility_types::input_keyboard::KeysGroup;
 use crate::messages::prelude::*;
+use std::collections::HashMap;
+use std::collections::hash_map::DefaultHasher;
+use std::hash::{Hash, Hasher};
 use std::sync::Arc;
 
 #[repr(transparent)]
@@ -111,6 +114,43 @@ pub trait Diffable: Clone + PartialEq {
 
 	/// Computes the diff between self (old) and new, updating self and recording changes.
 	fn diff(&mut self, new: Self, widget_path: &mut Vec<usize>, widget_diffs: &mut Vec<WidgetDiff>);
+
+	/// Collects all CheckboxIds currently in use in this layout, computing stable replacements.
+	fn collect_checkbox_ids(&self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &mut HashMap<CheckboxId, CheckboxId>);
+
+	/// Replaces all widget IDs with deterministic IDs based on position and type.
+	/// Also replaces CheckboxIds using the provided mapping.
+	fn replace_widget_ids(&mut self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &HashMap<CheckboxId, CheckboxId>);
+}
+
+/// Computes a deterministic WidgetId based on layout target, path, and widget type.
+fn compute_widget_id(layout_target: LayoutTarget, widget_path: &[usize], widget: &Widget) -> WidgetId {
+	let mut hasher = DefaultHasher::new();
+
+	// Hash the layout target
+	(layout_target as u8).hash(&mut hasher);
+
+	// Hash the widget path
+	widget_path.hash(&mut hasher);
+
+	// Hash the widget type discriminant
+	std::mem::discriminant(widget).hash(&mut hasher);
+
+	WidgetId(hasher.finish())
+}
+
+/// Computes a deterministic CheckboxId based on the same WidgetId algorithm.
+fn compute_checkbox_id(layout_target: LayoutTarget, widget_path: &[usize], widget: &Widget) -> CheckboxId {
+	let mut hasher = DefaultHasher::new();
+
+	(layout_target as u8).hash(&mut hasher);
+	widget_path.hash(&mut hasher);
+	std::mem::discriminant(widget).hash(&mut hasher);
+
+	// Add extra salt for checkbox to differentiate from widget ID
+	"checkbox".hash(&mut hasher);
+
+	CheckboxId(hasher.finish())
 }
 
 /// Contains an arrangement of widgets mounted somewhere specific in the frontend.
@@ -159,6 +199,22 @@ impl Diffable for Layout {
 			widget_path.pop();
 		}
 	}
+
+	fn collect_checkbox_ids(&self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &mut HashMap<CheckboxId, CheckboxId>) {
+		for (index, child) in self.0.iter().enumerate() {
+			widget_path.push(index);
+			child.collect_checkbox_ids(layout_target, widget_path, checkbox_map);
+			widget_path.pop();
+		}
+	}
+
+	fn replace_widget_ids(&mut self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &HashMap<CheckboxId, CheckboxId>) {
+		for (index, child) in self.0.iter_mut().enumerate() {
+			widget_path.push(index);
+			child.replace_widget_ids(layout_target, widget_path, checkbox_map);
+			widget_path.pop();
+		}
+	}
 }
 
 #[derive(Debug, Default)]
@@ -474,6 +530,58 @@ impl Diffable for LayoutGroup {
 			}
 		}
 	}
+
+	fn collect_checkbox_ids(&self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &mut HashMap<CheckboxId, CheckboxId>) {
+		match self {
+			Self::Column { widgets } | Self::Row { widgets } => {
+				for (index, widget) in widgets.iter().enumerate() {
+					widget_path.push(index);
+					widget.collect_checkbox_ids(layout_target, widget_path, checkbox_map);
+					widget_path.pop();
+				}
+			}
+			Self::Table { rows, .. } => {
+				for (row_idx, row) in rows.iter().enumerate() {
+					for (col_idx, widget) in row.iter().enumerate() {
+						widget_path.push(row_idx);
+						widget_path.push(col_idx);
+						widget.collect_checkbox_ids(layout_target, widget_path, checkbox_map);
+						widget_path.pop();
+						widget_path.pop();
+					}
+				}
+			}
+			Self::Section { layout, .. } => {
+				layout.collect_checkbox_ids(layout_target, widget_path, checkbox_map);
+			}
+		}
+	}
+
+	fn replace_widget_ids(&mut self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &HashMap<CheckboxId, CheckboxId>) {
+		match self {
+			Self::Column { widgets } | Self::Row { widgets } => {
+				for (index, widget) in widgets.iter_mut().enumerate() {
+					widget_path.push(index);
+					widget.replace_widget_ids(layout_target, widget_path, checkbox_map);
+					widget_path.pop();
+				}
+			}
+			Self::Table { rows, .. } => {
+				for (row_idx, row) in rows.iter_mut().enumerate() {
+					for (col_idx, widget) in row.iter_mut().enumerate() {
+						widget_path.push(row_idx);
+						widget_path.push(col_idx);
+						widget.replace_widget_ids(layout_target, widget_path, checkbox_map);
+						widget_path.pop();
+						widget_path.pop();
+					}
+				}
+			}
+			Self::Section { layout, .. } => {
+				layout.replace_widget_ids(layout_target, widget_path, checkbox_map);
+			}
+		}
+	}
 }
 
 #[derive(Debug, Clone, serde::Serialize, serde::Deserialize, specta::Type)]
@@ -485,7 +593,7 @@ pub struct WidgetInstance {
 
 impl PartialEq for WidgetInstance {
 	fn eq(&self, other: &Self) -> bool {
-		self.widget == other.widget
+		self.widget_id == other.widget_id && self.widget == other.widget
 	}
 }
 
@@ -537,6 +645,62 @@ impl Diffable for WidgetInstance {
 			self.widget = new.widget;
 		}
 	}
+
+	fn collect_checkbox_ids(&self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &mut HashMap<CheckboxId, CheckboxId>) {
+		match &self.widget {
+			Widget::CheckboxInput(checkbox) => {
+				// Compute stable ID based on position and insert mapping
+				let checkbox_id = checkbox.for_label;
+				let stable_id = compute_checkbox_id(layout_target, widget_path, &self.widget);
+				checkbox_map.entry(checkbox_id).or_insert(stable_id);
+			}
+			Widget::TextLabel(label) => {
+				// Compute stable ID based on position and insert mapping
+				let checkbox_id = label.for_checkbox;
+				let stable_id = compute_checkbox_id(layout_target, widget_path, &self.widget);
+				checkbox_map.entry(checkbox_id).or_insert(stable_id);
+			}
+			Widget::PopoverButton(button) => {
+				// Recursively collect from nested popover layout
+				for (index, child) in button.popover_layout.0.iter().enumerate() {
+					widget_path.push(index);
+					child.collect_checkbox_ids(layout_target, widget_path, checkbox_map);
+					widget_path.pop();
+				}
+			}
+			_ => {}
+		}
+	}
+
+	fn replace_widget_ids(&mut self, layout_target: LayoutTarget, widget_path: &mut Vec<usize>, checkbox_map: &HashMap<CheckboxId, CheckboxId>) {
+		// 1. Generate deterministic WidgetId
+		self.widget_id = compute_widget_id(layout_target, widget_path, &self.widget);
+
+		// 2. Replace CheckboxIds if present
+		match &mut self.widget {
+			Widget::CheckboxInput(checkbox) => {
+				let old_id = checkbox.for_label;
+				if let Some(&new_id) = checkbox_map.get(&old_id) {
+					checkbox.for_label = new_id;
+				}
+			}
+			Widget::TextLabel(label) => {
+				let old_id = label.for_checkbox;
+				if let Some(&new_id) = checkbox_map.get(&old_id) {
+					label.for_checkbox = new_id;
+				}
+			}
+			Widget::PopoverButton(button) => {
+				// Recursively replace in nested popover layout
+				for (index, child) in button.popover_layout.0.iter_mut().enumerate() {
+					widget_path.push(index);
+					child.replace_widget_ids(layout_target, widget_path, checkbox_map);
+					widget_path.pop();
+				}
+			}
+			_ => {}
+		}
+	}
 }
 
 #[derive(Clone, specta::Type)]

editor/src/messages/layout/utility_types/widgets/input_widgets.rs

@@ -26,7 +26,6 @@ pub struct CheckboxInput {
 	pub tooltip_shortcut: Option<ActionShortcut>,
 
 	#[serde(rename = "forLabel")]
-	#[derivative(Debug = "ignore", PartialEq = "ignore")]
 	pub for_label: CheckboxId,
 
 	// Callbacks
@@ -55,8 +54,8 @@ impl Default for CheckboxInput {
 	}
 }
 
-#[derive(Copy, Clone, Debug, Eq, PartialEq, serde::Serialize, serde::Deserialize)]
-pub struct CheckboxId(u64);
+#[derive(Copy, Clone, Debug, Eq, PartialEq, Hash, serde::Serialize, serde::Deserialize)]
+pub struct CheckboxId(pub u64);
 
 impl CheckboxId {
 	pub fn new() -> Self {

editor/src/messages/layout/utility_types/widgets/label_widgets.rs

@@ -78,7 +78,6 @@ pub struct TextLabel {
 	pub tooltip_shortcut: Option<ActionShortcut>,
 
 	#[serde(rename = "forCheckbox")]
-	#[derivative(PartialEq = "ignore")]
 	pub for_checkbox: CheckboxId,
 
 	// Body