diff --git a/packages/frontend/src/pages/admin/approvals.vue b/packages/frontend/src/pages/admin/approvals.vue
index ad69c5c242..521346bd98 100644
--- a/packages/frontend/src/pages/admin/approvals.vue
+++ b/packages/frontend/src/pages/admin/approvals.vue
@@ -23,14 +23,14 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { computed, shallowRef } from 'vue';
+import { computed, useTemplateRef } from 'vue';
 import XHeader from './_header_.vue';
 import MkPagination from '@/components/MkPagination.vue';
 import SkApprovalUser from '@/components/SkApprovalUser.vue';
 import { i18n } from '@/i18n.js';
-import { definePageMetadata } from '@/utility/page-metadata.js';
+import { definePage } from '@/page';
 
-let paginationComponent = shallowRef<InstanceType<typeof MkPagination>>();
+let paginationComponent = useTemplateRef<InstanceType<typeof MkPagination>>('paginationComponent');
 
 const pagination = {
 	endpoint: 'admin/show-users' as const,
@@ -53,7 +53,7 @@ const headerActions = computed(() => []);
 
 const headerTabs = computed(() => []);
 
-definePageMetadata(() => ({
+definePage(() => ({
 	title: i18n.ts.approvals,
 	icon: 'ph-chalkboard-teacher ph-bold ph-lg',
 }));