From b6a6bbee5f39f6a5f7f09bc51ca87ba82fcacc60 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Tue, 12 Nov 2024 06:06:48 +0000
Subject: [PATCH] fix: minor ui corrections

---
 .../dashboard/TreeView/ViewsNode.vue          |  9 +++--
 .../nc-gui/components/dlg/ReAssign/index.vue  |  7 +++-
 .../smartsheet/toolbar/LockType.vue           | 33 +++++--------------
 packages/nc-gui/utils/viewUtils.ts            | 21 ++++++++++++
 4 files changed, 42 insertions(+), 28 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsNode.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsNode.vue
index 5dc062272d..be65d3c07a 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsNode.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import type { TableType, ViewType, ViewTypes } from 'nocodb-sdk'
+import { type TableType, ViewLockType, type ViewType, type ViewTypes } from 'nocodb-sdk'
 import type { WritableComputedRef } from '@vue/reactivity'
 import { isDefaultBase as _isDefaultBase } from '#imports'
 
@@ -285,15 +285,18 @@ watch(isDropdownOpen, async () => {
           :style="{ wordBreak: 'keep-all', whiteSpace: 'nowrap', display: 'inline' }"
         >
           {{ vModel.alias || vModel.title }}
+          <component
+            :is="viewLockIcons[view.lock_type].icon"
+            v-if="view.lock_type === ViewLockType.Locked || view.lock_type === ViewLockType.Personal"
+            class="text-gray-500 ml-1 -mt-[2px] w-4 h-4"
+          />
         </div>
       </NcTooltip>
-
       <template v-if="!isEditing && !isLocked">
         <NcTooltip v-if="vModel.description?.length" placement="bottom">
           <template #title>
             {{ vModel.description }}
           </template>
-
           <NcButton type="text" class="!hover:bg-transparent" size="xsmall">
             <GeneralIcon icon="info" class="!w-3.5 !h-3.5 nc-info-icon group-hover:opacity-100 text-gray-600 opacity-0" />
           </NcButton>
diff --git a/packages/nc-gui/components/dlg/ReAssign/index.vue b/packages/nc-gui/components/dlg/ReAssign/index.vue
index bbf1a90260..017382fe48 100644
--- a/packages/nc-gui/components/dlg/ReAssign/index.vue
+++ b/packages/nc-gui/components/dlg/ReAssign/index.vue
@@ -148,7 +148,12 @@ const inputEl = (el: HTMLInputElement) => {
     </div>
     <div class="mb-5">
       <div class="mb-1">New owner</div>
-      <div class="rounded-lg border-1">
+      <div
+        class="rounded-lg border-1"
+        :class="{
+          'shadow-sm': selectedUser && !userSelectMenu,
+        }"
+      >
         <UserItem
           v-if="selectedUser && !userSelectMenu"
           :user="selectedUser"
diff --git a/packages/nc-gui/components/smartsheet/toolbar/LockType.vue b/packages/nc-gui/components/smartsheet/toolbar/LockType.vue
index 3c1588943c..f576d401e8 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/LockType.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/LockType.vue
@@ -1,30 +1,11 @@
 <script setup lang="ts">
-import UsersIcon from '~icons/nc-icons/users'
-import LockIcon from '~icons/nc-icons/lock'
-import PersonalIcon from '~icons/nc-icons/personal'
 import { LockType } from '#imports'
 
 const { type, hideTick } = defineProps<{ hideTick?: boolean; type: LockType; disabled?: boolean }>()
 
 const emit = defineEmits(['select'])
 
-const types = {
-  [LockType.Personal]: {
-    title: 'title.personal',
-    icon: PersonalIcon,
-    subtitle: 'msg.info.personalView',
-  },
-  [LockType.Collaborative]: {
-    title: 'title.collaborative',
-    icon: UsersIcon,
-    subtitle: 'msg.info.collabView',
-  },
-  [LockType.Locked]: {
-    title: 'title.locked',
-    icon: LockIcon,
-    subtitle: 'msg.info.lockedView',
-  },
-}
+const types = viewLockIcons;
 
 const selectedView = inject(ActiveViewInj)
 </script>
@@ -58,10 +39,14 @@ const selectedView = inject(ActiveViewInj)
             <span v-else />
           </template>
         </div>
-        <div v-if="!hideTick" class="nc-subtitle max-w-120 text-xs whitespace-normal ml-6" :class="{
-              'text-gray-400': disabled,
-              'text-gray-500': !disabled,
-        }">
+        <div
+          v-if="!hideTick"
+          class="nc-subtitle max-w-120 text-xs whitespace-normal ml-6"
+          :class="{
+            'text-gray-400': disabled,
+            'text-gray-500': !disabled,
+          }"
+        >
           {{ $t(types[type].subtitle) }}
         </div>
       </div>
diff --git a/packages/nc-gui/utils/viewUtils.ts b/packages/nc-gui/utils/viewUtils.ts
index d928d6c7dd..737ab2f8e7 100644
--- a/packages/nc-gui/utils/viewUtils.ts
+++ b/packages/nc-gui/utils/viewUtils.ts
@@ -1,6 +1,9 @@
 import { ViewTypes } from 'nocodb-sdk'
 import { iconMap } from './iconUtils'
 import type { Language } from '~/lib/types'
+import UsersIcon from '~icons/nc-icons/users'
+import LockIcon from '~icons/nc-icons/lock'
+import PersonalIcon from '~icons/nc-icons/personal'
 
 export const viewIcons: Record<number | string, { icon: any; color: string }> = {
   [ViewTypes.GRID]: { icon: iconMap.grid, color: '#36BFFF' },
@@ -43,3 +46,21 @@ export const getViewIcon = (key?: string | number) => {
 export function applyNonSelectable() {
   document.body.classList.add('non-selectable')
 }
+
+export const viewLockIcons = {
+  [LockType.Personal]: {
+    title: 'title.personal',
+    icon: PersonalIcon,
+    subtitle: 'msg.info.personalView',
+  },
+  [LockType.Collaborative]: {
+    title: 'title.collaborative',
+    icon: UsersIcon,
+    subtitle: 'msg.info.collabView',
+  },
+  [LockType.Locked]: {
+    title: 'title.locked',
+    icon: LockIcon,
+    subtitle: 'msg.info.lockedView',
+  },
+}