diff options
Diffstat (limited to 'packages/frontend/src/pages')
| -rw-r--r-- | packages/frontend/src/pages/explore.featured.vue | 13 | ||||
| -rw-r--r-- | packages/frontend/src/pages/explore.users.vue | 14 | ||||
| -rw-r--r-- | packages/frontend/src/pages/qr.read.vue | 13 | ||||
| -rw-r--r-- | packages/frontend/src/pages/user/index.timeline.vue | 17 | ||||
| -rw-r--r-- | packages/frontend/src/pages/user/notes.vue | 17 |
5 files changed, 50 insertions, 24 deletions
diff --git a/packages/frontend/src/pages/explore.featured.vue b/packages/frontend/src/pages/explore.featured.vue index abb816a956..3158b384d2 100644 --- a/packages/frontend/src/pages/explore.featured.vue +++ b/packages/frontend/src/pages/explore.featured.vue @@ -5,9 +5,14 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <div class="_spacer" style="--MI_SPACER-w: 800px;"> - <MkTab v-model="tab" style="margin-bottom: var(--MI-margin);"> - <option value="notes">{{ i18n.ts.notes }}</option> - <option value="polls">{{ i18n.ts.poll }}</option> + <MkTab + v-model="tab" + :tabs="[ + { key: 'notes', label: i18n.ts.notes }, + { key: 'polls', label: i18n.ts.poll }, + ]" + style="margin-bottom: var(--MI-margin);" + > </MkTab> <MkNotesTimeline v-if="tab === 'notes'" :paginator="paginatorForNotes"/> <MkNotesTimeline v-else-if="tab === 'polls'" :paginator="paginatorForPolls"/> @@ -33,5 +38,5 @@ const paginatorForPolls = markRaw(new Paginator('notes/polls/recommendation', { }, })); -const tab = ref('notes'); +const tab = ref<'notes' | 'polls'>('notes'); </script> diff --git a/packages/frontend/src/pages/explore.users.vue b/packages/frontend/src/pages/explore.users.vue index 08f9f5e582..4e3fb16b5a 100644 --- a/packages/frontend/src/pages/explore.users.vue +++ b/packages/frontend/src/pages/explore.users.vue @@ -5,9 +5,15 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <div class="_spacer" style="--MI_SPACER-w: 1200px;"> - <MkTab v-if="instance.federation !== 'none'" v-model="origin" style="margin-bottom: var(--MI-margin);"> - <option value="local">{{ i18n.ts.local }}</option> - <option value="remote">{{ i18n.ts.remote }}</option> + <MkTab + v-if="instance.federation !== 'none'" + v-model="origin" + :tabs="[ + { key: 'local', label: i18n.ts.local }, + { key: 'remote', label: i18n.ts.remote }, + ]" + style="margin-bottom: var(--MI-margin);" + > </MkTab> <div v-if="origin === 'local'"> <template v-if="tag == null"> @@ -77,7 +83,7 @@ const props = defineProps<{ tag?: string; }>(); -const origin = ref('local'); +const origin = ref<'local' | 'remote'>('local'); const tagsLocal = ref<Misskey.entities.Hashtag[]>([]); const tagsRemote = ref<Misskey.entities.Hashtag[]>([]); diff --git a/packages/frontend/src/pages/qr.read.vue b/packages/frontend/src/pages/qr.read.vue index e4c475196a..251dccd0f0 100644 --- a/packages/frontend/src/pages/qr.read.vue +++ b/packages/frontend/src/pages/qr.read.vue @@ -39,10 +39,15 @@ SPDX-License-Identifier: AGPL-3.0-only > <MkStickyContainer> <template #header> - <MkTab v-model="tab" :class="$style.tab"> - <option value="users">{{ i18n.ts.users }}</option> - <option value="notes">{{ i18n.ts.notes }}</option> - <option value="all">{{ i18n.ts.all }}</option> + <MkTab + v-model="tab" + :tabs="[ + { key: 'users', label: i18n.ts.users }, + { key: 'notes', label: i18n.ts.notes }, + { key: 'all', label: i18n.ts.all }, + ]" + :class="$style.tab" + > </MkTab> </template> <div v-if="tab === 'users'" :class="[$style.users, '_margin']" style="padding-bottom: var(--MI-margin);"> diff --git a/packages/frontend/src/pages/user/index.timeline.vue b/packages/frontend/src/pages/user/index.timeline.vue index 5e9e671252..6d74de14a0 100644 --- a/packages/frontend/src/pages/user/index.timeline.vue +++ b/packages/frontend/src/pages/user/index.timeline.vue @@ -6,11 +6,16 @@ SPDX-License-Identifier: AGPL-3.0-only <template> <MkStickyContainer> <template #header> - <MkTab v-model="tab" :class="$style.tab"> - <option value="featured">{{ i18n.ts.featured }}</option> - <option value="notes">{{ i18n.ts.notes }}</option> - <option value="all">{{ i18n.ts.all }}</option> - <option value="files">{{ i18n.ts.withFiles }}</option> + <MkTab + v-model="tab" + :tabs="[ + { key: 'featured', label: i18n.ts.featured }, + { key: 'notes', label: i18n.ts.notes }, + { key: 'all', label: i18n.ts.all }, + { key: 'files', label: i18n.ts.withFiles }, + ]" + :class="$style.tab" + > </MkTab> </template> <MkNotesTimeline v-if="tab === 'featured'" :noGap="true" :paginator="featuredPaginator" :pullToRefresh="false" :class="$style.tl"/> @@ -30,7 +35,7 @@ const props = defineProps<{ user: Misskey.entities.UserDetailed; }>(); -const tab = ref<string>('all'); +const tab = ref<'featured' | 'notes' | 'all' | 'files'>('all'); const featuredPaginator = markRaw(new Paginator('users/featured-notes', { limit: 10, diff --git a/packages/frontend/src/pages/user/notes.vue b/packages/frontend/src/pages/user/notes.vue index b5e600da92..1e6dba73bd 100644 --- a/packages/frontend/src/pages/user/notes.vue +++ b/packages/frontend/src/pages/user/notes.vue @@ -8,11 +8,16 @@ SPDX-License-Identifier: AGPL-3.0-only <div :class="$style.root"> <MkStickyContainer> <template #header> - <MkTab v-model="tab" :class="$style.tab"> - <option value="featured">{{ i18n.ts.featured }}</option> - <option value="notes">{{ i18n.ts.notes }}</option> - <option value="all">{{ i18n.ts.all }}</option> - <option value="files">{{ i18n.ts.withFiles }}</option> + <MkTab + v-model="tab" + :tabs="[ + { key: 'featured', label: i18n.ts.featured }, + { key: 'notes', label: i18n.ts.notes }, + { key: 'all', label: i18n.ts.all }, + { key: 'files', label: i18n.ts.withFiles }, + ]" + :class="$style.tab" + > </MkTab> </template> <MkNotesTimeline v-if="tab === 'featured'" :noGap="true" :paginator="featuredPaginator" :class="$style.tl"/> @@ -34,7 +39,7 @@ const props = defineProps<{ user: Misskey.entities.UserDetailed; }>(); -const tab = ref<string>('all'); +const tab = ref<'featured' | 'notes' | 'all' | 'files'>('all'); const featuredPaginator = markRaw(new Paginator('users/featured-notes', { limit: 10, |