fix: cache user settings

frontend/src/components/Controls/Grid.vue

@@ -4,7 +4,10 @@
       {{ __(label) }}
     </div>
 
-    <div class="rounded border border-outline-gray-modals">
+    <div
+      v-if="fields?.length"
+      class="rounded border border-outline-gray-modals"
+    >
       <!-- Header -->
       <div
         class="grid-header flex items-center rounded-t-[7px] bg-surface-gray-2 text-ink-gray-5 truncate"
@@ -28,9 +31,8 @@
           :style="{ gridTemplateColumns: gridTemplateColumns }"
         >
           <div
-            v-if="fields?.length"
-            class="border-r border-outline-gray-2 p-2 truncate"
             v-for="field in fields"
+            class="border-r border-outline-gray-2 p-2 truncate"
             :key="field.name"
             :title="field.label"
           >
@@ -73,7 +75,6 @@
                 :style="{ gridTemplateColumns: gridTemplateColumns }"
               >
                 <div
-                  v-if="fields?.length"
                   class="border-r border-outline-gray-modals h-full"
                   v-for="field in fields"
                   :key="field.name"
@@ -242,7 +243,7 @@ const showGridFieldsEditorModal = ref(false)
 const showGridRowFieldsModal = ref(false)
 
 const fields = computed(() => {
-  let gridSettings = getGridSettings()
+  let gridSettings = getGridSettings(props.parentDoctype)
   let gridFields = getFields()
   if (gridSettings.length) {
     let d = gridSettings.map((gs) =>
@@ -266,7 +267,7 @@ function getFieldObj(field) {
 const gridTemplateColumns = computed(() => {
   if (!fields.value?.length) return '1fr'
   // for the checkbox & sr no. columns
-  let gridSettings = getGridSettings()
+  let gridSettings = getGridSettings(props.parentDoctype)
   if (gridSettings.length) {
     return gridSettings.map((gs) => `minmax(0, ${gs.columns || 2}fr)`).join(' ')
   }

frontend/src/components/Controls/GridFieldsEditorModal.vue

@@ -123,7 +123,7 @@ const dirty = computed(() => {
 
 const oldFields = computed(() => {
   let _fields = getFields()
-  let gridSettings = getGridSettings()
+  let gridSettings = getGridSettings(props.parentDoctype)
 
   if (gridSettings.length) {
     return gridSettings.map((field) => {
@@ -161,7 +161,7 @@ function removeField(field) {
 function update() {
   loading.value = true
 
-  let updateFields = fields.value.map((field, idx) => {
+  let updateFields = fields.value.map((field) => {
     return {
       fieldname: field.fieldname,
       columns: field.columns,
@@ -176,7 +176,7 @@ function update() {
   saveUserSettings(props.parentDoctype, 'GridView', updateFields, () => {
     loading.value = false
     show.value = false
-    userSettings.value['GridView'][props.doctype] = updateFields
+    userSettings[props.parentDoctype]['GridView'][props.doctype] = updateFields
   })
 }
 

frontend/src/stores/meta.js

@@ -3,7 +3,7 @@ import { formatCurrency, formatNumber } from '@/utils/numberFormat.js'
 import { ref, reactive } from 'vue'
 
 const doctypeMeta = reactive({})
-const userSettings = ref({})
+const userSettings = reactive({})
 
 export function getMeta(doctype) {
   const meta = createResource({
@@ -20,7 +20,7 @@ export function getMeta(doctype) {
         doctypeMeta[dtMeta.name] = dtMeta
       }
 
-      userSettings.value = JSON.parse(res.user_settings)
+      userSettings[doctype] = JSON.parse(res.user_settings)
     },
   })
 
@@ -55,10 +55,10 @@ export function getMeta(doctype) {
     return formatCurrency(doc[fieldname], '', currency, precision)
   }
 
-  function getGridSettings(dt = null) {
+  function getGridSettings(parentDoctype, dt = null) {
     dt = dt || doctype
-    if (!userSettings.value['GridView']?.[doctype]) return {}
-    return userSettings.value['GridView'][doctype]
+    if (!userSettings[parentDoctype]['GridView']?.[doctype]) return {}
+    return userSettings[parentDoctype]['GridView'][doctype]
   }
 
   function getFields(dt = null) {
@@ -77,7 +77,7 @@ export function getMeta(doctype) {
   }
 
   function saveUserSettings(parentDoctype, key, value, callback) {
-    let oldUserSettings = userSettings.value
+    let oldUserSettings = userSettings[parentDoctype]
     let newUserSettings = JSON.parse(JSON.stringify(oldUserSettings))
 
     newUserSettings[key][doctype] = value