feat(nc-gui): make showNullAndEmptyInFilter project-based

packages/nc-gui/components/dashboard/settings/Misc.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
 import { useGlobal, useProject, watch } from '#imports'
 
-const { includeM2M, showNull, showNullAndEmptyInFilter } = useGlobal()
+const { includeM2M, showNull } = useGlobal()
 
-const { loadTables, hasEmptyOrNullFilters } = useProject()
+const { project, updateProject, projectMeta, loadTables, hasEmptyOrNullFilters } = useProject()
 
 watch(includeM2M, async () => await loadTables())
 
+const showNullAndEmptyInFilter = ref(projectMeta.value.showNullAndEmptyInFilter)
+
 async function showNullAndEmptyInFilterOnChange(evt: any) {
   // users cannot hide null & empty option if there is existing null / empty filters
   if (!evt.target.checked) {
@@ -15,6 +17,16 @@ async function showNullAndEmptyInFilterOnChange(evt: any) {
       message.warning('Null / Empty filters exist. Please remove them first.')
     }
   }
+  const newProjectMeta = {
+    ...projectMeta.value,
+    showNullAndEmptyInFilter: showNullAndEmptyInFilter.value,
+  }
+  // update local state
+  project.value.meta = newProjectMeta
+  // update db
+  await updateProject({
+    meta: newProjectMeta,
+  })
 }
 </script>
 

packages/nc-gui/composables/useViewFilters.ts

@@ -11,9 +11,9 @@ import {
   message,
   ref,
   useDebounceFn,
-  useGlobal,
   useMetas,
   useNuxtApp,
+  useProject,
   useUIPermission,
   watch,
 } from '#imports'
@@ -34,7 +34,7 @@ export function useViewFilters(
 
   const { nestedFilters } = useSmartsheetStoreOrThrow()
 
-  const { showNullAndEmptyInFilter } = useGlobal()
+  const { projectMeta } = useProject()
 
   const isPublic = inject(IsPublicInj, ref(false))
 
@@ -110,7 +110,7 @@ export function useViewFilters(
   ) => {
     if (['empty', 'notempty', 'null', 'notnull'].includes(compOp.value)) {
       // for these 4 comparisonOp, show them based on `showNullAndEmptyInFilter` in Project Settings
-      return showNullAndEmptyInFilter.value
+      return projectMeta.value.showNullAndEmptyInFilter
     } else if (compOp.includedTypes) {
       // include allowed values only if selected column type matches
       return filter.fk_column_id && compOp.includedTypes.includes(types.value[filter.fk_column_id])