fix(gui): add newly added sort top of the list

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

packages/nc-gui/components/smartsheet/Grid.vue

@@ -545,7 +545,7 @@ watch(
   { immediate: true },
 )
 
-const columnPosition = ref<Pick<ColumnReqType, 'columnOrder'> | null>(null)
+const columnPosition = ref<Pick<ColumnReqType, 'column_order'> | null>(null)
 
 eventBus.on(async (event, payload) => {
   if (event === SmartsheetStoreEvents.FIELD_ADD) {

packages/nc-gui/components/smartsheet/column/EditOrAdd.vue

@@ -26,7 +26,7 @@ import MdiMinusIcon from '~icons/mdi/minus-circle-outline'
 import MdiIdentifierIcon from '~icons/mdi/identifier'
 
 const props = defineProps<{
-  columnPosition?: Pick<ColumnReqType, 'columnOrder'>
+  columnPosition?: Pick<ColumnReqType, 'column_order'>
 }>()
 
 const emit = defineEmits(['submit', 'cancel'])

packages/nc-gui/components/smartsheet/column/EditOrAddProvider.vue

@@ -5,7 +5,7 @@ import { MetaInj, inject, ref, toRef, useProvideColumnCreateStore } from '#impor
 
 interface Props {
   column?: ColumnType & { meta: any }
-  columnPosition?: Pick<ColumnReqType, 'columnOrder'>
+  columnPosition?: Pick<ColumnReqType, 'column_order'>
 }
 
 const props = defineProps<Props>()

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

@@ -18,7 +18,7 @@ provide(ColumnInj, column)
 
 const editColumnDropdown = ref(false)
 
-const columnOrder = ref<Pick<ColumnReqType, 'columnOrder'> | null>(null)
+const columnOrder = ref<Pick<ColumnReqType, 'column_order'> | null>(null)
 
 const addField = async (payload) => {
   columnOrder.value = payload

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

@@ -85,7 +85,7 @@ const setAsPrimaryValue = async () => {
 const sortByColumn = 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 })
+    await $api.dbTableSort.create(view.value?.id as string, { fk_column_id: column!.value.id, direction, push_to_top: true })
     eventBus.emit(SmartsheetStoreEvents.SORT_RELOAD)
     reloadDataHook?.trigger()
   } catch (e: any) {
@@ -144,9 +144,9 @@ const duplicateColumn = async () => {
 
     await $api.dbTableColumn.create(meta!.value!.id!, {
       ...columnCreatePayload,
-      columnOrder: {
+      column_order: {
         order: newColumnOrder,
-        viewId: view.value?.id as string,
+        view_id: view.value?.id as string,
       },
     })
     await getMeta(meta!.value!.id!, true)
@@ -178,10 +178,10 @@ const addColumn = async (before = false) => {
   //     viewId: view.value?.id as string,
   //   },
   // })
-  emit('addColumn',  {
-    columnOrder: {
+  emit('addColumn', {
+    column_order: {
       order: newColumnOrder,
-      viewId: view.value?.id as string,
+      view_id: view.value?.id as string,
     },
   })
 }

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

@@ -100,7 +100,7 @@ const tooltipMsg = computed(() => {
   return ''
 })
 
-const columnOrder = ref<Pick<ColumnReqType, 'columnOrder'> | null>(null)
+const columnOrder = ref<Pick<ColumnReqType, 'column_order'> | null>(null)
 
 const addField = async (payload) => {
   columnOrder.value = payload

packages/nc-gui/composables/useColumnCreateStore.ts

@@ -191,7 +191,7 @@ const [useProvideColumnCreateStore, useColumnCreateStore] = createInjectionState
       if (cdf) formState.value.cdf = formState.value.cdf || null
     }
 
-    const addOrUpdate = async (onSuccess: () => void, columnPosition?: Pick<ColumnReqType, 'columnOrder'>) => {
+    const addOrUpdate = async (onSuccess: () => void, columnPosition?: Pick<ColumnReqType, 'column_order'>) => {
       try {
         if (!(await validate())) return
       } catch (e) {

packages/nocodb-sdk/src/lib/Api.ts

@@ -669,8 +669,8 @@ export type ColumnReqType = (
 ) & {
   column_name?: string;
   title?: string;
-  columnOrder?: {
-    viewId?: string;
+  column_order?: {
+    view_id?: string;
     order?: number;
   };
 };
@@ -2618,7 +2618,13 @@ export class Api<
      * @request POST:/api/v1/db/meta/views/{viewId}/sorts
      * @response `200` `void` OK
      */
-    create: (viewId: string, data: SortType, params: RequestParams = {}) =>
+    create: (
+      viewId: string,
+      data: SortType & {
+        push_to_top?: boolean;
+      },
+      params: RequestParams = {}
+    ) =>
       this.request<void, any>({
         path: `/api/v1/db/meta/views/${viewId}/sorts`,
         method: 'POST',

packages/nocodb/src/lib/meta/api/sortApis.ts

@@ -4,7 +4,7 @@ import Model from '../../models/Model';
 import { Tele } from 'nc-help';
 // @ts-ignore
 import { PagedResponseImpl } from '../helpers/PagedResponse';
-import { SortListType, TableReqType, TableType } from 'nocodb-sdk';
+import { SortListType, SortType, TableType } from 'nocodb-sdk';
 // @ts-ignore
 import ProjectMgrv2 from '../../db/sql-mgr/v2/ProjectMgrv2';
 // @ts-ignore
@@ -28,11 +28,11 @@ export async function sortList(
 }
 
 // @ts-ignore
-export async function sortCreate(req: Request<any, any, TableReqType>, res) {
+export async function sortCreate(req: Request<any, any, SortType>, res) {
   const sort = await Sort.insert({
     ...req.body,
     fk_view_id: req.params.viewId,
-  });
+  } as Sort);
   Tele.emit('evt', { evt_type: 'sort:created' });
   res.json(sort);
 }

packages/nocodb/src/lib/models/Column.ts

@@ -74,7 +74,7 @@ export default class Column<T = any> implements ColumnType {
       [key: string]: any;
       fk_model_id: string;
       uidt: UITypes | string;
-    },
+    } & Pick<ColumnReqType, 'column_order'>,
     ncMeta = Noco.ncMeta
   ) {
     if (!column.fk_model_id) NcError.badRequest('Missing model id');
@@ -130,7 +130,6 @@ export default class Column<T = any> implements ColumnType {
     }
 
     if (!column.uidt) throw new Error('UI Datatype not found');
-    const order = 1;
     const row = await ncMeta.metaInsert2(
       null, //column.project_id || column.base_id,
       null, //column.db_alias,
@@ -152,8 +151,8 @@ export default class Column<T = any> implements ColumnType {
       {
         fk_column_id: row.id,
         fk_model_id: column.fk_model_id,
-        order,
         show: true,
+        column_order: column.column_order,
       },
       ncMeta
     );

packages/nocodb/src/lib/models/Sort.ts

@@ -34,18 +34,22 @@ export default class Sort {
     });
   }
 
-  public static async insert(sortObj: Partial<Sort>, ncMeta = Noco.ncMeta) {
+  public static async insert(
+    sortObj: Partial<Sort> & { push_to_top?: boolean },
+    ncMeta = Noco.ncMeta
+  ) {
     // todo: implement a generic function
-    const order =
-      (+(
-        await ncMeta
-          .knex(MetaTable.SORT)
-          .max('order', { as: 'order' })
-          .where({
-            fk_view_id: sortObj.fk_view_id,
-          })
-          .first()
-      )?.order || 0) + 1;
+    const order = sortObj.push_to_top
+      ? 1
+      : (+(
+          await ncMeta
+            .knex(MetaTable.SORT)
+            .max('order', { as: 'order' })
+            .where({
+              fk_view_id: sortObj.fk_view_id,
+            })
+            .first()
+        )?.order || 0) + 1;
 
     const insertObj = {
       id: sortObj.id,
@@ -62,20 +66,39 @@ export default class Sort {
       insertObj.base_id = model.base_id;
     }
 
-    const row = await ncMeta.metaInsert2(null, null, MetaTable.SORT, insertObj);
-
-    await NocoCache.appendToList(
-      CacheScope.SORT,
-      [sortObj.fk_view_id],
-      `${CacheScope.SORT}:${row.id}`
-    );
-
-    await NocoCache.appendToList(
-      CacheScope.SORT,
-      [sortObj.fk_column_id],
-      `${CacheScope.SORT}:${row.id}`
-    );
+    // increment existing order
+    if (sortObj.push_to_top) {
+      await ncMeta
+        .knex(MetaTable.SORT)
+        .where({
+          fk_view_id: sortObj.fk_view_id,
+        })
+        .increment('order', 1);
+    }
 
+    const row = await ncMeta.metaInsert2(null, null, MetaTable.SORT, insertObj);
+    if (sortObj.push_to_top) {
+      // todo: delete cache
+      const sortList = await ncMeta.metaList2(null, null, MetaTable.SORT, {
+        condition: { fk_view_id: sortObj.fk_view_id },
+        orderBy: {
+          order: 'asc',
+        },
+      });
+      await NocoCache.setList(CacheScope.SORT, [sortObj.fk_view_id], sortList);
+    } else {
+      await NocoCache.appendToList(
+        CacheScope.SORT,
+        [sortObj.fk_view_id],
+        `${CacheScope.SORT}:${row.id}`
+      );
+
+      await NocoCache.appendToList(
+        CacheScope.SORT,
+        [sortObj.fk_column_id],
+        `${CacheScope.SORT}:${row.id}`
+      );
+    }
     return this.get(row.id, ncMeta);
   }
 

packages/nocodb/src/lib/models/View.ts

@@ -450,7 +450,7 @@ export default class View implements ViewType {
       fk_model_id: any;
       order?: number;
       show;
-    } & Pick<ColumnReqType, 'columnOrder'>,
+    } & Pick<ColumnReqType, 'column_order'>,
     ncMeta = Noco.ncMeta
   ) {
     const insertObj = {
@@ -464,8 +464,8 @@ export default class View implements ViewType {
     for (const view of views) {
       const modifiedInsertObj = { ...insertObj, fk_view_id: view.id };
 
-      if (param.columnOrder?.viewId === view.id) {
-        modifiedInsertObj.order = param.columnOrder?.order;
+      if (param.column_order?.view_id === view.id) {
+        modifiedInsertObj.order = param.column_order?.order;
       }
 
       switch (view.type) {

scripts/sdk/swagger.json

@@ -2286,7 +2286,19 @@
           "content": {
             "application/json": {
               "schema": {
-                "$ref": "#/components/schemas/Sort"
+                "allOf": [
+                  {
+                    "$ref": "#/components/schemas/Sort"
+                  },
+                  {
+                    "type": "object",
+                    "properties": {
+                      "push_to_top": {
+                        "type": "boolean"
+                      }
+                    }
+                  }
+                ]
               }
             }
           }
@@ -9195,10 +9207,10 @@
               "title": {
                 "type": "string"
               },
-              "columnOrder": {
+              "column_order": {
                 "type": "object",
                 "properties": {
-                  "viewId": {
+                  "view_id": {
                     "type": "string"
                   },
                   "order": {