feat(frontend): project tags link to a search (#3126)

* feat(frontend): tags link to a search

* fix category type

* process feedback

---------

Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>
This commit is contained in:
Sven 2025-01-10 17:52:05 +01:00 committed by GitHub
parent ec5e3b0050
commit abd679d716
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 11 additions and 1 deletions

View File

@ -37,7 +37,11 @@
<div v-if="project.categories.length > 0" class="hidden items-center gap-2 md:flex">
<TagsIcon class="h-6 w-6 text-secondary" />
<div class="flex flex-wrap gap-2">
<TagItem v-for="(category, index) in project.categories" :key="index">
<TagItem
v-for="(category, index) in project.categories"
:key="index"
:action="() => router.push(`/${project.project_type}s?f=categories:${category}`)"
>
{{ formatCategory(category) }}
</TagItem>
</div>
@ -53,9 +57,12 @@ import { DownloadIcon, HeartIcon, TagsIcon } from '@modrinth/assets'
import Avatar from '../base/Avatar.vue'
import ContentPageHeader from '../base/ContentPageHeader.vue'
import { formatCategory, formatNumber, type Project } from '@modrinth/utils'
import { useRouter } from 'vue-router'
import TagItem from '../base/TagItem.vue'
import ProjectStatusBadge from './ProjectStatusBadge.vue'
const router = useRouter()
withDefaults(
defineProps<{
project: Project

View File

@ -18,6 +18,7 @@
<TagItem
v-for="platform in project.loaders"
:key="`platform-tag-${platform}`"
:action="() => router.push(`/${project.project_type}s?g=categories:${platform}`)"
:style="`--_color: var(--color-platform-${platform})`"
>
<svg v-html="tags.loaders.find((x) => x.name === platform).icon"></svg>
@ -78,9 +79,11 @@ import { ClientIcon, MonitorSmartphoneIcon, ServerIcon, UserIcon } from '@modrin
import { formatCategory, getVersionsToDisplay } from '@modrinth/utils'
import type { GameVersionTag, PlatformTag } from '@modrinth/utils'
import { useVIntl, defineMessages } from '@vintl/vintl'
import { useRouter } from 'vue-router'
import TagItem from '../base/TagItem.vue'
const { formatMessage } = useVIntl()
const router = useRouter()
type EnvironmentValue = 'optional' | 'required' | 'unsupported' | 'unknown'