refactor: align files tab with content tab design (#5621)

* fix: files.vue bugs before styling changes

* feat: move files tab to shared layout structure

* fix: qa

* fix: qa

* fix: bugs

* fix: lint

* fix: admonition cleanup with progress + actions

* fix: cleanup

* fix: modals

* fix: admon title

* fix: i18n standard

* fix: lint + i18n pass

* fix: remove transition

* fix: type errors

* feat: files tab in app

* fix: qa

* fix: backup item minmax

* fix: use ContentPageHeader for server panel

* fix: lint

* fix: lint

* fix: lint

* feat: page leave safety

* fix: lint

* fix: cargo fmt fix

* fix: blank in prod

* fix: content card table stuff

* Revert "fix: blank in prod"

This reverts commit 74758fe185.

* fix: import

* feat: browse worlds/servers flow

* fix: worlds tab parity with content tab

* fix: perf bug + shader filter pill copy

* feat: singleplayer filter

* fix: ordering

* fix: breadcrumbs

* fix: lint

* fix: qa

* feat: store server proj id when adding to a non-linked instance

* fix: lint

* fix: i18n + qa

* fix: conflict

* qa: already installed modal + placeholders not server-specific

* fix: qa

* fix: add + edit server modals

* fix: qa

* fix: security

* fix: devin flags

* fix: lint

* chore: change file to break build cache

* fix: admon

* fix: import path stuff

* feat: qa

* fix: fmt fmt idiot

---------

Signed-off-by: Calum H. <calum@modrinth.com>
This commit is contained in:
Calum H.
2026-03-26 18:55:15 +00:00
committed by GitHub
parent 706eb800cb
commit 381ea51cce
170 changed files with 8052 additions and 4571 deletions
@@ -1,114 +0,0 @@
import type { Meta, StoryObj } from '@storybook/vue3-vite'
import BackupProgressAdmonition from '../../components/servers/backups/BackupProgressAdmonition.vue'
const meta = {
title: 'Servers/BackupProgressAdmonition',
component: BackupProgressAdmonition,
parameters: {
layout: 'padded',
},
} satisfies Meta<typeof BackupProgressAdmonition>
export default meta
type Story = StoryObj<typeof meta>
const justNow = new Date().toISOString()
const eightMinsAgo = new Date(Date.now() - 8 * 60 * 1000).toISOString()
const fiveHoursAgo = new Date(Date.now() - 5 * 60 * 60 * 1000).toISOString()
export const AllStates: Story = {
render: () => ({
components: { BackupProgressAdmonition },
setup() {
const now = new Date().toISOString()
const mins8 = new Date(Date.now() - 8 * 60 * 1000).toISOString()
const hours5 = new Date(Date.now() - 5 * 60 * 60 * 1000).toISOString()
return { now, mins8, hours5 }
},
template: /*html*/ `
<div style="display: flex; flex-direction: column; gap: 1rem; max-width: 1020px;">
<h3 style="margin: 0; color: var(--color-contrast);">Backup Creation</h3>
<BackupProgressAdmonition type="create" state="ongoing" :progress="0" backup-name="World Backup 1" :created-at="now" />
<BackupProgressAdmonition type="create" state="ongoing" :progress="0.33" backup-name="World Backup 1" :created-at="mins8" />
<BackupProgressAdmonition type="create" state="failed" :progress="0" backup-name="World Backup 1" :created-at="hours5" />
<h3 style="margin: 1rem 0 0; color: var(--color-contrast);">Backup Restoration</h3>
<BackupProgressAdmonition type="restore" state="ongoing" :progress="0" backup-name="World Backup 1" :created-at="now" />
<BackupProgressAdmonition type="restore" state="ongoing" :progress="0.33" backup-name="World Backup 1" :created-at="mins8" />
<BackupProgressAdmonition type="restore" state="done" :progress="1" backup-name="World Backup 1" :created-at="hours5" />
<BackupProgressAdmonition type="restore" state="failed" :progress="0" backup-name="World Backup 1" :created-at="hours5" />
</div>
`,
}),
}
export const BackupQueued: Story = {
args: {
type: 'create',
state: 'ongoing',
progress: 0,
backupName: 'World Backup 1',
createdAt: justNow,
},
}
export const CreatingBackup: Story = {
args: {
type: 'create',
state: 'ongoing',
progress: 0.33,
backupName: 'World Backup 1',
createdAt: eightMinsAgo,
},
}
export const BackupFailed: Story = {
args: {
type: 'create',
state: 'failed',
progress: 0,
backupName: 'World Backup 1',
createdAt: fiveHoursAgo,
},
}
export const RestoreQueued: Story = {
args: {
type: 'restore',
state: 'ongoing',
progress: 0,
backupName: 'World Backup 1',
createdAt: justNow,
},
}
export const RestoringBackup: Story = {
args: {
type: 'restore',
state: 'ongoing',
progress: 0.33,
backupName: 'World Backup 1',
createdAt: eightMinsAgo,
},
}
export const RestoreSuccessful: Story = {
args: {
type: 'restore',
state: 'done',
progress: 1,
backupName: 'World Backup 1',
createdAt: fiveHoursAgo,
},
}
export const RestoreFailed: Story = {
args: {
type: 'restore',
state: 'failed',
progress: 0,
backupName: 'World Backup 1',
createdAt: fiveHoursAgo,
},
}