refactor: use separate component for birthday dates

Resolves: FoundKeyGang/FoundKey#90
This commit is contained in:
Norm 2022-08-28 14:49:22 -04:00
parent af8de58c84
commit b66ae3847b
Signed by untrusted user: norm
GPG key ID: 7123E30E441E80DE
23 changed files with 41 additions and 1 deletions

View file

@ -254,6 +254,7 @@ remoteUserCaution: "هذه المعلومات قد لا تكون مكتملة ب
activity: "النشاط"
images: "الصور"
birthday: "تاريخ الميلاد"
yearsOld: "{age} سنة"
registeredDate: "انضم في"
location: "الموقع الجغرافي"
theme: "المظهر"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "এই ব্যাবহারকারী রিমোট
activity: "কার্যকলাপ"
images: "ছবি"
birthday: "জন্মদিন"
yearsOld: "{age} বছর"
registeredDate: "যোগদানের তারিখ"
location: "অবস্থান"
theme: "থিম"

View file

@ -241,6 +241,7 @@ remoteUserCaution: "Tyto informace nemusí být aktuální jelikož uživatel je
activity: "Aktivita"
images: "Obrázky"
birthday: "Datum narození"
yearsOld: "{age} let"
registeredDate: "Datum registrace"
location: "Lokace"
theme: "Vzhled"

View file

@ -259,6 +259,7 @@ remoteUserCaution: "Diese Informationen sind möglicherweise unvollständig, da
activity: "Aktivität"
images: "Bilder"
birthday: "Geburtstag"
yearsOld: "{age} Jahre alt"
registeredDate: "Registrationsdatum"
location: "Ort"
theme: "Farbschema"

View file

@ -259,6 +259,7 @@ remoteUserCaution: "As this user is from a remote instance, the shown informatio
activity: "Activity"
images: "Images"
birthday: "Birthday"
yearsOld: "{age} years old"
registeredDate: "Joined on"
location: "Location"
theme: "Themes"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Para el usuario remoto, la información está incompleta"
activity: "Actividad"
images: "Imágenes"
birthday: "Fecha de nacimiento"
yearsOld: "{age} años"
registeredDate: "Fecha de registro"
location: "Lugar"
theme: "Tema"

View file

@ -256,6 +256,7 @@ remoteUserCaution: "Les informations de ce compte risqueraient dêtre incompl
activity: "Activité"
images: "Images"
birthday: "Date de naissance"
yearsOld: "{age} ans"
registeredDate: "Inscrit le"
location: "Localisation"
theme: "Thème"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Informasi ini mungkin tidak mutakhir, karena pengguna ini be
activity: "Aktivitas"
images: "Gambar"
birthday: "Tanggal lahir"
yearsOld: "{age} tahun"
registeredDate: "Bergabung pada"
location: "Lokasi"
theme: "Tema"

View file

@ -254,6 +254,7 @@ remoteUserCaution: "Può darsi che le informazioni siano incomplete perché ques
activity: "Attività"
images: "Immagini"
birthday: "Compleanno"
yearsOld: "{age}Anni"
registeredDate: "Iscrizione a.."
location: "Posizione"
theme: "Tema"

View file

@ -259,6 +259,7 @@ remoteUserCaution: "リモートユーザーのため、情報が不完全です
activity: "アクティビティ"
images: "画像"
birthday: "誕生日"
yearsOld: "{age}歳"
registeredDate: "登録日"
location: "場所"
theme: "テーマ"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "リモートユーザーやから、足りひん情報ある
activity: "アクティビティ"
images: "画像"
birthday: "生まれた日"
yearsOld: "{age}歳"
registeredDate: "始めた日"
location: "場所"
theme: "テーマ"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "리모트 유저이기 때문에, 정보가 정확하지 않
activity: "활동"
images: "이미지"
birthday: "생일"
yearsOld: "{age}세"
registeredDate: "등록일"
location: "장소"
theme: "테마"

View file

@ -244,6 +244,7 @@ remoteUserCaution: "Aangezien deze gebruiker van een externe server afkomstig is
activity: "Activiteit"
images: "Afbeeldingen"
birthday: "Geboortedatum"
yearsOld: "{age} jaar"
registeredDate: "Inschrijvingsdatum"
location: "Locatie"
theme: "Thema's"

View file

@ -253,6 +253,7 @@ remoteUserCaution: "Te informacje mogą nie być aktualne, ponieważ użytkownik
activity: "Aktywność"
images: "Zdjęcia"
birthday: "Data urodzenia"
yearsOld: "{age} lat"
registeredDate: "Zarejestrowano"
location: "Lokalizacja"
theme: "Motywy"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Deoarece acest utilizator este dintr-o instanță externă,
activity: "Activitate"
images: "Imagini"
birthday: "Zi de naștere"
yearsOld: "{age} ani"
registeredDate: "Data înregistrării"
location: "Locație"
theme: "Teme"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Это пользователь с другого сайта
activity: "Активность"
images: "Изображения"
birthday: "День рождения"
yearsOld: "Возраст: {age}"
registeredDate: "Дата регистрации"
location: "Местоположение"
theme: "Тема"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Tieto informácie nemusia byť aktuálne, keďže používat
activity: "Aktivita"
images: "Obrázky"
birthday: "Dátum narodenia"
yearsOld: "{age} rokov"
registeredDate: "Dátum registrácie"
location: "Lokalita"
theme: "Téma"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Інформація може бути неповною, о
activity: "Активність"
images: "Зображення"
birthday: "День народження"
yearsOld: "{age} років"
registeredDate: "Приєднався(лась)"
location: "Локація"
theme: "Тема"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "Vì người dùng này ở máy chủ khác, thông tin hi
activity: "Hoạt động"
images: "Hình ảnh"
birthday: "Sinh nhật"
yearsOld: "{age} tuổi"
registeredDate: "Tham gia"
location: "Đến từ"
theme: "Chủ đề"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "由于此用户来自其它实例,显示的信息可能不
activity: "活动"
images: "图片"
birthday: "生日"
yearsOld: "{age}岁"
registeredDate: "注册于"
location: "位置"
theme: "主题"

View file

@ -258,6 +258,7 @@ remoteUserCaution: "由於該使用者來自遠端實例,因此資訊可能非
activity: "動態"
images: "圖片"
birthday: "生日"
yearsOld: "{age}歲"
registeredDate: "註冊日期"
location: "位置"
theme: "外觀主題"

View file

@ -0,0 +1,18 @@
<template>
<MkTime format="date" mode="absolute" :time="birthday" :utc="true"/> ({{ $t('yearsOld', { age }) }})
</template>
<script lang="ts" setup>
import MkTime from '@/components/global/time.vue';
const props = defineProps<{
birthday: Date | string;
}>();
const age = $computed(() => {
const now = new Date();
const birthday = (typeof props.birthday === 'string') ? new Date(props.birthday) : props.birthday;
return Math.floor((now.getTime() - birthday.getTime()) / 1000 / 31536000);
});
</script>

View file

@ -51,7 +51,7 @@
</dl>
<dl v-if="user.birthday" class="field">
<dt class="name"><i class="fas fa-birthday-cake fa-fw"></i> {{ i18n.ts.birthday }}</dt>
<dd class="value"><MkTime format="date" mode="detail" :time="user.birthday" :utc="true"/></dd>
<dd class="value"><MkBirthdayDate :birthday="user.birthday"/></dd>
</dl>
<dl class="field">
<dt class="name"><i class="fas fa-calendar-alt fa-fw"></i> {{ i18n.ts.registeredDate }}</dt>
@ -112,6 +112,7 @@ import { defineAsyncComponent, onMounted, onUnmounted } from 'vue';
import * as misskey from 'foundkey-js';
import XUserTimeline from './index.timeline.vue';
import XNote from '@/components/note.vue';
import MkBirthdayDate from '@/components/birthday-date.vue';
import MkFollowButton from '@/components/follow-button.vue';
import MkRemoteCaution from '@/components/remote-caution.vue';
import MkInfo from '@/components/ui/info.vue';