feat(nc-gui): persist add new record mode (grid/form) in local storage (#8992)

packages/nc-gui/components/smartsheet/grid/Table.vue

@@ -109,7 +109,7 @@ const reloadViewDataHook = inject(ReloadViewDataHookInj, createEventHook())
 
 const openNewRecordFormHook = inject(OpenNewRecordFormHookInj, createEventHook())
 
-const { isMobileMode } = useGlobal()
+const { isMobileMode, isAddNewRecordGridMode, setAddNewRecordGridMode } = useGlobal()
 
 const scrollParent = inject(ScrollParentInj, ref<undefined>())
 
@@ -196,8 +196,6 @@ const preloadColumn = ref<any>()
 
 const scrolling = ref(false)
 
-const isAddNewRecordGridMode = ref(true)
-
 const switchingTab = ref(false)
 
 const isView = false
@@ -493,12 +491,12 @@ const onDraftRecordClick = () => {
 }
 
 const onNewRecordToGridClick = () => {
-  isAddNewRecordGridMode.value = true
+  setAddNewRecordGridMode(true)
   addEmptyRow()
 }
 
 const onNewRecordToFormClick = () => {
-  isAddNewRecordGridMode.value = false
+  setAddNewRecordGridMode(false)
   onDraftRecordClick()
 }
 

packages/nc-gui/composables/useGlobal/actions.ts

@@ -167,6 +167,10 @@ export function useGlobalActions(state: State): Actions {
     }
   }
 
+  const setAddNewRecordGridMode = (isGridMode: boolean) => {
+    state.isAddNewRecordGridMode.value = isGridMode
+  }
+
   return {
     signIn,
     signOut,
@@ -179,5 +183,6 @@ export function useGlobalActions(state: State): Actions {
     getMainUrl,
     setGridViewPageSize,
     setLeftSidebarSize,
+    setAddNewRecordGridMode,
   }
 }

packages/nc-gui/composables/useGlobal/state.ts

@@ -62,6 +62,7 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
       old: INITIAL_LEFT_SIDEBAR_WIDTH,
       current: INITIAL_LEFT_SIDEBAR_WIDTH,
     },
+    isAddNewRecordGridMode: true,
   }
 
   /** saves a reactive state, any change to these values will write/delete to localStorage */

packages/nc-gui/composables/useGlobal/types.ts

@@ -57,6 +57,7 @@ export interface StoredState {
     old: number
     current: number
   }
+  isAddNewRecordGridMode: boolean
 }
 
 export type State = ToRefs<Omit<StoredState, 'token'>> & {
@@ -94,6 +95,7 @@ export interface Actions {
   getMainUrl: (workspaceId: string) => string | undefined
   setGridViewPageSize: (pageSize: number) => void
   setLeftSidebarSize: (params: { old?: number; current?: number }) => void
+  setAddNewRecordGridMode: (isGridMode: boolean) => void
 }
 
 export type ReadonlyState = Readonly<Pick<State, 'token' | 'user'>> & Omit<State, 'token' | 'user'>