+ ))}
+
+
+
+
+
+ Daily journal
+
+ One entry per day to reflect and help your pet grow.
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/app/(app)/daily/quiz/page.tsx b/app/(app)/daily/quiz/page.tsx
new file mode 100644
index 0000000..b39be03
--- /dev/null
+++ b/app/(app)/daily/quiz/page.tsx
@@ -0,0 +1,56 @@
+import { AppShell } from "@/components/layout/app-shell";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardDescription,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+
+const quizQuestion = {
+ prompt: "What is one small win you can celebrate today?",
+ options: [
+ "I showed up for myself",
+ "I rested when I needed to",
+ "I reached out to someone",
+ "I kept a promise to myself",
+ ],
+};
+
+export default function DailyQuizPage() {
+ return (
+
+
+
+ Today's prompt
+ Not completed
+
+
+
+
+ {quizQuestion.prompt}
+
+ Pick the answer that fits best. You can only submit once per day.
+
+
+
+ {quizQuestion.options.map((option) => (
+
+ ))}
+
+
+
+
+ );
+}
diff --git a/app/(app)/layout.tsx b/app/(app)/layout.tsx
new file mode 100644
index 0000000..0c936cc
--- /dev/null
+++ b/app/(app)/layout.tsx
@@ -0,0 +1,15 @@
+import { Suspense } from "react";
+
+import { AppAuthGate } from "@/components/layout/app-auth-gate";
+
+export default function AppLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+ }>
+ {children}
+
+ );
+}
diff --git a/app/(app)/profile/page.tsx b/app/(app)/profile/page.tsx
new file mode 100644
index 0000000..ec7fba2
--- /dev/null
+++ b/app/(app)/profile/page.tsx
@@ -0,0 +1,72 @@
+import { Suspense } from "react";
+
+import { AppShell } from "@/components/layout/app-shell";
+import { LogoutButton } from "@/components/logout-button";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardDescription,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { getSessionUser } from "@/lib/auth-helpers";
+
+async function ProfileContent() {
+ const user = await getSessionUser();
+
+ return (
+
+
+
+ Account
+ Your sign-in details and session.
+
+
+
+
+
+
+
+ Onboarding
+ Complete
+
+
+
+
+
+
+
+ Preferences
+
+ Notification and reminder settings will live here.
+
+
+
+
+
+
+
+
+ );
+}
+
+export default function ProfilePage() {
+ return (
+
+ Loading profile...}>
+
+
+
+ );
+}
diff --git a/app/(app)/shop/page.tsx b/app/(app)/shop/page.tsx
new file mode 100644
index 0000000..5a16088
--- /dev/null
+++ b/app/(app)/shop/page.tsx
@@ -0,0 +1,66 @@
+import { AppShell } from "@/components/layout/app-shell";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardDescription,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+
+const shopItems = [
+ {
+ id: "hat",
+ name: "Pixel cap",
+ price: 50,
+ description: "A cozy cap for your habit pet.",
+ },
+ {
+ id: "bed",
+ name: "Cloud bed",
+ price: 120,
+ description: "Boost recovery after tough days.",
+ },
+ {
+ id: "snack",
+ name: "Berry snack",
+ price: 25,
+ description: "A small treat for good streaks.",
+ },
+];
+
+export default function ShopPage() {
+ return (
+
+
+ Your balance
+ 120 points
+
+
+
+ {shopItems.map((item) => (
+
+
+
+
+ {item.name}
+ {item.description}
+
+ {item.price} pts
+
+
+
+
+
+
+ ))}
+
+
+ );
+}
diff --git a/app/auth/confirm/route.ts b/app/auth/confirm/route.ts
index b1b1086..22c5fa4 100644
--- a/app/auth/confirm/route.ts
+++ b/app/auth/confirm/route.ts
@@ -1,4 +1,5 @@
import { createClient } from "@/lib/supabase/server";
+import { routes } from "@/lib/routes";
import { type EmailOtpType } from "@supabase/supabase-js";
import { redirect } from "next/navigation";
import { type NextRequest } from "next/server";
@@ -7,7 +8,7 @@ export async function GET(request: NextRequest) {
const { searchParams } = new URL(request.url);
const token_hash = searchParams.get("token_hash");
const type = searchParams.get("type") as EmailOtpType | null;
- const next = searchParams.get("next") ?? "/";
+ const next = searchParams.get("next") ?? routes.onboardingQuiz;
if (token_hash && type) {
const supabase = await createClient();
diff --git a/app/layout.tsx b/app/layout.tsx
index 4c803d6..a77eeff 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -10,7 +10,7 @@ const defaultUrl = process.env.VERCEL_URL
export const metadata: Metadata = {
metadataBase: new URL(defaultUrl),
title: "Habit Pet",
- description: "Hackathon bootstrap for a Next.js and Supabase habit pet app.",
+ description: "Build habits, care for your pixel pet, and track wellness every day.",
};
const geistSans = Geist({
diff --git a/app/onboarding/layout.tsx b/app/onboarding/layout.tsx
new file mode 100644
index 0000000..de3c223
--- /dev/null
+++ b/app/onboarding/layout.tsx
@@ -0,0 +1,15 @@
+import { Suspense } from "react";
+
+import { OnboardingAuthGate } from "@/components/layout/onboarding-auth-gate";
+
+export default function OnboardingLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+ }>
+ {children}
+
+ );
+}
diff --git a/app/onboarding/quiz/page.tsx b/app/onboarding/quiz/page.tsx
new file mode 100644
index 0000000..ca0e20d
--- /dev/null
+++ b/app/onboarding/quiz/page.tsx
@@ -0,0 +1,148 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+import { PixelAvatar } from "@/components/avatar/pixel-avatar";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardDescription,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+import { Label } from "@/components/ui/label";
+import { createClient } from "@/lib/supabase/client";
+import { routes } from "@/lib/routes";
+
+const questions = [
+ {
+ id: "focus",
+ prompt: "What habit do you most want to build first?",
+ options: ["Sleep", "Movement", "Hydration", "Mindfulness"],
+ },
+ {
+ id: "pet-name",
+ prompt: "Pick a starter vibe for your pet.",
+ options: ["Calm", "Energetic", "Curious", "Cozy"],
+ },
+];
+
+export default function OnboardingQuizPage() {
+ const router = useRouter();
+ const [step, setStep] = useState(0);
+ const [answers, setAnswers] = useState>({});
+ const [isSubmitting, setIsSubmitting] = useState(false);
+ const [error, setError] = useState(null);
+
+ const currentQuestion = questions[step];
+ const isLastStep = step === questions.length - 1;
+
+ const handleSelect = (value: string) => {
+ setAnswers((current) => ({
+ ...current,
+ [currentQuestion.id]: value,
+ }));
+ };
+
+ const handleContinue = async () => {
+ if (!answers[currentQuestion.id]) {
+ return;
+ }
+
+ if (!isLastStep) {
+ setStep((current) => current + 1);
+ return;
+ }
+
+ setIsSubmitting(true);
+ setError(null);
+
+ try {
+ const supabase = createClient();
+ const { error: updateError } = await supabase.auth.updateUser({
+ data: {
+ onboarding_completed: true,
+ onboarding_answers: answers,
+ },
+ });
+
+ if (updateError) {
+ throw updateError;
+ }
+
+ router.push(routes.avatar);
+ router.refresh();
+ } catch (submitError) {
+ setError(
+ submitError instanceof Error
+ ? submitError.message
+ : "Could not save onboarding answers.",
+ );
+ } finally {
+ setIsSubmitting(false);
+ }
+ };
+
+ return (
+
+ );
+}
diff --git a/app/page.tsx b/app/page.tsx
index a1659d2..2f7d07d 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,58 +1,91 @@
-import { DeployButton } from "@/components/deploy-button";
-import { EnvVarWarning } from "@/components/env-var-warning";
-import { AuthButton } from "@/components/auth-button";
-import { Hero } from "@/components/hero";
-import { ThemeSwitcher } from "@/components/theme-switcher";
-import { ConnectSupabaseSteps } from "@/components/tutorial/connect-supabase-steps";
-import { SignUpUserSteps } from "@/components/tutorial/sign-up-user-steps";
-import { hasEnvVars } from "@/lib/utils";
import Link from "next/link";
import { Suspense } from "react";
+import { PixelAvatar } from "@/components/avatar/pixel-avatar";
+import { LoggedInRedirect } from "@/components/layout/logged-in-redirect";
+import { SiteFooter, SiteHeader } from "@/components/layout/site-header";
+import { Button } from "@/components/ui/button";
+import {
+ Card,
+ CardContent,
+ CardDescription,
+ CardHeader,
+ CardTitle,
+} from "@/components/ui/card";
+import { routes } from "@/lib/routes";
+
export default function Home() {
return (
-
-
-
-
-
-
-
Next steps
- {hasEnvVars ? : }
-
-
+
+
+
+
-
+
+
+
+
+
+
+ Calgary Hackathon MVP
+
+
+ Build habits. Care for your pixel pet.
+
+
+ Habit Pet turns daily check-ins, wellness sliders, and journaling
+ into a simple game. Keep streaks alive, take your once-per-day
+ quiz, and watch your pet change with you.
+
-
- This is a protected page that you can only see as an authenticated
- user
-
-
-
-
Your user details
-
-
-
-
-
-
-
-
Next steps
-
-
-
- );
+ redirect(routes.avatar);
}
diff --git a/components/auth-button.tsx b/components/auth-button.tsx
index 29f696c..f55cc89 100644
--- a/components/auth-button.tsx
+++ b/components/auth-button.tsx
@@ -1,28 +1,29 @@
import Link from "next/link";
+
import { Button } from "./ui/button";
import { createClient } from "@/lib/supabase/server";
import { LogoutButton } from "./logout-button";
+import { routes } from "@/lib/routes";
export async function AuthButton() {
const supabase = await createClient();
-
- // You can also use getUser() which will be slower.
const { data } = await supabase.auth.getClaims();
-
const user = data?.claims;
return user ? (
-