diff options
Diffstat (limited to 'packages/frontend/src/pages/my-clips/index.vue')
| -rw-r--r-- | packages/frontend/src/pages/my-clips/index.vue | 19 |
1 files changed, 9 insertions, 10 deletions
diff --git a/packages/frontend/src/pages/my-clips/index.vue b/packages/frontend/src/pages/my-clips/index.vue index acf37a9a2f..1525bbef9b 100644 --- a/packages/frontend/src/pages/my-clips/index.vue +++ b/packages/frontend/src/pages/my-clips/index.vue @@ -4,35 +4,34 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<MkStickyContainer> - <template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template> +<PageWithHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"> <MkSpacer :contentMax="700"> <MkHorizontalSwipe v-model:tab="tab" :tabs="headerTabs"> - <div v-if="tab === 'my'" key="my" class="_gaps"> + <div v-if="tab === 'my'" class="_gaps"> <MkButton primary rounded class="add" @click="create"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton> <MkPagination v-slot="{ items }" ref="pagingComponent" :pagination="pagination" class="_gaps"> <MkClipPreview v-for="item in items" :key="item.id" :clip="item" :noUserInfo="true"/> </MkPagination> </div> - <div v-else-if="tab === 'favorites'" key="favorites" class="_gaps"> + <div v-else-if="tab === 'favorites'" class="_gaps"> <MkClipPreview v-for="item in favorites" :key="item.id" :clip="item"/> </div> </MkHorizontalSwipe> </MkSpacer> -</MkStickyContainer> +</PageWithHeader> </template> <script lang="ts" setup> -import { watch, ref, shallowRef, computed } from 'vue'; +import { watch, ref, useTemplateRef, computed } from 'vue'; import * as Misskey from 'misskey-js'; import MkPagination from '@/components/MkPagination.vue'; import MkButton from '@/components/MkButton.vue'; import MkClipPreview from '@/components/MkClipPreview.vue'; import * as os from '@/os.js'; -import { misskeyApi } from '@/scripts/misskey-api.js'; +import { misskeyApi } from '@/utility/misskey-api.js'; import { i18n } from '@/i18n.js'; -import { definePageMetadata } from '@/scripts/page-metadata.js'; +import { definePage } from '@/page.js'; import { clipsCache } from '@/cache.js'; import MkHorizontalSwipe from '@/components/MkHorizontalSwipe.vue'; @@ -46,7 +45,7 @@ const tab = ref('my'); const favorites = ref<Misskey.entities.Clip[] | null>(null); -const pagingComponent = shallowRef<InstanceType<typeof MkPagination>>(); +const pagingComponent = useTemplateRef('pagingComponent'); watch(tab, async () => { favorites.value = await misskeyApi('clips/my-favorites'); @@ -100,7 +99,7 @@ const headerTabs = computed(() => [{ icon: 'ti ti-heart', }]); -definePageMetadata(() => ({ +definePage(() => ({ title: i18n.ts.clip, icon: 'ti ti-paperclip', })); |