feat: flesh out data shown on inspector

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

@@ -1,8 +1,12 @@
 import { ChannelCard } from "@/components/cards/ChannelCard";
 import { JsonCard } from "@/components/cards/JsonCard";
 import { ServerCard } from "@/components/cards/ServerCard";
+import { UserCard } from "@/components/cards/UserCard";
 import { NavigationToolbar } from "@/components/common/NavigationToolbar";
-import { fetchChannelById, fetchServerById } from "@/lib/db";
+import { RecentMessages } from "@/components/inspector/RecentMessages";
+import { Separator } from "@/components/ui/separator";
+import { fetchChannelById, fetchServerById, fetchUsersById } from "@/lib/db";
+import Link from "next/link";
 import { notFound } from "next/navigation";
 
 export default async function Message({ params }: { params: { id: string } }) {
@@ -14,11 +18,40 @@ export default async function Message({ params }: { params: { id: string } }) {
       ? await fetchServerById(channel.server)
       : undefined;
 
+  const participants =
+    channel.channel_type === "DirectMessage" || channel.channel_type === "Group"
+      ? await fetchUsersById(channel.recipients)
+      : [];
+
   return (
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting Channel</NavigationToolbar>
       <ChannelCard channel={channel!} subtitle="Channel" />
-      {server && <ServerCard server={server} subtitle="Server" />}
+
+      {server && (
+        <Link href={`/panel/inspect/server/${server._id}`}>
+          <ServerCard server={server} subtitle="Server" />
+        </Link>
+      )}
+
+      {participants.length ? (
+        <>
+          <Separator />
+          {participants.map((user) => (
+            <Link key={user._id} href={`/panel/inspect/user/${user._id}`}>
+              <UserCard user={user} subtitle="Member" />
+            </Link>
+          ))}
+        </>
+      ) : undefined}
+
+      <Separator />
+      <RecentMessages
+        query={{ channel: channel._id }}
+        users={participants.length ? participants : true}
+      />
+
+      <Separator />
       <JsonCard obj={channel} />
     </div>
   );

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

@@ -1,17 +1,32 @@
 import { JsonCard } from "@/components/cards/JsonCard";
 import { ServerCard } from "@/components/cards/ServerCard";
+import { UserCard } from "@/components/cards/UserCard";
 import { NavigationToolbar } from "@/components/common/NavigationToolbar";
-import { fetchServerById } from "@/lib/db";
+import { RecentMessages } from "@/components/inspector/RecentMessages";
+import { Separator } from "@/components/ui/separator";
+import { fetchServerById, fetchUserById } from "@/lib/db";
+import Link from "next/link";
 import { notFound } from "next/navigation";
 
 export default async function Server({ params }: { params: { id: string } }) {
   const server = await fetchServerById(params.id);
   if (!server) return notFound();
 
+  const owner = await fetchUserById(server.owner);
+
   return (
     <div className="flex flex-col gap-2">
       <NavigationToolbar>Inspecting Server</NavigationToolbar>
       <ServerCard server={server} subtitle="Server" />
+
+      <Link href={`/panel/inspect/user/${owner!._id}`}>
+        <UserCard user={owner!} subtitle="Server Owner" />
+      </Link>
+
+      <Separator />
+      <RecentMessages query={{ channel: { $in: server.channels } }} users />
+
+      <Separator />
       <JsonCard obj={server} />
     </div>
   );

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

@@ -1,6 +1,7 @@
 import { JsonCard } from "@/components/cards/JsonCard";
 import { UserCard } from "@/components/cards/UserCard";
 import { NavigationToolbar } from "@/components/common/NavigationToolbar";
+import { RecentMessages } from "@/components/inspector/RecentMessages";
 import { RelevantModerationNotices } from "@/components/inspector/RelevantModerationNotices";
 import { RelevantObjects } from "@/components/inspector/RelevantObjects";
 import { RelevantReports } from "@/components/inspector/RelevantReports";
@@ -85,7 +86,16 @@ export default async function User({
       <NavigationToolbar>Inspecting User</NavigationToolbar>
 
       <UserCard user={user} subtitle={user.status?.text ?? "No status set"} />
-      <UserActions id={user._id} />
+      <UserActions
+        id={user._id}
+        counts={{
+          pending:
+            user.relations?.filter(
+              (x) => x.status === "Outgoing" || x.status === "Incoming"
+            ).length ?? 0,
+          all: user.relations?.length ?? 0,
+        }}
+      />
 
       {user.profile?.content && (
         <Card>
@@ -114,6 +124,9 @@ export default async function User({
       <Separator />
       <RelevantReports byUser={reportsByUser} forUser={reportsAgainstUser} />
 
+      <Separator />
+      <RecentMessages query={{ author: user._id }} />
+
       <Separator />
       <JsonCard obj={user} />
     </div>