Moved items to server

src/app/(stats)/player/[ign]/_components/GenericProgress.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import { cn } from "@/lib/utils"
 import { useEffect, useState } from "react"
 import { Tooltip } from "react-tooltip"

src/app/(stats)/player/[ign]/_components/Sidebar.tsx

@@ -1,3 +1,4 @@
+import { Button } from "@/components/ui/button"
 import { Card, CardContent } from "@/components/ui/card"
 import { Separator } from "@/components/ui/separator"
 import { getColor } from "@/lib/colors"
@@ -143,6 +144,16 @@ export default function Sidebar({ level, ign, player, guild, rank, specialRank,
         )
     }
 
+    function SkyblockButton() {
+        return (
+            <Button asChild variant="outline">
+                <Link href={`https://sky.shiiyu.moe/stats/${player.displayname}`}>
+                    View SkyBlock Stats
+                </Link>
+            </Button>
+        )
+    }
+
     function GuildInfo() {
         if (!guild) return null
 
@@ -221,6 +232,8 @@ export default function Sidebar({ level, ign, player, guild, rank, specialRank,
                 <Separator className="my-4" />
                 <Logins />
                 <Separator className="my-4" />
+                <SkyblockButton />
+                <Separator className="my-4" />
                 <GuildInfo />
                 <SoicalLinks />
             </CardContent>

src/app/(stats)/player/[ign]/_components/SocialIcons.tsx

@@ -1,12 +1,9 @@
-"use client"
-
 import { Button } from "@/components/ui/button"
-import { CopyIcon } from "lucide-react"
 import Link from "next/link"
 import { CgWebsite } from "react-icons/cg"
-import { FaDiscord, FaTwitch, FaYoutube } from "react-icons/fa"
+import { FaTwitch, FaYoutube } from "react-icons/fa"
 import { FiTwitter } from "react-icons/fi"
-import { toast } from "sonner"
+import { DiscordIcon } from "./client"
 
 export default function SocialIcons(
     { discord, twitch, youtube, twitter, hypixel }: {
@@ -36,37 +33,6 @@ export default function SocialIcons(
     )
 }
 
-function DiscordIcon({ username }: { username?: string }) {
-    if (!username) return null
-
-    function handleClick() {
-        toast(
-            <div className="flex gap-8">
-                <h1 className="text-2xl">{username}</h1>
-                <button
-                    onClick={() => {
-                        navigator.clipboard.writeText(username!)
-                        toast.dismiss("discord-username")
-                    }}
-                >
-                    <CopyIcon />
-                </button>
-            </div>,
-            {
-                position: "bottom-center",
-                id: "discord-username",
-                className: "flex justify-center items-center gap-4"
-            }
-        )
-    }
-
-    return (
-        <Button variant="ghost" className="transition-all hover:scale-125 hover:cursor-pointer" onClick={handleClick}>
-            <FaDiscord />
-        </Button>
-    )
-}
-
 function SocialIcon({ href, children }: { href?: string, children: React.ReactNode }) {
     if (!href) return null
 

src/app/(stats)/player/[ign]/_components/client.tsx

@@ -0,0 +1,37 @@
+"use client"
+
+import { Button } from "@/components/ui/button"
+import { CopyIcon } from "lucide-react"
+import { FaDiscord } from "react-icons/fa"
+import { toast } from "sonner"
+
+export function DiscordIcon({ username }: { username?: string }) {
+    if (!username) return null
+
+    function handleClick() {
+        toast(
+            <div className="flex gap-8">
+                <h1 className="text-2xl">{username}</h1>
+                <button
+                    onClick={() => {
+                        navigator.clipboard.writeText(username!)
+                        toast.dismiss("discord-username")
+                    }}
+                >
+                    <CopyIcon />
+                </button>
+            </div>,
+            {
+                position: "bottom-center",
+                id: "discord-username",
+                className: "flex justify-center items-center gap-4"
+            }
+        )
+    }
+
+    return (
+        <Button variant="ghost" className="transition-all hover:scale-125 hover:cursor-pointer" onClick={handleClick}>
+            <FaDiscord />
+        </Button>
+    )
+}

src/app/(stats)/player/[ign]/_stats/bedwars/bedwars.tsx

@@ -1,5 +1,3 @@
-"use client"
-
 import { AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"
 import { Card, CardContent } from "@/components/ui/card"
 import { Separator } from "@/components/ui/separator"

src/app/(stats)/player/[ign]/_stats/skywars/skywars.tsx

@@ -1,5 +1,3 @@
-"use client"
-
 import { AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"
 import { Card, CardContent } from "@/components/ui/card"
 import { Separator } from "@/components/ui/separator"

src/components/ui/separator.tsx

@@ -1,5 +1,3 @@
-"use client"
-
 import * as SeparatorPrimitive from "@radix-ui/react-separator"
 import * as React from "react"
 

src/components/ui/table.tsx

@@ -1,5 +1,3 @@
-"use client"
-
 import * as React from "react"
 
 import { cn } from "@/lib/utils"