chore: update imports in pages

apps/next-template/src/app/layout.tsx

@@ -1,4 +1,6 @@
 import "./styles.css";
+// import "@repo/ui/globals.css";
+import "@repo/ui/globals.css";
 
 export default function RootLayout({
 	children,

apps/next-template/src/app/page.tsx

@@ -1,6 +1,6 @@
 import { log } from "@repo/logger";
-import { Link } from "@repo/ui/link";
+import { Link } from "@repo/ui/link/index.js";
-import { CounterButton } from "@repo/ui/counter-button";
+import { CounterButton } from "@repo/ui/counter-button/index.js";
 
 export const metadata = {
 	title: "Store | Kitchen Sink",

apps/next-template/src/app/shadcn/page.tsx

@@ -0,0 +1,49 @@
+import { Button } from "@repo/ui/components/button.js";
+import {
+	Card,
+	CardContent,
+	CardHeader,
+	CardTitle,
+} from "@repo/ui/components/card.js";
+
+export default function HomePage() {
+	return (
+		<main className="flex flex-col items-center justify-center min-h-screen bg-gray-50">
+			<Card className="w-full max-w-md shadow-lg">
+				<CardHeader>
+					<CardTitle className="text-3xl font-bold text-center">
+						Welcome to the Next.js Homepage
+					</CardTitle>
+				</CardHeader>
+				<CardContent className="flex flex-col items-center gap-6">
+					<p className="text-gray-600 text-center">
+						This homepage uses{" "}
+						<span className="font-semibold">shadcn/ui</span>{" "}
+						components from{" "}
+						<span className="font-mono">@repo/ui</span>.
+					</p>
+					<div className="flex gap-4">
+						<Button asChild>
+							<a
+								href="https://nextjs.org/"
+								target="_blank"
+								rel="noopener noreferrer"
+							>
+								Learn Next.js
+							</a>
+						</Button>
+						<Button variant="outline" asChild>
+							<a
+								href="https://ui.shadcn.com/"
+								target="_blank"
+								rel="noopener noreferrer"
+							>
+								Explore shadcn/ui
+							</a>
+						</Button>
+					</div>
+				</CardContent>
+			</Card>
+		</main>
+	);
+}