1
0
Fork 0
mirror of synced 2024-09-09 22:16:26 +12:00

Allow edition display

This commit is contained in:
Adria Navarro 2024-06-03 17:04:35 +02:00
parent 42d60ad95b
commit cb2349fdef

View file

@ -11,7 +11,9 @@
let open = false
let anchor
$: restrictedColumns = $columns.filter(col => !col.visible || col.readonly)
$: allColumns = $stickyColumn ? [$stickyColumn, ...$columns] : $columns
$: restrictedColumns = allColumns.filter(col => !col.visible || col.readonly)
$: anyRestricted = restrictedColumns.length
$: text = anyRestricted ? `Columns (${anyRestricted} restricted)` : "Columns"
@ -34,36 +36,44 @@
HIDDEN: "hidden",
}
const EDIT_OPTION = {
icon: "Edit",
value: PERMISSION_OPTIONS.WRITABLE,
tooltip: "Writable",
}
$: READONLY_OPTION = {
icon: "Visibility",
value: PERMISSION_OPTIONS.READONLY,
tooltip: allowViewReadonlyColumns
? "Read only"
: "Read only (premium feature)",
disabled: !allowViewReadonlyColumns,
}
const HIDDEN_OPTION = {
icon: "VisibilityOff",
value: PERMISSION_OPTIONS.HIDDEN,
tooltip: "Hidden",
}
$: displayColumns = allColumns.map(c => {
const isDisplayColumn = $stickyColumn === c
$: options =
$datasource.type === "viewV2"
? [EDIT_OPTION, READONLY_OPTION, HIDDEN_OPTION]
: [EDIT_OPTION, HIDDEN_OPTION]
const options = [
{
icon: "Edit",
value: PERMISSION_OPTIONS.WRITABLE,
tooltip: "Writable",
},
]
if ($datasource.type === "viewV2") {
options.push({
icon: "Visibility",
value: PERMISSION_OPTIONS.READONLY,
tooltip: allowViewReadonlyColumns
? "Read only"
: "Read only (premium feature)",
disabled: !allowViewReadonlyColumns,
})
}
options.push({
icon: "VisibilityOff",
value: PERMISSION_OPTIONS.HIDDEN,
tooltip: "Hidden",
disabled: isDisplayColumn,
tooltip: isDisplayColumn && "Display column cannot be hidden",
})
return { ...c, options }
})
function columnToPermissionOptions(column) {
if (!column.visible) {
if (!column.schema.visible) {
return PERMISSION_OPTIONS.HIDDEN
}
if (column.readonly) {
if (column.schema.readonly) {
return PERMISSION_OPTIONS.READONLY
}
@ -87,19 +97,7 @@
<Popover bind:open {anchor} align="left">
<div class="content">
<div class="columns">
{#if $stickyColumn}
<div class="column">
<Icon size="S" name={getColumnIcon($stickyColumn)} />
{$stickyColumn.label}
</div>
<ToggleActionButtonGroup
disabled
value={PERMISSION_OPTIONS.WRITABLE}
options={options.map(o => ({ ...o, disabled: true }))}
/>
{/if}
{#each $columns as column}
{#each displayColumns as column}
<div class="column">
<Icon size="S" name={getColumnIcon(column)} />
{column.label}
@ -107,7 +105,7 @@
<ToggleActionButtonGroup
on:click={e => toggleColumn(column, e.detail)}
value={columnToPermissionOptions(column)}
{options}
options={column.options}
/>
{/each}
</div>