1efa979443
Adds complete initial codebase for the RJ Bulk Supplies fuel delivery backoffice: - Authentication pages and protected route layouts - Customer, supplier, fuel purchase, and delivery note management - Custom reporting and customer statement sending tools - Full UI component library and Tailwind styling - Server actions, API routes, and PocketBase integration - Development scripts and project configuration updates - Updated README and package metadata
53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import { useActionState, useEffect, useRef } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import { updateProfile, type ActionResult } from "@/actions/profile";
|
|
import { toast } from "sonner";
|
|
import type { AppUser } from "@/lib/types";
|
|
|
|
const initial: ActionResult = { ok: false, error: "" };
|
|
|
|
export function ProfileForm({ user }: { user: AppUser }) {
|
|
const router = useRouter();
|
|
const [state, action, pending] = useActionState(updateProfile, initial);
|
|
const ref = useRef<HTMLFormElement>(null);
|
|
|
|
useEffect(() => {
|
|
if (state.ok) {
|
|
toast.success("Profile saved");
|
|
router.refresh();
|
|
} else if (state.error) {
|
|
toast.error(state.error);
|
|
}
|
|
}, [state, router]);
|
|
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Profile</CardTitle>
|
|
</CardHeader>
|
|
<form ref={ref} action={action}>
|
|
<CardContent className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="p-name">Name</Label>
|
|
<Input id="p-name" name="name" defaultValue={user.name || ""} required />
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="p-email">Email</Label>
|
|
<Input id="p-email" name="email" type="email" defaultValue={user.email} required />
|
|
</div>
|
|
</CardContent>
|
|
<CardFooter>
|
|
<Button type="submit" disabled={pending}>
|
|
{pending ? "Saving…" : "Save profile"}
|
|
</Button>
|
|
</CardFooter>
|
|
</form>
|
|
</Card>
|
|
);
|
|
}
|