refactor(client): Refine routing (#8846)

packages/client/src/pages/search.vue

@@ -1,16 +1,17 @@
 <template>
-<div class="_section">
-	<div class="_content">
+<MkStickyContainer>
+	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
+	<MkSpacer :content-max="800">
 		<XNotes ref="notes" :pagination="pagination"/>
-	</div>
-</div>
+	</MkSpacer>
+</MkStickyContainer>
 </template>
 
 <script lang="ts" setup>
 import { computed } from 'vue';
 import XNotes from '@/components/notes.vue';
-import * as symbols from '@/symbols';
 import { i18n } from '@/i18n';
+import { definePageMetadata } from '@/scripts/page-metadata';
 
 const props = defineProps<{
 	query: string;
@@ -23,14 +24,16 @@ const pagination = {
 	params: computed(() => ({
 		query: props.query,
 		channelId: props.channel,
-	}))
+	})),
 };
 
-defineExpose({
-	[symbols.PAGE_INFO]: computed(() => ({
-		title: i18n.t('searchWith', { q: props.query }),
-		icon: 'fas fa-search',
-		bg: 'var(--bg)',
-	})),
-});
+const headerActions = $computed(() => []);
+
+const headerTabs = $computed(() => []);
+
+definePageMetadata(computed(() => ({
+	title: i18n.t('searchWith', { q: props.query }),
+	icon: 'fas fa-search',
+	bg: 'var(--bg)',
+})));
 </script>