Collapse side panel when new activity has been selected

galaxyproject · Jun 12, 2023 · 9fac5cf · 9fac5cf
1 parent 99ea0a7
commit 9fac5cf
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 5 deletions.
diff --git a/client/src/components/ActivityBar/ActivityBar.vue b/client/src/components/ActivityBar/ActivityBar.vue
@@ -119,7 +119,8 @@ function onDragLeave(evt) {
                                 :key="activity.id"
                                 :icon="activity.icon"
                                 :title="activity.title"
-                                :tooltip="activity.tooltip" />
+                                :tooltip="activity.tooltip"
+                                @click="onToggleSidebar()" />
                             <ActivityItem
                                 v-else-if="['tools', 'workflows'].includes(activity.id)"
                                 :id="`activity-${activity.id}`"
@@ -136,7 +137,8 @@ function onDragLeave(evt) {
                                 :title="activity.title"
                                 :icon="activity.icon"
                                 :tooltip="activity.tooltip"
-                                :to="activity.to" />
+                                :to="activity.to"
+                                @click="onToggleSidebar()" />
                         </div>
                     </div>
                 </draggable>

diff --git a/client/src/components/ActivityBar/ActivityItem.vue b/client/src/components/ActivityBar/ActivityItem.vue
@@ -37,10 +37,10 @@ const emit = defineEmits<{
 }>();
 
 function onClick(evt: MouseEvent): void {
+    emit("click");
     if (props.to) {
         router.push(props.to);
     }
-    emit("click");
 }
 </script>
 

diff --git a/client/src/components/ActivityBar/Items/UploadItem.vue b/client/src/components/ActivityBar/Items/UploadItem.vue
@@ -19,6 +19,10 @@ export interface Props {
 
 defineProps<Props>();
 
+const emit = defineEmits<{
+    (e: "click"): void;
+}>();
+
 const status: Ref<string> = ref("success");
 const percentage: Ref<number> = ref(0);
 
@@ -35,6 +39,11 @@ onUnmounted(() => {
     eventHub.$off("upload:percentage", setPercentage);
 });
 
+function onUploadModal() {
+    emit("click");
+    openGlobalUploadModal();
+}
+
 function setStatus(val: string): void {
     status.value = val;
 }
@@ -52,5 +61,5 @@ function setPercentage(val: number): void {
         :icon="icon"
         :progress-percentage="percentage"
         :progress-status="status"
-        @click="openGlobalUploadModal" />
+        @click="onUploadModal" />
 </template>
diff --git a/client/src/stores/userStore.ts b/client/src/stores/userStore.ts
@@ -108,7 +108,7 @@ export const useUserStore = defineStore(
         function toggleActivityBar() {
             showActivityBar.value = !showActivityBar.value;
         }
-        function toggleSideBar(currentOpen: string) {
+        function toggleSideBar(currentOpen = "") {
             toggledSideBar.value = toggledSideBar.value === currentOpen ? "" : currentOpen;
         }