feat(gui): add menu options in column header

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui/components.d.ts

@@ -168,6 +168,7 @@ declare module '@vue/runtime-core' {
     MdiFileEyeOutline: typeof import('~icons/mdi/file-eye-outline')['default']
     MdiFileImageBox: typeof import('~icons/mdi/file-image-box')['default']
     MdiFilePlusOutline: typeof import('~icons/mdi/file-plus-outline')['default']
+    MdiFileReplaceOutline: typeof import('~icons/mdi/file-replace-outline')['default']
     MdiFileUploadOutline: typeof import('~icons/mdi/file-upload-outline')['default']
     MdiFilterOutline: typeof import('~icons/mdi/filter-outline')['default']
     MdiFlag: typeof import('~icons/mdi/flag')['default']
@@ -210,11 +211,15 @@ declare module '@vue/runtime-core' {
     MdiShieldKeyOutline: typeof import('~icons/mdi/shield-key-outline')['default']
     MdiSlack: typeof import('~icons/mdi/slack')['default']
     MdiSort: typeof import('~icons/mdi/sort')['default']
+    MdiSortAscending: typeof import('~icons/mdi/sort-ascending')['default']
+    MdiSortDescending: typeof import('~icons/mdi/sort-descending')['default']
     MdiStar: typeof import('~icons/mdi/star')['default']
     MdiStarOutline: typeof import('~icons/mdi/star-outline')['default']
     MdiStorefrontOutline: typeof import('~icons/mdi/storefront-outline')['default']
     MdiTable: typeof import('~icons/mdi/table')['default']
     MdiTableArrowRight: typeof import('~icons/mdi/table-arrow-right')['default']
+    MdiTableColumnPlusAfter: typeof import('~icons/mdi/table-column-plus-after')['default']
+    MdiTableColumnPlusBefore: typeof import('~icons/mdi/table-column-plus-before')['default']
     MdiTableLarge: typeof import('~icons/mdi/table-large')['default']
     MdiText: typeof import('~icons/mdi/text')['default']
     MdiThumbUp: typeof import('~icons/mdi/thumb-up')['default']

packages/nc-gui/components/smartsheet/header/Menu.vue

@@ -13,6 +13,7 @@ import {
   useMetas,
   useNuxtApp,
 } from '#imports'
+import { ActiveViewInj } from '~/context'
 
 const { virtual = false } = defineProps<{ virtual?: boolean }>()
 
@@ -22,6 +23,8 @@ const column = inject(ColumnInj)
 
 const meta = inject(MetaInj, ref())
 
+const view = inject(ActiveViewInj, ref())
+
 const isLocked = inject(IsLockedInj)
 
 const { $api, $e } = useNuxtApp()
@@ -69,10 +72,20 @@ const setAsPrimaryValue = async () => {
     message.error(t('msg.error.primaryColumnUpdateFailed'))
   }
 }
+
+const sortCol = async (direction: 'asc' | 'desc') => {
+  try {
+    $e('a:sort:add', { from: 'column-menu' })
+    await $api.dbTableSort.create(view.value?.id as string, { fk_column_id: column!.value.id, direction })
+  } catch (e: any) {
+    message.error(await extractSdkResponseErrorMsg(e))
+  }
+}
 </script>
 
 <template>
-  <a-dropdown v-if="!isLocked" placement="bottomRight" :trigger="['click']" overlay-class-name="nc-dropdown-column-operations">
+  <a-dropdown v-if="!isLocked" placement="bottomRight" :trigger="['click']"
+              overlay-class-name="nc-dropdown-column-operations">
     <MdiMenuDown class="h-full text-grey nc-ui-dt-dropdown cursor-pointer outline-0" />
 
     <template #overlay>
@@ -85,6 +98,41 @@ const setAsPrimaryValue = async () => {
           </div>
         </a-menu-item>
 
+        <a-divider class="!my-0" />
+
+        <a-menu-item @click="emit('edit')">
+          <div class="nc-column-duplicate nc-header-menu-item">
+            <MdiFileReplaceOutline class="text-primary" />
+            Duplicate
+          </div>
+        </a-menu-item>
+        <a-menu-item @click="emit('edit')">
+          <div class="nc-column-insert-after nc-header-menu-item">
+            <MdiTableColumnPlusAfter class="text-primary" />
+            Insert After
+          </div>
+        </a-menu-item>
+        <a-menu-item @click="emit('edit')">
+          <div class="nc-column-insert-before nc-header-menu-item">
+            <MdiTableColumnPlusBefore class="text-primary" />
+            Insert before
+          </div>
+        </a-menu-item>
+        <a-divider class="!my-0" />
+        <a-menu-item @click="sortCol('asc')">
+          <div class="nc-column-insert-after nc-header-menu-item">
+            <MdiSortAscending class="text-primary" />
+            Sort Ascending
+          </div>
+        </a-menu-item>
+        <a-menu-item @click="sortCol('desc')">
+          <div class="nc-column-insert-before nc-header-menu-item">
+            <MdiSortDescending class="text-primary" />
+            Sort Descending
+          </div>
+        </a-menu-item>
+        <a-divider class="!my-0" />
+
         <a-menu-item v-if="!virtual" @click="setAsPrimaryValue">
           <div class="nc-column-set-primary nc-header-menu-item">
             <MdiStar class="text-primary" />