From 99bd7190d4869219448cfe6de4906de0c4248cc3 Mon Sep 17 00:00:00 2001
From: reenphygeorge <reenphygeorge@gmail.com>
Date: Fri, 15 Sep 2023 17:37:46 +0530
Subject: [PATCH 1/2] fix(nc-gui): ui updates

---
 packages/nc-gui/assets/style.scss                    |  4 ++++
 packages/nc-gui/components/cell/Email.vue            |  4 ++--
 .../components/dashboard/Sidebar/TopSection.vue      |  2 +-
 .../nc-gui/components/dashboard/Sidebar/UserInfo.vue |  6 +++---
 packages/nc-gui/components/general/WorkspaceIcon.vue |  4 +++-
 .../nc-gui/components/project/AccessSettings.vue     | 12 +++++++-----
 .../nc-gui/components/smartsheet/header/CellIcon.ts  |  4 +++-
 7 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/packages/nc-gui/assets/style.scss b/packages/nc-gui/assets/style.scss
index 3f8bf39fa8..c50fa26b64 100644
--- a/packages/nc-gui/assets/style.scss
+++ b/packages/nc-gui/assets/style.scss
@@ -32,6 +32,10 @@
   height: var(--topbar-height) !important;
 }
 
+.anticon-check-circle {
+  @apply !relative top-[-1px] left-0;  
+}
+
 html,
 body,
 #__nuxt,
diff --git a/packages/nc-gui/components/cell/Email.vue b/packages/nc-gui/components/cell/Email.vue
index 58a704e247..8372a1a468 100644
--- a/packages/nc-gui/components/cell/Email.vue
+++ b/packages/nc-gui/components/cell/Email.vue
@@ -86,9 +86,9 @@ watch(
 
   <span v-else-if="vModel === null && showNull" class="nc-null">NULL</span>
 
-  <a v-else-if="validEmail" class="text-sm underline hover:opacity-75" :href="`mailto:${vModel}`" target="_blank">
+  <nuxt-link v-else-if="validEmail" class="text-sm underline hover:opacity-75 inline-block" :href="`mailto:${vModel}`" target="_blank">
     <LazyCellClampedText :value="vModel" :lines="rowHeight" />
-  </a>
+  </nuxt-link>
 
   <LazyCellClampedText v-else :value="vModel" :lines="rowHeight" />
 </template>
diff --git a/packages/nc-gui/components/dashboard/Sidebar/TopSection.vue b/packages/nc-gui/components/dashboard/Sidebar/TopSection.vue
index e9f76d1430..0fada364b1 100644
--- a/packages/nc-gui/components/dashboard/Sidebar/TopSection.vue
+++ b/packages/nc-gui/components/dashboard/Sidebar/TopSection.vue
@@ -41,7 +41,7 @@ const navigateToSettings = () => {
     </div>
   </template>
   <template v-else-if="!isSharedBase">
-    <div class="flex flex-col p-1 gap-y-0.5 mt-0.25 mb-0.5">
+    <div class="flex flex-col p-1 gap-y-0.5 mt-0.25 mb-0.5 truncate">
       <DashboardSidebarTopSectionHeader />
 
       <NcButton
diff --git a/packages/nc-gui/components/dashboard/Sidebar/UserInfo.vue b/packages/nc-gui/components/dashboard/Sidebar/UserInfo.vue
index 6b8ce6bd73..076c4e77f1 100644
--- a/packages/nc-gui/components/dashboard/Sidebar/UserInfo.vue
+++ b/packages/nc-gui/components/dashboard/Sidebar/UserInfo.vue
@@ -141,15 +141,15 @@ onMounted(() => {
     </NcDropdown>
 
     <div v-if="appInfo.ee" class="text-gray-500 text-xs pl-3">© 2023 NocoDB. Inc</div>
-    <div v-else-if="isMounted" class="flex flex-col gap-y-1 pt-1">
-      <div class="flex items-start flex-row justify-center px-2 gap-2">
+    <div v-else-if="isMounted" class="flex flex-row justify-between flex-wrap pt-1 truncate">
+      <div class="flex items-start flex-row justify-center px-3 gap-2">
         <GithubButton href="https://github.com/nocodb/nocodb" data-icon="octicon-star" data-show-count="true" data-size="large">
           Star
         </GithubButton>
       </div>
 
       <div class="flex items-start flex-row justify-center gap-2">
-        <GeneralJoinCloud class="color-transition px-2 text-gray-500 cursor-pointer select-none hover:text-accent" />
+        <GeneralJoinCloud class="color-transition px-3 text-gray-500 cursor-pointer select-none hover:text-accent" />
       </div>
     </div>
   </div>
diff --git a/packages/nc-gui/components/general/WorkspaceIcon.vue b/packages/nc-gui/components/general/WorkspaceIcon.vue
index be32b5c108..6b5a53ebf0 100644
--- a/packages/nc-gui/components/general/WorkspaceIcon.vue
+++ b/packages/nc-gui/components/general/WorkspaceIcon.vue
@@ -25,7 +25,9 @@ const size = computed(() => props.size || 'medium')
     :style="{ backgroundColor: workspaceColor }"
   >
     <template v-if="!props.hideLabel">
-      {{ props.workspace?.title?.slice(0, 2) }}
+      <div class="font-black">
+        {{ props.workspace?.title?.slice(0, 2) }}
+      </div>
     </template>
   </div>
 </template>
diff --git a/packages/nc-gui/components/project/AccessSettings.vue b/packages/nc-gui/components/project/AccessSettings.vue
index c96c8e8c77..d9dd0c43f2 100644
--- a/packages/nc-gui/components/project/AccessSettings.vue
+++ b/packages/nc-gui/components/project/AccessSettings.vue
@@ -155,8 +155,8 @@ onMounted(async () => {
       </div>
       <div v-else class="nc-collaborators-list nc-scrollbar-md">
         <div class="nc-collaborators-list-header">
-          <div class="flex w-1/5">Users</div>
-          <div class="flex w-1/5">Date Joined</div>
+          <div class="flex w-3/5">Users</div>
+          <div class="flex w-2/5">Date Joined</div>
           <div class="flex w-1/5">Access</div>
           <div class="flex w-1/5"></div>
           <div class="flex w-1/5"></div>
@@ -164,17 +164,19 @@ onMounted(async () => {
 
         <div class="flex flex-col nc-scrollbar-md">
           <div v-for="(collab, i) of collaborators" :key="i" class="relative w-full nc-collaborators nc-collaborators-list-row">
-            <div class="!py-0 w-1/5 email">
+            <div class="!py-0 w-3/5 email truncate">
               <div class="flex items-center gap-2">
                 <span class="color-band" :style="{ backgroundColor: stringToColour(collab.email) }">{{
                   collab?.email?.slice(0, 2)
                 }}</span>
                 <!--                <GeneralTruncateText> -->
-                {{ collab.email }}
+                <span class="truncate">
+                  {{ collab.email }}
+                </span>
                 <!--                </GeneralTruncateText> -->
               </div>
             </div>
-            <div class="text-gray-500 text-xs w-1/5 created-at">
+            <div class="text-gray-500 text-xs w-2/5 created-at truncate">
               {{ timeAgo(collab.created_at) }}
             </div>
             <div class="w-1/5 roles">
diff --git a/packages/nc-gui/components/smartsheet/header/CellIcon.ts b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
index dba234f0cf..aff2238680 100644
--- a/packages/nc-gui/components/smartsheet/header/CellIcon.ts
+++ b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
@@ -1,4 +1,4 @@
-import type { ColumnType } from 'nocodb-sdk'
+import { UITypes, type ColumnType } from 'nocodb-sdk'
 import type { PropType } from '@vue/runtime-core'
 import {
   ColumnInj,
@@ -81,6 +81,8 @@ const renderIcon = (column: ColumnType, abstractType: any) => {
     return iconMap.percent
   } else if (isInt(column, abstractType) || isFloat(column, abstractType)) {
     return iconMap.number
+  } else if(column.uidt === UITypes.Geometry) {
+    return iconMap.calculator
   } else if (isString(column, abstractType)) {
     return iconMap.text
   } else {

From e8a5f63696b5221b8ee188b5384a25cb31c0236b Mon Sep 17 00:00:00 2001
From: reenphygeorge <reenphygeorge@gmail.com>
Date: Fri, 15 Sep 2023 22:05:12 +0530
Subject: [PATCH 2/2] fix(nc-gui): isgeometry defined and linting issues

---
 packages/nc-gui/components/cell/Email.vue                  | 7 ++++++-
 packages/nc-gui/components/dashboard/Sidebar.vue           | 2 --
 .../components/smartsheet/column/AdvancedOptions.vue       | 2 +-
 .../nc-gui/components/smartsheet/column/SelectOptions.vue  | 2 +-
 packages/nc-gui/components/smartsheet/header/CellIcon.ts   | 7 ++++---
 packages/nc-gui/utils/cell.ts                              | 1 +
 packages/nc-gui/utils/iconUtils.ts                         | 1 -
 7 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/packages/nc-gui/components/cell/Email.vue b/packages/nc-gui/components/cell/Email.vue
index 8372a1a468..434dd0a1fc 100644
--- a/packages/nc-gui/components/cell/Email.vue
+++ b/packages/nc-gui/components/cell/Email.vue
@@ -86,7 +86,12 @@ watch(
 
   <span v-else-if="vModel === null && showNull" class="nc-null">NULL</span>
 
-  <nuxt-link v-else-if="validEmail" class="text-sm underline hover:opacity-75 inline-block" :href="`mailto:${vModel}`" target="_blank">
+  <nuxt-link
+    v-else-if="validEmail"
+    class="text-sm underline hover:opacity-75 inline-block"
+    :href="`mailto:${vModel}`"
+    target="_blank"
+  >
     <LazyCellClampedText :value="vModel" :lines="rowHeight" />
   </nuxt-link>
 
diff --git a/packages/nc-gui/components/dashboard/Sidebar.vue b/packages/nc-gui/components/dashboard/Sidebar.vue
index ed87a2458a..fe8c5907bc 100644
--- a/packages/nc-gui/components/dashboard/Sidebar.vue
+++ b/packages/nc-gui/components/dashboard/Sidebar.vue
@@ -5,8 +5,6 @@ const { isWorkspaceLoading } = storeToRefs(workspaceStore)
 
 const { isSharedBase } = storeToRefs(useProject())
 
-const isCreateProjectOpen = ref(false)
-
 const treeViewDom = ref<HTMLElement>()
 
 const isTreeViewOnScrollTop = ref(false)
diff --git a/packages/nc-gui/components/smartsheet/column/AdvancedOptions.vue b/packages/nc-gui/components/smartsheet/column/AdvancedOptions.vue
index 32a8868299..be45ef45ac 100644
--- a/packages/nc-gui/components/smartsheet/column/AdvancedOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/AdvancedOptions.vue
@@ -82,8 +82,8 @@ vModel.value.au = !!vModel.value.au */
 
       <a-form-item v-if="!hideLength" :label="$t('labels.lengthValue')">
         <a-input
-          class="!rounded-md"
           v-model:value="vModel.dtxp"
+          class="!rounded-md"
           :disabled="sqlUi.getDefaultLengthIsDisabled(vModel.dt) || !sqlUi.columnEditable(vModel)"
           @input="onAlter"
         />
diff --git a/packages/nc-gui/components/smartsheet/column/SelectOptions.vue b/packages/nc-gui/components/smartsheet/column/SelectOptions.vue
index d2a038d3e2..d21bec54b9 100644
--- a/packages/nc-gui/components/smartsheet/column/SelectOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/SelectOptions.vue
@@ -29,7 +29,7 @@ const emit = defineEmits(['update:value'])
 
 const vModel = useVModel(props, 'value', emit)
 
-const { formState, setAdditionalValidations, validateInfos, isPg, isMysql } = useColumnCreateStoreOrThrow()
+const { formState, setAdditionalValidations, validateInfos, isMysql } = useColumnCreateStoreOrThrow()
 
 const { project } = storeToRefs(useProject())
 
diff --git a/packages/nc-gui/components/smartsheet/header/CellIcon.ts b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
index aff2238680..ce75b5bf4d 100644
--- a/packages/nc-gui/components/smartsheet/header/CellIcon.ts
+++ b/packages/nc-gui/components/smartsheet/header/CellIcon.ts
@@ -1,4 +1,4 @@
-import { UITypes, type ColumnType } from 'nocodb-sdk'
+import { type ColumnType } from 'nocodb-sdk'
 import type { PropType } from '@vue/runtime-core'
 import {
   ColumnInj,
@@ -17,6 +17,7 @@ import {
   isEmail,
   isFloat,
   isGeoData,
+  isGeometry,
   isInt,
   isJSON,
   isPercent,
@@ -79,10 +80,10 @@ const renderIcon = (column: ColumnType, abstractType: any) => {
     return iconMap.duration
   } else if (isPercent(column)) {
     return iconMap.percent
+  } else if (isGeometry(column)) {
+    return iconMap.calculator
   } else if (isInt(column, abstractType) || isFloat(column, abstractType)) {
     return iconMap.number
-  } else if(column.uidt === UITypes.Geometry) {
-    return iconMap.calculator
   } else if (isString(column, abstractType)) {
     return iconMap.text
   } else {
diff --git a/packages/nc-gui/utils/cell.ts b/packages/nc-gui/utils/cell.ts
index 713d5e14c5..9defa58cb2 100644
--- a/packages/nc-gui/utils/cell.ts
+++ b/packages/nc-gui/utils/cell.ts
@@ -31,6 +31,7 @@ export const isDuration = (column: ColumnType) => column.uidt === UITypes.Durati
 export const isGeoData = (column: ColumnType) => column.uidt === UITypes.GeoData
 export const isPercent = (column: ColumnType) => column.uidt === UITypes.Percent
 export const isSpecificDBType = (column: ColumnType) => column.uidt === UITypes.SpecificDBType
+export const isGeometry = (column: ColumnType) => column.uidt === UITypes.Geometry
 export const isAutoSaved = (column: ColumnType) =>
   [
     UITypes.SingleLineText,
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index cf3b8af6be..ea282a3501 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -24,7 +24,6 @@ import MsGroup from '~icons/material-symbols/groups-outline-rounded'
 import MsAddBoxOutline from '~icons/nc-icons/add-box'
 import MsDownloadRounded from '~icons/nc-icons/download'
 import LogosAirtable from '~icons/logos/airtable'
-import MsStar from '~icons/material-symbols/star-outline-rounded'
 import NcStar from '~icons/nc-icons/star'
 import NcUnStar from '~icons/nc-icons/star-remove'
 import MsSort from '~icons/material-symbols/sort'