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

Add support for closing document tabs (#215)

Browse Source 
* Can only remove last document successfully

* Correctly update the layer tree panel

* Remove comments

* Add support for randomly closing docs

* Create new doc after closing last doc

* Update layer panel when creating new docs

* Fix bug that crashed the program when first doc was closed

* Refactor to make code simpler and increase readability

* Add shortcut to close active doc (Shift + C)

* Add a confirmation dialog box before closing tabs

* New docs get the correct title

* Remove comments and fix typos

* Disable 'eslint-no-alert'

* Refactor and fix document title bug

* Rename the FrontendMessage and ReponseType for showing close confirmation modal

* Change the message displayed in the close confirmation modal

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
akshay1992kalbhor
2021-06-22 14:28:02 +05:30
committed by GitHub
parent 8a56d6cf46
commit 0b0873262c
7 changed files with 118 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
client/web/src/components/workspace/Panel.vue
View File

@@ -4,7 +4,7 @@
<div class="tab-group">
<div class="tab" :class="{ active: tabIndex === tabActiveIndex }" v-for="(tabLabel, tabIndex) in tabLabels" :key="tabLabel" @click="handleTabClick(tabIndex)">
<span>{{ tabLabel }}</span>
<IconButton :icon="'CloseX'" :size="16" v-if="tabCloseButtons" />
<IconButton :icon="'CloseX'" :size="16" v-if="tabCloseButtons" @click.stop="closeTab(tabIndex)" />
</div>
</div>
<PopoverButton :icon="PopoverButtonIcon.VerticalEllipsis">
@@ -143,6 +143,7 @@ import Minimap from "../panels/Minimap.vue";
import IconButton from "../widgets/buttons/IconButton.vue";
import PopoverButton, { PopoverButtonIcon } from "../widgets/buttons/PopoverButton.vue";
import { MenuDirection } from "../widgets/floating-menus/FloatingMenu.vue";
import { ResponseType, registerResponseHandler, Response } from "../../response-handler";
const wasm = import("../../../wasm/pkg");
@@ -160,6 +161,17 @@ export default defineComponent({
const { select_document } = await wasm;
select_document(tabIndex);
},
async closeTab(tabIndex: number) {
const { close_document } = await wasm;
// eslint-disable-next-line no-alert
const result = window.confirm("Closing this document will permanently discard all work. Continue?");
if (result) close_document(tabIndex);
},
},
mounted() {
registerResponseHandler(ResponseType.PromptCloseConfirmationModal, (_responseData: Response) => {
this.closeTab(this.tabActiveIndex);
});
},
props: {
tabMinWidths: { type: Boolean, default: false },

9
client/web/src/components/workspace/Workspace.vue
View File

@@ -46,7 +46,7 @@
<script lang="ts">
import { defineComponent } from "vue";
import { ResponseType, registerResponseHandler, Response, SetActiveDocument, NewDocument } from "../../response-handler";
import { ResponseType, registerResponseHandler, Response, SetActiveDocument, NewDocument, CloseDocument } from "../../response-handler";
import LayoutRow from "../layout/LayoutRow.vue";
import LayoutCol from "../layout/LayoutCol.vue";
import Panel from "./Panel.vue";
@@ -64,6 +64,13 @@ export default defineComponent({
if (documentData) this.documents.push(documentData.document_name);
});
registerResponseHandler(ResponseType.CloseDocument, (responseData: Response) => {
const documentData = responseData as CloseDocument;
if (documentData) {
this.documents.splice(documentData.document_index, 1);
}
});
registerResponseHandler(ResponseType.SetActiveDocument, (responseData: Response) => {
const documentData = responseData as SetActiveDocument;
if (documentData) this.activeDocument = documentData.document_index;