diff --git a/packages/bbui/src/ButtonGroup/CollapsedButtonGroup.svelte b/packages/bbui/src/ButtonGroup/CollapsedButtonGroup.svelte
new file mode 100644
index 0000000000..f1860ecaea
--- /dev/null
+++ b/packages/bbui/src/ButtonGroup/CollapsedButtonGroup.svelte
@@ -0,0 +1,39 @@
+
+
+
+
+
+
diff --git a/packages/bbui/src/index.js b/packages/bbui/src/index.js
index 7a4ff3f081..083b4ecfd5 100644
--- a/packages/bbui/src/index.js
+++ b/packages/bbui/src/index.js
@@ -39,6 +39,7 @@ export { default as ActionGroup } from "./ActionGroup/ActionGroup.svelte"
export { default as ActionMenu } from "./ActionMenu/ActionMenu.svelte"
export { default as Button } from "./Button/Button.svelte"
export { default as ButtonGroup } from "./ButtonGroup/ButtonGroup.svelte"
+export { default as CollapsedButtonGroup } from "./ButtonGroup/CollapsedButtonGroup.svelte"
export { default as ClearButton } from "./ClearButton/ClearButton.svelte"
export { default as Icon } from "./Icon/Icon.svelte"
export { default as IconAvatar } from "./Icon/IconAvatar.svelte"
diff --git a/packages/builder/src/pages/builder/app/[application]/data/table/[tableId]/index.svelte b/packages/builder/src/pages/builder/app/[application]/data/table/[tableId]/index.svelte
index a157aef463..b89becaa03 100644
--- a/packages/builder/src/pages/builder/app/[application]/data/table/[tableId]/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/data/table/[tableId]/index.svelte
@@ -30,10 +30,6 @@
let rowActions = []
let generateButton
- let rowActionPopover
- let rowActionRow
- let rowActionAnchor
- let refreshRow
$: autoColumnStatus = verifyAutocolumns($tables?.selected)
$: duplicates = Object.values(autoColumnStatus).reduce((acc, status) => {
@@ -58,21 +54,22 @@
$: relationshipsEnabled = relationshipSupport(tableDatasource)
$: currentTheme = $themeStore?.theme
$: darkMode = !currentTheme.includes("light")
- $: buttons = [
- {
- text: "Action",
- type: "cta",
- icon: "ChevronDown",
- onClick: async (e, row, refresh) => {
- rowActionRow = row
- rowActionAnchor = e.currentTarget
- rowActionPopover.show()
- refreshRow = refresh
- },
- },
- ]
+ $: buttons = makeRowActionButtons(rowActions)
$: fetchRowActions(id)
+ const makeRowActionButtons = rowActions => {
+ return rowActions.map(action => ({
+ text: action.name,
+ onClick: async row => {
+ await API.rowActions.trigger({
+ rowActionId: action.id,
+ tableId: id,
+ rowId: row._id,
+ })
+ },
+ }))
+ }
+
const relationshipSupport = datasource => {
const integration = $integrations[datasource?.source]
return !isInternal && integration?.relationships !== false
@@ -110,16 +107,6 @@
const res = await API.rowActions.fetch(tableId)
rowActions = Object.values(res || {})
}
-
- const runRowAction = async action => {
- await API.rowActions.trigger({
- rowActionId: action.id,
- tableId: id,
- rowId: rowActionRow._id,
- })
- await refreshRow()
- rowActionPopover.hide()
- }
{#if $tables?.selected?.name}
@@ -143,7 +130,8 @@
schemaOverrides={isUsersTable ? userSchemaOverrides : null}
showAvatars={false}
isCloud={$admin.cloud}
- buttons={rowActions.length ? buttons : null}
+ {buttons}
+ buttonsCollapsed
on:updatedatasource={handleGridTableUpdate}
>
@@ -192,19 +180,6 @@
Create your first table to start building
{/if}
-
-
-
-