fix: download modal no compatible empty state (#6680)

apps/frontend/src/components/ui/ProjectDownloadModal/DownloadProject.vue

@@ -126,6 +126,9 @@
 			@download="emit('download')"
 		/>
 	</div>
+	<div v-else-if="showNoCompatibleVersions" class="pl-1 text-base text-primary" role="status">
+		{{ noCompatibleVersionsDescription }}
+	</div>
 </template>
 
 <script setup lang="ts">
@@ -174,6 +177,7 @@ const props = withDefaults(
 		versions?: Labrinth.Versions.v3.Version[]
 		dependencyDownloadFiles?: DownloadableFile[]
 		downloadDataLoaded?: boolean
+		versionsLoaded?: boolean
 		downloadReason?: CdnDownloadReason
 		initialGameVersion?: string | null
 		initialPlatform?: string | null
@@ -185,6 +189,7 @@ const props = withDefaults(
 		versions: () => [],
 		dependencyDownloadFiles: () => [],
 		downloadDataLoaded: false,
+		versionsLoaded: false,
 		downloadReason: 'standalone',
 		initialGameVersion: null,
 		initialPlatform: null,
@@ -409,6 +414,25 @@ const compatibleVersions = computed<Labrinth.Versions.v3.Version[]>(() => {
 	return [defaultSelectedVersion.value, ...suggestedPreReleaseVersions.value]
 })
 
+const showNoCompatibleVersions = computed(() => {
+	return (
+		props.versionsLoaded &&
+		compatibleVersions.value.length === 0 &&
+		!!currentGameVersion.value &&
+		!!currentPlatform.value
+	)
+})
+
+const noCompatibleVersionsDescription = computed(() => {
+	const gameVersion = currentGameVersion.value
+	if (!gameVersion || !currentPlatform.value) return ''
+
+	return formatMessage(messages.noVersionsAvailable, {
+		gameVersion,
+		platform: currentPlatformText.value,
+	})
+})
+
 const selectedVersion = computed<Labrinth.Versions.v3.Version | null>(() => {
 	return (
 		compatibleVersions.value.find(
@@ -636,6 +660,10 @@ const messages = defineMessages({
 		id: 'project.download.no-game-versions-found',
 		defaultMessage: 'No game versions found',
 	},
+	noVersionsAvailable: {
+		id: 'project.download.no-versions-available',
+		defaultMessage: 'No versions available for {gameVersion} and {platform}.',
+	},
 	platformUnsupportedTooltip: {
 		id: 'project.download.platform-unsupported-tooltip',
 		defaultMessage: '{title} does not support {platform} for {gameVersion}',

apps/frontend/src/components/ui/ProjectDownloadModal/index.vue

@@ -20,6 +20,7 @@
 					:versions="versions"
 					:dependency-download-files="dependencyDownloadFiles"
 					:download-data-loaded="downloadRowsLoaded"
+					:versions-loaded="versionsLoaded"
 					:download-reason="downloadReason"
 					:initial-game-version="initialGameVersion"
 					:initial-platform="initialPlatform"
@@ -255,6 +256,9 @@ const { data: versionsV3, isFetching: versionsV3Loading } = useQuery({
 const versions = computed<Labrinth.Versions.v3.Version[]>(() =>
 	normalizeVersionsForDownload(versionsV3.value ?? []),
 )
+const versionsLoaded = computed(
+	() => versionsEnabled.value && !versionsV3Loading.value && Array.isArray(versionsV3.value),
+)
 
 const initialGameVersion = computed(() => {
 	const version = route.query.version