Add support for closing document tabs (#215)

* 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 01:58:02 -07:00
committed by GitHub
co-authored by Keavon Chambers
parent 8a56d6cf46
commit 0b0873262c
7 changed files with 118 additions and 5 deletions
+13 -1
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 },