From 1cb5856f7cf6151327637de08fa29074aca18c2d Mon Sep 17 00:00:00 2001
From: Francis Dinh <normandy@biribiri.dev>
Date: Sun, 14 Aug 2022 23:59:50 -0400
Subject: [PATCH] Fix birthday time offset and date locale

The user's configred birthday is stored as UTC time, so use that for display as well.
This means the birthday won't be shown as a day behind or ahead depending on the user's browser timezone.

Also use the locale configured in the user's client settings in Misskey for date formatting.
---
 packages/client/src/components/global/time.vue | 10 +++++++---
 packages/client/src/pages/user/home.vue        |  2 +-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/components/global/time.vue b/packages/client/src/components/global/time.vue
index 529be1603..c4e904350 100644
--- a/packages/client/src/components/global/time.vue
+++ b/packages/client/src/components/global/time.vue
@@ -9,22 +9,26 @@
 <script lang="ts" setup>
 import { onUnmounted } from 'vue';
 import { i18n } from '@/i18n';
+import { lang } from '@/config';
 
 const props = withDefaults(defineProps<{
 	time: Date | string;
 	format?: 'both' | 'date' | 'time';
 	mode?: 'relative' | 'absolute' | 'detail';
+	utc?: boolean;
 }>(), {
 	format: 'both',
 	mode: 'relative',
+	utc: false,
 });
 
 const _time = typeof props.time === 'string' ? new Date(props.time) : props.time;
 const absolute = ((): string => {
+	const options = props.utc ? { timeZone: 'UTC' } : {};
 	switch (props.format) {
-		case 'date': return _time.toLocaleDateString();
-		case 'time': return _time.toLocaleTimeString();
-		default: return _time.toLocaleString();
+		case 'date': return _time.toLocaleDateString(lang ?? 'en-US', options);
+		case 'time': return _time.toLocaleTimeString(lang ?? 'en-US', options);
+		default: return _time.toLocaleString(lang ?? 'en-US', options);
 	}
 })();
 
diff --git a/packages/client/src/pages/user/home.vue b/packages/client/src/pages/user/home.vue
index c98ec19fc..4a2cce39c 100644
--- a/packages/client/src/pages/user/home.vue
+++ b/packages/client/src/pages/user/home.vue
@@ -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"/></dd>
+							<dd class="value"><MkTime format="date" mode="detail" :time="user.birthday" :utc="true"/></dd>
 						</dl>
 						<dl class="field">
 							<dt class="name"><i class="fas fa-calendar-alt fa-fw"></i> {{ i18n.ts.registeredDate }}</dt>