@promakeai/cli 0.0.5 → 0.1.0

package/template/src/modules/auth/forgot-password-page.tsx

@@ -1,371 +0,0 @@
-import { useState } from "react";
-import { Link } from "react-router";
-import { toast } from "sonner";
-import { Layout } from "@/components/Layout";
-import { usePageTitle } from "@/hooks/use-page-title";
-import { useTranslation } from "react-i18next";
-import { useAuth } from "@/modules/auth/use-auth";
-import { getErrorMessage } from "@/modules/api/get-error-message";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Card,
-  CardContent,
-  CardHeader,
-  CardTitle,
-  CardDescription,
-} from "@/components/ui/card";
-import { KeyRound, ArrowLeft, Eye, EyeOff, CheckCircle2 } from "lucide-react";
-
-type Step = "request" | "reset" | "success";
-
-export default function ForgotPasswordPage() {
-  const { t } = useTranslation("forgotPassword");
-  usePageTitle({ title: t("title", "Forgot Password") });
-
-  const { forgotPassword, resetPassword } = useAuth();
-
-  const [step, setStep] = useState<Step>("request");
-  const [username, setUsername] = useState("");
-  const [code, setCode] = useState("");
-  const [newPassword, setNewPassword] = useState("");
-  const [confirmPassword, setConfirmPassword] = useState("");
-  const [showPassword, setShowPassword] = useState(false);
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleRequestCode = async (e: React.FormEvent) => {
-    e.preventDefault();
-    setIsSubmitting(true);
-    setError(null);
-
-    try {
-      await forgotPassword(username);
-      toast.success(t("codeSentTitle", "Code Sent!"), {
-        description: t(
-          "codeSentDesc",
-          "A password reset code has been sent to your email.",
-        ),
-      });
-      setStep("reset");
-    } catch (err) {
-      const errorMessage = getErrorMessage(
-        err,
-        t("errorGeneric", "Failed to send reset code. Please try again."),
-      );
-      setError(errorMessage);
-      toast.error(t("errorTitle", "Error"), {
-        description: errorMessage,
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-
-  const handleResetPassword = async (e: React.FormEvent) => {
-    e.preventDefault();
-    setError(null);
-
-    // Validate passwords match
-    if (newPassword !== confirmPassword) {
-      setError(t("passwordMismatch", "Passwords do not match"));
-      return;
-    }
-
-    setIsSubmitting(true);
-
-    try {
-      await resetPassword(username, code, newPassword);
-      toast.success(t("resetSuccessTitle", "Password Reset!"), {
-        description: t(
-          "resetSuccessDesc",
-          "Your password has been successfully reset.",
-        ),
-      });
-      setStep("success");
-    } catch (err) {
-      const errorMessage = getErrorMessage(
-        err,
-        t("errorResetGeneric", "Failed to reset password. Please try again."),
-      );
-      setError(errorMessage);
-      toast.error(t("errorTitle", "Error"), {
-        description: errorMessage,
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-
-  // Success step
-  if (step === "success") {
-    return (
-      <Layout>
-        <div className="min-h-screen bg-muted/30 py-12">
-          <div className="container mx-auto px-4">
-            <div className="max-w-md mx-auto">
-              <Card>
-                <CardContent className="pt-8 pb-8 text-center">
-                  <CheckCircle2 className="w-16 h-16 text-green-500 mx-auto mb-4" />
-                  <h1 className="text-2xl font-bold mb-2">
-                    {t("successTitle", "Password Reset Successfully!")}
-                  </h1>
-                  <p className="text-muted-foreground mb-6">
-                    {t(
-                      "successDescription",
-                      "Your password has been changed. You can now login with your new password.",
-                    )}
-                  </p>
-                  <Button asChild className="w-full">
-                    <Link to="/login">{t("goToLogin", "Go to Login")}</Link>
-                  </Button>
-                </CardContent>
-              </Card>
-            </div>
-          </div>
-        </div>
-      </Layout>
-    );
-  }
-
-  return (
-    <Layout>
-      <div className="min-h-screen bg-muted/30 py-12">
-        <div className="container mx-auto px-4">
-          {/* Hero Section */}
-          <div className="text-center mb-12">
-            <h1 className="text-4xl font-bold text-foreground mb-4">
-              {t("title", "Forgot Password")}
-            </h1>
-            <div className="w-16 h-1 bg-primary mx-auto mb-6"></div>
-            <p className="text-lg text-muted-foreground max-w-xl mx-auto">
-              {step === "request"
-                ? t(
-                    "descriptionRequest",
-                    "Enter your username and we'll send you a code to reset your password.",
-                  )
-                : t(
-                    "descriptionReset",
-                    "Enter the code sent to your email and your new password.",
-                  )}
-            </p>
-          </div>
-
-          <div className="max-w-md mx-auto">
-            <Card>
-              <CardHeader>
-                <CardTitle className="flex items-center gap-2">
-                  <KeyRound className="w-5 h-5 text-primary" />
-                  {step === "request"
-                    ? t("cardTitleRequest", "Request Reset Code")
-                    : t("cardTitleReset", "Reset Password")}
-                </CardTitle>
-                <CardDescription>
-                  {step === "request"
-                    ? t("cardDescRequest", "Step 1 of 2: Request a reset code")
-                    : t(
-                        "cardDescReset",
-                        "Step 2 of 2: Enter code and new password",
-                      )}
-                </CardDescription>
-              </CardHeader>
-              <CardContent>
-                {step === "request" ? (
-                  // Step 1: Request Code
-                  <form onSubmit={handleRequestCode} className="space-y-6">
-                    <div>
-                      <Label htmlFor="username">
-                        {t("username", "Username")} *
-                      </Label>
-                      <Input
-                        id="username"
-                        type="text"
-                        value={username}
-                        onChange={(e) => setUsername(e.target.value)}
-                        placeholder={t(
-                          "usernamePlaceholder",
-                          "Enter your username",
-                        )}
-                        required
-                        className="mt-1"
-                        autoComplete="username"
-                      />
-                    </div>
-
-                    {error && (
-                      <div className="p-4 bg-red-50 border border-red-200 rounded-lg">
-                        <p className="text-red-800 text-sm font-medium">
-                          {error}
-                        </p>
-                      </div>
-                    )}
-
-                    <Button
-                      type="submit"
-                      size="lg"
-                      className="w-full"
-                      disabled={isSubmitting}
-                    >
-                      {isSubmitting ? (
-                        <>
-                          <div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin mr-2" />
-                          {t("sending", "Sending...")}
-                        </>
-                      ) : (
-                        t("sendCode", "Send Reset Code")
-                      )}
-                    </Button>
-
-                    <div className="text-center">
-                      <Link
-                        to="/login"
-                        className="text-sm text-muted-foreground hover:text-primary inline-flex items-center gap-1"
-                      >
-                        <ArrowLeft className="w-4 h-4" />
-                        {t("backToLogin", "Back to Login")}
-                      </Link>
-                    </div>
-                  </form>
-                ) : (
-                  // Step 2: Reset Password
-                  <form onSubmit={handleResetPassword} className="space-y-6">
-                    <div className="p-3 bg-muted rounded-lg text-sm">
-                      <span className="text-muted-foreground">
-                        {t("codeFor", "Reset code for:")}{" "}
-                      </span>
-                      <span className="font-medium">{username}</span>
-                    </div>
-
-                    <div>
-                      <Label htmlFor="code">{t("code", "Reset Code")} *</Label>
-                      <Input
-                        id="code"
-                        type="text"
-                        value={code}
-                        onChange={(e) => setCode(e.target.value)}
-                        placeholder={t("codePlaceholder", "Enter 6-digit code")}
-                        required
-                        className="mt-1"
-                        maxLength={6}
-                      />
-                    </div>
-
-                    <div>
-                      <Label htmlFor="newPassword">
-                        {t("newPassword", "New Password")} *
-                      </Label>
-                      <div className="relative">
-                        <Input
-                          id="newPassword"
-                          type={showPassword ? "text" : "password"}
-                          value={newPassword}
-                          onChange={(e) => setNewPassword(e.target.value)}
-                          placeholder={t(
-                            "newPasswordPlaceholder",
-                            "Enter new password",
-                          )}
-                          required
-                          className="mt-1 pr-10"
-                          autoComplete="new-password"
-                        />
-                        <button
-                          type="button"
-                          onClick={() => setShowPassword(!showPassword)}
-                          className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
-                        >
-                          {showPassword ? (
-                            <EyeOff className="w-4 h-4" />
-                          ) : (
-                            <Eye className="w-4 h-4" />
-                          )}
-                        </button>
-                      </div>
-                      <p className="text-xs text-muted-foreground mt-1">
-                        {t(
-                          "passwordRequirements",
-                          "At least 8 characters, 1 letter and 1 number",
-                        )}
-                      </p>
-                    </div>
-
-                    <div>
-                      <Label htmlFor="confirmPassword">
-                        {t("confirmPassword", "Confirm Password")} *
-                      </Label>
-                      <Input
-                        id="confirmPassword"
-                        type={showPassword ? "text" : "password"}
-                        value={confirmPassword}
-                        onChange={(e) => setConfirmPassword(e.target.value)}
-                        placeholder={t(
-                          "confirmPasswordPlaceholder",
-                          "Confirm new password",
-                        )}
-                        required
-                        className="mt-1"
-                        autoComplete="new-password"
-                      />
-                    </div>
-
-                    {error && (
-                      <div className="p-4 bg-red-50 border border-red-200 rounded-lg">
-                        <p className="text-red-800 text-sm font-medium">
-                          {error}
-                        </p>
-                      </div>
-                    )}
-
-                    <Button
-                      type="submit"
-                      size="lg"
-                      className="w-full"
-                      disabled={isSubmitting}
-                    >
-                      {isSubmitting ? (
-                        <>
-                          <div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin mr-2" />
-                          {t("resetting", "Resetting...")}
-                        </>
-                      ) : (
-                        t("resetPassword", "Reset Password")
-                      )}
-                    </Button>
-
-                    <div className="flex justify-between">
-                      <button
-                        type="button"
-                        onClick={() => {
-                          setStep("request");
-                          setCode("");
-                          setNewPassword("");
-                          setConfirmPassword("");
-                          setError(null);
-                        }}
-                        className="text-sm text-muted-foreground hover:text-primary"
-                      >
-                        {t("changeUsername", "Change username")}
-                      </button>
-                      <button
-                        type="button"
-                        onClick={() =>
-                          handleRequestCode({
-                            preventDefault: () => {},
-                          } as React.FormEvent)
-                        }
-                        className="text-sm text-primary hover:underline"
-                        disabled={isSubmitting}
-                      >
-                        {t("resendCode", "Resend code")}
-                      </button>
-                    </div>
-                  </form>
-                )}
-              </CardContent>
-            </Card>
-          </div>
-        </div>
-      </div>
-    </Layout>
-  );
-}

package/template/src/modules/auth/login-page.tsx

@@ -1,183 +0,0 @@
-import { useState, useEffect } from "react";
-import { Link, useNavigate } from "react-router";
-import { toast } from "sonner";
-import { Layout } from "@/components/Layout";
-import { usePageTitle } from "@/hooks/use-page-title";
-import { useTranslation } from "react-i18next";
-import { useAuth } from "@/modules/auth/use-auth";
-import { getErrorMessage } from "@/modules/api/get-error-message";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import { LogIn, Eye, EyeOff } from "lucide-react";
-
-export default function LoginPage() {
-  const { t } = useTranslation("login");
-  usePageTitle({ title: t("title") });
-
-  const navigate = useNavigate();
-  const { login, isAuthenticated } = useAuth();
-
-  const [formData, setFormData] = useState({
-    username: "",
-    password: "",
-  });
-  const [showPassword, setShowPassword] = useState(false);
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  // Redirect when authenticated (works for both initial load and after login)
-  useEffect(() => {
-    if (isAuthenticated) {
-      navigate("/", { replace: true });
-    }
-  }, [isAuthenticated, navigate]);
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    setIsSubmitting(true);
-    setError(null);
-
-    try {
-      await login(formData.username, formData.password);
-      toast.success(t("toastSuccessTitle", "Welcome back!"), {
-        description: t("toastSuccessDesc", "You have successfully logged in."),
-      });
-      navigate("/", { replace: true });
-    } catch (err) {
-      const errorMessage = getErrorMessage(err, t("errorGeneric"));
-      setError(errorMessage);
-      toast.error(t("toastErrorTitle", "Login failed"), {
-        description: errorMessage,
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setFormData((prev) => ({
-      ...prev,
-      [e.target.name]: e.target.value,
-    }));
-  };
-
-  return (
-    <Layout>
-      <div className="min-h-screen bg-muted/30 py-12">
-        <div className="container mx-auto px-4">
-          {/* Hero Section */}
-          <div className="text-center mb-12">
-            <h1 className="text-4xl font-bold text-foreground mb-4">
-              {t("title")}
-            </h1>
-            <div className="w-16 h-1 bg-primary mx-auto mb-6"></div>
-            <p className="text-lg text-muted-foreground max-w-xl mx-auto">
-              {t("description")}
-            </p>
-          </div>
-
-          <div className="max-w-md mx-auto">
-            <Card>
-              <CardHeader>
-                <CardTitle className="flex items-center gap-2">
-                  <LogIn className="w-5 h-5 text-primary" />
-                  {t("cardTitle")}
-                </CardTitle>
-              </CardHeader>
-              <CardContent>
-                <form onSubmit={handleSubmit} className="space-y-6">
-                  <div>
-                    <Label htmlFor="username">{t("username")} *</Label>
-                    <Input
-                      id="username"
-                      name="username"
-                      type="text"
-                      value={formData.username}
-                      onChange={handleChange}
-                      placeholder={t("usernamePlaceholder")}
-                      required
-                      className="mt-1"
-                      autoComplete="username"
-                    />
-                  </div>
-
-                  <div>
-                    <div className="flex items-center justify-between">
-                      <Label htmlFor="password">{t("password")} *</Label>
-                      <Link
-                        to="/forgot-password"
-                        className="text-sm text-primary hover:underline"
-                      >
-                        {t("forgotPassword", "Forgot password?")}
-                      </Link>
-                    </div>
-                    <div className="relative">
-                      <Input
-                        id="password"
-                        name="password"
-                        type={showPassword ? "text" : "password"}
-                        value={formData.password}
-                        onChange={handleChange}
-                        placeholder={t("passwordPlaceholder")}
-                        required
-                        className="mt-1 pr-10"
-                        autoComplete="current-password"
-                      />
-                      <button
-                        type="button"
-                        onClick={() => setShowPassword(!showPassword)}
-                        className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
-                      >
-                        {showPassword ? (
-                          <EyeOff className="w-4 h-4" />
-                        ) : (
-                          <Eye className="w-4 h-4" />
-                        )}
-                      </button>
-                    </div>
-                  </div>
-
-                  {error && (
-                    <div className="p-4 bg-red-50 border border-red-200 rounded-lg">
-                      <p className="text-red-800 text-sm font-medium">
-                        {error}
-                      </p>
-                    </div>
-                  )}
-
-                  <Button
-                    type="submit"
-                    size="lg"
-                    className="w-full"
-                    disabled={isSubmitting}
-                  >
-                    {isSubmitting ? (
-                      <>
-                        <div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin mr-2" />
-                        {t("submitting")}
-                      </>
-                    ) : (
-                      t("submit")
-                    )}
-                  </Button>
-
-                  <div className="text-center text-sm text-muted-foreground">
-                    {t("noAccount")}{" "}
-                    <Link
-                      to="/register"
-                      className="text-primary hover:underline font-medium"
-                    >
-                      {t("registerLink")}
-                    </Link>
-                  </div>
-                </form>
-              </CardContent>
-            </Card>
-          </div>
-        </div>
-      </div>
-    </Layout>
-  );
-}