diff --git a/packages/frontend-core/src/components/grid/controls/HideColumnsButton.svelte b/packages/frontend-core/src/components/grid/controls/HideColumnsButton.svelte index b8728156db..01c9dc648b 100644 --- a/packages/frontend-core/src/components/grid/controls/HideColumnsButton.svelte +++ b/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 => { diff --git a/packages/frontend-core/src/components/grid/stores/viewV2.js b/packages/frontend-core/src/components/grid/stores/viewV2.js index c14ce8cf0d..493dbb0ad3 100644 --- a/packages/frontend-core/src/components/grid/stores/viewV2.js +++ b/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() + }) }