feat: show account/server/channel age

app/panel/inspect/account/[id]/page.tsx

@@ -22,9 +22,9 @@ import dayjs from "dayjs";
 import { notFound } from "next/navigation";
 import { User } from "revolt-api";
 import { decodeTime } from "ulid";
-
 import relativeTime from "dayjs/plugin/relativeTime";
 import SafetyNotesCard from "@/components/cards/SafetyNotesCard";
+
 dayjs.extend(relativeTime);
 
 export default async function User({
@@ -41,7 +41,7 @@ export default async function User({
   return (
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting Account</NavigationToolbar>
-      {user && <UserCard user={user} subtitle={account.email} withLink />}
+      {user && <UserCard user={user} subtitle={`${account.email} · Created ${dayjs(decodeTime(account._id)).fromNow()}`} withLink />}
       <AccountActions account={account} user={user as User} />
       <EmailClassificationCard email={account.email} />
       <SafetyNotesCard objectId={account._id} type="account" />

app/panel/inspect/channel/[id]/page.tsx

@@ -9,6 +9,11 @@ import { Separator } from "@/components/ui/separator";
 import { fetchChannelById, fetchServerById, fetchUsersById } from "@/lib/db";
 import Link from "next/link";
 import { notFound } from "next/navigation";
+import dayjs from "dayjs";
+import relativeTime from "dayjs/plugin/relativeTime";
+import { decodeTime } from "ulid";
+
+dayjs.extend(relativeTime);
 
 export default async function Message({ params }: { params: { id: string } }) {
   const channel = await fetchChannelById(params.id);
@@ -27,7 +32,7 @@ export default async function Message({ params }: { params: { id: string } }) {
   return (
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting Channel</NavigationToolbar>
-      <ChannelCard channel={channel!} subtitle="Channel" />
+      <ChannelCard channel={channel!} subtitle={`Channel · Created ${dayjs(decodeTime(channel._id)).fromNow()}`} />
 
       {server && (
         <Link href={`/panel/inspect/server/${server._id}`}>

app/panel/inspect/server/[id]/page.tsx

@@ -8,8 +8,13 @@ import { ServerActions } from "@/components/pages/inspector/ServerActions";
 import { Card, CardHeader } from "@/components/ui/card";
 import { Separator } from "@/components/ui/separator";
 import { fetchServerById, fetchUserById } from "@/lib/db";
+import dayjs from "dayjs";
 import Link from "next/link";
 import { notFound } from "next/navigation";
+import { decodeTime } from "ulid";
+import relativeTime from "dayjs/plugin/relativeTime";
+
+dayjs.extend(relativeTime);
 
 export default async function Server({ params }: { params: { id: string } }) {
   const server = await fetchServerById(params.id);
@@ -20,7 +25,7 @@ export default async function Server({ params }: { params: { id: string } }) {
   return (
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting Server</NavigationToolbar>
-      <ServerCard server={server} subtitle="Server" />
+      <ServerCard server={server} subtitle={`Server · Created ${dayjs(decodeTime(server._id)).fromNow()}`} />
       <ServerActions server={server} />
       <SafetyNotesCard objectId={server._id} type="server" />
       {server.description && (

app/panel/inspect/user/[id]/page.tsx

@@ -24,9 +24,14 @@ import {
   fetchUsersById,
   findDM,
 } from "@/lib/db";
+import dayjs from "dayjs";
 import Link from "next/link";
 import { notFound } from "next/navigation";
 import { Bot } from "revolt-api";
+import relativeTime from "dayjs/plugin/relativeTime";
+import { decodeTime } from "ulid";
+
+dayjs.extend(relativeTime);
 
 export default async function User({
   params,
@@ -75,7 +80,7 @@ export default async function User({
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting User</NavigationToolbar>
 
-      <UserCard user={user} subtitle={user.status?.text ?? "No status set"} />
+      <UserCard user={user} subtitle={`Joined ${dayjs(decodeTime(user._id)).fromNow()} · ${user.status?.text ?? "No status set"}`} />
       <UserActions user={user} bot={bot as Bot} />
       <SafetyNotesCard objectId={user._id} type="user" />