create-blitzpack 0.1.0 → 0.1.1

package/template/apps/web/src/app/(auth)/forgot-password/page.tsx

@@ -1,177 +0,0 @@
-'use client';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { Button } from '@repo/packages-ui/button';
-import { Input } from '@repo/packages-ui/input';
-import { Label } from '@repo/packages-ui/label';
-import { Info, MailIcon, TriangleAlert } from 'lucide-react';
-import Link from 'next/link';
-import { useRouter } from 'next/navigation';
-import React, { useState } from 'react';
-import { useForm } from 'react-hook-form';
-import { toast } from 'sonner';
-import { z } from 'zod';
-
-import { RedirectIfAuthenticated } from '@/components/auth/redirect-if-authenticated';
-import { authClient } from '@/lib/auth';
-
-const forgotPasswordSchema = z.object({
-  email: z.string().email('Invalid email address'),
-});
-
-type ForgotPasswordFormData = z.infer<typeof forgotPasswordSchema>;
-
-export default function ForgotPasswordPage() {
-  const router = useRouter();
-  const [isLoading, setIsLoading] = useState(false);
-  const [emailSent, setEmailSent] = useState(false);
-
-  const {
-    register,
-    handleSubmit,
-    formState: { errors },
-    getValues,
-  } = useForm<ForgotPasswordFormData>({
-    resolver: zodResolver(forgotPasswordSchema),
-    defaultValues: {
-      email: '',
-    },
-  });
-
-  const onSubmit = async (data: ForgotPasswordFormData) => {
-    setIsLoading(true);
-
-    try {
-      const result = await authClient.forgetPassword({
-        email: data.email,
-        redirectTo: '/reset-password',
-      });
-
-      if (result.error) {
-        toast.error(result.error.message || 'Failed to send reset email');
-        return;
-      }
-
-      setEmailSent(true);
-      toast.success('Password reset email sent! Check your inbox.');
-    } catch (error) {
-      toast.error('An unexpected error occurred');
-      console.error('Forgot password error:', error);
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
-  if (emailSent) {
-    return (
-      <RedirectIfAuthenticated>
-        <div className="flex min-h-screen items-center justify-center p-4">
-          <div className="bg-card w-full max-w-md rounded-lg border p-8">
-            <div className="mb-6 text-center">
-              <div className="bg-primary text-primary-foreground mx-auto mb-4 flex size-16 items-center justify-center rounded-full">
-                <MailIcon className="size-8" />
-              </div>
-              <h1 className="text-2xl font-semibold">Check your email</h1>
-              <p className="text-muted-foreground mt-2 text-sm">
-                We sent a password reset link to
-              </p>
-              <p className="text-foreground mt-1 text-sm font-medium">
-                {getValues('email')}
-              </p>
-            </div>
-            <div className="mb-6 space-y-4 rounded-lg border p-4">
-              <div className="flex gap-3">
-                <div className="mt-0.5 flex-shrink-0">
-                  <Info className="size-4" />
-                </div>
-                <div className="space-y-1">
-                  <p className="text-foreground text-sm font-medium">
-                    Next steps
-                  </p>
-                  <p className="text-muted-foreground text-sm leading-relaxed">
-                    Click the link in the email to reset your password. The link
-                    will expire in 1 hour.
-                  </p>
-                </div>
-              </div>
-              <div className="flex gap-3">
-                <div className="mt-0.5 flex-shrink-0">
-                  <TriangleAlert className="size-4" />
-                </div>
-                <div className="space-y-1">
-                  <p className="text-foreground text-sm font-medium">
-                    Didn't receive it?
-                  </p>
-                  <p className="text-muted-foreground text-sm leading-relaxed">
-                    Check your spam folder or use the button below to send
-                    another email.
-                  </p>
-                </div>
-              </div>
-            </div>
-            <div className="flex flex-col gap-3">
-              <Button
-                variant="outline"
-                className="w-full"
-                onClick={() => setEmailSent(false)}
-              >
-                Send another email
-              </Button>
-              <Button
-                variant="ghost"
-                className="w-full"
-                onClick={() => router.push('/login')}
-              >
-                Back to sign in
-              </Button>
-            </div>
-          </div>
-        </div>
-      </RedirectIfAuthenticated>
-    );
-  }
-
-  return (
-    <RedirectIfAuthenticated>
-      <div className="flex min-h-screen items-center justify-center p-4">
-        <div className="bg-card w-full max-w-md rounded-lg border p-8">
-          <div className="mb-6">
-            <h1 className="text-2xl font-semibold">Reset your password</h1>
-            <p className="text-muted-foreground mt-2 text-sm">
-              Enter your email address and we'll send you a link to reset your
-              password
-            </p>
-          </div>
-          <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
-            <div className="space-y-2">
-              <Label htmlFor="email">Email</Label>
-              <Input
-                id="email"
-                type="email"
-                placeholder="name@example.com"
-                {...register('email')}
-                disabled={isLoading}
-              />
-              {errors.email && (
-                <p className="text-destructive text-xs">
-                  {errors.email.message}
-                </p>
-              )}
-            </div>
-            <div className="flex flex-col gap-4 pt-2">
-              <Button type="submit" className="w-full" isLoading={isLoading}>
-                Send reset link
-              </Button>
-              <p className="text-muted-foreground text-center text-sm">
-                Remember your password?{' '}
-                <Link href="/login" className="text-primary hover:underline">
-                  Sign in
-                </Link>
-              </p>
-            </div>
-          </form>
-        </div>
-      </div>
-    </RedirectIfAuthenticated>
-  );
-}

package/template/apps/web/src/app/(auth)/login/page.tsx

@@ -1,159 +0,0 @@
-'use client';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { Button } from '@repo/packages-ui/button';
-import { Checkbox } from '@repo/packages-ui/checkbox';
-import { Input } from '@repo/packages-ui/input';
-import { Label } from '@repo/packages-ui/label';
-import { PasswordInput } from '@repo/packages-ui/password-input';
-import Link from 'next/link';
-import { useRouter } from 'next/navigation';
-import React, { useState } from 'react';
-import { useForm } from 'react-hook-form';
-import { toast } from 'sonner';
-import { z } from 'zod';
-
-import { GithubButton } from '@/components/auth/github-button';
-import { GoogleButton } from '@/components/auth/google-button';
-import { RedirectIfAuthenticated } from '@/components/auth/redirect-if-authenticated';
-import { authClient } from '@/lib/auth';
-
-const loginSchema = z.object({
-  email: z.string().email('Invalid email address'),
-  password: z.string().min(8, 'Password must be at least 8 characters'),
-  rememberMe: z.boolean().default(false),
-});
-
-export default function LoginPage() {
-  const router = useRouter();
-  const [isLoading, setIsLoading] = useState(false);
-
-  const {
-    register,
-    handleSubmit,
-    formState: { errors },
-  } = useForm({
-    resolver: zodResolver(loginSchema),
-    defaultValues: {
-      email: '',
-      password: '',
-      rememberMe: false,
-    },
-  });
-
-  const onSubmit = async (data: z.infer<typeof loginSchema>) => {
-    setIsLoading(true);
-
-    try {
-      const result = await authClient.signIn.email({
-        email: data.email,
-        password: data.password,
-        rememberMe: data.rememberMe,
-      });
-
-      if (result.error) {
-        toast.error(result.error.message || 'Failed to sign in');
-        return;
-      }
-
-      toast.success('Welcome back!');
-      router.push('/dashboard');
-    } catch (error) {
-      toast.error('An unexpected error occurred');
-      console.error('Login error:', error);
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
-  return (
-    <RedirectIfAuthenticated>
-      <div className="flex min-h-screen items-center justify-center p-4">
-        <div className="bg-card w-full max-w-md rounded-lg border p-8">
-          <div className="mb-6">
-            <h1 className="text-2xl font-semibold">Sign In</h1>
-            <p className="text-muted-foreground mt-2 text-sm">
-              Enter your email and password to access your account
-            </p>
-          </div>
-
-          <div className="mb-6 space-y-3">
-            <GoogleButton />
-            <GithubButton />
-          </div>
-
-          <div className="relative mb-6">
-            <div className="absolute inset-0 flex items-center">
-              <span className="w-full border-t" />
-            </div>
-            <div className="relative flex justify-center text-xs uppercase">
-              <span className="bg-card text-muted-foreground px-2">
-                Or continue with email
-              </span>
-            </div>
-          </div>
-
-          <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
-            <div className="space-y-2">
-              <Label htmlFor="email">Email</Label>
-              <Input
-                id="email"
-                type="email"
-                placeholder="name@example.com"
-                {...register('email')}
-                disabled={isLoading}
-              />
-              {errors.email && (
-                <p className="text-destructive text-xs">
-                  {errors.email.message}
-                </p>
-              )}
-            </div>
-            <div className="space-y-2">
-              <Label htmlFor="password">Password</Label>
-              <PasswordInput
-                id="password"
-                placeholder="Enter your password"
-                {...register('password')}
-                disabled={isLoading}
-              />
-              {errors.password && (
-                <p className="text-destructive text-xs">
-                  {errors.password.message}
-                </p>
-              )}
-            </div>
-            <div className="flex items-center justify-between pt-2">
-              <div className="flex items-center space-x-2">
-                <Checkbox id="rememberMe" {...register('rememberMe')} />
-                <Label
-                  htmlFor="rememberMe"
-                  className="text-sm font-normal leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                >
-                  Remember me for 30 days
-                </Label>
-              </div>
-              <Link
-                href="/forgot-password"
-                className="text-primary text-sm hover:underline"
-              >
-                Forgot password?
-              </Link>
-            </div>
-            <div className="flex flex-col gap-4 pt-2">
-              <Button type="submit" className="w-full" isLoading={isLoading}>
-                Sign In
-              </Button>
-              <p className="text-muted-foreground text-center text-sm">
-                Don&apos;t have an account?{' '}
-                <Link href="/signup" className="text-primary hover:underline">
-                  Sign up
-                </Link>
-              </p>
-            </div>
-          </form>
-        </div>
-      </div>
-    </RedirectIfAuthenticated>
-  );
-}

package/template/apps/web/src/app/(auth)/reset-password/page.tsx

@@ -1,245 +0,0 @@
-'use client';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { Button } from '@repo/packages-ui/button';
-import { Label } from '@repo/packages-ui/label';
-import { PasswordInput } from '@repo/packages-ui/password-input';
-import { ShieldAlert } from 'lucide-react';
-import Link from 'next/link';
-import { useRouter, useSearchParams } from 'next/navigation';
-import React, { Suspense, useState } from 'react';
-import { useForm } from 'react-hook-form';
-import { toast } from 'sonner';
-import { z } from 'zod';
-
-import { authClient } from '@/lib/auth';
-
-const resetPasswordSchema = z.object({
-  password: z.string().min(8, 'Password must be at least 8 characters'),
-});
-
-type ResetPasswordFormData = z.infer<typeof resetPasswordSchema>;
-
-function ResetPasswordContent() {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-  const [isLoading, setIsLoading] = useState(false);
-  const [resetSuccess, setResetSuccess] = useState(false);
-
-  const token = searchParams.get('token');
-  const error = searchParams.get('error');
-
-  const {
-    register,
-    handleSubmit,
-    formState: { errors },
-  } = useForm<ResetPasswordFormData>({
-    resolver: zodResolver(resetPasswordSchema),
-    defaultValues: {
-      password: '',
-    },
-  });
-
-  const hasErrors = Object.keys(errors).length > 0;
-
-  if (!token || error) {
-    return (
-      <div className="flex min-h-screen items-center justify-center p-4">
-        <div className="bg-card w-full max-w-md rounded-lg border p-8">
-          <div className="mb-6 text-center">
-            <div className="bg-destructive/10 text-destructive mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                fill="none"
-                viewBox="0 0 24 24"
-                strokeWidth={1.5}
-                stroke="currentColor"
-                className="h-7 w-7"
-              >
-                <path
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126ZM12 15.75h.007v.008H12v-.008Z"
-                />
-              </svg>
-            </div>
-            <h1 className="text-2xl font-semibold">Invalid reset link</h1>
-            <p className="text-muted-foreground mt-2 text-sm">
-              This password reset link is invalid or has expired.
-            </p>
-          </div>
-          <div className="bg-muted/50 mb-6 space-y-2 rounded-lg p-4">
-            <p className="text-muted-foreground text-sm">
-              Password reset links expire after 1 hour for security reasons.
-            </p>
-            <p className="text-muted-foreground text-sm">
-              Please request a new password reset link to continue.
-            </p>
-          </div>
-          <div className="flex flex-col gap-3">
-            <Button
-              className="w-full"
-              onClick={() => router.push('/forgot-password')}
-            >
-              Request new reset link
-            </Button>
-            <Button
-              variant="ghost"
-              className="w-full"
-              onClick={() => router.push('/login')}
-            >
-              Back to sign in
-            </Button>
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  const onSubmit = async (data: ResetPasswordFormData) => {
-    if (!token) {
-      toast.error('Reset token is missing');
-      return;
-    }
-
-    setIsLoading(true);
-
-    try {
-      const result = await authClient.resetPassword({
-        newPassword: data.password,
-        token,
-      });
-
-      if (result.error) {
-        toast.error(result.error.message || 'Failed to reset password');
-        return;
-      }
-
-      setResetSuccess(true);
-      toast.success('Password reset successful!');
-    } catch (error) {
-      toast.error('An unexpected error occurred');
-      console.error('Reset password error:', error);
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
-  if (resetSuccess) {
-    return (
-      <div className="flex min-h-screen items-center justify-center p-4">
-        <div className="bg-card w-full max-w-md rounded-lg border p-8">
-          <div className="mb-6 text-center">
-            <div className="bg-primary/10 text-primary mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                fill="none"
-                viewBox="0 0 24 24"
-                strokeWidth={1.5}
-                stroke="currentColor"
-                className="h-7 w-7"
-              >
-                <path
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  d="m4.5 12.75 6 6 9-13.5"
-                />
-              </svg>
-            </div>
-            <h1 className="text-2xl font-semibold">
-              Password reset successful
-            </h1>
-            <p className="text-muted-foreground mt-2 text-sm">
-              Your password has been successfully reset. You can now sign in
-              with your new password.
-            </p>
-          </div>
-          <Button className="w-full" onClick={() => router.push('/login')}>
-            Continue to sign in
-          </Button>
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div className="flex min-h-screen items-center justify-center p-4">
-      <div className="bg-card w-full max-w-md rounded-lg border p-8">
-        <div className="mb-6">
-          <h1 className="text-2xl font-semibold">Create new password</h1>
-          <p className="text-muted-foreground mt-2 text-sm">
-            Enter a new password for your account
-          </p>
-        </div>
-        <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
-          <div className="space-y-2">
-            <Label htmlFor="password">New password</Label>
-            <PasswordInput
-              id="password"
-              placeholder="Enter your new password"
-              {...register('password')}
-              disabled={isLoading}
-            />
-            {errors.password && (
-              <p className="text-destructive text-xs">
-                {errors.password.message}
-              </p>
-            )}
-          </div>
-
-          {hasErrors && (
-            <div className="border-destructive/50 bg-destructive/5 rounded-lg border p-4">
-              <div className="flex items-start gap-3">
-                <ShieldAlert className="text-destructive mt-0.5 h-5 w-5 shrink-0" />
-                <div>
-                  <p className="text-destructive text-sm font-medium">
-                    Password requirements:
-                  </p>
-                  <ul className="text-destructive/80 mt-1.5 space-y-1 text-sm">
-                    <li>• At least 8 characters long</li>
-                  </ul>
-                </div>
-              </div>
-            </div>
-          )}
-
-          {!hasErrors && (
-            <div className="bg-muted/50 rounded-lg p-4">
-              <p className="text-muted-foreground text-sm font-medium">
-                Password requirements:
-              </p>
-              <ul className="text-muted-foreground mt-2 space-y-1 text-sm">
-                <li>• At least 8 characters long</li>
-              </ul>
-            </div>
-          )}
-          <div className="flex flex-col gap-4 pt-2">
-            <Button type="submit" className="w-full" isLoading={isLoading}>
-              Reset password
-            </Button>
-            <p className="text-muted-foreground text-center text-sm">
-              Remember your password?{' '}
-              <Link href="/login" className="text-primary hover:underline">
-                Sign in
-              </Link>
-            </p>
-          </div>
-        </form>
-      </div>
-    </div>
-  );
-}
-
-export default function ResetPasswordPage() {
-  return (
-    <Suspense
-      fallback={
-        <div className="flex min-h-screen items-center justify-center">
-          <div className="text-muted-foreground">Loading...</div>
-        </div>
-      }
-    >
-      <ResetPasswordContent />
-    </Suspense>
-  );
-}