Refresh view data when showing hidden columns in order to populate new cells

packages/frontend-core/src/components/grid/controls/HideColumnsButton.svelte

@@ -3,7 +3,7 @@
   import { ActionButton, Popover, Toggle, Icon } from "@budibase/bbui"
   import { getColumnIcon } from "../lib/utils"
 
-  const { columns, stickyColumn } = getContext("grid")
+  const { columns, stickyColumn, dispatch } = getContext("grid")
 
   let open = false
   let anchor
@@ -11,33 +11,36 @@
   $: anyHidden = $columns.some(col => !col.visible)
   $: text = getText($columns)
 
-  const toggleVisibility = (column, visible) => {
+  const toggleVisibility = async (column, visible) => {
     columns.update(state => {
       const index = state.findIndex(col => col.name === column.name)
       state[index].visible = visible
       return state.slice()
     })
-    columns.actions.saveChanges()
+    await columns.actions.saveChanges()
+    dispatch(visible ? "show-column" : "hide-column")
   }
 
-  const showAll = () => {
+  const showAll = async () => {
     columns.update(state => {
       return state.map(col => ({
         ...col,
         visible: true,
       }))
     })
-    columns.actions.saveChanges()
+    await columns.actions.saveChanges()
+    dispatch("show-column")
   }
 
-  const hideAll = () => {
+  const hideAll = async () => {
     columns.update(state => {
       return state.map(col => ({
         ...col,
         visible: false,
       }))
     })
-    columns.actions.saveChanges()
+    await columns.actions.saveChanges()
+    dispatch("hide-column")
   }
 
   const getText = columns => {

packages/frontend-core/src/components/grid/stores/viewV2.js

@@ -84,7 +84,7 @@ export const createActions = context => {
 }
 
 export const initialise = context => {
-  const { definition, datasource, sort, rows, filter } = context
+  const { definition, datasource, sort, rows, filter, subscribe } = context
 
   // Keep sort and filter state in line with the view definition
   definition.subscribe($definition => {
@@ -133,4 +133,13 @@ export const initialise = context => {
       await rows.actions.refreshData()
     }
   })
+
+  // When hidden we show columns, we need to refresh data in order to fetch
+  // values for those columns
+  subscribe("show-column", async () => {
+    if (get(datasource)?.type !== "viewV2") {
+      return
+    }
+    await rows.actions.refreshData()
+  })
 }