public games list functionality

client/src/components/home/PublicGames/JoinButton.tsx

@@ -0,0 +1,27 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useTransition } from "react";
+
+export default function JoinButton({ code }: { code: string }) {
+  const router = useRouter();
+  const [isLoading, startTransition] = useTransition();
+
+  function handleJoin() {
+    startTransition(() => {
+      router.push(`/game/${code}`);
+    });
+  }
+
+  return (
+    <button
+      className={
+        "btn btn-ghost btn-xs focus:opacity-100 lg:opacity-0 lg:group-hover:opacity-100" +
+        (isLoading ? " btn-disabled" : "")
+      }
+      onClick={handleJoin}
+    >
+      Join
+    </button>
+  );
+}