refactor(account): improve joined time format

components/account/AccountHeader.vue

@@ -5,10 +5,11 @@ const { account } = defineProps<{
   account: Account
 }>()
 
-const createdAt = $computed(() => {
-  const date = new Date(account.createdAt)
-  return new Intl.DateTimeFormat('en-US', { month: 'long', day: 'numeric', year: 'numeric' }).format(date)
-})
+const createdAt = $(useFormattedDateTime(() => account.createdAt, {
+  month: 'long',
+  day: 'numeric',
+  year: 'numeric',
+}))
 
 const fields = $computed(() => {
   return [

composables/time.ts

@@ -1,7 +1,7 @@
-import type { MaybeRef, UseTimeAgoOptions } from '@vueuse/core'
+import type { MaybeComputedRef, UseTimeAgoOptions } from '@vueuse/core'
 
 export const useFormattedDateTime = (
-  value: MaybeRef<string | Date | undefined>,
+  value: MaybeComputedRef<string | Date | undefined>,
   options: Intl.DateTimeFormatOptions = { dateStyle: 'long', timeStyle: 'medium' },
 ) => {
   const formatter = Intl.DateTimeFormat(undefined, options)