Add DisplayError to show user errors from the backend

editor/src/frontend/frontend_message_handler.rs

@@ -13,6 +13,7 @@ pub enum FrontendMessage {
 	SetActiveTool { tool_name: String },
 	SetActiveDocument { document_index: usize },
 	UpdateOpenDocumentsList { open_documents: Vec<String> },
+	DisplayError { description: String },
 	DisplayConfirmationToCloseDocument { document_index: usize },
 	DisplayConfirmationToCloseAllDocuments,
 	UpdateCanvas { document: String },
@@ -42,6 +43,7 @@ impl MessageHandler<FrontendMessage, ()> for FrontendMessageHandler {
 	advertise_actions!(
 		FrontendMessageDiscriminant;
 
+		DisplayError,
 		CollapseFolder,
 		ExpandFolder,
 		SetActiveTool,

editor/src/input/input_mapper.rs

@@ -87,17 +87,17 @@ macro_rules! entry {
 		entry!{action=$action, message=InputMapperMessage::KeyUp(Key::$key) $(, modifiers=[$($m),* ])?}
 	}};
 	{action=$action:expr, message=$message:expr $(, modifiers=[$($m:ident),* $(,)?])?} => {{
-        &[MappingEntry {trigger: $message, modifiers: modifiers!($($($m),*)?), action: $action.into()}]
+		&[MappingEntry {trigger: $message, modifiers: modifiers!($($($m),*)?), action: $action.into()}]
 	}};
 	{action=$action:expr, triggers=[$($m:ident),* $(,)?]} => {{
-        &[
+		&[
-            MappingEntry {trigger:InputMapperMessage::PointerMove, action: $action.into(), modifiers: modifiers!()},
+			MappingEntry {trigger:InputMapperMessage::PointerMove, action: $action.into(), modifiers: modifiers!()},
-            $(
+			$(
-            MappingEntry {trigger:InputMapperMessage::KeyDown(Key::$m), action: $action.into(), modifiers: modifiers!()},
+			MappingEntry {trigger:InputMapperMessage::KeyDown(Key::$m), action: $action.into(), modifiers: modifiers!()},
-            MappingEntry {trigger:InputMapperMessage::KeyUp(Key::$m), action: $action.into(), modifiers: modifiers!()},
+			MappingEntry {trigger:InputMapperMessage::KeyUp(Key::$m), action: $action.into(), modifiers: modifiers!()},
-            )*
+			)*
-        ]
+		]
-    }};
+	}};
 }
 macro_rules! mapping {
 	//[$(<action=$action:expr; message=$key:expr; $(modifiers=[$($m:ident),* $(,)?];)?>)*] => {{
@@ -107,17 +107,17 @@ macro_rules! mapping {
 		let mut pointer_move: KeyMappingEntries = Default::default();
 		let mut mouse_scroll: KeyMappingEntries = Default::default();
 		$(
-            for entry in $entry {
+			for entry in $entry {
-                let arr = match entry.trigger {
+				let arr = match entry.trigger {
-                    InputMapperMessage::KeyDown(key) => &mut key_down[key as usize],
+					InputMapperMessage::KeyDown(key) => &mut key_down[key as usize],
-                    InputMapperMessage::KeyUp(key) => &mut key_up[key as usize],
+					InputMapperMessage::KeyUp(key) => &mut key_up[key as usize],
-                    InputMapperMessage::PointerMove => &mut pointer_move,
+					InputMapperMessage::PointerMove => &mut pointer_move,
-                    InputMapperMessage::MouseScroll => &mut mouse_scroll,
+					InputMapperMessage::MouseScroll => &mut mouse_scroll,
-                };
+				};
-                arr.push(entry.clone());
+				arr.push(entry.clone());
-            }
+			}
-        )*
+		)*
-        (key_up, key_down, pointer_move, mouse_scroll)
+		(key_up, key_down, pointer_move, mouse_scroll)
 	}};
 }
 

frontend/src/components/panels/Document.vue

@@ -212,7 +212,7 @@ import { defineComponent } from "vue";
 import { makeModifiersBitfield } from "@/utilities/input";
 import { ResponseType, registerResponseHandler, Response, UpdateCanvas, SetActiveTool, ExportDocument, SetCanvasZoom, SetCanvasRotation } from "@/utilities/response-handler";
 import { SeparatorDirection, SeparatorType } from "@/components/widgets/widgets";
-import comingSoon from "@/utilities/coming-soon";
+import { comingSoon } from "@/utilities/errors";
 
 import LayoutRow from "@/components/layout/LayoutRow.vue";
 import LayoutCol from "@/components/layout/LayoutCol.vue";

frontend/src/components/widgets/inputs/MenuBarInput.vue

@@ -53,7 +53,7 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 
-import comingSoon from "@/utilities/coming-soon";
+import { comingSoon } from "@/utilities/errors";
 
 import IconLabel from "@/components/widgets/labels/IconLabel.vue";
 import { ApplicationPlatform } from "@/components/window/MainWindow.vue";

frontend/src/components/widgets/options/ToolOptions.vue

@@ -25,7 +25,7 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 
-import comingSoon from "@/utilities/coming-soon";
+import { comingSoon } from "@/utilities/errors";
 
 import { WidgetRow, SeparatorType, IconButtonWidget } from "@/components/widgets/widgets";
 import Separator from "@/components/widgets/separators/Separator.vue";

frontend/src/main.ts

@@ -2,6 +2,7 @@ import { createApp } from "vue";
 import { fullscreenModeChanged } from "@/utilities/fullscreen";
 import { handleKeyUp, handleKeyDown, handleMouseDown } from "@/utilities/input";
 import App from "@/App.vue";
+import "@/utilities/errors";
 
 // Bind global browser events
 document.addEventListener("contextmenu", (e) => e.preventDefault());

frontend/src/utilities/errors.ts

@@ -1,7 +1,8 @@
 import { createDialog, dismissDialog } from "@/utilities/dialog";
 import { TextButtonWidget } from "@/components/widgets/widgets";
+import { ResponseType, registerResponseHandler, Response, DisplayError } from "@/utilities/response-handler";
 
-export default function comingSoon(issueNumber?: number) {
+export function comingSoon(issueNumber?: number) {
 	const bugMessage = `— but you can help add it!\nSee issue #${issueNumber} on GitHub.`;
 	const details = `This feature is not implemented yet${issueNumber ? bugMessage : ""}`;
 
@@ -20,3 +21,16 @@ export default function comingSoon(issueNumber?: number) {
 
 	createDialog("Warning", "Coming soon", details, buttons);
 }
+
+registerResponseHandler(ResponseType.DisplayError, (responseData: Response) => {
+	const data = responseData as DisplayError;
+
+	const okButton: TextButtonWidget = {
+		kind: "TextButton",
+		callback: async () => dismissDialog(),
+		props: { label: "OK", emphasized: true, minWidth: 96 },
+	};
+	const buttons = [okButton];
+
+	createDialog("Warning", "Editor error", data.description, buttons);
+});

frontend/src/utilities/response-handler.ts

@@ -16,13 +16,14 @@ export enum ResponseType {
 	ExportDocument = "ExportDocument",
 	ExpandFolder = "ExpandFolder",
 	CollapseFolder = "CollapseFolder",
+	UpdateLayer = "UpdateLayer",
 	SetActiveTool = "SetActiveTool",
 	SetActiveDocument = "SetActiveDocument",
 	UpdateOpenDocumentsList = "UpdateOpenDocumentsList",
 	UpdateWorkingColors = "UpdateWorkingColors",
-	UpdateLayer = "UpdateLayer",
 	SetCanvasZoom = "SetCanvasZoom",
 	SetCanvasRotation = "SetCanvasRotation",
+	DisplayError = "DisplayError",
 	DisplayConfirmationToCloseDocument = "DisplayConfirmationToCloseDocument",
 	DisplayConfirmationToCloseAllDocuments = "DisplayConfirmationToCloseAllDocuments",
 }
@@ -72,6 +73,8 @@ function parseResponse(responseType: string, data: any): Response {
 			return newExportDocument(data.ExportDocument);
 		case "UpdateWorkingColors":
 			return newUpdateWorkingColors(data.UpdateWorkingColors);
+		case "DisplayError":
+			return newDisplayError(data.DisplayError);
 		case "DisplayConfirmationToCloseDocument":
 			return newDisplayConfirmationToCloseDocument(data.DisplayConfirmationToCloseDocument);
 		case "DisplayConfirmationToCloseAllDocuments":
@@ -130,6 +133,15 @@ function newSetActiveDocument(input: any): SetActiveDocument {
 	};
 }
 
+export interface DisplayError {
+	description: string;
+}
+function newDisplayError(input: any): DisplayError {
+	return {
+		description: input.description,
+	};
+}
+
 export interface DisplayConfirmationToCloseDocument {
 	document_index: number;
 }