Fix missing artboard layer icon

Author: Keavon

editor/src/messages/portfolio/document/node_graph/node_graph_message_handler.rs

@@ -2714,6 +2714,7 @@ impl NodeGraphMessageHandler {
 				let clippable = layer.can_be_clipped(network_interface.document_metadata());
 				let data = LayerPanelEntry {
 					id: node_id,
+					reference: network_interface.reference(&node_id, &[]).and_then(|x| x.as_ref()).cloned().unwrap_or_default(),
 					alias: network_interface.display_name(&node_id, &[]),
 					in_selected_network: selection_network_path.is_empty(),
 					children_allowed,

editor/src/messages/portfolio/document/utility_types/nodes.rs

@@ -34,6 +34,7 @@ impl serde::Serialize for JsRawBuffer {
 #[derive(Debug, Clone, serde::Serialize, serde::Deserialize, PartialEq, Eq, specta::Type)]
 pub struct LayerPanelEntry {
 	pub id: NodeId,
+	pub reference: String,
 	pub alias: String,
 	#[serde(rename = "inSelectedNetwork")]
 	pub in_selected_network: bool,

editor/src/messages/tool/utility_types.rs

@@ -134,12 +134,12 @@ impl DocumentToolData {
 			LayoutGroup::Row {
 				widgets: vec![
 					IconButton::new("SwapVertical", 16)
-						.tooltip_label("Swap")
+						.tooltip_label("Swap Working Colors")
 						.tooltip_shortcut(action_shortcut!(ToolMessageDiscriminant::SwapColors))
 						.on_update(|_| ToolMessage::SwapColors.into())
 						.widget_instance(),
 					IconButton::new("WorkingColors", 16)
-						.tooltip_label("Reset")
+						.tooltip_label("Reset Working Colors")
 						.tooltip_shortcut(action_shortcut!(ToolMessageDiscriminant::ResetColors))
 						.on_update(|_| ToolMessage::ResetColors.into())
 						.widget_instance(),

frontend/src/components/panels/Layers.svelte

@@ -644,15 +644,15 @@
 							{@html $nodeGraph.thumbnails.get(listing.entry.id)}
 						{/if}
 					</div>
-					{#if listing.entry.name === "Artboard"}
-						<IconLabel icon="Artboard" class="layer-type-icon" />
+					{#if listing.entry.reference === "Artboard"}
+						<IconLabel icon="Artboard" class="layer-type-icon" tooltipLabel="Artboard" />
 					{/if}
 					<LayoutRow class="layer-name" on:dblclick={() => onEditLayerName(listing)}>
 						<input
 							data-text-input
 							type="text"
 							value={listing.entry.alias}
-							placeholder={listing.entry.name}
+							placeholder={listing.entry.reference}
 							disabled={!listing.editingName}
 							on:blur={() => onEditLayerNameDeselect(listing)}
 							on:keydown={(e) => e.key === "Escape" && onEditLayerNameDeselect(listing)}
@@ -842,7 +842,6 @@
 				}
 
 				.layer-type-icon {
-					flex: 0 0 auto;
 					margin-left: 8px;
 					margin-right: -4px;
 				}

frontend/src/components/widgets/inputs/NumberInput.svelte

@@ -745,10 +745,6 @@
 
 <style lang="scss" global>
 	.number-input {
-		input {
-			text-align: center;
-		}
-
 		&.narrow {
 			--widget-height: 20px;
 		}
@@ -973,5 +969,9 @@
 				}
 			}
 		}
+
+		input {
+			text-align: center;
+		}
 	}
 </style>

frontend/src/messages.ts

@@ -827,13 +827,10 @@ export class UpdateDocumentLayerDetails extends JsMessage {
 export class LayerPanelEntry {
 	id!: bigint;
 
-	name!: string;
+	reference!: string;
 
 	alias!: string;
 
-	@Transform(({ value }: { value: string }) => value || undefined)
-	debugLayerIdTooltip!: string | undefined;
-
 	inSelectedNetwork!: boolean;
 
 	childrenAllowed!: boolean;