From a88e3cde9a64140f263dcd5d2ecb219c26f3b833 Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Tue, 9 Aug 2022 13:43:12 +0200
Subject: [PATCH] feat(gui-v2): mark open table & view

---
 packages/nc-gui-v2/components/dashboard/TreeView.vue | 12 ++++++++++--
 .../components/smartsheet/sidebar/MenuTop.vue        |  6 ++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui-v2/components/dashboard/TreeView.vue b/packages/nc-gui-v2/components/dashboard/TreeView.vue
index 9673f6a5d1..7d524ea5e5 100644
--- a/packages/nc-gui-v2/components/dashboard/TreeView.vue
+++ b/packages/nc-gui-v2/components/dashboard/TreeView.vue
@@ -185,7 +185,11 @@ const addTableTab = (table: TableType) => {
                 v-for="table of tables"
                 :key="table.id"
                 v-t="['a:table:open']"
-                :class="[{ hidden: !filteredTables?.includes(table) }, `nc-project-tree-tbl nc-project-tree-tbl-${table.title}`]"
+                :class="[
+                  { hidden: !filteredTables?.includes(table) },
+                  `nc-project-tree-tbl nc-project-tree-tbl-${table.title}`,
+                  route.params.title.includes(table.title) ? 'bg-blue-500/15' : '',
+                ]"
                 class="pl-5 pr-3 py-2 text-sm cursor-pointer group"
                 :data-order="table.order"
                 :data-id="table.id"
@@ -199,7 +203,11 @@ const addTableTab = (table: TableType) => {
                       @click.stop.prevent
                     />
 
-                    <component :is="icon(table)" class="nc-view-icon group-hover:hidden text-xs text-pink-500" />
+                    <component
+                      :is="icon(table)"
+                      :class="route.params.title.includes(table.title) ? 'text-pink-500' : 'text-gray-500'"
+                      class="nc-view-icon group-hover:hidden text-xs"
+                    />
                   </div>
 
                   <div class="nc-tbl-title text-xs flex-1">{{ table.title }}</div>
diff --git a/packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue b/packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue
index 1642c6296b..3691fa3672 100644
--- a/packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue
+++ b/packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue
@@ -6,7 +6,7 @@ import { notification } from 'ant-design-vue'
 import type { Ref } from 'vue'
 import Sortable from 'sortablejs'
 import RenameableMenuItem from './RenameableMenuItem.vue'
-import { inject, onMounted, ref, useApi, useRouter, watch } from '#imports'
+import { inject, onMounted, ref, useApi, useRoute, useRouter, watch } from '#imports'
 import { extractSdkResponseErrorMsg } from '~/utils'
 import { ActiveViewInj, ViewListInj } from '~/context'
 
@@ -26,6 +26,8 @@ const { api } = useApi()
 
 const router = useRouter()
 
+const route = useRoute()
+
 /** Selected view(s) for menu */
 const selected = ref<string[]>([])
 
@@ -192,7 +194,7 @@ function onDeleted() {
       :key="view.id"
       :view="view"
       class="transition-all ease-in duration-300"
-      :class="[isMarked === view.id ? 'bg-gray-200' : '']"
+      :class="[isMarked === view.id ? 'bg-gray-200' : '', route.params.viewTitle.includes(view.title) ? 'bg-blue-500/15' : '']"
       @change-view="changeView"
       @open-modal="$emit('openModal', $event)"
       @delete="onDelete"