diff --git a/packages/builder/assets/remixicon.woff b/packages/builder/assets/remixicon.woff new file mode 100644 index 0000000000..62a756bd30 Binary files /dev/null and b/packages/builder/assets/remixicon.woff differ diff --git a/packages/builder/assets/remixicon.woff2 b/packages/builder/assets/remixicon.woff2 new file mode 100644 index 0000000000..89a0b99ec6 Binary files /dev/null and b/packages/builder/assets/remixicon.woff2 differ diff --git a/packages/builder/package.json b/packages/builder/package.json index f77060c1da..5be217440e 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -77,6 +77,7 @@ "lodash": "^4.17.13", "mustache": "^4.0.1", "posthog-js": "1.4.5", + "remixicon": "^2.5.0", "shortid": "^2.2.15", "svelte-loading-spinners": "^0.1.1", "svelte-portal": "^0.1.0", diff --git a/packages/builder/rollup.config.js b/packages/builder/rollup.config.js index af51739200..b7c68cbaae 100644 --- a/packages/builder/rollup.config.js +++ b/packages/builder/rollup.config.js @@ -178,6 +178,10 @@ export default { src: "node_modules/@budibase/bbui/dist/bbui.css", dest: outputpath, }, + { + src: "node_modules/remixicon/fonts/*", + dest: outputpath, + }, ], }), diff --git a/packages/builder/src/components/backend/DataTable/DataTable.svelte b/packages/builder/src/components/backend/DataTable/DataTable.svelte index 9a5eaef83a..8d72c12576 100644 --- a/packages/builder/src/components/backend/DataTable/DataTable.svelte +++ b/packages/builder/src/components/backend/DataTable/DataTable.svelte @@ -12,6 +12,7 @@ $: title = $backendUiStore.selectedTable.name $: schema = $backendUiStore.selectedTable.schema + $: tableId = $backendUiStore.selectedTable._id $: tableView = { schema, name: $backendUiStore.selectedView.name, diff --git a/packages/builder/src/components/backend/DataTable/Table.svelte b/packages/builder/src/components/backend/DataTable/Table.svelte index 6a747f1f07..5bb93cbc88 100644 --- a/packages/builder/src/components/backend/DataTable/Table.svelte +++ b/packages/builder/src/components/backend/DataTable/Table.svelte @@ -1,29 +1,39 @@
@@ -90,9 +123,19 @@

{title}

+ {#if selectedRows.length > 0} + + {/if}
- + (selectedRows = detail)} /> + />
diff --git a/packages/builder/src/components/backend/DataTable/TableHeader/TableHeader.svelte b/packages/builder/src/components/backend/DataTable/TableHeader/TableHeader.svelte index fe4c16484e..f8ed2df3d8 100644 --- a/packages/builder/src/components/backend/DataTable/TableHeader/TableHeader.svelte +++ b/packages/builder/src/components/backend/DataTable/TableHeader/TableHeader.svelte @@ -42,9 +42,7 @@
{displayName} - {#if enableSorting && sortDirection} - - {/if} +
+ import { TextButton, Icon, Modal, ModalContent } from "@budibase/bbui" + import CreateEditRowModal from "../modals/CreateEditRowModal.svelte" + + export let selectedRows + export let deleteRows + + let modal + + async function confirmDeletion() { + await deleteRows() + modal.hide() + } + + +
+ + + Delete + {selectedRows.length} + row(s) + +
+ + + Are you sure you want to delete these + {selectedRows.length} + rows? + + diff --git a/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js b/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js index c22cad0c71..17165f9437 100644 --- a/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js +++ b/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js @@ -1,5 +1,6 @@ import AttachmentList from "./AttachmentCell.svelte" -import EditRowPopover from "../modals/EditRow.svelte" +import EditRow from "../modals/EditRow.svelte" +import DeleteRow from "../modals/DeleteRow.svelte" import RelationshipDisplay from "./RelationshipCell.svelte" const renderers = { @@ -15,10 +16,23 @@ export function getRenderer(schema, editable) { } } +export function deleteRowRenderer(params) { + const container = document.createElement("div") + + new DeleteRow({ + target: container, + props: { + row: params.data, + }, + }) + + return container +} + export function editRowRenderer(params) { const container = document.createElement("div") - new EditRowPopover({ + new EditRow({ target: container, props: { row: params.data, diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte index 3682b38ce2..4233a3be37 100644 --- a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte +++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte @@ -24,6 +24,7 @@ $backendUiStore.selectedTable.primaryDisplay == null || $backendUiStore.selectedTable.primaryDisplay === field.name let confirmDeleteDialog + let deletion $: tableOptions = $backendUiStore.tables.filter( table => table._id !== $backendUiStore.draftTable._id @@ -47,8 +48,8 @@ notifier.danger("You cannot delete the display column") } else { backendUiStore.actions.tables.deleteField(field) - notifier.success("Column deleted") - hideDeleteDialog() + notifier.success(`Column ${field.name} deleted.`) + onClosed() } } @@ -76,15 +77,16 @@ function confirmDelete() { confirmDeleteDialog.show() - onClosed() + deletion = true } function hideDeleteDialog() { confirmDeleteDialog.hide() + deletion = false } -
+