refactor(backend): better code quality, fix timeout issue, fix website eat port 3000, fix nginx wrong point, better docker compose file, moving some file and change some import, update package dependency etc.

components/LinkCard.tsx

@@ -1,23 +1,33 @@
 "use client";
 
 import { useState } from "react";
+import type { ComponentType, SVGProps } from "react";
 import { Button } from "@/components/ui/button";
 import { CardContent } from "@/components/ui/card";
 import Link from "next/link";
 import { ArrowLeft, ArrowRight } from "lucide-react";
-import { config, config_p2 } from "@/lib/config";
-import { getCountForLink, formatCount, FollowerCounts } from "@/lib/followers";
+import { LinkConfig, type IconName } from "@/lib/config";
+import { getCountForLink, formatCount, FollowerCounts } from "@/lib/followers/utils";
+import { RobloxIcon, DiscordIcon, TiktokIcon, YoutubeIcon, FormIcon } from "@/lib/icons";
 
-export function LinkCard({ counts }: { counts: FollowerCounts }) {
+const iconMap: Record<IconName, ComponentType<SVGProps<SVGSVGElement>>> = {
+  roblox: RobloxIcon,
+  discord: DiscordIcon,
+  tiktok: TiktokIcon,
+  youtube: YoutubeIcon,
+  form: FormIcon,
+};
+
+export function LinkCard({ counts, links1, links2 }: { counts: FollowerCounts, links1: LinkConfig[], links2: LinkConfig[] }) {
   const [isPage2, setIsPage2] = useState(false);
-  const currentConfig = isPage2 ? config_p2 : config;
+  const currentLinks = isPage2 ? links2 : links1;
 
   return (
     <CardContent>
       <div key={isPage2 ? "p2" : "p1"} className="animate-in fade-in slide-in-from-bottom-2 duration-200">
         <nav aria-label="ลิ้งค์โซเชียลมีเดีย" className="flex flex-col gap-3">
-          {currentConfig.links.map((item, index) => {
-            const IconComponent = item.icon;
+          {currentLinks.map((item, index) => {
+            const IconComponent = iconMap[item.icon];
 
             const count = getCountForLink(item.name, counts);