From fa581defbfad78c136dd065e1f5396174dd28ab7 Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Sat, 29 Jun 2024 14:03:20 +0200
Subject: [PATCH] Add modal confirmation before restoring ab defaults

---
 .../src/components/Panels/SettingsPanel.vue   | 25 +++++
 client/src/stores/activitySetup.ts            | 92 +++++++++----------
 client/src/stores/activityStore.ts            |  8 ++
 3 files changed, 79 insertions(+), 46 deletions(-)

diff --git a/client/src/components/Panels/SettingsPanel.vue b/client/src/components/Panels/SettingsPanel.vue
index 10d38496bd2a..e5dbdec22d11 100644
--- a/client/src/components/Panels/SettingsPanel.vue
+++ b/client/src/components/Panels/SettingsPanel.vue
@@ -1,11 +1,18 @@
 <script setup lang="ts">
+import { faUndo } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
+import { BButton, BModal } from "bootstrap-vue";
 import { ref } from "vue";
 
+import { useActivityStore } from "@/stores/activityStore";
+
 import ActivitySettings from "@/components/ActivityBar/ActivitySettings.vue";
 import DelayedInput from "@/components/Common/DelayedInput.vue";
 import ActivityPanel from "@/components/Panels/ActivityPanel.vue";
 
 const query = ref("");
+const confirmRestore = ref(false);
+const activityStore = useActivityStore();
 
 function onQuery(newQuery: string) {
     query.value = newQuery;
@@ -17,6 +24,24 @@ function onQuery(newQuery: string) {
         <template v-slot:header>
             <DelayedInput :delay="100" placeholder="Search activities" @change="onQuery" />
         </template>
+        <template v-slot:header-buttons>
+            <BButton
+                v-b-tooltip.bottom.hover
+                data-description="restore factory settings"
+                size="sm"
+                variant="link"
+                title="Restore default"
+                @click="confirmRestore = true">
+                <FontAwesomeIcon :icon="faUndo" fixed-width />
+            </BButton>
+        </template>
         <ActivitySettings :query="query" />
+        <BModal
+            v-model="confirmRestore"
+            title="Restore Activity Bar Defaults"
+            title-tag="h2"
+            @ok="activityStore.restore()">
+            <p v-localize>Are you sure you want to reset the activity bar to its default settings?</p>
+        </BModal>
     </ActivityPanel>
 </template>
diff --git a/client/src/stores/activitySetup.ts b/client/src/stores/activitySetup.ts
index f07e7ede7809..e9285fd9c816 100644
--- a/client/src/stores/activitySetup.ts
+++ b/client/src/stores/activitySetup.ts
@@ -44,43 +44,17 @@ export const Activities = [
         tooltip: "Search and run tools",
         visible: true,
     },
-    {
-        anonymous: true,
-        description: "Displays a panel to search and access workflows.",
-        icon: "sitemap",
-        id: "workflows",
-        mutable: false,
-        optional: true,
-        panel: false,
-        title: "Workflows",
-        to: "/workflows/list",
-        tooltip: "Search and run workflows",
-        visible: true,
-    },
     {
         anonymous: false,
-        description: "Displays all workflow runs.",
-        icon: "fa-list",
-        id: "invocation",
-        mutable: false,
-        optional: true,
-        panel: true,
-        title: "Workflow Invocations",
-        tooltip: "Show all workflow runs",
-        to: null,
-        visible: true,
-    },
-    {
-        anonymous: true,
-        description: "Displays the list of available visualizations.",
-        icon: "chart-bar",
-        id: "visualizations",
+        description: "Displays all of your datasets across all histories.",
+        icon: "fa-folder",
+        id: "datasets",
         mutable: false,
         optional: true,
-        panel: true,
-        title: "Visualization",
-        to: null,
-        tooltip: "Visualize datasets",
+        panel: false,
+        title: "Datasets",
+        tooltip: "Show all datasets",
+        to: "/datasets/list",
         visible: true,
     },
     {
@@ -111,15 +85,15 @@ export const Activities = [
     },
     {
         anonymous: false,
-        description: "Displays all of your datasets across all histories.",
-        icon: "fa-folder",
-        id: "datasets",
+        description: "Display Data Libraries with datasets available to all users.",
+        icon: "fa-database",
+        id: "libraries",
         mutable: false,
         optional: true,
         panel: false,
-        title: "Datasets",
-        tooltip: "Show all datasets",
-        to: "/datasets/list",
+        title: "Libraries",
+        tooltip: "Access data libraries",
+        to: "/libraries",
         visible: true,
     },
     {
@@ -136,16 +110,42 @@ export const Activities = [
         visible: true,
     },
     {
-        anonymous: false,
-        description: "Display Data Libraries with datasets available to all users.",
-        icon: "fa-database",
-        id: "libraries",
+        anonymous: true,
+        description: "Displays the list of available visualizations.",
+        icon: "chart-bar",
+        id: "visualizations",
+        mutable: false,
+        optional: true,
+        panel: true,
+        title: "Visualization",
+        to: null,
+        tooltip: "Visualize datasets",
+        visible: true,
+    },
+    {
+        anonymous: true,
+        description: "Displays a panel to search and access workflows.",
+        icon: "sitemap",
+        id: "workflows",
         mutable: false,
         optional: true,
         panel: false,
-        title: "Libraries",
-        tooltip: "Access Data Libraries",
-        to: "/libraries",
+        title: "Workflows",
+        to: "/workflows/list",
+        tooltip: "Search and run workflows",
+        visible: true,
+    },
+    {
+        anonymous: false,
+        description: "Displays all workflow runs.",
+        icon: "fa-list",
+        id: "invocation",
+        mutable: false,
+        optional: true,
+        panel: true,
+        title: "Workflow Invocations",
+        tooltip: "Show all workflow runs",
+        to: null,
         visible: true,
     },
 ];
diff --git a/client/src/stores/activityStore.ts b/client/src/stores/activityStore.ts
index ed99ec67b2f7..377a68e08964 100644
--- a/client/src/stores/activityStore.ts
+++ b/client/src/stores/activityStore.ts
@@ -37,6 +37,13 @@ export interface Activity {
 export const useActivityStore = defineStore("activityStore", () => {
     const activities: Ref<Array<Activity>> = useUserLocalStorage("activity-store-activities", []);
 
+    /**
+     * Restores the default activity bar items
+     */
+    function restore() {
+        activities.value = Activities.slice();
+    }
+
     /**
      * The set of built-in activities is defined in activitySetup.js.
      * This helper function applies changes of the built-in activities,
@@ -100,6 +107,7 @@ export const useActivityStore = defineStore("activityStore", () => {
         getAll,
         remove,
         setAll,
+        restore,
         sync,
     };
 });