i18n: doing more

This commit is contained in:
Anthony Fu 2022-11-29 15:18:28 +08:00
parent 00ae9d0b6c
commit ea73107c23
9 changed files with 82 additions and 51 deletions

View file

@ -52,24 +52,24 @@ const toggleBlockDomain = async () => {
<template v-if="currentUser">
<template v-if="!isSelf">
<CommonDropdownItem icon="i-ri:at-line" @click="mentionUser(account)">
{{ $t('menu.mention_account', [account.acct]) }}
{{ $t('menu.mention_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<CommonDropdownItem icon="i-ri:message-3-line" @click="directMessageUser(account)">
{{ $t('menu.direct_message_account', [account.acct]) }}
{{ $t('menu.direct_message_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<CommonDropdownItem v-if="!relationship?.muting" icon="i-ri:volume-up-fill" @click="toggleMute">
{{ $t('menu.mute_account', [account.acct]) }}
{{ $t('menu.mute_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<CommonDropdownItem v-else icon="i-ri:volume-mute-line" @click="toggleMute">
{{ $t('menu.unmute_account', [account.acct]) }}
{{ $t('menu.unmute_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<CommonDropdownItem v-if="!relationship?.blocking" icon="i-ri:forbid-2-line" @click="toggleBlockUser">
{{ $t('menu.block_account', [account.acct]) }}
{{ $t('menu.block_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<CommonDropdownItem v-else icon="i-ri:checkbox-circle-line" @click="toggleBlockUser">
{{ $t('menu.unblock_account', [account.acct]) }}
{{ $t('menu.unblock_account', [`@${account.acct}`]) }}
</CommonDropdownItem>
<template v-if="getServerName(account) !== currentServer">

View file

@ -1,12 +1,21 @@
<script setup lang="ts">
defineProps<{
options: string[]
const { options } = defineProps<{
options: string[] | { name: string; display: string }[]
}>()
const { modelValue } = defineModel<{
modelValue: string
}>()
const tabs = computed(() => {
return options.map((option) => {
if (typeof option === 'string')
return { name: option, display: option }
else
return option
})
})
function toValidName(otpion: string) {
return otpion.toLowerCase().replace(/[^a-zA-Z0-9]/g, '-')
}
@ -14,25 +23,25 @@ function toValidName(otpion: string) {
<template>
<div flex w-full items-center lg:text-lg>
<template v-for="option in options" :key="option">
<template v-for="option in tabs" :key="option">
<input
:id="`tab-${toValidName(option)}`"
:checked="modelValue === option"
:id="`tab-${toValidName(option.name)}`"
:checked="modelValue === option.name"
:value="option"
type="radio"
name="tabs"
display="none"
@change="modelValue = option"
@change="modelValue = option.name"
><label
flex flex-auto cursor-pointer px3 m1 rounded transition-all
:for="`tab-${toValidName(option)}`"
:for="`tab-${toValidName(option.name)}`"
tabindex="1"
hover:bg-active transition-100
@keypress.enter="modelValue = option"
@keypress.enter="modelValue = option.name"
><span
mxa px4 py3 text-center
:class="modelValue === option ? 'font-bold border-b-3 border-primary' : 'op50 hover:op50'"
>{{ option }}</span>
:class="modelValue === option.name ? 'font-bold border-b-3 border-primary' : 'op50 hover:op50'"
>{{ option.display }}</span>
</label>
</template>
</div>

View file

@ -71,7 +71,7 @@ const teams: Team[] = [
</p>
<button btn-solid mxa @click="emit('close')">
Enter App
{{ $t('action.enter_app') }}
</button>
</div>
</template>

View file

@ -14,6 +14,6 @@
</template>
</VDropdown>
<button v-else btn-solid text-sm px-2 py-1 text-center @click="openSigninDialog()">
Sign in
{{ $t('action.sign_in') }}
</button>
</template>

View file

@ -15,7 +15,7 @@ const virtualScroller = $(computedEager(() => useFeatureFlags().experimentalVirt
<CommonPaginator v-bind="{ paginator, stream }" :virtual-scroller="virtualScroller">
<template #updater="{ number, update }">
<button py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="update">
Show {{ number }} new items
{{ $t('timeline.show_new_items', [number]) }}
</button>
</template>
<template #default="{ item, active }">

View file

@ -24,9 +24,8 @@
"notifications": "Mitteilungen",
"profile": "Profil"
},
"timeline": "Timeline",
"title": {
"federated_timeline": "@:nav_side.federated @:timeline",
"local_timeline": "@:nav_side.local @:timeline"
"federated_timeline": "@:nav_side.federated @:timeline.name",
"local_timeline": "@:nav_side.local @:timeline.name"
}
}

View file

@ -11,22 +11,24 @@
},
"action": {
"compose": "Compose",
"enter_app": "Enter App",
"publish": "Publish!",
"save_changes": "Save changes"
"save_changes": "Save changes",
"sign_in": "Sign in"
},
"feature_flag": {
"virtual_scroll": "Virtual Scrolling"
},
"menu": {
"block_account": "Block @{0}",
"block_account": "Block {0}",
"block_domain": "Block domain {0}",
"direct_message_account": "Direct message @{0}",
"mention_account": "Mention @{0}",
"mute_account": "Mute @{0}",
"direct_message_account": "Direct message {0}",
"mention_account": "Mention {0}",
"mute_account": "Mute {0}",
"open_in_original_site": "Open in original site",
"unblock_account": "Unblock @{0}",
"unblock_account": "Unblock {0}",
"unblock_domain": "Unblock domain {0}",
"unmute_account": "Unmute @{0}"
"unmute_account": "Unmute {0}"
},
"nav_footer": {
"select_feature_flags": "Toggle Feature Flags",
@ -49,10 +51,18 @@
"editing": "Editing",
"uploading": "Uploading..."
},
"timeline": "Timeline",
"tab": {
"media": "Media",
"posts": "Posts",
"posts_with_replies": "Posts & Replies"
},
"timeline": {
"name": "Timeline",
"show_new_items": "Show {0} new items"
},
"title": {
"federated_timeline": "@:nav_side.federated @:timeline",
"local_timeline": "@:nav_side.local @:timeline"
"federated_timeline": "@:nav_side.federated @:timeline.name",
"local_timeline": "@:nav_side.local @:timeline.name"
},
"tooltip": {
"add_content_warning": "Add content warning",

View file

@ -24,9 +24,16 @@
"notifications": "通知",
"profile": "个人资料"
},
"timeline": "时间轴",
"tab": {
"media": "媒体",
"posts": "贴文",
"posts_with_replies": "帖文与留言"
},
"timeline": {
"name": "时间轴"
},
"title": {
"federated_timeline": "@:nav_side.federated@:timeline",
"local_timeline": "@:nav_side.local@:timeline"
"federated_timeline": "@:nav_side.federated@:timeline.name",
"local_timeline": "@:nav_side.local@:timeline.name"
}
}

View file

@ -3,32 +3,38 @@ const params = useRoute().params
const accountName = $(computedEager(() => params.account as string))
const account = await fetchAccountByName(accountName)
const tabNames = ['Posts', 'Posts & replies', 'Media'] as const
// Don't use local storage because it is better to default to Posts every time you visit a user's profile.
const tab = $ref('Posts')
const { t } = useI18n()
const paginatorPosts = useMasto().accounts.getStatusesIterable(account.id, { excludeReplies: true })
const paginatorPostsWithReply = useMasto().accounts.getStatusesIterable(account.id, { excludeReplies: false })
const paginatorMedia = useMasto().accounts.getStatusesIterable(account.id, { onlyMedia: true, excludeReplies: false })
const paginator = $computed(() => {
switch (tab) {
case 'Posts & replies':
return paginatorPostsWithReply
const tabs = $computed(() => [
{
name: 'posts',
display: t('tab.posts'),
paginator: paginatorPosts,
},
{
name: 'relies',
display: t('tab.posts_with_replies'),
paginator: paginatorPostsWithReply,
},
{
name: 'media',
display: t('tab.media'),
paginator: paginatorMedia,
},
] as const)
case 'Media':
return paginatorMedia
default:
return paginatorPosts
}
})
// Don't use local storage because it is better to default to Posts every time you visit a user's profile.
const tab = $ref(tabs[0].name)
const paginator = $computed(() => tabs.find(t => t.name === tab)!.paginator)
</script>
<template>
<div>
<CommonTabs v-model="tab" :options="tabNames" />
<CommonTabs v-model="tab" :options="tabs" />
<KeepAlive>
<TimelinePaginator :key="tab" :paginator="paginator" />
</KeepAlive>