Files
zeavis-edu/apps/web/src/pages/register-page.tsx
T
Asep Haryana SaputraandClaude Opus 4.7 ba24cf1a05 fix(frontend): align pages with DB schema, fix auth, and improve UX
- Fix auth system: remove redirect bugs in login/register pages, register
  routes, wrap protected routes with AuthGuard, add AuthInitializer
- Add missing navbar links (Diagnosa, Pustaka, expert Review)
- Fix DiagnosesPage status filter to match DB DiagnosisStatus enum,
  support URL params (?status=, ?risk=) from dashboard links
- Replace hardcoded disease data on Dashboard with API-driven data,
  fix layout bugs (invalid gap-57 class, empty Button)
- Rewrite LibraryPage to use API instead of mock-diseases.ts
- Indonesian-ize Expert Reviews page labels and text
- Wrap DiagnosisDetailPage with MainLayout for consistent layout
- Improve ScanPage UX: image preview before upload, lucide icons,
  proper disease names in result modal, file size validation
- Delete dead code: mock-diseases.ts, unused form components,
  tailwind.config.ts (Tailwind v4 does not read v3 config)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-02 07:12:49 +00:00

55 lines
1.8 KiB
TypeScript

import { useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { AuthForm } from "@/components/auth-form";
import { apiClient } from "@/lib/api-client";
import { useAuthStore } from "@/store/auth-store";
export function RegisterPage() {
const navigate = useNavigate();
const queryClient = useQueryClient();
const setUser = useAuthStore((state) => state.setUser);
const [error, setError] = useState<string | null>(null);
const meQuery = useQuery({
queryKey: ["auth", "me"],
queryFn: () => apiClient.getMe(),
});
const mutation = useMutation({
mutationFn: apiClient.register,
onSuccess: (response) => {
setUser(response.user);
queryClient.setQueryData(["auth", "me"], response);
navigate("/dashboard");
},
onError: (err) =>
setError(err instanceof Error ? err.message : "Registrasi gagal"),
});
return (
<main className="flex min-h-screen items-center justify-center px-6 py-12">
<div className="w-full space-y-4">
<AuthForm
mode="register"
isSubmitting={mutation.isPending}
error={error}
googleOAuthEnabled={Boolean(
meQuery.data?.features.googleOAuthEnabled,
)}
onSubmit={async ({ name, email, password }) => {
setError(null);
return mutation.mutateAsync({ name: name ?? "", email, password });
}}
onFieldChange={() => setError(null)}
/>
<p className="text-center text-sm text-muted-foreground">
Sudah punya akun?{" "}
<Link className="text-primary" to="/login">
Masuk
</Link>
</p>
</div>
</main>
);
}