feat(products): edit support on /admin/products; Purchasing Items -> /inventory/items
- updateProduct server action (name + description, code locked) - EditProductButton dialog in product-form.tsx - Edit entry wired into ProductActionsMenu - Sidebar Purchasing Items for Manager/Admin now points to /inventory/items (cart view) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
9bbc97b9bd
commit
982a114eb5
4 changed files with 90 additions and 3 deletions
|
|
@ -35,6 +35,29 @@ export async function createProduct(formData: FormData): Promise<ActionResult> {
|
|||
return { ok: true };
|
||||
}
|
||||
|
||||
export async function updateProduct(formData: FormData): Promise<ActionResult> {
|
||||
const session = await auth();
|
||||
if (!session?.user || !hasPermission(session.user.role, "manage_products")) {
|
||||
return { error: "Forbidden" };
|
||||
}
|
||||
|
||||
const id = formData.get("id") as string;
|
||||
if (!id) return { error: "Product ID required" };
|
||||
|
||||
const parsed = z.object({
|
||||
name: z.string().min(1).max(200),
|
||||
description: z.string().optional(),
|
||||
}).safeParse({
|
||||
name: formData.get("name"),
|
||||
description: formData.get("description") || undefined,
|
||||
});
|
||||
if (!parsed.success) return { error: parsed.error.errors[0].message };
|
||||
|
||||
await db.product.update({ where: { id }, data: parsed.data });
|
||||
revalidatePath("/admin/products");
|
||||
return { ok: true };
|
||||
}
|
||||
|
||||
export async function deleteProduct(id: string): Promise<ActionResult> {
|
||||
const session = await auth();
|
||||
if (!session?.user || !hasPermission(session.user.role, "manage_products")) return { error: "Forbidden" };
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
import { useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { AdminDialog } from "@/components/ui/admin-dialog";
|
||||
import { createProduct, toggleProductActive } from "./actions";
|
||||
import { createProduct, updateProduct, toggleProductActive } from "./actions";
|
||||
|
||||
type ProductRow = {
|
||||
id: string;
|
||||
|
|
@ -78,6 +78,63 @@ export function AddProductButton() {
|
|||
);
|
||||
}
|
||||
|
||||
export function EditProductButton({
|
||||
product,
|
||||
open: controlledOpen,
|
||||
onOpenChange,
|
||||
}: {
|
||||
product: ProductRow;
|
||||
open?: boolean;
|
||||
onOpenChange?: (v: boolean) => void;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const [internalOpen, setInternalOpen] = useState(false);
|
||||
const [pending, setPending] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
|
||||
const isControlled = controlledOpen !== undefined;
|
||||
const open = isControlled ? controlledOpen : internalOpen;
|
||||
const setOpen = isControlled ? (onOpenChange ?? (() => {})) : setInternalOpen;
|
||||
|
||||
async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
|
||||
e.preventDefault();
|
||||
setPending(true);
|
||||
setError("");
|
||||
const fd = new FormData(e.currentTarget);
|
||||
fd.set("id", product.id);
|
||||
const result = await updateProduct(fd);
|
||||
if ("error" in result) { setError(result.error); setPending(false); }
|
||||
else { setPending(false); setOpen(false); router.refresh(); }
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{!isControlled && (
|
||||
<button onClick={() => setOpen(true)}
|
||||
className="rounded border border-primary-200 bg-primary-50 px-2.5 py-1 text-xs font-medium text-primary-700 hover:bg-primary-100 transition-colors">
|
||||
Edit
|
||||
</button>
|
||||
)}
|
||||
<AdminDialog title={`Edit — ${product.name}`} open={open} onClose={() => setOpen(false)}>
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
<ProductFormFields product={product} />
|
||||
{error && <p className="text-sm text-danger-700 bg-danger-50 rounded-lg px-3 py-2">{error}</p>}
|
||||
<div className="flex justify-end gap-3 pt-1">
|
||||
<button type="button" onClick={() => setOpen(false)}
|
||||
className="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-medium text-neutral-700 hover:bg-neutral-50">
|
||||
Cancel
|
||||
</button>
|
||||
<button type="submit" disabled={pending}
|
||||
className="rounded-lg bg-primary-600 px-4 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:opacity-60">
|
||||
{pending ? "Saving…" : "Save Changes"}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</AdminDialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export function ToggleProductButton({ product }: { product: ProductRow }) {
|
||||
const router = useRouter();
|
||||
const [toggling, setToggling] = useState(false);
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { useState } from "react";
|
|||
import { formatCurrency, formatDate } from "@/lib/utils";
|
||||
import { useTableControls } from "@/components/ui/use-table-controls";
|
||||
import { TableControls, SortableTh } from "@/components/ui/table-controls";
|
||||
import { AddProductButton } from "./product-form";
|
||||
import { AddProductButton, EditProductButton } from "./product-form";
|
||||
import { RowActionsMenu, RowActionsItem, RowActionsDestructiveItem, RowActionsSeparator } from "@/components/ui/row-actions-menu";
|
||||
import { DeleteConfirmDialog } from "@/components/ui/delete-confirm-dialog";
|
||||
import { ConfirmDialog } from "@/components/ui/confirm-dialog";
|
||||
|
|
@ -26,12 +26,14 @@ export type ProductRow = {
|
|||
const CHIPS = ["Active", "Inactive"];
|
||||
|
||||
function ProductActionsMenu({ product }: { product: ProductRow }) {
|
||||
const [editOpen, setEditOpen] = useState(false);
|
||||
const [deleteOpen, setDeleteOpen] = useState(false);
|
||||
const [toggleOpen, setToggleOpen] = useState(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<RowActionsMenu>
|
||||
<RowActionsItem onClick={() => setEditOpen(true)}>Edit</RowActionsItem>
|
||||
<RowActionsItem onClick={() => setToggleOpen(true)}>
|
||||
{product.isActive ? "Deactivate" : "Activate"}
|
||||
</RowActionsItem>
|
||||
|
|
@ -39,6 +41,11 @@ function ProductActionsMenu({ product }: { product: ProductRow }) {
|
|||
<RowActionsDestructiveItem onClick={() => setDeleteOpen(true)}>Delete</RowActionsDestructiveItem>
|
||||
</RowActionsMenu>
|
||||
|
||||
<EditProductButton
|
||||
product={{ id: product.id, code: product.code, name: product.name, description: product.description, isActive: product.isActive }}
|
||||
open={editOpen}
|
||||
onOpenChange={setEditOpen}
|
||||
/>
|
||||
<DeleteConfirmDialog
|
||||
open={deleteOpen}
|
||||
onOpenChange={setDeleteOpen}
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ const PURCHASING_STAFF: NavItem[] = [
|
|||
// Manager / Admin catalogue management — Sites conditionally shown
|
||||
const PURCHASING_MGMT: NavItem[] = [
|
||||
{ href: "/inventory/vendors", label: "Vendors", icon: Store, roles: ["MANAGER", "ADMIN"] },
|
||||
{ href: "/admin/products", label: "Items", icon: Package, roles: ["MANAGER", "ADMIN"] },
|
||||
{ href: "/inventory/items", label: "Items", icon: Package, roles: ["MANAGER", "ADMIN"] },
|
||||
{ href: "/admin/vessels", label: "Cost Centres", icon: Ship, roles: ["MANAGER", "ADMIN"] },
|
||||
...(INVENTORY_ENABLED
|
||||
? [{ href: "/admin/sites", label: "Sites", icon: MapPin, roles: ["MANAGER", "ADMIN"] as Role[] }]
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue