From a98be64f91db804ed41e5819ed2cbd1a1b38f67c Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 17 Jan 2024 16:29:04 +0500
Subject: [PATCH] for "panel activities" only toggle sideBar if `route !==
 activity.to`

Alter the way the `ActivityBar` treats "panel activities";
i.e.: activities that have a sideBar associated,
so that if the sidebar is active but the current route isn't `activity.to`, then keep sidebar active and
just change route.

Also, if `activity.to` is current route, always keep activity's `is-active` prop = true regardless of sidebar for the activity being active or not.
---
 .../components/ActivityBar/ActivityBar.vue    | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/client/src/components/ActivityBar/ActivityBar.vue b/client/src/components/ActivityBar/ActivityBar.vue
index 8706f1dc979a..84a1e7ea0474 100644
--- a/client/src/components/ActivityBar/ActivityBar.vue
+++ b/client/src/components/ActivityBar/ActivityBar.vue
@@ -50,7 +50,7 @@ const dragItem: Ref<Activity | null> = ref(null);
 const isDragging = ref(false);
 
 /**
- * Checks if the route of an activitiy is currently being visited and panels are collapsed
+ * Checks if the route of an activity is currently being visited and panels are collapsed
  */
 function isActiveRoute(activityTo: string) {
     return route.path === activityTo && isActiveSideBar("");
@@ -63,6 +63,13 @@ function isActiveSideBar(menuKey: string) {
     return userStore.toggledSideBar === menuKey;
 }
 
+/**
+ * Checks if an activity that has a panel should have the `is-active` prop
+ */
+function panelActivityIsActive(activity: Activity) {
+    return isActiveSideBar(activity.id) || (activity.to !== null && isActiveRoute(activity.to));
+}
+
 /**
  * Evaluates the drop data and keeps track of the drop area
  */
@@ -110,7 +117,12 @@ function onDragOver(evt: MouseEvent) {
 /**
  * Tracks the state of activities which expand or collapse the sidepanel
  */
-function onToggleSidebar(toggle: string) {
+function onToggleSidebar(toggle: string, to: string | null = null) {
+    // if an activity's dedicated panel/sideBar is already active
+    // but the route is different, don't collapse
+    if (toggle && to && !(route.path === to) && isActiveSideBar(toggle)) {
+        return;
+    }
     userStore.toggleSideBar(toggle);
 }
 
@@ -172,11 +184,11 @@ function toggleContextMenu(evt: MouseEvent) {
                                 :id="`activity-${activity.id}`"
                                 :key="activity.id"
                                 :icon="activity.icon"
-                                :is-active="isActiveSideBar(activity.id)"
+                                :is-active="panelActivityIsActive(activity)"
                                 :title="activity.title"
                                 :tooltip="activity.tooltip"
                                 :to="activity.to"
-                                @click="onToggleSidebar(activity.id)" />
+                                @click="onToggleSidebar(activity.id, activity.to)" />
                             <ActivityItem
                                 v-else-if="activity.to"
                                 :id="`activity-${activity.id}`"