+
@@ -280,7 +303,7 @@ const messages = defineMessages({
- Offline
+ {{ formatMessage(messages.offline) }}
@@ -299,7 +322,7 @@ const messages = defineMessages({
})
}}
- Not played yet
+ {{ formatMessage(messages.notPlayedYet) }}
•
diff --git a/apps/app-frontend/src/components/ui/world/modal/AddServerModal.vue b/apps/app-frontend/src/components/ui/world/modal/AddServerModal.vue
index 67783c2ce0..5c585de622 100644
--- a/apps/app-frontend/src/components/ui/world/modal/AddServerModal.vue
+++ b/apps/app-frontend/src/components/ui/world/modal/AddServerModal.vue
@@ -5,12 +5,11 @@ import {
commonMessages,
defineMessages,
injectNotificationManager,
+ NewModal,
useVIntl,
} from '@modrinth/ui'
import { ref } from 'vue'
-import InstanceModalTitlePrefix from '@/components/ui/modal/InstanceModalTitlePrefix.vue'
-import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
import ServerModalBody from '@/components/ui/world/modal/ServerModalBody.vue'
import type { GameInstance } from '@/helpers/types'
import { add_server_to_profile, type ServerPackStatus, type ServerWorld } from '@/helpers/worlds.ts'
@@ -26,10 +25,10 @@ const props = defineProps<{
instance: GameInstance
}>()
-const modal = ref()
+const modal = ref
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
diff --git a/apps/app-frontend/src/components/ui/world/modal/ServerModalBody.vue b/apps/app-frontend/src/components/ui/world/modal/ServerModalBody.vue
index 7d7479b5cf..d1603da948 100644
--- a/apps/app-frontend/src/components/ui/world/modal/ServerModalBody.vue
+++ b/apps/app-frontend/src/components/ui/world/modal/ServerModalBody.vue
@@ -49,34 +49,40 @@ const messages = defineMessages({
id: 'instance.server-modal.placeholder-name',
defaultMessage: 'Minecraft Server',
},
+ placeholderAddress: {
+ id: 'app.world.server-modal.placeholder-address',
+ defaultMessage: 'example.modrinth.gg',
+ },
+ selectAnOption: {
+ id: 'app.world.server-modal.select-an-option',
+ defaultMessage: 'Select an option',
+ },
})
defineExpose({ resourcePackOptions })
-
- {
return await invoke('plugin:worlds|add_server_to_profile', {
path,
name,
address,
packStatus,
+ projectId,
+ contentKind,
})
}
diff --git a/apps/app-frontend/src/locales/en-US/index.json b/apps/app-frontend/src/locales/en-US/index.json
index 418f30d826..d33b0b5bd6 100644
--- a/apps/app-frontend/src/locales/en-US/index.json
+++ b/apps/app-frontend/src/locales/en-US/index.json
@@ -5,6 +5,39 @@
"app.auth-servers.unreachable.header": {
"message": "Cannot reach authentication servers"
},
+ "app.browse.add-server-to-instance": {
+ "message": "Add server to instance"
+ },
+ "app.browse.add-servers-to-instance": {
+ "message": "Add servers to your instance"
+ },
+ "app.browse.add-to-instance": {
+ "message": "Add to instance"
+ },
+ "app.browse.add-to-instance-name": {
+ "message": "Add to {instanceName}"
+ },
+ "app.browse.added": {
+ "message": "Added"
+ },
+ "app.browse.already-added": {
+ "message": "Already added"
+ },
+ "app.browse.discover-content": {
+ "message": "Discover content"
+ },
+ "app.browse.discover-servers": {
+ "message": "Discover servers"
+ },
+ "app.browse.hide-added-servers": {
+ "message": "Hide added servers"
+ },
+ "app.browse.hide-installed-content": {
+ "message": "Hide installed content"
+ },
+ "app.browse.install-content-to-instance": {
+ "message": "Install content to instance"
+ },
"app.export-modal.description-placeholder": {
"message": "Enter modpack description..."
},
@@ -41,33 +74,21 @@
"app.instance.confirm-delete.header": {
"message": "Delete instance"
},
- "app.instance.modpack-already-installed.admonition-body": {
- "message": "This modpack is already installed in the \"{instanceName}\" instance."
- },
- "app.instance.modpack-already-installed.admonition-header": {
- "message": "Duplicate modpack"
+ "app.instance.modpack-already-installed.body": {
+ "message": "This modpack is already installed in the {instanceName} instance. Are you sure you want to duplicate it?"
},
- "app.instance.modpack-already-installed.create-anyway": {
- "message": "Create anyway"
- },
- "app.instance.modpack-already-installed.go-to-instance": {
- "message": "Go to instance"
+ "app.instance.modpack-already-installed.create": {
+ "message": "Create"
},
"app.instance.modpack-already-installed.header": {
"message": "Modpack already installed"
},
+ "app.instance.modpack-already-installed.instance": {
+ "message": "Instance"
+ },
"app.instance.mods.content-type-project": {
"message": "project"
},
- "app.instance.mods.copy-link": {
- "message": "Copy link"
- },
- "app.instance.mods.installing": {
- "message": "Installing..."
- },
- "app.instance.mods.modpack-fallback": {
- "message": "Modpack"
- },
"app.instance.mods.project-was-added": {
"message": "\"{name}\" was added"
},
@@ -80,17 +101,53 @@
"app.instance.mods.share-title": {
"message": "Sharing modpack content"
},
- "app.instance.mods.show-file": {
- "message": "Show file"
- },
"app.instance.mods.successfully-uploaded": {
"message": "Successfully uploaded"
},
- "app.instance.mods.unknown-version": {
- "message": "Unknown"
+ "app.instance.worlds.add-server": {
+ "message": "Add server"
+ },
+ "app.instance.worlds.browse-servers": {
+ "message": "Browse servers"
+ },
+ "app.instance.worlds.delete-world-description": {
+ "message": "'{name}' will be **permanently deleted**, and there will be no way to recover it."
+ },
+ "app.instance.worlds.delete-world-title": {
+ "message": "Are you sure you want to permanently delete this world?"
+ },
+ "app.instance.worlds.filter-modded": {
+ "message": "Modded"
},
- "app.instance.mods.updating": {
- "message": "Updating..."
+ "app.instance.worlds.filter-offline": {
+ "message": "Offline"
+ },
+ "app.instance.worlds.filter-online": {
+ "message": "Online"
+ },
+ "app.instance.worlds.filter-vanilla": {
+ "message": "Vanilla"
+ },
+ "app.instance.worlds.no-worlds-description": {
+ "message": "Add a server or browse to get started"
+ },
+ "app.instance.worlds.no-worlds-heading": {
+ "message": "No servers or worlds added"
+ },
+ "app.instance.worlds.remove-server-description": {
+ "message": "'{name}' will be removed from your list, including in-game, and there will be no way to recover it."
+ },
+ "app.instance.worlds.remove-server-description-with-address": {
+ "message": "'{name}' ({address}) will be removed from your list, including in-game, and there will be no way to recover it."
+ },
+ "app.instance.worlds.remove-server-title": {
+ "message": "Are you sure you want to remove {name}?"
+ },
+ "app.instance.worlds.search-worlds-placeholder": {
+ "message": "Search {count} worlds..."
+ },
+ "app.instance.worlds.this-server": {
+ "message": "this server"
},
"app.modal.install-to-play.content-required": {
"message": "Content required"
@@ -197,6 +254,24 @@
"app.update.reload-to-update": {
"message": "Reload to install update"
},
+ "app.world.server-modal.placeholder-address": {
+ "message": "example.modrinth.gg"
+ },
+ "app.world.server-modal.select-an-option": {
+ "message": "Select an option"
+ },
+ "app.world.world-item.incompatible-version": {
+ "message": "Incompatible version {version}"
+ },
+ "app.world.world-item.not-played-yet": {
+ "message": "Not played yet"
+ },
+ "app.world.world-item.offline": {
+ "message": "Offline"
+ },
+ "app.world.world-item.players-online": {
+ "message": "{count} online"
+ },
"friends.action.add-friend": {
"message": "Add a friend"
},
@@ -296,6 +371,12 @@
"instance.edit-world.title": {
"message": "Edit world"
},
+ "instance.files.adding-files": {
+ "message": "Adding files ({completed}/{total})"
+ },
+ "instance.files.save-as": {
+ "message": "Save as..."
+ },
"instance.server-modal.address": {
"message": "Address"
},
@@ -467,9 +548,6 @@
"instance.worlds.dont_show_on_home": {
"message": "Don't show on Home"
},
- "instance.worlds.filter.available": {
- "message": "Available"
- },
"instance.worlds.game_already_open": {
"message": "Instance is already open"
},
@@ -494,12 +572,6 @@
"instance.worlds.play_instance": {
"message": "Play instance"
},
- "instance.worlds.type.server": {
- "message": "Server"
- },
- "instance.worlds.type.singleplayer": {
- "message": "Singleplayer"
- },
"instance.worlds.view_instance": {
"message": "View instance"
},
diff --git a/apps/app-frontend/src/pages/Browse.vue b/apps/app-frontend/src/pages/Browse.vue
index ce2f8502e5..f7ec4dcef4 100644
--- a/apps/app-frontend/src/pages/Browse.vue
+++ b/apps/app-frontend/src/pages/Browse.vue
@@ -1,6 +1,7 @@
+
+
+
Never played
-
-
-
-
diff --git a/packages/ui/src/components/servers/backups/BackupItem.vue b/packages/ui/src/components/servers/backups/BackupItem.vue
index cecf43e10c..ae4e25e720 100644
--- a/packages/ui/src/components/servers/backups/BackupItem.vue
+++ b/packages/ui/src/components/servers/backups/BackupItem.vue
@@ -154,7 +154,11 @@ const messages = defineMessages({
- {{ formatMessage(messages.name) }} -
-- {{ formatMessage(messages.address) }} -
-- {{ formatMessage(messages.resourcePack) }} -
-
+
diff --git a/apps/app-frontend/src/helpers/worlds.ts b/apps/app-frontend/src/helpers/worlds.ts
index 0ddcaa62fa..fd25b945a2 100644
--- a/apps/app-frontend/src/helpers/worlds.ts
+++ b/apps/app-frontend/src/helpers/worlds.ts
@@ -30,6 +30,8 @@ export type ServerWorld = BaseWorld & {
index: number
address: string
pack_status: ServerPackStatus
+ project_id?: string
+ content_kind?: string
}
export type World = SingleplayerWorld | ServerWorld
@@ -140,12 +142,16 @@ export async function add_server_to_profile(
name: string,
address: string,
packStatus: ServerPackStatus,
+ projectId?: string,
+ contentKind?: string,
): Promise
+
+
+
+
- Linked to
-
- {{ linkedProjectV3.name }}
-
-
@@ -285,6 +265,7 @@
diff --git a/apps/app-frontend/src/pages/instance/index.js b/apps/app-frontend/src/pages/instance/index.js
index be2167e6bc..b96705e883 100644
--- a/apps/app-frontend/src/pages/instance/index.js
+++ b/apps/app-frontend/src/pages/instance/index.js
@@ -1,7 +1,8 @@
+import Files from './Files.vue'
import Index from './Index.vue'
import Logs from './Logs.vue'
import Mods from './Mods.vue'
import Overview from './Overview.vue'
import Worlds from './Worlds.vue'
-export { Index, Logs, Mods, Overview, Worlds }
+export { Files, Index, Logs, Mods, Overview, Worlds }
diff --git a/apps/app-frontend/src/pages/library/Index.vue b/apps/app-frontend/src/pages/library/Index.vue
index 46f039827a..327ab44d90 100644
--- a/apps/app-frontend/src/pages/library/Index.vue
+++ b/apps/app-frontend/src/pages/library/Index.vue
@@ -1,11 +1,10 @@
+
@@ -319,12 +320,14 @@ import { MIN_SUMMARY_CHARS } from '@modrinth/moderation'
import {
Avatar,
Combobox,
+ ConfirmLeaveModal,
ConfirmModal,
injectModrinthClient,
injectNotificationManager,
injectProjectPageContext,
StyledInput,
UnsavedChangesPopup,
+ usePageLeaveSafety,
} from '@modrinth/ui'
import { fileIsValid, formatProjectStatus, formatProjectType } from '@modrinth/utils'
@@ -480,6 +483,12 @@ const modified = computed(() => ({
deletedBanner: deletedBanner.value,
}))
+const hasChanges = computed(() =>
+ Object.keys(modified.value).some((key) => original.value[key] !== modified.value[key]),
+)
+
+const { confirmLeaveModal } = usePageLeaveSafety(hasChanges)
+
function resetChanges() {
name.value = project.value.title
slug.value = project.value.slug
diff --git a/apps/frontend/src/pages/[type]/[id]/settings/license.vue b/apps/frontend/src/pages/[type]/[id]/settings/license.vue
index 4a18ed2201..682b60ecf4 100644
--- a/apps/frontend/src/pages/[type]/[id]/settings/license.vue
+++ b/apps/frontend/src/pages/[type]/[id]/settings/license.vue
@@ -1,5 +1,6 @@
+
License
@@ -154,10 +155,12 @@ diff --git a/packages/ui/src/components/modal/index.ts b/packages/ui/src/components/modal/index.ts index 49b0c51fb5..412be2b2b2 100644 --- a/packages/ui/src/components/modal/index.ts +++ b/packages/ui/src/components/modal/index.ts @@ -1,3 +1,4 @@ +export { default as ConfirmLeaveModal } from './ConfirmLeaveModal.vue' export { default as ConfirmModal } from './ConfirmModal.vue' export { default as InstallToPlayModal } from './InstallToPlayModal.vue' export { default as Modal } from './Modal.vue' diff --git a/packages/ui/src/components/servers/ServerListing.vue b/packages/ui/src/components/servers/ServerListing.vue index 40c460b989..fe8dd4f4be 100644 --- a/packages/ui/src/components/servers/ServerListing.vue +++ b/packages/ui/src/components/servers/ServerListing.vue @@ -49,7 +49,7 @@ :show-game-label="showGameLabel" :show-loader-label="showLoaderLabel" :linked="false" - class="pointer-events-none flex w-full flex-row flex-wrap items-center gap-4 text-secondary *:hidden sm:flex-row sm:*:flex" + class="pointer-events-none flex w-full flex-row flex-wrap items-center gap-2 text-secondary *:hidden sm:flex-row sm:*:flex" />
-import type { Archon } from '@modrinth/api-client'
-import {
- CheckCircleIcon,
- ClockIcon,
- InfoIcon,
- RotateCounterClockwiseIcon,
- TriangleAlertIcon,
- XIcon,
-} from '@modrinth/assets'
-import { computed } from 'vue'
-
-import { useRelativeTime } from '../../../composables'
-import { defineMessages, useVIntl } from '../../../composables/i18n'
-import { commonMessages } from '../../../utils'
-import ButtonStyled from '../../base/ButtonStyled.vue'
-import ProgressBar from '../../base/ProgressBar.vue'
-
-const { formatMessage } = useVIntl()
-const relativeTime = useRelativeTime()
-
-const props = withDefaults(
- defineProps<{
- type: 'create' | 'restore'
- state: Archon.Backups.v1.BackupState
- progress: number
- backupName?: string
- createdAt?: string
- }>(),
- {
- backupName: undefined,
- createdAt: undefined,
- },
-)
-
-const emit = defineEmits<{
- (e: 'cancel' | 'retry' | 'dismiss'): void
-}>()
-
-const isQueued = computed(() => props.state === 'ongoing' && props.progress === 0)
-const isInProgress = computed(() => props.state === 'ongoing' && props.progress > 0)
-const isFailed = computed(() => props.state === 'failed')
-const isSuccess = computed(() => props.state === 'done')
-
-const showCancel = computed(() => isQueued.value || isInProgress.value)
-const showRetry = computed(() => isFailed.value)
-const showDismiss = computed(() => isFailed.value || isSuccess.value)
-const showProgress = computed(() => isInProgress.value)
-
-const colorClasses = computed(() => {
- if (isFailed.value) return 'border-brand-red bg-bg-red'
- if (isSuccess.value) return 'border-brand-green bg-bg-green'
- return 'border-brand-blue bg-bg-blue'
-})
-
-const icon = computed(() => {
- if (isFailed.value) return TriangleAlertIcon
- if (isSuccess.value) return CheckCircleIcon
- return InfoIcon
-})
-
-const iconClass = computed(() => {
- if (isFailed.value) return 'text-brand-red'
- if (isSuccess.value) return 'text-brand-green'
- return 'text-brand-blue'
-})
-
-const buttonColor = computed<'red' | 'green' | 'blue'>(() => {
- if (isFailed.value) return 'red'
- if (isSuccess.value) return 'green'
- return 'blue'
-})
-
-const name = computed(() => props.backupName ?? formatMessage(messages.fallbackName))
-
-const title = computed(() => {
- if (props.type === 'create') {
- if (isQueued.value) return formatMessage(messages.backupQueuedTitle)
- if (isInProgress.value) return formatMessage(messages.creatingBackupTitle)
- if (isFailed.value) return formatMessage(messages.backupFailedTitle)
- }
- if (isQueued.value) return formatMessage(messages.restoreQueuedTitle)
- if (isInProgress.value) return formatMessage(messages.restoringBackupTitle)
- if (isSuccess.value) return formatMessage(messages.restoreSuccessfulTitle)
- if (isFailed.value) return formatMessage(messages.restoreFailedTitle)
- return ''
-})
-
-const description = computed(() => {
- if (props.type === 'create') {
- if (isQueued.value)
- return formatMessage(messages.backupQueuedDescription, { backupName: name.value })
- if (isInProgress.value)
- return formatMessage(messages.creatingBackupDescription, { backupName: name.value })
- if (isFailed.value)
- return formatMessage(messages.backupFailedDescription, { backupName: name.value })
- }
- if (isQueued.value)
- return formatMessage(messages.restoreQueuedDescription, { backupName: name.value })
- if (isInProgress.value)
- return formatMessage(messages.restoringBackupDescription, { backupName: name.value })
- if (isSuccess.value)
- return formatMessage(messages.restoreSuccessfulDescription, { backupName: name.value })
- if (isFailed.value)
- return formatMessage(messages.restoreFailedDescription, { backupName: name.value })
- return ''
-})
-
-const messages = defineMessages({
- fallbackName: {
- id: 'servers.backups.admonition.fallback-name',
- defaultMessage: 'Your backup',
- },
- backupQueuedTitle: {
- id: 'servers.backups.admonition.backup-queued.title',
- defaultMessage: 'Backup queued',
- },
- backupQueuedDescription: {
- id: 'servers.backups.admonition.backup-queued.description',
- defaultMessage: '{backupName} is queued and will start shortly.',
- },
- creatingBackupTitle: {
- id: 'servers.backups.admonition.creating-backup.title',
- defaultMessage: 'Creating backup',
- },
- creatingBackupDescription: {
- id: 'servers.backups.admonition.creating-backup.description',
- defaultMessage:
- 'Saving world data and server configuration for {backupName}. This can take a few minutes.',
- },
- backupFailedTitle: {
- id: 'servers.backups.admonition.backup-failed.title',
- defaultMessage: 'Backup failed',
- },
- backupFailedDescription: {
- id: 'servers.backups.admonition.backup-failed.description',
- defaultMessage:
- 'Something went wrong while creating {backupName}. Please try again or contact support if the issue continues.',
- },
- restoreQueuedTitle: {
- id: 'servers.backups.admonition.restore-queued.title',
- defaultMessage: 'Restoring from backup queued',
- },
- restoreQueuedDescription: {
- id: 'servers.backups.admonition.restore-queued.description',
- defaultMessage: 'Restoring from {backupName} is queued and will start shortly.',
- },
- restoringBackupTitle: {
- id: 'servers.backups.admonition.restoring-backup.title',
- defaultMessage: 'Restoring from backup',
- },
- restoringBackupDescription: {
- id: 'servers.backups.admonition.restoring-backup.description',
- defaultMessage: 'Restoring your server from {backupName}. This may take a couple of minutes.',
- },
- restoreSuccessfulTitle: {
- id: 'servers.backups.admonition.restore-successful.title',
- defaultMessage: 'Restoring from backup successful',
- },
- restoreSuccessfulDescription: {
- id: 'servers.backups.admonition.restore-successful.description',
- defaultMessage: 'Your server has been restored to {backupName} and is ready to start.',
- },
- restoreFailedTitle: {
- id: 'servers.backups.admonition.restore-failed.title',
- defaultMessage: 'Restoring from backup failed',
- },
- restoreFailedDescription: {
- id: 'servers.backups.admonition.restore-failed.description',
- defaultMessage:
- 'Something went wrong while restoring from {backupName}. Please try again or contact support if the issue continues.',
- },
-})
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/components/servers/backups/index.ts b/packages/ui/src/components/servers/backups/index.ts
index abcd1d34a9..abee9897a5 100644
--- a/packages/ui/src/components/servers/backups/index.ts
+++ b/packages/ui/src/components/servers/backups/index.ts
@@ -1,7 +1,6 @@
export { default as BackupCreateModal } from './BackupCreateModal.vue'
export { default as BackupDeleteModal } from './BackupDeleteModal.vue'
export { default as BackupItem } from './BackupItem.vue'
-export { default as BackupProgressAdmonition } from './BackupProgressAdmonition.vue'
export { default as BackupProgressAdmonitions } from './BackupProgressAdmonitions.vue'
export { default as BackupRenameModal } from './BackupRenameModal.vue'
export { default as BackupRestoreModal } from './BackupRestoreModal.vue'
diff --git a/packages/ui/src/components/servers/files/FileNavbar.vue b/packages/ui/src/components/servers/files/FileNavbar.vue
deleted file mode 100644
index e8993204ee..0000000000
--- a/packages/ui/src/components/servers/files/FileNavbar.vue
+++ /dev/null
@@ -1,251 +0,0 @@
-
-
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/editor/FileEditor.vue b/packages/ui/src/components/servers/files/editor/FileEditor.vue
deleted file mode 100644
index 340879d14c..0000000000
--- a/packages/ui/src/components/servers/files/editor/FileEditor.vue
+++ /dev/null
@@ -1,242 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/explorer/FileLabelBar.vue b/packages/ui/src/components/servers/files/explorer/FileLabelBar.vue
deleted file mode 100644
index 3f93afb20c..0000000000
--- a/packages/ui/src/components/servers/files/explorer/FileLabelBar.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/explorer/FileVirtualList.vue b/packages/ui/src/components/servers/files/explorer/FileVirtualList.vue
deleted file mode 100644
index 210cb181cc..0000000000
--- a/packages/ui/src/components/servers/files/explorer/FileVirtualList.vue
+++ /dev/null
@@ -1,86 +0,0 @@
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/FileDeleteItemModal.vue b/packages/ui/src/components/servers/files/modals/FileDeleteItemModal.vue
deleted file mode 100644
index 88a9c32811..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileDeleteItemModal.vue
+++ /dev/null
@@ -1,78 +0,0 @@
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/FileMoveItemModal.vue b/packages/ui/src/components/servers/files/modals/FileMoveItemModal.vue
deleted file mode 100644
index 378532df80..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileMoveItemModal.vue
+++ /dev/null
@@ -1,79 +0,0 @@
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/FileRenameItemModal.vue b/packages/ui/src/components/servers/files/modals/FileRenameItemModal.vue
deleted file mode 100644
index 3dfc3aa39e..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileRenameItemModal.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/FileUploadConflictModal.vue b/packages/ui/src/components/servers/files/modals/FileUploadConflictModal.vue
deleted file mode 100644
index e5d7f123e3..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileUploadConflictModal.vue
+++ /dev/null
@@ -1,56 +0,0 @@
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/FileUploadZipUrlModal.vue b/packages/ui/src/components/servers/files/modals/FileUploadZipUrlModal.vue
deleted file mode 100644
index 4b63f6f27d..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileUploadZipUrlModal.vue
+++ /dev/null
@@ -1,219 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/modals/index.ts b/packages/ui/src/components/servers/files/modals/index.ts
deleted file mode 100644
index 1f2fd5694d..0000000000
--- a/packages/ui/src/components/servers/files/modals/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export { default as FileCreateItemModal } from './FileCreateItemModal.vue'
-export { default as FileDeleteItemModal } from './FileDeleteItemModal.vue'
-export { default as FileMoveItemModal } from './FileMoveItemModal.vue'
-export { default as FileRenameItemModal } from './FileRenameItemModal.vue'
-export { default as FileUploadConflictModal } from './FileUploadConflictModal.vue'
-export { default as FileUploadZipUrlModal } from './FileUploadZipUrlModal.vue'
diff --git a/packages/ui/src/components/servers/files/upload/index.ts b/packages/ui/src/components/servers/files/upload/index.ts
deleted file mode 100644
index d44ae326ac..0000000000
--- a/packages/ui/src/components/servers/files/upload/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default as FileUploadDragAndDrop } from './FileUploadDragAndDrop.vue'
-export { default as FileUploadDropdown } from './FileUploadDropdown.vue'
diff --git a/packages/ui/src/components/servers/index.ts b/packages/ui/src/components/servers/index.ts
index de615e239d..1c434c9e6d 100644
--- a/packages/ui/src/components/servers/index.ts
+++ b/packages/ui/src/components/servers/index.ts
@@ -1,5 +1,4 @@
export * from './backups'
-export * from './files'
export * from './flows'
export * from './icons'
export { default as InstallingBanner } from './InstallingBanner.vue'
diff --git a/packages/ui/src/components/servers/labels/ServerLoaderLabel.vue b/packages/ui/src/components/servers/labels/ServerLoaderLabel.vue
index 8b7de765de..c5136acd8e 100644
--- a/packages/ui/src/components/servers/labels/ServerLoaderLabel.vue
+++ b/packages/ui/src/components/servers/labels/ServerLoaderLabel.vue
@@ -1,6 +1,6 @@
-
-
-
diff --git a/packages/ui/src/components/servers/backups/BackupProgressAdmonitions.vue b/packages/ui/src/components/servers/backups/BackupProgressAdmonitions.vue
index 1e56e0671c..3e72d68ae6 100644
--- a/packages/ui/src/components/servers/backups/BackupProgressAdmonitions.vue
+++ b/packages/ui/src/components/servers/backups/BackupProgressAdmonitions.vue
@@ -1,12 +1,27 @@
@@ -186,18 +320,55 @@ function handleDismiss(key: string) {
tag="div"
class="flex flex-col gap-3"
>
-
-
-
-
-
-
-
- {{ title }}
-
- {{ description }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ {{ getTitle(item) }}
+
+
+ {{ getDescription(item) }}
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
- New file
- New folder
- Upload file
-
- Upload from .zip file
-
-
- Upload from .zip URL
-
-
- Install CurseForge pack
-
-
-
-
-
-
-
-
-
-
-
- Save
- Save as...
-
-
- Save & restart
-
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/editor/FileImageViewer.vue b/packages/ui/src/components/servers/files/editor/FileImageViewer.vue
deleted file mode 100644
index 094cbfdfdd..0000000000
--- a/packages/ui/src/components/servers/files/editor/FileImageViewer.vue
+++ /dev/null
@@ -1,178 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/editor/index.ts b/packages/ui/src/components/servers/files/editor/index.ts
deleted file mode 100644
index 3f5fed318a..0000000000
--- a/packages/ui/src/components/servers/files/editor/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default as FileEditor } from './FileEditor.vue'
-export { default as FileImageViewer } from './FileImageViewer.vue'
diff --git a/packages/ui/src/components/servers/files/explorer/FileItem.vue b/packages/ui/src/components/servers/files/explorer/FileItem.vue
deleted file mode 100644
index 36bd56bdcc..0000000000
--- a/packages/ui/src/components/servers/files/explorer/FileItem.vue
+++ /dev/null
@@ -1,360 +0,0 @@
-
-
-
- ![Viewed image]()
-
-
-
- {{ state.errorMessage || 'Invalid or empty image file.' }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ name }}
-
-
-
-
- {{ formattedSize }}
-
-
- {{ formattedCreationDate }}
-
-
- {{ formattedModifiedDate }}
-
-
-
-
-
-
-
-
-
-
-
diff --git a/packages/ui/src/components/servers/files/explorer/index.ts b/packages/ui/src/components/servers/files/explorer/index.ts
deleted file mode 100644
index a19d7a7774..0000000000
--- a/packages/ui/src/components/servers/files/explorer/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export { default as FileItem } from './FileItem.vue'
-export { default as FileLabelBar } from './FileLabelBar.vue'
-export { default as FileManagerError } from './FileManagerError.vue'
-export { default as FileVirtualList } from './FileVirtualList.vue'
-export { default as TeleportOverflowMenu } from './TeleportOverflowMenu.vue'
diff --git a/packages/ui/src/components/servers/files/index.ts b/packages/ui/src/components/servers/files/index.ts
deleted file mode 100644
index 93f3acbc51..0000000000
--- a/packages/ui/src/components/servers/files/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export * from './editor'
-export * from './explorer'
-export { default as FileNavbar } from './FileNavbar.vue'
-export * from './modals'
-export * from './upload'
diff --git a/packages/ui/src/components/servers/files/modals/FileCreateItemModal.vue b/packages/ui/src/components/servers/files/modals/FileCreateItemModal.vue
deleted file mode 100644
index 5897a84a76..0000000000
--- a/packages/ui/src/components/servers/files/modals/FileCreateItemModal.vue
+++ /dev/null
@@ -1,93 +0,0 @@
-
-
-
- -
-
-
- - - Over 100 files will be overwritten if you proceed with extraction; here is just some of - them: - - - The following {{ files.length }} files already exist on your server, and will be - overwritten if you proceed with extraction: - -
--
-
-
-
{{ file }} -
-
-
-
-
-
-
-
-
-
-
-
+
+
-
+
- Cancelled
+ {{ formatMessage(messages.cancelled) }}
{{ item.progress }}%
@@ -102,12 +112,61 @@
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/providers/file-manager.ts b/packages/ui/src/layouts/shared/files-tab/providers/file-manager.ts
new file mode 100644
index 0000000000..4eb5ba6e35
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/providers/file-manager.ts
@@ -0,0 +1,72 @@
+import type { ComputedRef, Ref } from 'vue'
+
+import { createContext } from '#ui/providers/create-context'
+
+import type {
+ EditingFile,
+ ExtractDryRunResult,
+ FileItem,
+ FileOperation,
+ UploadState,
+} from '../types'
+
+export interface FileManagerContext {
+ items: Ref
+ loading: Ref
+ error: Ref
+
+ currentPath: Ref
+ navigateTo: (path: string) => void
+
+ editingFile: Ref
+ startEditing: (file: EditingFile) => void
+ stopEditing: () => void
+
+ createItem: (name: string, type: 'file' | 'directory') => Promise
+ renameItem: (path: string, newName: string) => Promise
+ moveItem: (source: string, destination: string) => Promise
+ deleteItem: (path: string, recursive: boolean) => Promise
+
+ readFile: (path: string) => Promise
+ readFileAsBlob: (path: string) => Promise
+ writeFile: (path: string, content: string) => Promise
+ downloadFile: (path: string, fileName: string) => Promise
+
+ uploadFiles: (files: File[]) => void
+ cancelUpload?: () => void
+ uploadState?: Ref | ComputedRef
+
+ refresh: () => void
+
+ isBusy?: Ref | ComputedRef
+ busyTooltip?: Ref | ComputedRef
+ busyWarning?: Ref | ComputedRef
+
+ extractFile?: (
+ path: string,
+ override: boolean,
+ dry: boolean,
+ ) => Promise
+ activeOperations?: Ref | ComputedRef
+ dismissOperation?: (id: string, action: 'dismiss' | 'cancel') => void
+
+ prefetchDirectory?: (path: string) => void
+ prefetchFile?: (path: string) => void
+
+ showInstallFromUrl?: boolean
+ basePath?: Ref | ComputedRef
+ openInFolder?: (path: string) => void
+
+ downloadButtonLabel?: string
+ uploadingLabel?: (completed: number, total: number) => string
+
+ canRestart?: boolean
+ restartServer?: () => Promise
+ canShareToMclogs?: boolean
+ shareToMclogs?: (content: string) => Promise
+}
+
+export const [injectFileManager, provideFileManager] = createContext(
+ 'FilePageLayout',
+ 'fileManagerContext',
+)
diff --git a/packages/ui/src/layouts/shared/files-tab/providers/index.ts b/packages/ui/src/layouts/shared/files-tab/providers/index.ts
new file mode 100644
index 0000000000..8772a59621
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/providers/index.ts
@@ -0,0 +1,2 @@
+export type { FileManagerContext } from './file-manager'
+export { injectFileManager, provideFileManager } from './file-manager'
diff --git a/packages/ui/src/layouts/shared/files-tab/types.ts b/packages/ui/src/layouts/shared/files-tab/types.ts
new file mode 100644
index 0000000000..12416aa5e0
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/types.ts
@@ -0,0 +1,69 @@
+export interface FileItem {
+ name: string
+ type: 'file' | 'directory' | 'symlink'
+ path: string
+ modified: number
+ created: number
+ size?: number
+ count?: number
+ target?: string
+}
+
+export interface EditingFile {
+ name: string
+ path: string
+}
+
+export type FileSortField = 'name' | 'size' | 'created' | 'modified'
+
+export type FileViewFilter = 'all' | 'filesOnly' | 'foldersOnly'
+
+export type FileContextMenuOption =
+ | {
+ id: string
+ action?: () => void
+ disabled?: boolean
+ tooltip?: string
+ color?: 'standard' | 'brand' | 'red' | 'orange' | 'green' | 'blue' | 'purple' | 'medal-promo'
+ shown?: boolean
+ }
+ | { divider: true; shown?: boolean }
+
+export interface FileOperation {
+ id?: string
+ op: string
+ src: string
+ state: string
+ progress?: number
+ bytes_processed?: number
+ files_processed?: number
+ current_file?: string
+}
+
+export interface UndoableOperation {
+ type: 'move' | 'rename'
+ itemType: string
+ fileName: string
+}
+
+export interface MoveOperation extends UndoableOperation {
+ type: 'move'
+ sourcePath: string
+ destinationPath: string
+}
+
+export interface RenameOperation extends UndoableOperation {
+ type: 'rename'
+ path: string
+ oldName: string
+ newName: string
+}
+
+export type Operation = MoveOperation | RenameOperation
+
+export interface ExtractDryRunResult {
+ modpack_name: string | null
+ conflicting_files: string[]
+}
+
+export type { UploadState } from '@modrinth/api-client'
diff --git a/packages/ui/src/layouts/shared/installation-settings/layout.vue b/packages/ui/src/layouts/shared/installation-settings/layout.vue
index d519bfc11f..d23d53d726 100644
--- a/packages/ui/src/layouts/shared/installation-settings/layout.vue
+++ b/packages/ui/src/layouts/shared/installation-settings/layout.vue
@@ -21,10 +21,10 @@ import Avatar from '#ui/components/base/Avatar.vue'
import ButtonStyled from '#ui/components/base/ButtonStyled.vue'
import Chips from '#ui/components/base/Chips.vue'
import Combobox from '#ui/components/base/Combobox.vue'
+import ConfirmLeaveModal from '#ui/components/modal/ConfirmLeaveModal.vue'
import { defineMessages, useVIntl } from '#ui/composables/i18n'
import { commonMessages } from '#ui/utils/common-messages'
-import ConfirmLeaveModal from '../content-tab/components/modals/ConfirmLeaveModal.vue'
import ConfirmModpackUpdateModal from '../content-tab/components/modals/ConfirmModpackUpdateModal.vue'
import ConfirmReinstallModal from '../content-tab/components/modals/ConfirmReinstallModal.vue'
import ConfirmRepairModal from '../content-tab/components/modals/ConfirmRepairModal.vue'
diff --git a/packages/ui/src/layouts/wrapped/hosting/manage/content.vue b/packages/ui/src/layouts/wrapped/hosting/manage/content.vue
index af1aff3f86..adc761f9a3 100644
--- a/packages/ui/src/layouts/wrapped/hosting/manage/content.vue
+++ b/packages/ui/src/layouts/wrapped/hosting/manage/content.vue
@@ -5,6 +5,7 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/vue-query'
import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
import { onBeforeRouteLeave, useRoute, useRouter } from 'vue-router'
+import ConfirmLeaveModal from '#ui/components/modal/ConfirmLeaveModal.vue'
import { defineMessages, useVIntl } from '#ui/composables/i18n'
import {
injectModrinthClient,
@@ -13,7 +14,6 @@ import {
} from '#ui/providers'
import { commonMessages } from '#ui/utils/common-messages'
-import ConfirmLeaveModal from '../../../shared/content-tab/components/modals/ConfirmLeaveModal.vue'
import ConfirmModpackUpdateModal from '../../../shared/content-tab/components/modals/ConfirmModpackUpdateModal.vue'
import ConfirmUnlinkModal from '../../../shared/content-tab/components/modals/ConfirmUnlinkModal.vue'
import ContentUpdaterModal from '../../../shared/content-tab/components/modals/ContentUpdaterModal.vue'
@@ -78,9 +78,17 @@ const messages = defineMessages({
id: 'hosting.content.failed-to-bulk-update',
defaultMessage: 'Failed to update content',
},
- copyLink: {
- id: 'hosting.content.copy-link',
- defaultMessage: 'Copy link',
+})
+
+const leaveMessages = defineMessages({
+ uploadInProgress: {
+ id: 'instances.confirm-leave-modal.upload-in-progress',
+ defaultMessage: 'Upload in progress',
+ },
+ leavePageBody: {
+ id: 'instances.confirm-leave-modal.body',
+ defaultMessage:
+ 'Files are still being uploaded. Leaving this page will cancel the upload and your changes may be lost.',
},
})
@@ -167,7 +175,7 @@ const modpack = computed(() => {
: `/user/${mp.owner.id}`,
}
: undefined,
- categories: (project?.display_categories ?? []).map((name) => ({
+ categories: (project?.categories ?? []).map((name) => ({
name,
icon: name,
project_type: 'modpack',
@@ -823,7 +831,7 @@ function getOverflowOptions(item: ContentItem) {
if (item.project?.slug) {
options.push({
- id: formatMessage(messages.copyLink),
+ id: formatMessage(commonMessages.copyLinkButton),
icon: ClipboardCopyIcon,
action: async () => {
await navigator.clipboard.writeText(
@@ -914,6 +922,7 @@ provideContentManager({
:modpack-name="modpack?.project.title"
:modpack-icon-url="modpack?.project.icon_url"
enable-toggle
+ :switch-version="handleSwitchVersion"
@update:enabled="handleModpackContentToggle"
@bulk:enable="handleModpackBulkToggle($event, true)"
@bulk:disable="handleModpackBulkToggle($event, false)"
@@ -960,5 +969,10 @@ provideContentManager({
@confirm="handleModpackUpdateConfirm"
@cancel="handleModpackUpdateCancel"
/>
-
diff --git a/packages/ui/src/layouts/wrapped/hosting/manage/files.vue b/packages/ui/src/layouts/wrapped/hosting/manage/files.vue
index 70ade05d78..eb76a8bba6 100644
--- a/packages/ui/src/layouts/wrapped/hosting/manage/files.vue
+++ b/packages/ui/src/layouts/wrapped/hosting/manage/files.vue
@@ -1,328 +1,41 @@
-
-
-
-
-
-
-
+// Provide the file manager context
+provideFileManager({
+ items,
+ loading: computed(() => isLoading.value),
+ error: computed(() => loadError.value ?? null),
+ currentPath,
+ navigateTo,
+ editingFile,
+ startEditing,
+ stopEditing,
+ createItem: async (name, type) => {
+ const path = `${currentPath.value}/${name}`.replace('//', '/')
+ await createMutation.mutateAsync({ path, type })
+ },
+ renameItem: async (path, newName) => {
+ await renameMutation.mutateAsync({ path, newName })
+ },
+ moveItem: async (source, destination) => {
+ await moveMutation.mutateAsync({ source, destination })
+ },
+ deleteItem: async (path, recursive) => {
+ await deleteMutation.mutateAsync({ path, recursive })
+ },
+ readFile,
+ readFileAsBlob,
+ writeFile,
+ downloadFile,
+ uploadFiles,
+ cancelUpload,
+ uploadState,
+ refresh: refreshList,
+ isBusy: serverBusy,
+ busyTooltip,
+ busyWarning,
+ extractFile,
+ activeOperations: activeOps,
+ dismissOperation,
+ prefetchDirectory,
+ prefetchFile,
+ showInstallFromUrl: true,
+ canRestart: true,
+ restartServer,
+ canShareToMclogs: true,
+})
+
+
+
+ Rewards Program Terms "
},
@@ -1028,6 +1379,12 @@
"label.update-available": {
"defaultMessage": "Update available"
},
+ "label.updating": {
+ "defaultMessage": "Updating..."
+ },
+ "label.upload-failed": {
+ "defaultMessage": "Upload failed"
+ },
"label.username": {
"defaultMessage": "Username"
},
@@ -2818,5 +3175,20 @@
},
"ui.component.unsaved-changes-popup.body": {
"defaultMessage": "You have unsaved changes."
+ },
+ "ui.confirm-leave-modal.body": {
+ "defaultMessage": "You have unsaved changes that will be lost if you leave this page."
+ },
+ "ui.confirm-leave-modal.header": {
+ "defaultMessage": "You have unsaved changes"
+ },
+ "ui.confirm-leave-modal.leave": {
+ "defaultMessage": "Leave page"
+ },
+ "ui.confirm-leave-modal.stay": {
+ "defaultMessage": "Stay on page"
+ },
+ "ui.confirm-leave-modal.title": {
+ "defaultMessage": "Leave page?"
}
}
diff --git a/packages/ui/src/stories/base/Admonition.stories.ts b/packages/ui/src/stories/base/Admonition.stories.ts
index 7ec3c77ff2..f04ea9e81f 100644
--- a/packages/ui/src/stories/base/Admonition.stories.ts
+++ b/packages/ui/src/stories/base/Admonition.stories.ts
@@ -1,6 +1,8 @@
import type { Meta, StoryObj } from '@storybook/vue3-vite'
import Admonition from '../../components/base/Admonition.vue'
+import ButtonStyled from '../../components/base/ButtonStyled.vue'
+import ProgressBar from '../../components/base/ProgressBar.vue'
const meta = {
title: 'Base/Admonition',
@@ -45,3 +47,92 @@ export const Success: Story = {
body: 'Everything went smoothly.',
},
}
+
+export const Dismissible: Story = {
+ args: {
+ type: 'info',
+ header: 'Dismissible Notice',
+ body: 'This admonition can be dismissed by clicking the X button.',
+ dismissible: true,
+ },
+}
+
+export const WithTopRightActions: Story = {
+ render: () => ({
+ components: { Admonition, ButtonStyled },
+ template: /*html*/ `
+
+
+export default meta
+type Story = StoryObj
+
+export const Default: Story = {
+ args: {
+ mode: 'local',
+ activeIndex: 0,
+ links: [
+ { label: 'Overview', href: '' },
+ { label: 'Gallery', href: 'gallery' },
+ { label: 'Changelog', href: 'changelog' },
+ { label: 'Versions', href: 'versions' },
+ ],
+ },
+}
+
+export const LocalMode: StoryObj = {
+ render: () => ({
+ components: { NavTabs },
+ setup() {
+ const activeIndex = ref(0)
+ const links = [
+ { label: 'Overview', href: '' },
+ { label: 'Gallery', href: 'gallery' },
+ { label: 'Changelog', href: 'changelog' },
+ { label: 'Versions', href: 'versions' },
+ ]
+ function onTabClick(index: number) {
+ activeIndex.value = index
+ }
+ return { activeIndex, links, onTabClick }
+ },
+ template: /* html */ `
+
+
+export const Default: Story = {
+ render: () => ({
+ components: { ConfirmLeaveModal, ButtonStyled },
+ setup() {
+ const modalRef = ref | null>(null)
+ const result = ref('')
+ async function openModal() {
+ result.value = ''
+ const confirmed = await modalRef.value?.prompt()
+ result.value = confirmed ? 'User chose to leave' : 'User chose to stay'
+ }
+ return { modalRef, result, openModal }
+ },
+ template: /* html */ `
+ | null>(null)
+ const openModal = () => modalRef.value?.prompt()
+ return { modalRef, openModal }
+ },
+ template: /* html */ `
+ | null>(null)
+ const openModal = () => modalRef.value?.prompt()
+ return { modalRef, openModal }
+ },
+ template: /* html */ `
+
-
-export default meta
-type Story = StoryObj
-
-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*/ `
- = {
+ shaderpack: 'shader',
+}
+
+export function normalizeProjectType(type: string): string {
+ return PROJECT_TYPE_ALIASES[type] ?? type
+}
+
export const commonProjectTypeCategoryMessages = defineMessages({
datapack: {
id: 'project-type.datapack.category',
diff --git a/packages/ui/src/utils/file-extensions.ts b/packages/ui/src/utils/file-extensions.ts
index 7908f52b06..78b88c067a 100644
--- a/packages/ui/src/utils/file-extensions.ts
+++ b/packages/ui/src/utils/file-extensions.ts
@@ -146,6 +146,8 @@ export function getEditorLanguage(ext: string): string {
case 'cfg':
case 'conf':
return 'ini'
+ case 'log':
+ return 'mclog'
default:
return 'text'
}
diff --git a/packages/ui/src/utils/server-search.ts b/packages/ui/src/utils/server-search.ts
index 6658e29b95..6f88f905a2 100644
--- a/packages/ui/src/utils/server-search.ts
+++ b/packages/ui/src/utils/server-search.ts
@@ -112,7 +112,7 @@ export const SERVER_SORT_TYPES: SortType[] = [
const FILTER_FIELD_MAP: Record = {
server_content_type: 'minecraft_java_server.content.kind',
- server_game_version: 'minecraft_java_server.content.supported_game_versions',
+ server_game_version: 'game_versions',
server_status: 'minecraft_java_server.ping.data',
server_region: 'minecraft_server.region',
server_language: 'minecraft_server.languages',
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0c64e72f10..5bd6673c85 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -98,6 +98,9 @@ importers:
'@tauri-apps/plugin-dialog':
specifier: ^2.2.1
version: 2.6.0
+ '@tauri-apps/plugin-fs':
+ specifier: ^2.4.5
+ version: 2.4.5
'@tauri-apps/plugin-http':
specifier: ~2.5.7
version: 2.5.7
@@ -4109,6 +4112,9 @@ packages:
'@tauri-apps/plugin-dialog@2.6.0':
resolution: {integrity: sha512-q4Uq3eY87TdcYzXACiYSPhmpBA76shgmQswGkSVio4C82Sz2W4iehe9TnKYwbq7weHiL88Yw19XZm7v28+Micg==}
+ '@tauri-apps/plugin-fs@2.4.5':
+ resolution: {integrity: sha512-dVxWWGE6VrOxC7/jlhyE+ON/Cc2REJlM35R3PJX3UvFw2XwYhLGQVAIyrehenDdKjotipjYEVc4YjOl3qq90fA==}
+
'@tauri-apps/plugin-http@2.5.7':
resolution: {integrity: sha512-+F2lEH/c9b0zSsOXKq+5hZNcd9F4IIKCK1T17RqMwpCmVnx2aoqY8yIBccCd25HTYUb3j6NPVbRax/m00hKG8A==}
@@ -12987,6 +12993,10 @@ snapshots:
dependencies:
'@tauri-apps/api': 2.10.1
+ '@tauri-apps/plugin-fs@2.4.5':
+ dependencies:
+ '@tauri-apps/api': 2.10.1
+
'@tauri-apps/plugin-http@2.5.7':
dependencies:
'@tauri-apps/api': 2.10.1
diff --git a/standards/frontend/INTERNATIONALIZATION.md b/standards/frontend/INTERNATIONALIZATION.md
index a33ee79aa6..b87471ef71 100644
--- a/standards/frontend/INTERNATIONALIZATION.md
+++ b/standards/frontend/INTERNATIONALIZATION.md
@@ -3,6 +3,7 @@
- [Message Definitions](#message-definitions)
- [Rendering Messages](#rendering-messages)
- [ICU Message Format](#icu-message-format)
+ - [Writing Translation-Friendly Strings](#writing-translation-friendly-strings)
- [Rich-Text Messages](#rich-text-messages)
- [Vue/ICU Delimiter Collisions](#vueicu-delimiter-collisions)
- [Imports](#imports)
@@ -52,6 +53,36 @@ Dynamic values use ICU placeholders in `defaultMessage`:
- **Numbers/dates/times:** `'{price, number, ::currency/USD}'`
- **Plurals/selects:** `'{count, plural, one {# message} other {# messages}}'`
+## Writing Translation-Friendly Strings
+
+ICU gives you powerful tools (plurals, selects, nested expressions), but translators in other languages face constraints that English doesn't have:
+
+- **Word order varies by language.** Don't assume `{action} {noun}` works everywhere — some languages need `{noun} {action}` or require prepositions between them.
+- **Plurals aren't just "add an s".** Many languages change internal parts of a word or phrase for pluralization, not just the ending. A simple `{count} {itemType}` breaks if `itemType` is always singular.
+- **Grammatical gender affects surrounding words.** Articles, adjectives, and verbs may change based on whether a noun is masculine or feminine. If a variable like `{contentType}` can be "shader" or "mod", translators may need to inflect surrounding text differently for each.
+
+### Guidelines
+
+1. **Use `select` for content types, not bare variables.** When a variable represents different content types (mod, shader, modpack, etc.), pass a key and use ICU `select` so translators can write type-specific forms:
+
+```
+// Bad — translators can't inflect around a pre-rendered noun
+'Delete {count} {itemType}'
+
+// Good — translators can write entirely different phrases per type
+'Delete {count} {contentType, select, mod {{count, plural, one {mod} other {mods}}} shader {{count, plural, one {shader} other {shaders}}} other {items}}'
+```
+
+This lets translators write entirely different noun forms per branch, which many languages require.
+
+2. **Prefer separate messages over complex ICU when branches diverge significantly.** If the singular and plural versions of a string are structurally different (not just a noun change), use two separate message IDs rather than one complex ICU expression.
+
+3. **Don't concatenate translated strings.** Never build a sentence by joining multiple `formatMessage` calls — the word order may be wrong in other languages. Put the entire sentence in one message.
+
+4. **Keep variables semantic.** Pass `contentType: 'mod'` (a key), not `contentType: 'Mod'` (a pre-rendered display string). Translators can then map each key to the correct form in their language.
+
+5. **Test with long strings.** German and Finnish words can be 2-3x longer than English equivalents. Ensure UI layouts don't break with longer text.
+
## Rich-Text Messages
When a message contains links or markup, wrap the relevant ranges with named tags in `defaultMessage`:
-
+
@@ -52,18 +60,20 @@
-
+
| ComputedRef) {
+ const confirmLeaveModal = ref>()
+
+ function handleBeforeUnload(e: BeforeUnloadEvent) {
+ if (dirty.value) {
+ e.preventDefault()
+ }
+ }
+
+ if (typeof window !== 'undefined') {
+ watch(dirty, (isDirty) => {
+ if (isDirty) {
+ window.addEventListener('beforeunload', handleBeforeUnload)
+ } else {
+ window.removeEventListener('beforeunload', handleBeforeUnload)
+ }
+ })
+
+ onBeforeUnmount(() => {
+ window.removeEventListener('beforeunload', handleBeforeUnload)
+ })
+
+ onBeforeRouteLeave(async () => {
+ if (dirty.value) {
+ return (await confirmLeaveModal.value?.prompt()) ?? false
+ }
+ return true
+ })
+ }
+
+ return { confirmLeaveModal }
+}
diff --git a/packages/ui/src/composables/virtual-scroll.ts b/packages/ui/src/composables/virtual-scroll.ts
index e039ad9a30..d09ffc7f06 100644
--- a/packages/ui/src/composables/virtual-scroll.ts
+++ b/packages/ui/src/composables/virtual-scroll.ts
@@ -1,5 +1,5 @@
import type { Ref } from 'vue'
-import { computed, ref, watchEffect } from 'vue'
+import { computed, ref, watch, watchEffect } from 'vue'
export interface VirtualScrollOptions {
itemHeight: number
@@ -16,6 +16,7 @@ export function useVirtualScroll(items: Ref, options: VirtualScrollOptio
const scrollContainer = ref(null)
const scrollTop = ref(0)
const viewportHeight = ref(0)
+ const containerOffset = ref(0)
const totalHeight = computed(() => items.value.length * itemHeight)
@@ -41,13 +42,25 @@ export function useVirtualScroll(items: Ref, options: VirtualScrollOptio
return container instanceof Window ? window.innerHeight : container.clientHeight
}
- function getContainerOffset(listEl: HTMLElement, container: HTMLElement | Window): number {
+ function updateContainerOffset() {
+ const listEl = listContainer.value
+ const container = scrollContainer.value
+ if (!listEl || !container) return
+
if (container instanceof Window) {
- return listEl.getBoundingClientRect().top + window.scrollY
+ containerOffset.value = listEl.getBoundingClientRect().top + window.scrollY
+ } else {
+ const listRect = listEl.getBoundingClientRect()
+ const containerRect = container.getBoundingClientRect()
+ containerOffset.value = listRect.top - containerRect.top + container.scrollTop
}
- const listRect = listEl.getBoundingClientRect()
- const containerRect = container.getBoundingClientRect()
- return listRect.top - containerRect.top + container.scrollTop
+ }
+
+ function syncScrollState() {
+ if (!scrollContainer.value) return
+ scrollTop.value = getScrollTop(scrollContainer.value)
+ viewportHeight.value = getViewportHeight(scrollContainer.value)
+ updateContainerOffset()
}
const visibleRange = computed(() => {
@@ -57,15 +70,17 @@ export function useVirtualScroll(items: Ref, options: VirtualScrollOptio
if (!listContainer.value || !scrollContainer.value) return { start: 0, end: 0 }
- const containerOffset = getContainerOffset(listContainer.value, scrollContainer.value)
- const relativeScrollTop = Math.max(0, scrollTop.value - containerOffset)
+ const relativeScrollTop = Math.max(0, scrollTop.value - containerOffset.value)
const start = Math.floor(relativeScrollTop / itemHeight)
const visibleCount = Math.ceil(viewportHeight.value / itemHeight)
+ const rangeStart = Math.max(0, start - bufferSize)
+ const rangeEnd = Math.min(items.value.length, start + visibleCount + bufferSize * 2)
+
return {
- start: Math.max(0, start - bufferSize),
- end: Math.min(items.value.length, start + visibleCount + bufferSize * 2),
+ start: Math.min(rangeStart, rangeEnd),
+ end: rangeEnd,
}
})
@@ -91,16 +106,20 @@ export function useVirtualScroll(items: Ref, options: VirtualScrollOptio
function handleScroll() {
if (scrollContainer.value) {
scrollTop.value = getScrollTop(scrollContainer.value)
+ updateContainerOffset()
}
checkNearEnd()
}
function handleResize() {
- if (scrollContainer.value) {
- viewportHeight.value = getViewportHeight(scrollContainer.value)
- }
+ syncScrollState()
}
+ // Re-sync scroll state when items change to avoid stale scrollTop/offset
+ watch(items, () => {
+ syncScrollState()
+ })
+
watchEffect((onCleanup) => {
if (typeof window === 'undefined') return
@@ -109,15 +128,24 @@ export function useVirtualScroll(items: Ref, options: VirtualScrollOptio
const container = findScrollableAncestor(listEl)
scrollContainer.value = container
- viewportHeight.value = getViewportHeight(container)
- scrollTop.value = getScrollTop(container)
+ syncScrollState()
container.addEventListener('scroll', handleScroll, { passive: true })
window.addEventListener('resize', handleResize, { passive: true })
+ // Use ResizeObserver for element scroll containers
+ let resizeObserver: ResizeObserver | undefined
+ if (!(container instanceof Window)) {
+ resizeObserver = new ResizeObserver(() => {
+ syncScrollState()
+ })
+ resizeObserver.observe(container)
+ }
+
onCleanup(() => {
container.removeEventListener('scroll', handleScroll)
window.removeEventListener('resize', handleResize)
+ resizeObserver?.disconnect()
})
})
diff --git a/packages/ui/src/layouts/index.ts b/packages/ui/src/layouts/index.ts
index 41e610cf28..8532fe5be8 100644
--- a/packages/ui/src/layouts/index.ts
+++ b/packages/ui/src/layouts/index.ts
@@ -1,3 +1,4 @@
export * from './shared/content-tab'
+export * from './shared/files-tab'
export * from './shared/installation-settings'
export * from './wrapped'
diff --git a/packages/ui/src/layouts/shared/content-tab/components/ContentCardItem.vue b/packages/ui/src/layouts/shared/content-tab/components/ContentCardItem.vue
index 7e12cb55fe..723842d449 100644
--- a/packages/ui/src/layouts/shared/content-tab/components/ContentCardItem.vue
+++ b/packages/ui/src/layouts/shared/content-tab/components/ContentCardItem.vue
@@ -19,8 +19,8 @@ import BulletDivider from '#ui/components/base/BulletDivider.vue'
import ButtonStyled from '#ui/components/base/ButtonStyled.vue'
import Checkbox from '#ui/components/base/Checkbox.vue'
import type { Option as OverflowMenuOption } from '#ui/components/base/OverflowMenu.vue'
+import TeleportOverflowMenu from '#ui/components/base/TeleportOverflowMenu.vue'
import Toggle from '#ui/components/base/Toggle.vue'
-import TeleportOverflowMenu from '#ui/components/servers/files/explorer/TeleportOverflowMenu.vue'
import { useVIntl } from '#ui/composables/i18n'
import { commonMessages } from '#ui/utils/common-messages'
import { truncatedTooltip } from '#ui/utils/truncate'
@@ -94,7 +94,7 @@ const deleteHovered = ref(false)
@@ -305,7 +301,7 @@ onUnmounted(() => {
{{ formatMessage(commonMessages.contentLabel) }}
-
@@ -176,13 +170,13 @@ const bulkProgressMessage = computed(() => {
v-tooltip="
allDisabled
? formatMessage(messages.allAlreadyDisabled)
- : formatMessage(messages.disable)
+ : formatMessage(commonMessages.disableButton)
"
:disabled="isBusy || allDisabled"
@click="emit('disable')"
>
diff --git a/packages/ui/src/layouts/shared/content-tab/components/modals/ConfirmLeaveModal.vue b/packages/ui/src/layouts/shared/content-tab/components/modals/ConfirmLeaveModal.vue
deleted file mode 100644
index 74f70b93a4..0000000000
--- a/packages/ui/src/layouts/shared/content-tab/components/modals/ConfirmLeaveModal.vue
+++ /dev/null
@@ -1,91 +0,0 @@
-
-
-
-
-
-
diff --git a/packages/ui/src/layouts/shared/content-tab/components/modals/ContentInstallModal.vue b/packages/ui/src/layouts/shared/content-tab/components/modals/ContentInstallModal.vue
index 3a2de57722..71c24ec3f4 100644
--- a/packages/ui/src/layouts/shared/content-tab/components/modals/ContentInstallModal.vue
+++ b/packages/ui/src/layouts/shared/content-tab/components/modals/ContentInstallModal.vue
@@ -119,7 +119,7 @@
@@ -176,7 +176,7 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/FileTableHeader.vue b/packages/ui/src/layouts/shared/files-tab/components/FileTableHeader.vue
new file mode 100644
index 0000000000..490ee14d71
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/FileTableHeader.vue
@@ -0,0 +1,136 @@
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/FileTableRow.vue b/packages/ui/src/layouts/shared/files-tab/components/FileTableRow.vue
new file mode 100644
index 0000000000..28e88baa72
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/FileTableRow.vue
@@ -0,0 +1,360 @@
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/editor/FileEditor.vue b/packages/ui/src/layouts/shared/files-tab/components/editor/FileEditor.vue
new file mode 100644
index 0000000000..e3f4ada2c9
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/editor/FileEditor.vue
@@ -0,0 +1,288 @@
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileDeleteItemModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileDeleteItemModal.vue
new file mode 100644
index 0000000000..7c705476dc
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileDeleteItemModal.vue
@@ -0,0 +1,80 @@
+
+
+
+ {{ formatMessage(messages.deletingName, { name: item?.name }) }}
+ {{ formatMessage(messages.deleteWarning, { type: item?.type }) }}
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileMoveItemModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileMoveItemModal.vue
new file mode 100644
index 0000000000..a01771c80b
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileMoveItemModal.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileRenameItemModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileRenameItemModal.vue
new file mode 100644
index 0000000000..186230f7c4
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileRenameItemModal.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileUnsavedChangesModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUnsavedChangesModal.vue
new file mode 100644
index 0000000000..a18634e142
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUnsavedChangesModal.vue
@@ -0,0 +1,89 @@
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadConflictModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadConflictModal.vue
new file mode 100644
index 0000000000..9050d67392
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadConflictModal.vue
@@ -0,0 +1,145 @@
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadZipUrlModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadZipUrlModal.vue
new file mode 100644
index 0000000000..1a6824ae8c
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileUploadZipUrlModal.vue
@@ -0,0 +1,291 @@
+
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/file-validation-messages.ts b/packages/ui/src/layouts/shared/files-tab/components/modals/file-validation-messages.ts
new file mode 100644
index 0000000000..f5d7db1147
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/file-validation-messages.ts
@@ -0,0 +1,22 @@
+import { defineMessages } from '#ui/composables/i18n'
+
+export const fileValidationMessages = defineMessages({
+ nameLabel: {
+ id: 'files.validation.name-label',
+ defaultMessage: 'Name',
+ },
+ nameRequired: {
+ id: 'files.validation.name-required',
+ defaultMessage: 'Name is required.',
+ },
+ nameInvalidFile: {
+ id: 'files.validation.name-invalid-file',
+ defaultMessage:
+ 'Name must contain only alphanumeric characters, dashes, underscores, dots, or spaces.',
+ },
+ nameInvalidDirectory: {
+ id: 'files.validation.name-invalid-directory',
+ defaultMessage:
+ 'Name must contain only alphanumeric characters, dashes, underscores, or spaces.',
+ },
+})
diff --git a/packages/ui/src/components/servers/files/upload/FileUploadDragAndDrop.vue b/packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDragAndDrop.vue
similarity index 73%
rename from packages/ui/src/components/servers/files/upload/FileUploadDragAndDrop.vue
rename to packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDragAndDrop.vue
index 3d03699feb..6a9900fcf0 100644
--- a/packages/ui/src/components/servers/files/upload/FileUploadDragAndDrop.vue
+++ b/packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDragAndDrop.vue
@@ -16,7 +16,11 @@
@@ -27,6 +31,10 @@
import { UploadIcon } from '@modrinth/assets'
import { ref } from 'vue'
+import { defineMessages, useVIntl } from '#ui/composables/i18n'
+
+const { formatMessage } = useVIntl()
+
const emit = defineEmits<{
filesDropped: [files: File[]]
}>()
@@ -36,15 +44,20 @@ defineProps<{
type?: string
}>()
+const messages = defineMessages({
+ dropToUpload: {
+ id: 'files.upload.drag-and-drop.drop-to-upload',
+ defaultMessage: 'Drop {type, select, undefined {files} other {{type}s}} here to upload',
+ },
+})
+
const isDragging = ref(false)
const dragCounter = ref(0)
const handleDragEnter = (event: DragEvent) => {
event.preventDefault()
- if (!event.dataTransfer?.types.includes('application/modrinth-file-move')) {
- dragCounter.value++
- isDragging.value = true
- }
+ dragCounter.value++
+ isDragging.value = true
}
const handleDragOver = (event: DragEvent) => {
@@ -64,9 +77,6 @@ const handleDrop = (event: DragEvent) => {
isDragging.value = false
dragCounter.value = 0
- const isInternalMove = event.dataTransfer?.types.includes('application/modrinth-file-move')
- if (isInternalMove) return
-
const files = event.dataTransfer?.files
if (files) {
emit('filesDropped', Array.from(files))
diff --git a/packages/ui/src/components/servers/files/upload/FileUploadDropdown.vue b/packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDropdown.vue
similarity index 76%
rename from packages/ui/src/components/servers/files/upload/FileUploadDropdown.vue
rename to packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDropdown.vue
index 580754c31f..e9244087e8 100644
--- a/packages/ui/src/components/servers/files/upload/FileUploadDropdown.vue
+++ b/packages/ui/src/layouts/shared/files-tab/components/upload/FileUploadDropdown.vue
@@ -12,9 +12,17 @@
-
- {{ formatMessage(messages.leavePageBody) }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ formatMessage(messages.gameVersionLabel) }}
+ {{ formatMessage(commonMessages.gameVersionLabel) }}
@@ -26,7 +26,22 @@
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/FileOperationAdmonitions.vue b/packages/ui/src/layouts/shared/files-tab/components/FileOperationAdmonitions.vue
new file mode 100644
index 0000000000..8a9c666ef0
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/FileOperationAdmonitions.vue
@@ -0,0 +1,178 @@
+
+
+
+
+
+
+
+ {{ name }}
+
+
+
+
+ {{ formattedSize }}
+
+
+ {{ formattedCreationDate }}
+
+
+ {{ formattedModifiedDate }}
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/editor/FileImageViewer.vue b/packages/ui/src/layouts/shared/files-tab/components/editor/FileImageViewer.vue
new file mode 100644
index 0000000000..6bd8bfec48
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/editor/FileImageViewer.vue
@@ -0,0 +1,178 @@
+
+
+
+
+ ![]()
+
+
+
+
+
diff --git a/packages/ui/src/layouts/shared/files-tab/components/modals/FileCreateItemModal.vue b/packages/ui/src/layouts/shared/files-tab/components/modals/FileCreateItemModal.vue
new file mode 100644
index 0000000000..461ab5eca5
--- /dev/null
+++ b/packages/ui/src/layouts/shared/files-tab/components/modals/FileCreateItemModal.vue
@@ -0,0 +1,128 @@
+
+
+
+ + {{ state.errorMessage || formatMessage(messages.invalidImage) }} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + {{ formatMessage(messages.body) }} +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ formatMessage(messages.overwriteManyWarning) }}
+
+
+ {{ formatMessage(messages.overwriteWarning, { count: files.length }) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{
+ formatMessage(messages.overwrittenLabel)
+ }}
+
+ {{ file }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ - Drop {{ type ? type.toLocaleLowerCase() : 'file' }}s here to upload + {{ + formatMessage(messages.dropToUpload, { + type: type ? type.toLocaleLowerCase() : undefined, + }) + }}
- Done
+ {{ formatMessage(commonMessages.doneLabel) }}
- Failed - File already exists
+ {{ formatMessage(messages.failedFileExists) }}
- Failed - {{ item.error?.message || 'An unexpected error occured.' }}
+ {{
+ formatMessage(messages.failedGeneric, {
+ error: item.error?.message || formatMessage(messages.unexpectedError),
+ })
+ }}
- Failed - Incorrect file type
+ {{ formatMessage(messages.failedIncorrectType) }}
@@ -75,11 +85,11 @@
/>
-
-
-
-
- {{ formatMessage(nonBackupBusyReasons[0].reason) }}
- File operations are disabled while the operation is in progress.
-
-
-
-
-
- {{ selectedItems.size }} selected
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- This folder is empty
-There are no files or folders.
-
-
-
-
-
-
-
-
-
+
+ Uploading server files...
+
+
+
+
+
+
+
+ Something went wrong while extracting the archive.
+
+
+
+
+
+
+
+
+
+
+ All files have been extracted successfully.
+
+
+
+
+
+
+
+ `,
+ }),
+}
+
+export const WithProgressBar: Story = {
+ render: () => ({
+ components: { Admonition, ButtonStyled, ProgressBar },
+ template: /*html*/ `
+
+
+ 128 KB / 1.2 MB (45%)
+
+
+
+
+
+
+
+
+ 24 MB extracted — config/settings.yml
+
+
+
+
+
+
+
+
+ 56 MB extracted
+
+
+
+
+
+
+
+
+ `,
+ }),
+}
diff --git a/packages/ui/src/stories/base/NavTabs.stories.ts b/packages/ui/src/stories/base/NavTabs.stories.ts
new file mode 100644
index 0000000000..8a8e578972
--- /dev/null
+++ b/packages/ui/src/stories/base/NavTabs.stories.ts
@@ -0,0 +1,97 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+import { getCurrentInstance, ref } from 'vue'
+import { createMemoryHistory, createRouter } from 'vue-router'
+
+import NavTabs from '../../components/base/NavTabs.vue'
+
+const router = createRouter({
+ history: createMemoryHistory(),
+ routes: [{ path: '/', component: { template: '' } }],
+})
+
+const meta = {
+ title: 'Base/NavTabs',
+ component: NavTabs,
+ decorators: [
+ (story) => {
+ return {
+ components: { story },
+ setup() {
+ const app = getCurrentInstance()?.appContext.app
+ if (app && !app.config.globalProperties.$router) {
+ app.use(router)
+ }
+ },
+ template: '
+
+
+
+
+ `,
+ }),
+}
+
+export const CustomMessages: Story = {
+ render: () => ({
+ components: { ConfirmLeaveModal, ButtonStyled },
+ setup() {
+ const modalRef = ref{{ result }}
+
+
+
+
+
+ `,
+ }),
+}
+
+export const WarningAdmonition: Story = {
+ render: () => ({
+ components: { ConfirmLeaveModal, ButtonStyled },
+ setup() {
+ const modalRef = ref
+
+
+
+
+ `,
+ }),
+}
diff --git a/packages/ui/src/stories/servers/BackupProgressAdmonition.stories.ts b/packages/ui/src/stories/servers/BackupProgressAdmonition.stories.ts
deleted file mode 100644
index 83a3a96515..0000000000
--- a/packages/ui/src/stories/servers/BackupProgressAdmonition.stories.ts
+++ /dev/null
@@ -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
-
- `,
- }),
-}
-
-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,
- },
-}
diff --git a/packages/ui/src/utils/ace-mode-log.ts b/packages/ui/src/utils/ace-mode-log.ts
new file mode 100644
index 0000000000..720ff6f30e
--- /dev/null
+++ b/packages/ui/src/utils/ace-mode-log.ts
@@ -0,0 +1,71 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import ace from 'ace-builds'
+
+ace['define'](
+ 'ace/mode/mclog_highlight_rules',
+ ['require', 'exports', 'ace/lib/oop', 'ace/mode/text_highlight_rules'],
+ function (require: any, exports: any) {
+ const oop = require('ace/lib/oop')
+ const TextHighlightRules = require('ace/mode/text_highlight_rules').TextHighlightRules
+
+ const MclogHighlightRules = function (this: any) {
+ this.$rules = {
+ start: [
+ {
+ token: 'comment.timestamp',
+ regex: /^\[\d\d:\d\d:\d\d\]/.source,
+ },
+ {
+ token: 'invalid.error',
+ regex: /\[.+?\/ERROR\]:?/.source,
+ },
+ {
+ token: 'keyword.warn',
+ regex: /\[.+?\/WARN\]:?/.source,
+ },
+ {
+ token: 'string.info',
+ regex: /\[.+?\/INFO\]:/.source,
+ },
+ {
+ token: 'support.command',
+ regex: /: \/.+/.source,
+ },
+ {
+ token: 'comment.stacktrace',
+ regex: /\tat\s.+/.source,
+ },
+ {
+ token: 'entity.name.function',
+ regex: /\w+?\[\/\d+?\.\d+?\.\d+?\.\d+?:\d+?\]/.source,
+ },
+ {
+ token: 'storage.chat',
+ regex: /\[CHAT\]/.source,
+ },
+ ],
+ }
+ this.normalizeRules()
+ }
+
+ oop.inherits(MclogHighlightRules, TextHighlightRules)
+ exports.MclogHighlightRules = MclogHighlightRules
+ },
+)
+
+ace['define'](
+ 'ace/mode/mclog',
+ ['require', 'exports', 'ace/lib/oop', 'ace/mode/text', 'ace/mode/mclog_highlight_rules'],
+ function (require: any, exports: any) {
+ const oop = require('ace/lib/oop')
+ const TextMode = require('ace/mode/text').Mode
+ const MclogHighlightRules = require('ace/mode/mclog_highlight_rules').MclogHighlightRules
+
+ const Mode = function (this: any) {
+ this.HighlightRules = MclogHighlightRules
+ }
+
+ oop.inherits(Mode, TextMode)
+ exports.Mode = Mode
+ },
+)
diff --git a/packages/ui/src/utils/ace-theme.ts b/packages/ui/src/utils/ace-theme.ts
index a1cde94088..e78e42d483 100644
--- a/packages/ui/src/utils/ace-theme.ts
+++ b/packages/ui/src/utils/ace-theme.ts
@@ -1,3 +1,5 @@
+import 'ace-builds/esm-resolver'
+
import cssText from '@modrinth/assets/styles/ace.css?raw'
import ace from 'ace-builds'
diff --git a/packages/ui/src/utils/common-messages.ts b/packages/ui/src/utils/common-messages.ts
index db2dd285ee..5e6a5764cf 100644
--- a/packages/ui/src/utils/common-messages.ts
+++ b/packages/ui/src/utils/common-messages.ts
@@ -470,10 +470,94 @@ export const commonMessages = defineMessages({
id: 'label.plan-custom',
defaultMessage: 'Custom',
},
+ copyLinkButton: {
+ id: 'button.copy-link',
+ defaultMessage: 'Copy link',
+ },
switchVersionButton: {
id: 'button.switch-version',
defaultMessage: 'Switch version',
},
+ updatingLabel: {
+ id: 'label.updating',
+ defaultMessage: 'Updating...',
+ },
+ deleteFailedLabel: {
+ id: 'label.delete-failed',
+ defaultMessage: 'Delete failed',
+ },
+ uploadFailedLabel: {
+ id: 'label.upload-failed',
+ defaultMessage: 'Upload failed',
+ },
+ renameFailedLabel: {
+ id: 'label.rename-failed',
+ defaultMessage: 'Rename failed',
+ },
+ moveFailedLabel: {
+ id: 'label.move-failed',
+ defaultMessage: 'Move failed',
+ },
+ createFailedLabel: {
+ id: 'label.create-failed',
+ defaultMessage: 'Create failed',
+ },
+ extractFailedLabel: {
+ id: 'label.extract-failed',
+ defaultMessage: 'Extract failed',
+ },
+ showFileButton: {
+ id: 'button.show-file',
+ defaultMessage: 'Show file',
+ },
+ enableButton: {
+ id: 'button.enable',
+ defaultMessage: 'Enable',
+ },
+ disableButton: {
+ id: 'button.disable',
+ defaultMessage: 'Disable',
+ },
+ renameButton: {
+ id: 'button.rename',
+ defaultMessage: 'Rename',
+ },
+ moveButton: {
+ id: 'button.move',
+ defaultMessage: 'Move',
+ },
+ extractButton: {
+ id: 'button.extract',
+ defaultMessage: 'Extract',
+ },
+ doneLabel: {
+ id: 'label.done',
+ defaultMessage: 'Done',
+ },
+ copyFilenameButton: {
+ id: 'button.copy-filename',
+ defaultMessage: 'Copy filename',
+ },
+ copyFullPathButton: {
+ id: 'button.copy-full-path',
+ defaultMessage: 'Copy full path',
+ },
+ copiedFilenameLabel: {
+ id: 'label.copied-filename',
+ defaultMessage: 'Copied filename',
+ },
+ copiedPathLabel: {
+ id: 'label.copied-path',
+ defaultMessage: 'Copied path',
+ },
+ openInFolderButton: {
+ id: 'button.open-in-folder',
+ defaultMessage: 'Open in folder',
+ },
+ downloadFailedLabel: {
+ id: 'label.download-failed',
+ defaultMessage: 'Download failed',
+ },
projectCreated: {
id: 'project.about.details.created',
defaultMessage: 'Created {date}',
@@ -638,6 +722,14 @@ export const financialMessages = defineMessages({
},
})
+const PROJECT_TYPE_ALIASES: Record