Files
Starlight_Lancher/apps/app-frontend/src/components/instance/HostedPackProgress.vue
Disy bc904065c3
Some checks failed
Axolotl desktop CI / guardrails (push) Has been cancelled
Axolotl desktop CI / desktop (macos-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (ubuntu-latest) (push) Has been cancelled
Axolotl desktop CI / desktop (windows-latest) (push) Has been cancelled
Axolotl desktop CI / website (push) Has been cancelled
Repository checks / typos (push) Has been cancelled
Repository checks / tombi (push) Has been cancelled
Rust checks / shear (push) Has been cancelled
Sync source to CNB / Sync Git ref (push) Has been cancelled
feat: complete hosted mod sync and launcher interface updates
Add pack sync markers, tagged mod updates, parallel progress, JWT downloads and retry recovery. Include pending onboarding, about scene, compatibility data pack and download fixes.
2026-09-15 19:06:56 +08:00

50 lines
1.6 KiB
Vue

<script setup lang="ts">
import { ProgressBar, defineMessages, useVIntl } from '@modrinth/ui'
import { computed } from 'vue'
import { injectDownloadManager } from '@/providers/download-manager'
const props = defineProps<{ instanceId?: string; active?: boolean }>()
const manager = injectDownloadManager()
const { formatMessage } = useVIntl()
const messages = defineMessages({
preparing: {
id: 'app.hosted-packs.progress.preparing',
defaultMessage: 'Preparing modpack installation…',
},
downloads: { id: 'app.hosted-packs.progress.downloads', defaultMessage: 'View downloads' },
})
const bar = computed(() =>
manager.legacyDownloads.value.find(
(item) =>
props.instanceId &&
item.bar_type?.type === 'hosted_pack_sync' &&
!item.bar_type.error &&
item.bar_type.instance_id === props.instanceId,
),
)
const waiting = computed(() => !bar.value?.total)
const current = computed(() =>
Math.max(0, Math.min(bar.value?.current ?? 0, bar.value?.total ?? 0)),
)
const message = computed(() => bar.value?.message || formatMessage(messages.preparing))
</script>
<template>
<div v-if="active || bar" class="flex min-w-0 flex-col gap-2" role="status">
<ProgressBar
:progress="current"
:max="bar?.total || 1"
:waiting="waiting"
:label="message"
label-class="min-w-0 break-all text-sm text-secondary"
:show-progress="!waiting"
full-width
>
<template #progress-icon />
</ProgressBar>
<RouterLink to="/downloads" class="self-start text-sm text-brand hover:underline">
{{ formatMessage(messages.downloads) }}
</RouterLink>
</div>
</template>