From 8f63e6c3651e729c581994b7f0d7ba91b0399078 Mon Sep 17 00:00:00 2001
From: trafficlunar <hello@trafficlunar.net>
Date: Sat, 31 Jan 2026 13:39:43 +0000
Subject: [PATCH] feat: permanent discord button

---
 src/app/page.tsx             | 19 ++++++++++++++--
 src/components/countdown.tsx | 44 +++++++++++++++++-------------------
 2 files changed, 38 insertions(+), 25 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index ed195a3..6b76497 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,6 +1,7 @@
 import { Metadata } from "next";
 import { redirect } from "next/navigation";
 import { Suspense } from "react";
+import { Icon } from "@iconify/react";
 
 import { auth } from "@/lib/auth";
 import { prisma } from "@/lib/prisma";
@@ -36,7 +37,7 @@ export async function generateMetadata({ searchParams }: Props): Promise<Metadat
 
 export default async function Page({ searchParams }: Props) {
 	const session = await auth();
-	const { tags } = await searchParams;
+	const { page, tags } = await searchParams;
 
 	if (session?.user && !session.user.username) {
 		redirect("/create-username");
@@ -55,7 +56,21 @@ export default async function Page({ searchParams }: Props) {
 		<>
 			<h1 className="sr-only">{tags ? `Miis tagged with '${tags}' - TomodachiShare` : "TomodachiShare - index mii list"}</h1>
 
-			<Countdown />
+			{(!page || page === "1") && (
+				<div className="flex justify-center gap-2 mb-2">
+					<a
+						href="https://discord.gg/48cXBFKvWQ"
+						className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg px-4 py-2.5 flex justify-center items-center gap-4 w-fit"
+					>
+						<Icon icon="ic:baseline-discord" fontSize={48} className="text-indigo-400" />
+						<div>
+							<p className="text-xl font-bold">Join the Discord</p>
+							<p className="text-sm">Code: 48cXBFKvWQ</p>
+						</div>
+					</a>
+					<Countdown />
+				</div>
+			)}
 			<Suspense fallback={<Skeleton />}>
 				<MiiList searchParams={await searchParams} />
 			</Suspense>
diff --git a/src/components/countdown.tsx b/src/components/countdown.tsx
index 91c551c..a0a05c4 100644
--- a/src/components/countdown.tsx
+++ b/src/components/countdown.tsx
@@ -34,30 +34,28 @@ export default function Countdown() {
 	}, []);
 
 	return (
-		<div className="flex justify-center">
-			<div className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg p-4 mb-2 flex justify-center items-center gap-12 w-fit">
-				<div className="flex flex-col">
-					<h1 className="text-2xl font-bold">Living the Dream</h1>
-					<h2 className="text-right text-sm">releases in:</h2>
-				</div>
+		<div className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg px-4 py-2.5 flex justify-center items-center gap-8 w-fit">
+			<div className="flex flex-col">
+				<h1 className="text-xl font-bold">Living the Dream</h1>
+				<h2 className="text-right text-sm">releases in:</h2>
+			</div>
 
-				<div className="flex gap-4">
-					<div className="flex flex-col text-center">
-						<span className="text-2xl font-semibold">{days}</span>
-						<span className="text-xs">days</span>
-					</div>
-					<div className="flex flex-col text-center">
-						<span className="text-2xl font-semibold">{hours}</span>
-						<span className="text-xs">hours</span>
-					</div>
-					<div className="flex flex-col text-center">
-						<span className="text-2xl font-semibold">{minutes}</span>
-						<span className="text-xs">minutes</span>
-					</div>
-					<div className="flex flex-col text-center">
-						<span className="text-2xl font-semibold">{seconds}</span>
-						<span className="text-xs">seconds</span>
-					</div>
+			<div className="flex gap-4">
+				<div className="flex flex-col text-center">
+					<span className="text-2xl font-semibold">{days}</span>
+					<span className="text-xs">days</span>
+				</div>
+				<div className="flex flex-col text-center">
+					<span className="text-2xl font-semibold">{hours}</span>
+					<span className="text-xs">hours</span>
+				</div>
+				<div className="flex flex-col text-center">
+					<span className="text-2xl font-semibold">{minutes}</span>
+					<span className="text-xs">minutes</span>
+				</div>
+				<div className="flex flex-col text-center">
+					<span className="text-2xl font-semibold">{seconds}</span>
+					<span className="text-xs">seconds</span>
 				</div>
 			</div>
 		</div>