fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-25 06:08:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

Migrate dialogs to Rust and add a New File dialog (#623)

Browse Source 
* Migrate coming soon and about dialog to Rust

* Migrate confirm close and close all

* Migrate dialog error

* Improve keyboard navigation throughout UI

* Cleanup and fix panic dialog

* Reduce css spacing to better match old dialogs

* Add new document modal

* Fix crash when generating default name

* Populate rust about graphite data on startup

* Code review changes

* Move one more :focus CSS rule into App.vue

* Add a dialog message and move dialogs

* Split out keyboard input navigation from this branch

* Improvements including simplifying panic dialog code

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
0HyperCube
2022-05-07 01:59:52 -07:00
committed by Keavon Chambers
co-authored by Keavon Chambers
parent 7729b6219e
commit f177f63217
44 changed files with 1017 additions and 390 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/state/documents.ts
+2 -73
View File
@@ -1,80 +1,18 @@
/* eslint-disable max-classes-per-file */
import { reactive, readonly } from "vue";
import {
DisplayConfirmationToCloseAllDocuments,
DisplayConfirmationToCloseDocument,
TriggerFileDownload,
FrontendDocumentDetails,
TriggerFileUpload,
UpdateActiveDocument,
UpdateOpenDocumentsList,
} from "@/dispatcher/js-messages";
import { DialogState } from "@/state/dialog";
import { TriggerFileDownload, FrontendDocumentDetails, TriggerFileUpload, UpdateActiveDocument, UpdateOpenDocumentsList } from "@/dispatcher/js-messages";
import { EditorState } from "@/state/wasm-loader";
import { download, upload } from "@/utilities/files";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createDocumentsState(editor: EditorState, dialogState: DialogState) {
export function createDocumentsState(editor: EditorState) {
const state = reactive({
unsaved: false,
documents: [] as FrontendDocumentDetails[],
activeDocumentIndex: 0,
});
const closeDocumentWithConfirmation = async (documentId: BigInt): Promise<void> => {
// Assume we receive a correct document_id
const targetDocument = state.documents.find((doc) => doc.id === documentId) as FrontendDocumentDetails;
const tabLabel = targetDocument.displayName;
// Show the close confirmation prompt
dialogState.createDialog("File", "Save changes before closing?", tabLabel, [
{
kind: "TextButton",
callback: async (): Promise<void> => {
editor.instance.save_document();
dialogState.dismissDialog();
},
props: { label: "Save", emphasized: true, minWidth: 96 },
},
{
kind: "TextButton",
callback: async (): Promise<void> => {
editor.instance.close_document(targetDocument.id);
dialogState.dismissDialog();
},
props: { label: "Discard", minWidth: 96 },
},
{
kind: "TextButton",
callback: async (): Promise<void> => {
dialogState.dismissDialog();
},
props: { label: "Cancel", minWidth: 96 },
},
]);
};
const closeAllDocumentsWithConfirmation = (): void => {
dialogState.createDialog("Copy", "Close all documents?", "Unsaved work will be lost!", [
{
kind: "TextButton",
callback: (): void => {
editor.instance.close_all_documents();
dialogState.dismissDialog();
},
props: { label: "Discard All", minWidth: 96 },
},
{
kind: "TextButton",
callback: (): void => {
dialogState.dismissDialog();
},
props: { label: "Cancel", minWidth: 96 },
},
]);
};
// Set up message subscriptions on creation
editor.dispatcher.subscribeJsMessage(UpdateOpenDocumentsList, (updateOpenDocumentList) => {
state.documents = updateOpenDocumentList.open_documents;
@@ -86,14 +24,6 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
state.activeDocumentIndex = activeId;
});
editor.dispatcher.subscribeJsMessage(DisplayConfirmationToCloseDocument, (displayConfirmationToCloseDocument) => {
closeDocumentWithConfirmation(displayConfirmationToCloseDocument.document_id);
});
editor.dispatcher.subscribeJsMessage(DisplayConfirmationToCloseAllDocuments, () => {
closeAllDocumentsWithConfirmation();
});
editor.dispatcher.subscribeJsMessage(TriggerFileUpload, async () => {
const extension = editor.rawWasm.file_save_suffix();
const data = await upload(extension);
@@ -110,7 +40,6 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
return {
state: readonly(state),
closeAllDocumentsWithConfirmation,
};
}
export type DocumentsState = ReturnType<typeof createDocumentsState>;