Initial commit

src/app/account/page.tsx

@@ -0,0 +1,54 @@
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
+import React from 'react';
+import { getUser } from '@/auth';
+import { redirect } from 'next/navigation';
+import signOut from '@/lib/actions/signOut';
+import { Button } from '@/components/ui/button';
+import Link from 'next/link';
+import { ChevronLeft } from 'lucide-react';
+import { Label } from '@/components/ui/label';
+import { Input } from '@/components/ui/input';
+import SignOutForm from '@/components/form/signOutForm';
+import { URL_HOME, URL_SIGN_IN } from '@/lib/constants';
+
+export default async function AccountPage() {
+
+    const user = await getUser();
+
+    if (!user) {
+        redirect(URL_SIGN_IN);
+    }
+
+    return (
+        <div className="flex min-h-screen flex-col items-center justify-center relative">
+            <Button variant="ghost" size="icon" className="absolute top-4 left-4" asChild>
+                <Link href={URL_HOME}>
+                    <ChevronLeft/>
+                </Link>
+            </Button>
+            <Card className="w-full max-w-md">
+                <CardHeader>
+                    <CardTitle>Hey, {user?.username}!</CardTitle>
+                    <CardDescription>This is your account overview.</CardDescription>
+                </CardHeader>
+                <CardContent className="space-y-2">
+                    <div>
+                        <Label>ID</Label>
+                        <Input
+                            disabled
+                            value={user?.id}/>
+                    </div>
+                    <div>
+                        <Label>Username</Label>
+                        <Input
+                            disabled
+                            value={user?.username}/>
+                    </div>
+                </CardContent>
+                <CardFooter>
+                    <SignOutForm onSubmit={signOut}/>
+                </CardFooter>
+            </Card>
+        </div>
+    );
+}

src/app/auth/layout.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+
+export default function AuthLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    return (
+        <div className="flex min-h-screen items-center justify-center">
+            {children}
+        </div>
+    );
+}

src/app/auth/signin/page.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
+import SignInForm from '@/components/form/signInForm';
+import signIn from '@/lib/actions/signIn';
+import Link from 'next/link';
+import { URL_SIGN_UP } from '@/lib/constants';
+
+export default async function SignInPage() {
+    return (
+        <Card className="w-full max-w-md">
+            <CardHeader>
+                <CardTitle>Sign in</CardTitle>
+                <CardDescription>Sign into your existing account</CardDescription>
+            </CardHeader>
+            <CardContent>
+                <SignInForm onSubmit={signIn}/>
+            </CardContent>
+            <CardFooter>
+                <Link href={URL_SIGN_UP}>
+                    Don&apos;t have an account? Sign up
+                </Link>
+            </CardFooter>
+        </Card>
+    );
+}

src/app/auth/signup/page.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
+import signUp from '@/lib/actions/signUp';
+import SignUpForm from '@/components/form/signUpForm';
+import Link from 'next/link';
+import { URL_SIGN_IN } from '@/lib/constants';
+
+export default async function SignUpPage() {
+    return (
+        <Card className="w-full max-w-md">
+            <CardHeader>
+                <CardTitle>Sign up</CardTitle>
+                <CardDescription>Create a new account.</CardDescription>
+            </CardHeader>
+            <CardContent>
+                <SignUpForm onSubmit={signUp}/>
+            </CardContent>
+            <CardFooter>
+                <Link href={URL_SIGN_IN}>
+                    Already have an account? Sign in
+                </Link>
+            </CardFooter>
+        </Card>
+    );
+}

src/app/globals.css

@@ -0,0 +1,62 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+
+@layer base {
+    :root {
+        --background: 0 0% 100%;
+        --foreground: 20 14.3% 4.1%;
+        --card: 0 0% 100%;
+        --card-foreground: 20 14.3% 4.1%;
+        --popover: 0 0% 100%;
+        --popover-foreground: 20 14.3% 4.1%;
+        --primary: 24.6 95% 53.1%;
+        --primary-foreground: 60 9.1% 97.8%;
+        --secondary: 60 4.8% 95.9%;
+        --secondary-foreground: 24 9.8% 10%;
+        --muted: 60 4.8% 95.9%;
+        --muted-foreground: 25 5.3% 44.7%;
+        --accent: 60 4.8% 95.9%;
+        --accent-foreground: 24 9.8% 10%;
+        --destructive: 0 84.2% 60.2%;
+        --destructive-foreground: 60 9.1% 97.8%;
+        --border: 20 5.9% 90%;
+        --input: 20 5.9% 90%;
+        --ring: 24.6 95% 53.1%;
+        --radius: 0.5rem;
+    }
+
+    .dark {
+        --background: 20 14.3% 4.1%;
+        --foreground: 60 9.1% 97.8%;
+        --card: 20 14.3% 4.1%;
+        --card-foreground: 60 9.1% 97.8%;
+        --popover: 20 14.3% 4.1%;
+        --popover-foreground: 60 9.1% 97.8%;
+        --primary: 20.5 90.2% 48.2%;
+        --primary-foreground: 60 9.1% 97.8%;
+        --secondary: 12 6.5% 15.1%;
+        --secondary-foreground: 60 9.1% 97.8%;
+        --muted: 12 6.5% 15.1%;
+        --muted-foreground: 24 5.4% 63.9%;
+        --accent: 12 6.5% 15.1%;
+        --accent-foreground: 60 9.1% 97.8%;
+        --destructive: 0 72.2% 50.6%;
+        --destructive-foreground: 60 9.1% 97.8%;
+        --border: 12 6.5% 15.1%;
+        --input: 12 6.5% 15.1%;
+        --ring: 20.5 90.2% 48.2%;
+    }
+}
+
+
+@layer base {
+    * {
+        @apply border-border;
+    }
+
+    body {
+        @apply bg-background text-foreground;
+    }
+}

src/app/layout.tsx

@@ -0,0 +1,29 @@
+import type { Metadata } from 'next';
+import { Inter } from 'next/font/google';
+import './globals.css';
+import { cn } from '@/lib/utils';
+import { Toaster } from '@/components/ui/sonner';
+
+const inter = Inter({subsets: ['latin']});
+
+export const metadata: Metadata = {
+    title: 'Create Next App',
+    description: 'Generated by create next app',
+};
+
+export default function RootLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    return (
+        <html lang="en">
+        <body className={cn('dark', inter.className)}>
+        <main>
+            {children}
+            <Toaster/>
+        </main>
+        </body>
+        </html>
+    );
+}

src/app/page.tsx

@@ -0,0 +1,18 @@
+import { Button } from '@/components/ui/button';
+import { User } from 'lucide-react';
+import React from 'react';
+import Link from 'next/link';
+import { URL_ACCOUNT } from '@/lib/constants';
+
+export default async function Home() {
+    return (
+        <main className="flex min-h-screen flex-col items-center justify-center p-24 text-3xl space-y-4 relative">
+            <Button variant="ghost" size="icon" className="absolute top-4 right-4" asChild>
+                <Link href={URL_ACCOUNT}>
+                    <User/>
+                </Link>
+            </Button>
+            Next Base
+        </main>
+    );
+}