Appwrite/console
1
0
Fork 0
mirror of https://github.com/appwrite/console.git synced 2026-06-06 19:27:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: improved backup ui

Browse Source
This commit is contained in:
Harsh Mahajan
2025-08-19 13:00:03 +05:30
parent 0059958e01
commit 4e07887cd8
5 changed files with 52 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/+page.svelte
+5 -1
View File
@@ -178,7 +178,7 @@
</script>
<Container size="xxl">
<div class="u-flex u-gap-32 u-flex-vertical-mobile">
<div class="backups-page u-flex u-gap-32 u-flex-vertical-mobile">
{#if !isDisabled}
<div class="u-flex-vertical u-gap-16 policies-holder-card">
<ContainerHeader
@@ -285,4 +285,8 @@
min-width: 330px;
}
}
:global(.backups-page .common-section) {
margin-block-start: 0 !important;
}
</style>
src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/containerHeader.svelte
+1
View File
@@ -41,6 +41,7 @@
<div style:height="40px;" style:padding-block-start="4px">
<DropList bind:show={showDropdown} width="16">
<Badge
style="white-space: nowrap; max-width: none;"
variant="secondary"
content={`${policiesCreated}/${maxPolicies} created`}
on:click={() => (showDropdown = true)}>
src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/policy.svelte
+2 -2
View File
@@ -198,7 +198,7 @@
<!-- Prev / Next section -->
<div class="policy-cycles u-flex u-gap-24 u-padding-block-2">
<div style="width: 128px" class="u-flex-vertical policy-item-caption">
<div style="width: 160px" class="u-flex-vertical policy-item-caption">
<Typography.Caption variant="400" color="--fgcolor-neutral-tertiary"
>Previous
</Typography.Caption>
@@ -225,7 +225,7 @@
<Divider vertical />
</div>
<div style="width: 128px" class="u-flex-vertical policy-item-caption">
<div style="width: 140px" class="u-flex-vertical policy-item-caption">
<Typography.Caption variant="400" color="--fgcolor-neutral-tertiary"
>Next
</Typography.Caption>
src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/store.ts
+3 -3
View File
@@ -30,8 +30,8 @@ export const presetPolicies = writable<UserBackupPolicy[]>([
export const columns = writable<Column[]>([
{ id: 'backups', title: 'Backups', type: 'string', width: { min: 180 } },
{ id: 'size', title: 'Size', type: 'integer', width: { min: 163 } },
{ id: 'size', title: 'Size', type: 'integer', width: { min: 100 } },
{ id: 'status', title: 'Status', type: 'enum', width: { min: 163 } },
{ id: 'policy', title: 'Policy', type: 'string', width: { min: 163 } },
{ id: 'actions', title: '', type: 'string', width: 48 }
{ id: 'policy', title: 'Policy', type: 'string', width: { min: 100 } },
{ id: 'actions', title: '', type: 'string', width: 64 }
]);
src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/table.svelte
+41 -39
View File
@@ -205,7 +205,7 @@
<!--{/if}-->
</Table.Cell>
<Table.Cell column="policy" {root}>
<div class="u-flex u-main-space-between u-cross-baseline">
<div class="u-flex u-cross-baseline">
<Tooltip maxWidth="fit-content">
<span>
{policy?.name || 'Manual'}
@@ -217,51 +217,53 @@
</Tooltip>
</div>
</Table.Cell>
<Table.Cell column="action" {root}>
<Popover let:toggle padding="m" placement="bottom-end">
<Button extraCompact on:click={toggle}>
<Icon icon={IconDotsHorizontal} />
</Button>
<svelte:fragment slot="tooltip" let:toggle>
<ActionMenu.Root width="180px" noPadding>
{#if backup.status === 'completed'}
<Table.Cell column="actions" {root}>
<div class="action-cell u-flex u-main-end u-width-full-line">
<Popover let:toggle padding="m" placement="bottom-end">
<Button extraCompact on:click={toggle}>
<Icon icon={IconDotsHorizontal} />
</Button>
<svelte:fragment slot="tooltip" let:toggle>
<ActionMenu.Root width="180px" noPadding>
{#if backup.status === 'completed'}
<ActionMenu.Item.Button
trailingIcon={IconRefresh}
on:click={(e) => {
toggle(e);
showRestore = true;
selectedBackup = backup;
showDropdown[index] = false;
trackEvent(Click.BackupRestoreClick);
}}>
Restore
</ActionMenu.Item.Button>
{/if}
<ActionMenu.Item.Button
trailingIcon={IconRefresh}
trailingIcon={IconDuplicate}
on:click={(e) => {
toggle(e);
showRestore = true;
copy(backup.$id);
showDropdown[index] = false;
trackEvent(Click.BackupCopyIdClick);
}}>
Copy ID
</ActionMenu.Item.Button>
<ActionMenu.Item.Button
status="danger"
trailingIcon={IconTrash}
on:click={(e) => {
toggle(e);
showDelete = true;
selectedBackup = backup;
showDropdown[index] = false;
trackEvent(Click.BackupRestoreClick);
trackEvent(Click.BackupDeleteClick);
}}>
Restore
Delete
</ActionMenu.Item.Button>
{/if}
<ActionMenu.Item.Button
trailingIcon={IconDuplicate}
on:click={(e) => {
toggle(e);
copy(backup.$id);
showDropdown[index] = false;
trackEvent(Click.BackupCopyIdClick);
}}>
Copy ID
</ActionMenu.Item.Button>
<ActionMenu.Item.Button
status="danger"
trailingIcon={IconTrash}
on:click={(e) => {
toggle(e);
showDelete = true;
selectedBackup = backup;
showDropdown[index] = false;
trackEvent(Click.BackupDeleteClick);
}}>
Delete
</ActionMenu.Item.Button>
</ActionMenu.Root>
</svelte:fragment>
</Popover>
</ActionMenu.Root>
</svelte:fragment>
</Popover>
</div>
</Table.Cell>
</Table.Row.Base>
{/each}