diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js index 0a5b9f0461..93ed27c9af 100644 --- a/packages/builder/src/builderStore/store/backend.js +++ b/packages/builder/src/builderStore/store/backend.js @@ -259,6 +259,7 @@ export const getBackendUiStore = () => { } state.draftTable.schema[field.name] = cloneDeep(field) + console.log(state.draftTable) store.actions.tables.save(state.draftTable) return state }) diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte index ae19489575..812647d1cc 100644 --- a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte +++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte @@ -11,12 +11,13 @@ import { cloneDeep } from "lodash/fp" import { backendUiStore } from "builderStore" import { TableNames, UNEDITABLE_USER_FIELDS } from "constants" - import { FIELDS, AUTO_COLUMN_SUB_TYPES } from "constants/backend" + import { FIELDS, AUTO_COLUMN_SUB_TYPES, RelationshipTypes } from "constants/backend" import { getAutoColumnInformation, buildAutoColumn } from "builderStore/utils" import { notifier } from "builderStore/store/notifications" import ValuesList from "components/common/ValuesList.svelte" import DatePicker from "components/common/DatePicker.svelte" import ConfirmDialog from "components/common/ConfirmDialog.svelte" + import { truncate } from "lodash" const AUTO_COL = "auto" const LINK_TYPE = FIELDS.LINK.type @@ -36,16 +37,7 @@ $backendUiStore.selectedTable.primaryDisplay == null || $backendUiStore.selectedTable.primaryDisplay === field.name - let relationshipTypes = [ - { text: "Many to many (N:N)", value: "many-to-many" }, - { text: "One to many (1:N)", value: "one-to-many" }, - ] - let types = ["Many to many (N:N)", "One to many (1:N)"] - - let selectedRelationshipType = - relationshipTypes.find(type => type.value === field.relationshipType) - ?.text || "Many to many (N:N)" - + let table = $backendUiStore.selectedTable let indexes = [...($backendUiStore.selectedTable.indexes || [])] let confirmDeleteDialog let deletion @@ -57,7 +49,7 @@ $: uneditable = $backendUiStore.selectedTable?._id === TableNames.USERS && UNEDITABLE_USER_FIELDS.includes(field.name) - $: invalid = field.type === FIELDS.LINK.type && !field.tableId + $: invalid = field.type === LINK_TYPE && !field.tableId // used to select what different options can be displayed for column type $: canBeSearched = @@ -67,15 +59,9 @@ $: canBeDisplay = field.type !== LINK_TYPE && field.type !== AUTO_COL $: canBeRequired = field.type !== LINK_TYPE && !uneditable && field.type !== AUTO_COL + $: relationshipOptions = getRelationshipOptions(field) async function saveColumn() { - // Set relationship type if it's - if (field.type === "link") { - field.relationshipType = relationshipTypes.find( - type => type.text === selectedRelationshipType - ).value - } - if (field.type === AUTO_COL) { field = buildAutoColumn( $backendUiStore.draftTable.name, @@ -110,12 +96,18 @@ if (!definition) { return } - field.type = definition.type - field.constraints = definition.constraints // remove any extra fields that may not be related to this type delete field.autocolumn delete field.subtype delete field.tableId + delete field.relationshipType + // add in defaults and initial definition + field.type = definition.type + field.constraints = definition.constraints + // default relationships many to many + if (field.type === LINK_TYPE) { + field.relationshipType = RelationshipTypes.MANY_TO_MANY + } } function onChangeRequired(e) { @@ -153,6 +145,23 @@ confirmDeleteDialog.hide() deletion = false } + + function getRelationshipOptions(field) { + if (!field || !field.tableId) { + return null + } + const linkTable = tableOptions.find(table => table._id === field.tableId) + if (!linkTable) { + return null + } + const thisName = truncate(table.name, { length: 20 }), + linkName = truncate(linkTable.name, { length: 20 }) + return [ + { name: `Many ${thisName} has many ${linkName}`, value: RelationshipTypes.MANY_TO_MANY }, + { name: `One ${thisName} has many ${linkName}`, value: RelationshipTypes.ONE_TO_MANY }, + { name: `Many ${thisName} has one ${linkName}`, value: RelationshipTypes.MANY_TO_ONE }, + ] + }