feat: start of cross platform page system (#4731)

* feat: abstract api-client DI into ui package

* feat: cross platform page system

* feat: tanstack as cross platform useAsyncData

* feat: archon servers routes + labrinth billing routes

* fix: dont use partial

* feat: migrate server list page to tanstack + api-client + re-enabled broken features!

* feat: migrate servers manage page to api-client before page system

* feat: migrate manage page to page system

* fix: type issues

* fix: upgrade wrapper bugs

* refactor: move state types into api-client

* feat: disable financial stuff on app frontend

* feat: finalize cross platform page system for now

* fix: lint

* fix: build issues

* feat: remove papaparse

* fix: lint

* fix: interface error

---------

Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>

packages/ui/src/components/servers/labels/ServerSubdomainLabel.vue

@@ -0,0 +1,52 @@
+<template>
+	<div
+		v-if="subdomain && !isHidden"
+		v-tooltip="'Copy custom URL'"
+		class="flex min-w-0 flex-row items-center gap-4 truncate hover:cursor-pointer"
+	>
+		<div v-if="!noSeparator" class="experimental-styles-within h-6 w-0.5 bg-button-border"></div>
+		<div class="flex flex-row items-center gap-2">
+			<LinkIcon class="flex size-5 shrink-0" />
+			<div
+				class="flex min-w-0 text-sm font-semibold"
+				:class="serverId ? 'hover:underline' : ''"
+				@click="copySubdomain"
+			>
+				{{ subdomain }}.modrinth.gg
+			</div>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { LinkIcon } from '@modrinth/assets'
+import { injectNotificationManager } from '@modrinth/ui'
+import { useStorage } from '@vueuse/core'
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+
+const { addNotification } = injectNotificationManager()
+
+const props = defineProps<{
+	subdomain: string
+	noSeparator?: boolean
+}>()
+
+const copySubdomain = () => {
+	navigator.clipboard.writeText(props.subdomain + '.modrinth.gg')
+	addNotification({
+		title: 'Custom URL copied',
+		text: "Your server's URL has been copied to your clipboard.",
+		type: 'success',
+	})
+}
+
+const route = useRoute()
+const serverId = computed(() => route.params.id as string)
+
+const userPreferences = useStorage(`pyro-server-${serverId.value}-preferences`, {
+	hideSubdomainLabel: false,
+})
+
+const isHidden = computed(() => userPreferences.value.hideSubdomainLabel)
+</script>