feat: show full created time in tooltip

components/status/StatusCard.vue

@@ -36,6 +36,7 @@ function go() {
   router.push(getStatusPath(status))
 }
 
+const createdAt = useFormattedDateTime(status.createdAt)
 const timeago = useTimeAgo(() => status.createdAt, {
   showSecond: true,
   messages: {
@@ -89,9 +90,11 @@ const timeago = useTimeAgo(() => status.createdAt, {
         <div flex>
           <StatusAccountDetails :account="status.account" />
           <div flex-auto />
-          <div text-sm op50 :title="status.createdAt">
-            {{ timeago }}
-          </div>
+          <CommonTooltip :content="createdAt">
+            <div text-sm op50 :title="status.createdAt">
+              {{ timeago }}
+            </div>
+          </CommonTooltip>
         </div>
         <StatusReplyingTo v-if="status.inReplyToAccountId" :status="status" pt1 />
         <div>

components/status/StatusDetails.vue

@@ -11,8 +11,7 @@ const status = $computed(() => {
   return props.status
 })
 
-const formatter = Intl.DateTimeFormat(undefined, { dateStyle: 'long' })
-const date = computed(() => formatter.format(new Date(status.createdAt)))
+const date = useFormattedDateTime(status.createdAt)
 </script>
 
 <template>

composables/time.ts

@@ -0,0 +1,9 @@
+import type { MaybeRef } from '@vueuse/core'
+
+export const useFormattedDateTime = (
+  value: MaybeRef<string | Date>,
+  options: Intl.DateTimeFormatOptions = { dateStyle: 'long', timeStyle: 'medium' },
+) => {
+  const formatter = Intl.DateTimeFormat(undefined, options)
+  return computed(() => formatter.format(new Date(resolveUnref(value))))
+}