From 6394705f1e68d961565c9b6b760925c4f6f42271 Mon Sep 17 00:00:00 2001
From: Lea <lea@janderedev.xyz>
Date: Thu, 10 Aug 2023 15:49:56 +0200
Subject: [PATCH] feat: link to user page from account page

---
 app/panel/inspect/account/[id]/page.tsx |  2 +-
 components/cards/UserCard.tsx           | 15 +++++++++++++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/app/panel/inspect/account/[id]/page.tsx b/app/panel/inspect/account/[id]/page.tsx
index c57e847..5c4e189 100644
--- a/app/panel/inspect/account/[id]/page.tsx
+++ b/app/panel/inspect/account/[id]/page.tsx
@@ -40,7 +40,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} />}
+      {user && <UserCard user={user} subtitle={account.email} withLink />}
       <AccountActions account={account} user={user as User} />
       <EmailClassificationCard email={account.email} />
 
diff --git a/components/cards/UserCard.tsx b/components/cards/UserCard.tsx
index 6154dca..fd0c76e 100644
--- a/components/cards/UserCard.tsx
+++ b/components/cards/UserCard.tsx
@@ -3,8 +3,10 @@ import { Card, CardDescription, CardHeader, CardTitle } from "../ui/card";
 import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
 import { Badge } from "../ui/badge";
 import { AUTUMN_URL } from "@/lib/constants";
+import Link from "next/link";
+import { ExternalLinkIcon } from "lucide-react";
 
-export function UserCard({ user, subtitle }: { user: User; subtitle: string }) {
+export function UserCard({ user, subtitle, withLink }: { user: User; subtitle: string, withLink?: boolean }) {
   return (
     <Card
       className="bg-no-repeat bg-right text-left"
@@ -28,7 +30,16 @@ export function UserCard({ user, subtitle }: { user: User; subtitle: string }) {
             </AvatarFallback>
           </Avatar>
           {user.bot && <Badge className="align-middle">Bot</Badge>}{" "}
-          {user.username}#{user.discriminator} {user.display_name}
+          <div className="flex gap-2">
+            {user.username}#{user.discriminator} {user.display_name}
+            {
+              withLink
+                ? <Link href={`/panel/inspect/user/${user._id}`}>
+                  <ExternalLinkIcon className="text-gray-500 hover:text-gray-700 transition-all" />
+                </Link>
+                : <></>
+            }
+            </div>
         </CardTitle>
         <CardDescription>{subtitle}</CardDescription>
       </CardHeader>