mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-24 19:58:11 +08:00
Major frontend code cleanup (#452)
Many large changes, including:
- TypeScript enums are now string unions throughout
- Strong type-checking throughout the TS and Vue codebase
- Vue component props now all specify `as PropType<...>`
- Usage of annotated return types on all functions
- Sorting of JS import statements
- Explicit usage of Vue bind attribute function call arguments (`@click="foo"` is now `@click=(e) => foo(e)`)
- Much improved code quality related to the color picker
- Consistent camelCase Vue bind and v-model attributes
- Consistent Vue HTML attribute strings with single quotes
- Bug fix and clarity improvement with incorrect hint class parameters
- Empty Vue component objects like `props: {}` and `components: {}` removed
This commit is contained in:
@@ -1,9 +1,6 @@
|
||||
/* eslint-disable max-classes-per-file */
|
||||
import { reactive, readonly } from "vue";
|
||||
|
||||
import { DialogState } from "@/state/dialog";
|
||||
import { download, upload } from "@/utilities/files";
|
||||
import { EditorState } from "@/state/wasm-loader";
|
||||
import {
|
||||
DisplayConfirmationToCloseAllDocuments,
|
||||
DisplayConfirmationToCloseDocument,
|
||||
@@ -14,7 +11,11 @@ import {
|
||||
SetActiveDocument,
|
||||
UpdateOpenDocumentsList,
|
||||
} from "@/dispatcher/js-messages";
|
||||
import { DialogState } from "@/state/dialog";
|
||||
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) {
|
||||
const state = reactive({
|
||||
unsaved: false,
|
||||
@@ -22,7 +23,7 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
activeDocumentIndex: 0,
|
||||
});
|
||||
|
||||
const closeDocumentWithConfirmation = async (documentId: BigInt) => {
|
||||
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;
|
||||
@@ -31,7 +32,7 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
dialogState.createDialog("File", "Save changes before closing?", tabLabel, [
|
||||
{
|
||||
kind: "TextButton",
|
||||
callback: async () => {
|
||||
callback: async (): Promise<void> => {
|
||||
editor.instance.save_document();
|
||||
dialogState.dismissDialog();
|
||||
},
|
||||
@@ -39,7 +40,7 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
},
|
||||
{
|
||||
kind: "TextButton",
|
||||
callback: async () => {
|
||||
callback: async (): Promise<void> => {
|
||||
editor.instance.close_document(targetDocument.id);
|
||||
dialogState.dismissDialog();
|
||||
},
|
||||
@@ -47,7 +48,7 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
},
|
||||
{
|
||||
kind: "TextButton",
|
||||
callback: async () => {
|
||||
callback: async (): Promise<void> => {
|
||||
dialogState.dismissDialog();
|
||||
},
|
||||
props: { label: "Cancel", minWidth: 96 },
|
||||
@@ -55,11 +56,11 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
]);
|
||||
};
|
||||
|
||||
const closeAllDocumentsWithConfirmation = () => {
|
||||
const closeAllDocumentsWithConfirmation = (): void => {
|
||||
dialogState.createDialog("Copy", "Close all documents?", "Unsaved work will be lost!", [
|
||||
{
|
||||
kind: "TextButton",
|
||||
callback: () => {
|
||||
callback: (): void => {
|
||||
editor.instance.close_all_documents();
|
||||
dialogState.dismissDialog();
|
||||
},
|
||||
@@ -67,7 +68,7 @@ export function createDocumentsState(editor: EditorState, dialogState: DialogSta
|
||||
},
|
||||
{
|
||||
kind: "TextButton",
|
||||
callback: () => {
|
||||
callback: (): void => {
|
||||
dialogState.dismissDialog();
|
||||
},
|
||||
props: { label: "Cancel", minWidth: 96 },
|
||||
|
||||
Reference in New Issue
Block a user