fix: update browse page when installing dependencies (#6414)

* fix: update browse page when installing dependencies

* fix: lint

* fix: vers page

* fix: vers page link query persistence

apps/app-frontend/src/pages/project/Index.vue

@@ -406,6 +406,20 @@ function buildProjectHref(path, extraQuery = {}) {
 	return qs ? `${path}?${qs}` : path
 }
 
+function buildBrowseHref(path) {
+	const params = new URLSearchParams()
+	for (const [key, val] of Object.entries(route.query)) {
+		if (key === 'b') continue
+		if (Array.isArray(val)) {
+			for (const v of val) params.append(key, v)
+		} else if (val) {
+			params.append(key, String(val))
+		}
+	}
+	const qs = params.toString()
+	return qs ? `${path}?${qs}` : path
+}
+
 const projectDescriptionHref = computed(() => buildProjectHref(`/project/${route.params.id}`))
 const versionsHref = computed(() =>
 	buildProjectHref(`/project/${route.params.id}/versions`, instanceFilters.value),
@@ -416,7 +430,7 @@ const projectBrowseBackUrl = computed(() => {
 	const browsePath = route.query.b
 	if (typeof browsePath === 'string' && browsePath.startsWith('/browse/')) return browsePath
 	const type = data.value?.project_type ? `${data.value.project_type}` : 'mod'
-	return `/browse/${type}`
+	return buildBrowseHref(`/browse/${type}`)
 })
 
 const projectInstallContext = computed(() => {
@@ -725,10 +739,11 @@ async function install(version) {
 		version,
 		instance.value ? instance.value.path : null,
 		'ProjectPage',
-		(version) => {
+		(version, installedProjectIds) => {
 			installing.value = false
 
-			if (instance.value && version) {
+			const installedIds = installedProjectIds ?? [data.value.id]
+			if (instance.value && version && installedIds.includes(data.value.id)) {
 				installed.value = true
 				installedVersion.value = version
 			}

apps/app-frontend/src/pages/project/Version.vue

@@ -5,7 +5,7 @@
 				:current-title="version.name"
 				:link-stack="[
 					{
-						href: `/project/${route.params.id}/versions`,
+						href: buildProjectHref(`/project/${route.params.id}/versions`),
 						label: 'Versions',
 					},
 				]"
@@ -249,6 +249,19 @@ const author = computed(() =>
 
 const displayDependencies = ref({})
 
+function buildProjectHref(path) {
+	const params = new URLSearchParams()
+	for (const [key, val] of Object.entries(route.query)) {
+		if (Array.isArray(val)) {
+			for (const v of val) params.append(key, v)
+		} else if (val) {
+			params.append(key, String(val))
+		}
+	}
+	const qs = params.toString()
+	return qs ? `${path}?${qs}` : path
+}
+
 async function refreshDisplayDependencies() {
 	const projectIds = new Set()
 	const versionIds = new Set()
@@ -282,7 +295,7 @@ async function refreshDisplayDependencies() {
 				icon: project?.icon_url,
 				title: project?.title || project?.name,
 				subtitle: `Version ${version.version_number} is ${dependency.dependency_type}`,
-				link: `/project/${project.slug}/version/${version.id}`,
+				link: buildProjectHref(`/project/${project.slug}/version/${version.id}`),
 			}
 		} else {
 			const project = dependencies.projects.find((obj) => obj.id === dependency.project_id)
@@ -292,7 +305,7 @@ async function refreshDisplayDependencies() {
 					icon: project?.icon_url,
 					title: project?.title || project?.name,
 					subtitle: `${dependency.dependency_type}`,
-					link: `/project/${project.slug}`,
+					link: buildProjectHref(`/project/${project.slug}`),
 				}
 			} else {
 				return {

apps/app-frontend/src/pages/project/Versions.vue

@@ -5,7 +5,7 @@
 			:game-versions="gameVersions"
 			:versions="versions"
 			:project="project"
-			:version-link="(version) => `/project/${project.id}/version/${version.id}`"
+			:version-link="(version) => buildProjectHref(`/project/${project.id}/version/${version.id}`)"
 		>
 			<template #actions="{ version }">
 				<ButtonStyled circular type="transparent">
@@ -73,6 +73,7 @@ import {
 	ProjectPageVersions,
 } from '@modrinth/ui'
 import { ref } from 'vue'
+import { useRoute } from 'vue-router'
 
 import { SwapIcon } from '@/assets/icons/index.js'
 import { get_game_versions, get_loaders } from '@/helpers/tags.js'
@@ -109,6 +110,20 @@ defineProps({
 })
 
 const { handleError } = injectNotificationManager()
+const route = useRoute()
+
+function buildProjectHref(path) {
+	const params = new URLSearchParams()
+	for (const [key, val] of Object.entries(route.query)) {
+		if (Array.isArray(val)) {
+			for (const v of val) params.append(key, v)
+		} else if (val) {
+			params.append(key, String(val))
+		}
+	}
+	const qs = params.toString()
+	return qs ? `${path}?${qs}` : path
+}
 
 const [loaders, gameVersions] = await Promise.all([
 	get_loaders().catch(handleError).then(ref),