MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add Clear Row Selection action (#13002) 

* Add Clear Row Selection action

* update account-portal

* Refactor to use contextActionHandler

* Remove unused code
This commit is contained in:
melohagan 2024-02-14 10:05:14 +00:00 committed by GitHub
parent 573b3a13f8
commit faa8fad0b5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 76 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ClearRowSelection.svelte Normal file
View File

@ -0,0 +1,54 @@
<script>
import { Label, Select, Body } from "@budibase/bbui"
import { findAllMatchingComponents } from "builderStore/componentUtils"
import { currentAsset } from "builderStore"
export let parameters
$: tables = findAllMatchingComponents($currentAsset?.props, component =>
component._component.endsWith("table")
).map(table => ({
label: table._instanceName,
value: table._id,
}))
$: tableBlocks = findAllMatchingComponents($currentAsset?.props, component =>
component._component.endsWith("tableblock")
).map(block => ({
label: block._instanceName,
value: `${block._id}-table`,
}))
$: componentOptions = tables.concat(tableBlocks)
</script>
<div class="root">
<Body size="S">Clear the row selection from the selected table.</Body>
<div class="params">
<Label small>Table</Label>
<Select bind:value={parameters.componentId} options={componentOptions} />
</div>
</div>
<style>
.root {
width: 100%;
max-width: 500px;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
gap: var(--spacing-xl);
}
.root :global(p) {
line-height: 1.5;
}
.params {
display: grid;
column-gap: var(--spacing-xs);
row-gap: var(--spacing-s);
grid-template-columns: 90px 1fr;
align-items: center;
}
</style>

1
packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/index.js
View File

@ -21,3 +21,4 @@ export { default as ShowNotification } from "./ShowNotification.svelte"
export { default as PromptUser } from "./PromptUser.svelte" export { default as PromptUser } from "./PromptUser.svelte"
export { default as OpenSidePanel } from "./OpenSidePanel.svelte" export { default as OpenSidePanel } from "./OpenSidePanel.svelte"
export { default as CloseSidePanel } from "./CloseSidePanel.svelte" export { default as CloseSidePanel } from "./CloseSidePanel.svelte"
export { default as ClearRowSelection } from "./ClearRowSelection.svelte"

5
packages/builder/src/components/design/settings/controls/ButtonActionEditor/manifest.json
View File

@ -156,6 +156,11 @@
"type": "application", "type": "application",
"component": "CloseSidePanel", "component": "CloseSidePanel",
"dependsOnFeature": "sidePanel" "dependsOnFeature": "sidePanel"
},
{
"name": "Clear Row Selection",
"type": "data",
"component": "ClearRowSelection"
} }
] ]
} }

1
packages/client/manifest.json
View File

@ -4639,6 +4639,7 @@
"illegalChildren": ["section"], "illegalChildren": ["section"],
"hasChildren": true, "hasChildren": true,
"showEmptyState": false, "showEmptyState": false,
"actions": ["ClearRowSelection"],
"size": { "size": {
"width": 600, "width": 600,
"height": 400 "height": 400

9
packages/client/src/components/app/table/Table.svelte
View File

@ -156,13 +156,20 @@
} }
} }
const actions = [
{
type: ActionTypes.ClearRowSelection,
callback: () => (selectedRows = []),
},
]
onDestroy(() => { onDestroy(() => {
rowSelectionStore.actions.updateSelection($component.id, []) rowSelectionStore.actions.updateSelection($component.id, [])
}) })
</script> </script>
<div use:styleable={$component.styles} class={size}> <div use:styleable={$component.styles} class={size}>
<Provider data={dataContext}> <Provider {actions} data={dataContext}>
<Table <Table
{data} {data}
{schema} {schema}

1
packages/client/src/constants.js
View File

@ -10,6 +10,7 @@ export const ActionTypes = {
ClearForm: "ClearForm", ClearForm: "ClearForm",
ChangeFormStep: "ChangeFormStep", ChangeFormStep: "ChangeFormStep",
ScrollTo: "ScrollTo", ScrollTo: "ScrollTo",
ClearRowSelection: "ClearRowSelection",
} }
export const DNDPlaceholderID = "dnd-placeholder" export const DNDPlaceholderID = "dnd-placeholder"

10
packages/client/src/utils/buttonActions.js
View File

@ -47,6 +47,8 @@ export const getActionContextKey = action => {
return key(action.parameters.componentId, ActionTypes.ClearForm) return key(action.parameters.componentId, ActionTypes.ClearForm)
case "Change Form Step": case "Change Form Step":
return key(action.parameters.componentId, ActionTypes.ChangeFormStep) return key(action.parameters.componentId, ActionTypes.ChangeFormStep)
case "Clear Row Selection":
return key(action.parameters.componentId, ActionTypes.ClearRowSelection)
default: default:
return null return null
} }
@ -383,14 +385,14 @@ const showNotificationHandler = action => {
const promptUserHandler = () => {} const promptUserHandler = () => {}
const OpenSidePanelHandler = action => { const openSidePanelHandler = action => {
const { id } = action.parameters const { id } = action.parameters
if (id) { if (id) {
sidePanelStore.actions.open(id) sidePanelStore.actions.open(id)
} }
} }
const CloseSidePanelHandler = () => { const closeSidePanelHandler = () => {
sidePanelStore.actions.close() sidePanelStore.actions.close()
} }
@ -410,8 +412,8 @@ const handlerMap = {
["Continue if / Stop if"]: continueIfHandler, ["Continue if / Stop if"]: continueIfHandler,
["Show Notification"]: showNotificationHandler, ["Show Notification"]: showNotificationHandler,
["Prompt User"]: promptUserHandler, ["Prompt User"]: promptUserHandler,
["Open Side Panel"]: OpenSidePanelHandler, ["Open Side Panel"]: openSidePanelHandler,
["Close Side Panel"]: CloseSidePanelHandler, ["Close Side Panel"]: closeSidePanelHandler,
} }
const confirmTextMap = { const confirmTextMap = {