diff --git a/packages/builder/src/components/backend/modals/DeleteDataConfirmationModal.svelte b/packages/builder/src/components/backend/modals/DeleteDataConfirmationModal.svelte index 0649e40c09..4d2a60d2f5 100644 --- a/packages/builder/src/components/backend/modals/DeleteDataConfirmationModal.svelte +++ b/packages/builder/src/components/backend/modals/DeleteDataConfirmationModal.svelte @@ -25,22 +25,7 @@ $: isInternalTable = isInternal && sourceType === SourceType.TABLE - const getViewsMessage = () => { - if (!source || !("views" in source)) { - return "" - } - const views = Object.values(source?.views ?? []) - if (views.length < 1) { - return "" - } - if (views.length === 1) { - return "1 view" - } - - return `${views.length} views` - } - - const getQueriesMessage = () => { + const getDatasourceQueries = () => { if (sourceType !== SourceType.DATASOURCE) { return "" } @@ -48,14 +33,7 @@ const queryList = get(queries).list.filter( query => query.datasourceId === sourceId ) - if (queryList.length < 1) { - return "" - } - if (queryList.length === 1) { - return "1 query" - } - - return `${queryList.length} queries` + return queryList } function getSourceID(): string { @@ -168,21 +146,35 @@ } } - function buildMessage() { - let message = "" - if (isInternalTable) { - message = `All ${sourceType} data will also be deleted` - const viewsMessage = getViewsMessage() - if (viewsMessage) { - message += `, including ${viewsMessage}. ` - } else { - message += ". " + function buildMessage(sourceType: string) { + if (!source) { + return "" + } + let message = `Removing ${source?.name} ` + let initialLength = message.length + if (sourceType === SourceType.TABLE) { + const views = "views" in source ? Object.values(source?.views ?? []) : [] + if (isInternalTable) { + message += `will delete its data${ + views.length ? `, views (${views.length})` : "" + }` + } else if (views.length) { + message += `will delete its views (${views.length})` } } else if (sourceType === SourceType.DATASOURCE) { - const queriesMessage = getQueriesMessage() - message = `This will include deleting ${queriesMessage}. ` + const queryList = getDatasourceQueries() + if (queryList.length) { + message += `will delete its queries (${queryList.length})` + } + } + if (affectedScreens.length) { + message += + initialLength !== message.length + ? ", and break connected screens:" + : "will break connected screens:" + } else { + message += "." } - message += "This action cannot be undone." return message } @@ -192,12 +184,12 @@ okText="Delete" onOk={deleteSource} onCancel={hideDeleteDialog} - title={`Are you sure you want to delete ${source?.name}?`} + title={`Are you sure you want to delete this ${sourceType}?`} >
- {#if affectedScreens.length > 0} + {#if affectedScreens.length > 0 && sourceType}

- Removing this {sourceType} will break the following screens: + {buildMessage(sourceType)} {#each affectedScreens as item, idx} {/if}

- - {@html buildMessage()} + This action cannot be undone.

@@ -228,6 +219,7 @@ .screens { display: flex; flex-direction: row; + padding-bottom: var(--spacing-l); gap: var(--spacing-xs); }