diff --git a/packages/builder/package.json b/packages/builder/package.json index 75faa8671f..5b77a06687 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -57,7 +57,7 @@ ] }, "dependencies": { - "@budibase/bbui": "^1.23.1", + "@budibase/bbui": "^1.24.0", "@budibase/client": "^0.1.17", "@budibase/colorpicker": "^1.0.1", "@nx-js/compiler-util": "^2.0.0", diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js index 7c80f21353..0100d77934 100644 --- a/packages/builder/src/builderStore/store/backend.js +++ b/packages/builder/src/builderStore/store/backend.js @@ -23,13 +23,10 @@ export const getBackendUiStore = () => { database: { select: async db => { const modelsResponse = await api.get(`/api/models`) - const viewsResponse = await api.get(`/api/views`) const models = await modelsResponse.json() - const views = await viewsResponse.json() store.update(state => { state.selectedDatabase = db state.models = models - state.views = views return state }) }, @@ -59,7 +56,7 @@ export const getBackendUiStore = () => { store.update(state => { state.selectedModel = model state.draftModel = cloneDeep(model) - state.selectedView = `all_${model._id}` + state.selectedView = { name: `all_${model._id}` } return state }), save: async model => { @@ -119,12 +116,19 @@ export const getBackendUiStore = () => { state.selectedModel = {} return state }), - save: async view => { - const response = await api.post(`/api/views`, view) - const savedView = await response.json() - await store.actions.models.fetch() + delete: async view => { + await api.delete(`/api/views/${view}`) store.update(state => { - state.selectedView = view.name + store.actions.models.select(state.models[0]) + return state + }) + await store.actions.models.fetch() + }, + save: async view => { + await api.post(`/api/views`, view) + store.update(state => { + state.selectedModel.views[view.name] = view + state.selectedView = view return state }) } diff --git a/packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte b/packages/builder/src/components/database/DataTable/LinkedRecord.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte rename to packages/builder/src/components/database/DataTable/LinkedRecord.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/ModelDataTable.svelte b/packages/builder/src/components/database/DataTable/ModelDataTable.svelte similarity index 91% rename from packages/builder/src/components/database/ModelDataTable/ModelDataTable.svelte rename to packages/builder/src/components/database/DataTable/ModelDataTable.svelte index 3caa7e4678..486eec5633 100644 --- a/packages/builder/src/components/database/ModelDataTable/ModelDataTable.svelte +++ b/packages/builder/src/components/database/DataTable/ModelDataTable.svelte @@ -23,12 +23,11 @@ let modalOpen = false let data = [] let headers = [] - let views = [] let currentPage = 0 let search $: { - if ($backendUiStore.selectedView) { + if ($backendUiStore.selectedView && $backendUiStore.selectedView.name.startsWith("all_")) { api.fetchDataForView($backendUiStore.selectedView).then(records => { data = records || [] }) @@ -49,22 +48,6 @@ ) $: schema = $backendUiStore.selectedModel.schema - - const createNewRecord = () => { - open( - CreateEditRecordModal, - { - onClosed: close, - }, - { styleContent: { padding: "0" } } - ) - } - - onMount(() => { - if (views.length) { - backendUiStore.actions.views.select(views[0]) - } - })
@@ -105,7 +88,7 @@ {#if schema[header].type === 'link'} - {:else}{getOr("", header, row)}{/if} + {:else}{getOr('', header, row)}{/if} {/each} diff --git a/packages/builder/src/components/database/DataTable/Table.svelte b/packages/builder/src/components/database/DataTable/Table.svelte new file mode 100644 index 0000000000..5d519cd7c8 --- /dev/null +++ b/packages/builder/src/components/database/DataTable/Table.svelte @@ -0,0 +1,150 @@ + + +
+
+

{title}

+
+ +
+
+ + + + {#each columns as header} + + {/each} + + + + {#if paginatedData.length === 0} +
No Data.
+ {/if} + {#each paginatedData as row} + + {#each columns as header} + + {/each} + + {/each} + +
{header.name}
{getOr('', header.key, row)}
+ +
+ + diff --git a/packages/builder/src/components/database/ModelDataTable/TablePagination.svelte b/packages/builder/src/components/database/DataTable/TablePagination.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/TablePagination.svelte rename to packages/builder/src/components/database/DataTable/TablePagination.svelte diff --git a/packages/builder/src/components/database/DataTable/ViewDataTable.svelte b/packages/builder/src/components/database/DataTable/ViewDataTable.svelte new file mode 100644 index 0000000000..804bec6810 --- /dev/null +++ b/packages/builder/src/components/database/DataTable/ViewDataTable.svelte @@ -0,0 +1,63 @@ + + + + +
diff --git a/packages/builder/src/components/database/ModelDataTable/api.js b/packages/builder/src/components/database/DataTable/api.js similarity index 67% rename from packages/builder/src/components/database/ModelDataTable/api.js rename to packages/builder/src/components/database/DataTable/api.js index 3434cdb4f1..f4c9a44380 100644 --- a/packages/builder/src/components/database/ModelDataTable/api.js +++ b/packages/builder/src/components/database/DataTable/api.js @@ -6,20 +6,6 @@ export async function createUser(user) { return await response.json() } -export async function createDatabase(appname, instanceName) { - const CREATE_DATABASE_URL = `/api/${appname}/instances` - const response = await api.post(CREATE_DATABASE_URL, { - name: instanceName, - }) - return await response.json() -} - -export async function deleteRecord(record) { - const DELETE_RECORDS_URL = `/api/${record.modelId}/records/${record._id}/${record._rev}` - const response = await api.delete(DELETE_RECORDS_URL) - return response -} - export async function saveRecord(record, modelId) { const SAVE_RECORDS_URL = `/api/${modelId}/records` const response = await api.post(SAVE_RECORDS_URL, record) @@ -27,8 +13,14 @@ export async function saveRecord(record, modelId) { return await response.json() } -export async function fetchDataForView(viewName) { - const FETCH_RECORDS_URL = `/api/views/${viewName}` +export async function deleteRecord(record) { + const DELETE_RECORDS_URL = `/api/${record.modelId}/records/${record._id}/${record._rev}` + const response = await api.delete(DELETE_RECORDS_URL) + return response +} + +export async function fetchDataForView(view) { + const FETCH_RECORDS_URL = `/api/views/${view.name}` const response = await api.get(FETCH_RECORDS_URL) return await response.json() diff --git a/packages/builder/src/components/database/ModelDataTable/index.js b/packages/builder/src/components/database/DataTable/index.js similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/index.js rename to packages/builder/src/components/database/DataTable/index.js diff --git a/packages/builder/src/components/database/ModelDataTable/modals/CreateEditColumn.svelte b/packages/builder/src/components/database/DataTable/modals/CreateEditColumn.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/CreateEditColumn.svelte rename to packages/builder/src/components/database/DataTable/modals/CreateEditColumn.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/modals/CreateEditRecord.svelte b/packages/builder/src/components/database/DataTable/modals/CreateEditRecord.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/CreateEditRecord.svelte rename to packages/builder/src/components/database/DataTable/modals/CreateEditRecord.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/modals/CreateUser.svelte b/packages/builder/src/components/database/DataTable/modals/CreateUser.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/CreateUser.svelte rename to packages/builder/src/components/database/DataTable/modals/CreateUser.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/modals/DeleteRecord.svelte b/packages/builder/src/components/database/DataTable/modals/DeleteRecord.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/DeleteRecord.svelte rename to packages/builder/src/components/database/DataTable/modals/DeleteRecord.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/modals/DeleteTable.svelte b/packages/builder/src/components/database/DataTable/modals/DeleteTable.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/DeleteTable.svelte rename to packages/builder/src/components/database/DataTable/modals/DeleteTable.svelte diff --git a/packages/builder/src/components/database/DataTable/modals/DeleteView.svelte b/packages/builder/src/components/database/DataTable/modals/DeleteView.svelte new file mode 100644 index 0000000000..f845b18425 --- /dev/null +++ b/packages/builder/src/components/database/DataTable/modals/DeleteView.svelte @@ -0,0 +1,60 @@ + + +
+
+ + +

Delete View

+
+

+ Are you sure you want to delete this view? All of your data will be + permanently removed. This action cannot be undone. +

+
+ +
+ + diff --git a/packages/builder/src/components/database/ModelDataTable/modals/RecordFieldControl.svelte b/packages/builder/src/components/database/DataTable/modals/RecordFieldControl.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/modals/RecordFieldControl.svelte rename to packages/builder/src/components/database/DataTable/modals/RecordFieldControl.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/modals/index.js b/packages/builder/src/components/database/DataTable/modals/index.js similarity index 74% rename from packages/builder/src/components/database/ModelDataTable/modals/index.js rename to packages/builder/src/components/database/DataTable/modals/index.js index bb49df8746..6bd9691228 100644 --- a/packages/builder/src/components/database/ModelDataTable/modals/index.js +++ b/packages/builder/src/components/database/DataTable/modals/index.js @@ -1,4 +1,3 @@ export { default as DeleteRecordModal } from "./DeleteRecord.svelte" export { default as CreateEditRecordModal } from "./CreateEditRecord.svelte" -export { default as CreateEditViewModal } from "./CreateEditView.svelte" export { default as CreateUserModal } from "./CreateUser.svelte" diff --git a/packages/builder/src/components/database/DataTable/popovers/Calculate.svelte b/packages/builder/src/components/database/DataTable/popovers/Calculate.svelte new file mode 100644 index 0000000000..ab25c8b4ee --- /dev/null +++ b/packages/builder/src/components/database/DataTable/popovers/Calculate.svelte @@ -0,0 +1,88 @@ + + +
+ +
+ +
Calculate
+
+

The

+ +

of

+ +
+
+ + +
+
+ + diff --git a/packages/builder/src/components/database/ModelDataTable/popovers/Column.svelte b/packages/builder/src/components/database/DataTable/popovers/Column.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/popovers/Column.svelte rename to packages/builder/src/components/database/DataTable/popovers/Column.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/popovers/ColumnHeader.svelte b/packages/builder/src/components/database/DataTable/popovers/ColumnHeader.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/popovers/ColumnHeader.svelte rename to packages/builder/src/components/database/DataTable/popovers/ColumnHeader.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/popovers/EditRow.svelte b/packages/builder/src/components/database/DataTable/popovers/EditRow.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/popovers/EditRow.svelte rename to packages/builder/src/components/database/DataTable/popovers/EditRow.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/popovers/Row.svelte b/packages/builder/src/components/database/DataTable/popovers/Row.svelte similarity index 100% rename from packages/builder/src/components/database/ModelDataTable/popovers/Row.svelte rename to packages/builder/src/components/database/DataTable/popovers/Row.svelte diff --git a/packages/builder/src/components/database/ModelDataTable/popovers/View.svelte b/packages/builder/src/components/database/DataTable/popovers/View.svelte similarity index 52% rename from packages/builder/src/components/database/ModelDataTable/popovers/View.svelte rename to packages/builder/src/components/database/DataTable/popovers/View.svelte index fe150b2337..d78d6a923d 100644 --- a/packages/builder/src/components/database/ModelDataTable/popovers/View.svelte +++ b/packages/builder/src/components/database/DataTable/popovers/View.svelte @@ -1,18 +1,29 @@ @@ -26,6 +37,11 @@
Create View
+
@@ -38,4 +54,17 @@ margin-bottom: var(--spacing-l); font-weight: 500; } + + .button-group { + margin-top: var(--spacing-l); + display: flex; + justify-content: flex-end; + gap: var(--spacing-s); + } + + .input-group-column { + display: flex; + flex-direction: column; + gap: var(--spacing-s); + } diff --git a/packages/builder/src/components/database/ModelDataTable/modals/CreateEditView.svelte b/packages/builder/src/components/database/ModelDataTable/modals/CreateEditView.svelte deleted file mode 100644 index c7d3ec8af0..0000000000 --- a/packages/builder/src/components/database/ModelDataTable/modals/CreateEditView.svelte +++ /dev/null @@ -1,127 +0,0 @@ - - -
- -

Create / Edit View

-
-
- {#if $store.errors && $store.errors.length > 0} - - {/if} -
-
-
- -
-
-
- {#each Object.values(SNIPPET_EDITORS) as snippetType} - (currentSnippetEditor = snippetType)}> - {snippetType} - - {/each} - {#if currentSnippetEditor === SNIPPET_EDITORS.MAP} - - {:else if currentSnippetEditor === SNIPPET_EDITORS.FILTER} - - {:else if currentSnippetEditor === SNIPPET_EDITORS.REDUCE} - - {/if} -
-
-
-
- Delete -
- Save -
- - - diff --git a/packages/builder/src/components/nav/HierarchyRow.svelte b/packages/builder/src/components/nav/HierarchyRow.svelte deleted file mode 100644 index 3baacd208e..0000000000 --- a/packages/builder/src/components/nav/HierarchyRow.svelte +++ /dev/null @@ -1,45 +0,0 @@ - - -
-
onSelect(node)} - class="budibase__nav-item hierarchy-item" - class:capitalized={type === 'model'} - class:selected={$backendUiStore.selectedView === `all_${node._id}`}> - - {node.name} -
-
- - diff --git a/packages/builder/src/components/nav/ModelNavigator/EditTable.svelte b/packages/builder/src/components/nav/ModelNavigator/EditTable.svelte index 3bfa5892d1..e4893e3a3f 100644 --- a/packages/builder/src/components/nav/ModelNavigator/EditTable.svelte +++ b/packages/builder/src/components/nav/ModelNavigator/EditTable.svelte @@ -3,7 +3,7 @@ import { backendUiStore } from "builderStore" import { DropdownMenu, Button, Icon, Input, Select } from "@budibase/bbui" import { FIELDS } from "constants/backend" - import DeleteTableModal from "components/database/ModelDataTable/modals/DeleteTable.svelte" + import DeleteTableModal from "components/database/DataTable/modals/DeleteTable.svelte" const { open, close } = getContext("simple-modal") @@ -28,7 +28,7 @@ open( DeleteTableModal, { - onClosed: close, + onClosed: hideEditor, table, }, { styleContent: { padding: "0" } } diff --git a/packages/builder/src/components/nav/ModelNavigator/EditView.svelte b/packages/builder/src/components/nav/ModelNavigator/EditView.svelte index cc6ce2036d..4cd14e454c 100644 --- a/packages/builder/src/components/nav/ModelNavigator/EditView.svelte +++ b/packages/builder/src/components/nav/ModelNavigator/EditView.svelte @@ -3,11 +3,11 @@ import { backendUiStore } from "builderStore" import { DropdownMenu, Button, Icon, Input, Select } from "@budibase/bbui" import { FIELDS } from "constants/backend" - import DeleteTableModal from "components/database/ModelDataTable/modals/DeleteTable.svelte" + import DeleteViewModal from "components/database/DataTable/modals/DeleteView.svelte" const { open, close } = getContext("simple-modal") - export let table + export let view let anchor let dropdown @@ -24,19 +24,19 @@ close() } - const deleteTable = () => { + const deleteView = () => { open( - DeleteTableModal, + DeleteViewModal, { onClosed: close, - table, + view, }, { styleContent: { padding: "0" } } ) } function save() { - backendUiStore.actions.models.save(table) + backendUiStore.actions.views.save(view) hideEditor() } @@ -48,7 +48,7 @@ {#if editing}
Edit View
- +