diff --git a/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte b/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
index 8c66d9ecfc..b4940c8903 100644
--- a/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
+++ b/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
@@ -2,16 +2,29 @@
import { getContext } from "svelte"
import { ActionButton, Popover } from "@budibase/bbui"
import ColumnsSettingContent from "./ColumnsSettingContent.svelte"
+ import { FieldPermissions } from "../../../constants"
export let allowViewReadonlyColumns = false
- const { columns } = getContext("grid")
+ const { columns, datasource } = getContext("grid")
let open = false
let anchor
$: anyRestricted = $columns.filter(col => !col.visible || col.readonly).length
$: text = anyRestricted ? `Columns (${anyRestricted} restricted)` : "Columns"
+
+ $: permissions =
+ $datasource.type === "viewV2"
+ ? [
+ FieldPermissions.WRITABLE,
+ FieldPermissions.READONLY,
+ FieldPermissions.HIDDEN,
+ ]
+ : [FieldPermissions.WRITABLE, FieldPermissions.HIDDEN]
+ $: disabledPermissions = allowViewReadonlyColumns
+ ? []
+ : [FieldPermissions.READONLY]
@@ -28,5 +41,9 @@
-
+
diff --git a/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte b/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte
index a967939bb3..e2d85f7945 100644
--- a/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte
+++ b/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte
@@ -6,11 +6,22 @@
import { helpers } from "@budibase/shared-core"
import { FieldType } from "@budibase/types"
import { tables } from "stores/builder"
+ import { FieldPermissions } from "../../../constants"
- export let allowViewReadonlyColumns
+ export let permissions = [FieldPermissions.WRITABLE, FieldPermissions.HIDDEN]
+ export let disabledPermissions = []
export let columns
const { datasource, dispatch } = getContext("grid")
+ $: permissionsObj = permissions.reduce(
+ (acc, c) => ({
+ ...acc,
+ [c]: {
+ disabled: disabledPermissions.includes(c),
+ },
+ }),
+ {}
+ )
$: allowRelationshipSchemas = true // TODO
let relationshipPanelOpen = false
@@ -18,8 +29,8 @@
let relationshipPanelColumns = []
const toggleColumn = async (column, permission) => {
- const visible = permission !== PERMISSION_OPTIONS.HIDDEN
- const readonly = permission === PERMISSION_OPTIONS.READONLY
+ const visible = permission !== FieldPermissions.HIDDEN
+ const readonly = permission === FieldPermissions.READONLY
await datasource.actions.addSchemaMutation(column.name, {
visible,
@@ -36,60 +47,63 @@
dispatch(visible ? "show-column" : "hide-column")
}
- const PERMISSION_OPTIONS = {
- WRITABLE: "writable",
- READONLY: "readonly",
- HIDDEN: "hidden",
- }
-
$: displayColumns = columns.map(c => {
const isRequired = helpers.schema.isRequired(c.schema.constraints)
const requiredTooltip = isRequired && "Required columns must be writable"
const editEnabled =
- !isRequired ||
- columnToPermissionOptions(c) !== PERMISSION_OPTIONS.WRITABLE
- const options = [
- {
- icon: "Edit",
- value: PERMISSION_OPTIONS.WRITABLE,
- tooltip: (!editEnabled && requiredTooltip) || "Writable",
- disabled: !editEnabled,
- },
- ]
- if ($datasource.type === "viewV2") {
+ !isRequired || columnToPermissionOptions(c) !== FieldPermissions.WRITABLE
+ const options = []
+
+ if (permissionsObj[FieldPermissions.WRITABLE]) {
options.push({
- icon: "Visibility",
- value: PERMISSION_OPTIONS.READONLY,
- tooltip: allowViewReadonlyColumns
- ? requiredTooltip || "Read only"
- : "Read only (premium feature)",
- disabled: !allowViewReadonlyColumns || isRequired,
+ icon: "Edit",
+ value: FieldPermissions.WRITABLE,
+ tooltip: (!editEnabled && requiredTooltip) || "Writable",
+ disabled:
+ !editEnabled || permissionsObj[FieldPermissions.WRITABLE].disabled,
})
}
- options.push({
- icon: "VisibilityOff",
- value: PERMISSION_OPTIONS.HIDDEN,
- disabled: c.primaryDisplay || isRequired,
- tooltip:
- (c.primaryDisplay && "Display column cannot be hidden") ||
- requiredTooltip ||
- "Hidden",
- })
+ if (permissionsObj[FieldPermissions.READONLY]) {
+ options.push({
+ icon: "Visibility",
+ value: FieldPermissions.READONLY,
+ tooltip: !permissionsObj[FieldPermissions.READONLY].disabled
+ ? requiredTooltip || "Read only"
+ : "Read only (premium feature)",
+ disabled:
+ permissionsObj[FieldPermissions.READONLY].disabled || isRequired,
+ })
+ }
+
+ if (permissionsObj[FieldPermissions.HIDDEN]) {
+ options.push({
+ icon: "VisibilityOff",
+ value: FieldPermissions.HIDDEN,
+ disabled:
+ c.primaryDisplay ||
+ isRequired ||
+ permissionsObj[FieldPermissions.HIDDEN].disabled,
+ tooltip:
+ (c.primaryDisplay && "Display column cannot be hidden") ||
+ requiredTooltip ||
+ "Hidden",
+ })
+ }
return { ...c, options }
})
function columnToPermissionOptions(column) {
if (column.schema.visible === false) {
- return PERMISSION_OPTIONS.HIDDEN
+ return FieldPermissions.HIDDEN
}
if (column.schema.readonly) {
- return PERMISSION_OPTIONS.READONLY
+ return FieldPermissions.READONLY
}
- return PERMISSION_OPTIONS.WRITABLE
+ return FieldPermissions.WRITABLE
}
function onRelationshipOpen(column, domElement) {
@@ -109,6 +123,7 @@
schema: {
...column,
visible: !!isPrimaryDisplay,
+ readonly: isPrimaryDisplay || column.readonly,
},
}
})
@@ -158,8 +173,8 @@
align="right-outside"
>
{/if}
diff --git a/packages/frontend-core/src/constants.js b/packages/frontend-core/src/constants.js
index 22e5e8583a..a8397a9a6f 100644
--- a/packages/frontend-core/src/constants.js
+++ b/packages/frontend-core/src/constants.js
@@ -161,3 +161,9 @@ export const TypeIconMap = {
export const OptionColours = [...new Array(12).keys()].map(idx => {
return `hsla(${((idx + 1) * 222) % 360}, 90%, 75%, 0.3)`
})
+
+export const FieldPermissions = {
+ WRITABLE: "writable",
+ READONLY: "readonly",
+ HIDDEN: "hidden",
+}