chore: clean up public assets and remove bun.lock file

app/api/upload/route.ts

@@ -1,6 +1,4 @@
 import { NextResponse } from "next/server";
-import { writeFile, mkdir } from "fs/promises";
-import path from "path";
 import { getServerSession } from "next-auth";
 import { authOptions } from "@/app/api/auth/[...nextauth]/route";
 

app/page.tsx

@@ -1,10 +1,8 @@
 import { config } from "@/lib/config";
-import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardHeader } from "@/components/ui/card";
+import { Card, CardHeader } from "@/components/ui/card";
 import Image from "next/image";
-import Link from "next/link";
-import ShaderBackground from "@/components/ShaderBackground";
-import { getFollowerCounts, getCountForLink, formatCount } from "@/lib/followers";
+import { getFollowerCounts } from "@/lib/followers";
+import { LinkCard } from "@/components/LinkCard";
 
 export default async function Home() {
   const counts = await getFollowerCounts();
@@ -55,55 +53,7 @@ export default async function Home() {
           </div>
         </CardHeader>
 
-        <CardContent>
-          <nav aria-label="ลิ้งค์โซเชียลมีเดีย" className="flex flex-col gap-3">
-            {config.links.map((item, index) => {
-              const isStringIcon = typeof item.icon === "string";
-              const IconComponent = !isStringIcon ? item.icon : null;
-
-              const count = getCountForLink(item.name, counts);
-
-              return (
-                <Button
-                  key={index}
-                  variant="outline"
-                  className="w-full h-auto p-4 group md:bg-muted bg-black/40 "
-                  asChild
-                >
-                  <Link href={item.link} target="_blank" rel="noopener noreferrer" className="w-full">
-                    <div className="flex items-center justify-between w-full">
-                      <div className="flex items-center gap-4">
-                        <div className="shrink-0 w-8 h-8 flex items-center justify-center">
-                          {isStringIcon ? (
-                            <Image
-                              src={item.icon as string}
-                              alt={`${item.name} icon`}
-                              width={24}
-                              height={24}
-                              className="object-contain"
-                            />
-                          ) : (
-                            IconComponent && <IconComponent className="w-6 h-6 text-zinc-300" />
-                          )}
-                        </div>
-                        <div className="flex flex-col items-start text-left">
-                          <span className="font-semibold text-zinc-100">{item.name}</span>
-                          {item.desc && <span className="text-xs text-zinc-400">{item.desc}</span>}
-                        </div>
-                      </div>
-                      {count !== null && (
-                        <span className="text-xs font-medium shrink-0">
-                          {formatCount(count.count)} 
-                          <span className="text-zinc-400"> {count.label}</span>
-                        </span>
-                      )}
-                    </div>
-                  </Link>
-                </Button>
-              );
-            })}
-          </nav>
-        </CardContent>
+        <LinkCard counts={counts} />
       </Card>
     </main>
   );