Skip to content

Show attribute/index errors if available #915

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
TorstenDittmann merged 3 commits into from
Mar 6, 2024
Merged

Show attribute/index errors if available #915

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d091b82
feat(databases): create modal to show error details
stnguyen90 Mar 2, 2024
f10b700
feat(databases): show attribute/index failed error in modal
stnguyen90 Mar 2, 2024
c24e7b1
feat(databases): prevent deleting processing attributes
stnguyen90 Mar 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
49 changes: 33 additions & 16 deletions ...t-[project]/databases/database-[database]/collection-[collection]/attributes/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
import { Container } from '$lib/layout';
import Create from '../createAttribute.svelte';
import { isRelationship } from '../document-[document]/attributes/store';
import FailedModal from '../failedModal.svelte';
import CreateIndex from '../indexes/createIndex.svelte';
import { attributes, type Attributes } from '../store';
import CreateAttributeDropdown from './createAttributeDropdown.svelte';
Expand All @@ -35,6 +36,8 @@
let showDelete = false;
let showEdit = false;
let showCreateIndex = false;
let showFailed = false;
let error = '';

enum attributeFormatIcon {
ip = 'location-marker',
Expand Down Expand Up @@ -89,13 +92,24 @@
<span class="text u-trim-1" data-private>{attribute.key}</span>
</div>
{#if attribute.status !== 'available'}
<Pill
warning={attribute.status === 'processing'}
danger={['deleting', 'stuck', 'failed'].includes(
attribute.status
)}>
{attribute.status}
</Pill>
<div class="u-inline-flex u-gap-12 u-cross-center">
<Pill
warning={attribute.status === 'processing'}
danger={['deleting', 'stuck', 'failed'].includes(
attribute.status
)}>
{attribute.status}
</Pill>
{#if attribute.error}
<Button
link
on:click={(e) => {
e.preventDefault();
error = attribute.error;
showFailed = true;
}}>Details</Button>
{/if}
</div>
{:else if attribute.required}
<Pill>Required</Pill>
{/if}
Expand Down Expand Up @@ -158,15 +172,17 @@
Create Index
</DropListItem>
{/if}
<DropListItem
icon="trash"
on:click={() => {
selectedAttribute = attribute;
showDelete = true;
showDropdown[index] = false;
}}>
Delete
</DropListItem>
{#if attribute.status !== 'processing'}
<DropListItem
icon="trash"
on:click={() => {
selectedAttribute = attribute;
showDelete = true;
showDropdown[index] = false;
}}>
Delete
</DropListItem>
{/if}
</svelte:fragment>
</DropList>
</TableCell>
Expand Down Expand Up @@ -214,3 +230,4 @@
<Delete bind:showDelete {selectedAttribute} />
<Edit bind:showEdit {selectedAttribute} />
<CreateIndex bind:showCreateIndex externalAttribute={selectedAttribute} />
<FailedModal bind:show={showFailed} title="Create attribute" header="Creation failed" {error} />
25 changes: 25 additions & 0 deletions ...roject-[project]/databases/database-[database]/collection-[collection]/failedModal.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
<script lang="ts">
import Modal from '$lib/components/modal.svelte';
import Button from '$lib/elements/forms/button.svelte';

export let show: boolean;
export let error: string;
export let title: string;
export let header: string;
</script>

<Modal {title} headerDivider={false} bind:show size="big">
<div class="box u-flex-vertical u-gap-24">
<p class="u-inline-flex u-cross-center u-gap-8">
<span
class="icon-exclamation-circle u-font-size-20"
aria-hidden="true"
style="color:hsl(var(--color-danger-100));" />{header}
</p>
<p>{error}</p>
</div>

<svelte:fragment slot="footer">
<Button secondary on:click={() => (show = false)}>Close</Button>
</svelte:fragment>
</Modal>
30 changes: 23 additions & 7 deletions ...ject-[project]/databases/database-[database]/collection-[collection]/indexes/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
import { Button } from '$lib/elements/forms';
import CreateAttributeDropdown from '../attributes/createAttributeDropdown.svelte';
import type { Option } from '../attributes/store';
import FailedModal from '../failedModal.svelte';

let showDropdown = [];
let selectedIndex: Models.Index = null;
Expand All @@ -29,6 +30,8 @@
let showCreateAttribute = false;
let showCreateDropdown = false;
let selectedAttribute: Option['name'] = null;
let showFailed = false;
let error = '';
</script>

<Container>
Expand Down Expand Up @@ -60,13 +63,24 @@
<div class="u-flex u-main-space-between">
<span class="text u-trim"> {index.key}</span>
{#if index.status !== 'available'}
<Pill
warning={index.status === 'processing'}
danger={['deleting', 'stuck', 'failed'].includes(
index.status
)}>
{index.status}
</Pill>
<div class="u-inline-flex u-gap-12 u-cross-center">
<Pill
warning={index.status === 'processing'}
danger={['deleting', 'stuck', 'failed'].includes(
index.status
)}>
{index.status}
</Pill>
{#if index.error}
<Button
link
on:click={(e) => {
e.preventDefault();
error = index.error;
showFailed = true;
}}>Details</Button>
{/if}
</div>
{/if}
</div>
</TableCell>
Expand Down Expand Up @@ -162,3 +176,5 @@
{/if}

<CreateAttribute bind:showCreate={showCreateAttribute} bind:selectedOption={selectedAttribute} />

<FailedModal bind:show={showFailed} title="Create index" header="Creation failed" {error} />