Use document name for saved and exported files

We pass through the document name in the export and save
messages. Additionally, we check if the appropriate file
suffixes (.graphite and .svg) need to be added before
passing it to the frontend.

Author: azeemba

editor/src/consts.rs

@@ -20,3 +20,5 @@ pub const LINE_ROTATE_SNAP_ANGLE: f64 = 15.;
 pub const SELECTION_TOLERANCE: f64 = 1.0;
 
 pub const DEFAULT_DOCUMENT_NAME: &str = "Untitled Document";
+pub const FILE_SAVE_SUFFIX: &str = ".graphite";
+pub const FILE_EXPORT_SUFFIX: &str = ".svg";

editor/src/document/document_file.rs

@@ -1,5 +1,9 @@
 pub use super::layer_panel::*;
-use crate::{frontend::layer_panel::*, EditorError};
+use crate::{
+	consts::{FILE_EXPORT_SUFFIX, FILE_SAVE_SUFFIX},
+	frontend::layer_panel::*,
+	EditorError,
+};
 use glam::{DAffine2, DVec2};
 use graphene::{document::Document as InternalDocument, DocumentError, LayerId};
 use serde::{Deserialize, Serialize};
@@ -282,6 +286,10 @@ impl MessageHandler<DocumentMessage, &InputPreprocessor> for DocumentMessageHand
 			ExportDocument => {
 				let bbox = self.document.visible_layers_bounding_box().unwrap_or([DVec2::ZERO, ipp.viewport_size.as_f64()]);
 				let size = bbox[1] - bbox[0];
+				let name = match self.name.ends_with(FILE_SAVE_SUFFIX) {
+					true => self.name.clone().replace(FILE_SAVE_SUFFIX, FILE_EXPORT_SUFFIX),
+					false => self.name.clone() + FILE_EXPORT_SUFFIX,
+				};
 				responses.push_back(
 					FrontendMessage::ExportDocument {
 						document: format!(
@@ -293,16 +301,24 @@ impl MessageHandler<DocumentMessage, &InputPreprocessor> for DocumentMessageHand
 							"\n",
 							self.document.render_root()
 						),
+						name,
+					}
+					.into(),
+				)
+			}
+			SaveDocument => {
+				let name = match self.name.ends_with(FILE_SAVE_SUFFIX) {
+					true => self.name.clone(),
+					false => self.name.clone() + FILE_SAVE_SUFFIX,
+				};
+				responses.push_back(
+					FrontendMessage::SaveDocument {
+						document: self.document.serialize_document(),
+						name,
 					}
 					.into(),
 				)
 			}
-			SaveDocument => responses.push_back(
-				FrontendMessage::SaveDocument {
-					document: self.document.serialize_document(),
-				}
-				.into(),
-			),
 			SetBlendModeForSelectedLayers(blend_mode) => {
 				let active_document = self;
 

editor/src/frontend/frontend_message_handler.rs

@@ -18,8 +18,8 @@ pub enum FrontendMessage {
 	DisplayConfirmationToCloseAllDocuments,
 	UpdateCanvas { document: String },
 	UpdateLayer { path: Vec<LayerId>, data: LayerPanelEntry },
-	ExportDocument { document: String },
-	SaveDocument { document: String },
+	ExportDocument { document: String, name: String },
+	SaveDocument { document: String, name: String },
 	EnableTextInput,
 	DisableTextInput,
 	UpdateWorkingColors { primary: Color, secondary: Color },

frontend/src/components/panels/Document.vue

@@ -332,11 +332,13 @@ export default defineComponent({
 		});
 		registerResponseHandler(ResponseType.ExportDocument, (responseData: Response) => {
 			const updateData = responseData as ExportDocument;
-			if (updateData) this.download("canvas.svg", updateData.document);
+			if (!updateData) return;
+			this.download(updateData.name, updateData.document);
 		});
 		registerResponseHandler(ResponseType.SaveDocument, (responseData: Response) => {
 			const saveData = responseData as SaveDocument;
-			if (saveData) this.download("canvas.graphite", saveData.document);
+			if (!saveData) return;
+			this.download(saveData.name, saveData.document);
 		});
 		registerResponseHandler(ResponseType.SetActiveTool, (responseData: Response) => {
 			const toolData = responseData as SetActiveTool;

frontend/src/utilities/response-handler.ts

@@ -169,19 +169,23 @@ function newUpdateCanvas(input: any): UpdateCanvas {
 
 export interface ExportDocument {
 	document: string;
+	name: string;
 }
-function newExportDocument(input: any): UpdateCanvas {
+function newExportDocument(input: any): ExportDocument {
 	return {
 		document: input.document,
+		name: input.name,
 	};
 }
 
 export interface SaveDocument {
 	document: string;
+	name: string;
 }
 function newSaveDocument(input: any): SaveDocument {
 	return {
 		document: input.document,
+		name: input.name,
 	};
 }