@open-mercato/core 0.6.7-develop.6669.1.40b669666b → 0.6.7-develop.6671.1.4b925c5096

package/src/modules/wms/components/backend/InventoryOperationsSection.tsx

@@ -0,0 +1,159 @@
+"use client"
+
+import * as React from 'react'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { ArrowDown, ArrowLeftRight, ClipboardList, ShieldCheck, SlidersHorizontal, Upload } from 'lucide-react'
+import { AdjustInventoryDialog } from './AdjustInventoryDialog'
+import { CycleCountWizardDialog } from './CycleCountWizardDialog'
+import { ImportInventoryDialog } from './ImportInventoryDialog'
+import { MoveInventoryDialog } from './MoveInventoryDialog'
+import { ReceiveInventoryDialog } from './ReceiveInventoryDialog'
+import { ReserveInventoryDialog } from './ReserveInventoryDialog'
+import type { WmsInventoryMutationAccess } from './useWmsInventoryMutationAccess'
+
+function SectionCard({
+  title,
+  description,
+  children,
+}: {
+  title: string
+  description: string
+  children: React.ReactNode
+}) {
+  return (
+    <section className="rounded-lg border bg-card p-5 text-card-foreground shadow-sm">
+      <div className="mb-4 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
+        <div className="min-w-0 space-y-1">
+          <h2 className="text-xl font-semibold">{title}</h2>
+          <p className="text-sm text-muted-foreground">{description}</p>
+        </div>
+        <div className="flex flex-wrap gap-2">{children}</div>
+      </div>
+    </section>
+  )
+}
+
+export function InventoryOperationsSection({
+  access,
+}: {
+  access: WmsInventoryMutationAccess
+}) {
+  const t = useT()
+  const [adjustOpen, setAdjustOpen] = React.useState(false)
+  const [receiveOpen, setReceiveOpen] = React.useState(false)
+  const [reserveOpen, setReserveOpen] = React.useState(false)
+  const [moveOpen, setMoveOpen] = React.useState(false)
+  const [cycleOpen, setCycleOpen] = React.useState(false)
+  const [importOpen, setImportOpen] = React.useState(false)
+  const [putawayContext, setPutawayContext] = React.useState<{
+    catalogVariantId: string
+    warehouseId: string
+    locationId: string
+    quantity: number
+  } | null>(null)
+
+  const handleReceiveSuccess = React.useCallback(
+    (ctx: { catalogVariantId: string; warehouseId: string; locationId: string; quantity: number }) => {
+      if (access.canMove) {
+        setPutawayContext(ctx)
+        setMoveOpen(true)
+      }
+    },
+    [access.canMove],
+  )
+
+  if (!access.scopeReady) return null
+  if (
+    !access.canAdjust &&
+    !access.canReceive &&
+    !access.canReserve &&
+    !access.canMove &&
+    !access.canCycleCount &&
+    !access.canImport
+  ) return null
+
+  return (
+    <>
+      <SectionCard
+        title={t('wms.backend.inventory.operations.title', 'Inventory operations')}
+        description={t(
+          'wms.backend.inventory.operations.description',
+          'Receive inbound stock, reserve or move stock, post adjustments, or run a cycle count.',
+        )}
+      >
+        {access.canImport ? (
+          <Button type="button" variant="outline" onClick={() => setImportOpen(true)}>
+            <Upload className="size-4" />
+            {t('wms.backend.inventory.operations.import', 'Import CSV')}
+          </Button>
+        ) : null}
+        {access.canAdjust ? (
+          <Button type="button" variant="outline" onClick={() => setAdjustOpen(true)}>
+            <SlidersHorizontal className="size-4" />
+            {t('wms.backend.inventory.operations.adjust', 'Adjust inventory')}
+          </Button>
+        ) : null}
+        {access.canCycleCount ? (
+          <Button type="button" variant="outline" onClick={() => setCycleOpen(true)}>
+            <ClipboardList className="size-4" />
+            {t('wms.backend.inventory.operations.cycleCount', 'Cycle count')}
+          </Button>
+        ) : null}
+        {access.canMove ? (
+          <Button type="button" variant="outline" onClick={() => setMoveOpen(true)}>
+            <ArrowLeftRight className="size-4" />
+            {t('wms.backend.inventory.operations.move', 'Move stock')}
+          </Button>
+        ) : null}
+        {access.canReserve ? (
+          <Button type="button" variant="outline" onClick={() => setReserveOpen(true)}>
+            <ShieldCheck className="size-4" />
+            {t('wms.backend.inventory.operations.reserve', 'Reserve')}
+          </Button>
+        ) : null}
+        {access.canReceive ? (
+          <Button type="button" variant="default" onClick={() => setReceiveOpen(true)}>
+            <ArrowDown className="size-4" />
+            {t('wms.backend.inventory.operations.receive', 'Receive stock')}
+          </Button>
+        ) : null}
+      </SectionCard>
+      {access.canImport ? (
+        <ImportInventoryDialog open={importOpen} onOpenChange={setImportOpen} access={access} />
+      ) : null}
+      {access.canAdjust ? (
+        <AdjustInventoryDialog open={adjustOpen} onOpenChange={setAdjustOpen} access={access} />
+      ) : null}
+      {access.canReceive ? (
+        <ReceiveInventoryDialog
+          open={receiveOpen}
+          onOpenChange={setReceiveOpen}
+          access={access}
+          onSuccess={handleReceiveSuccess}
+        />
+      ) : null}
+      {access.canReserve ? (
+        <ReserveInventoryDialog open={reserveOpen} onOpenChange={setReserveOpen} access={access} />
+      ) : null}
+      {access.canMove ? (
+        <MoveInventoryDialog
+          open={moveOpen}
+          onOpenChange={(next) => {
+            setMoveOpen(next)
+            if (!next) setPutawayContext(null)
+          }}
+          access={access}
+          initialCatalogVariantId={putawayContext?.catalogVariantId}
+          initialWarehouseId={putawayContext?.warehouseId}
+          initialFromLocationId={putawayContext?.locationId}
+          movementType={putawayContext ? 'putaway' : 'transfer'}
+          lockSourceContext={Boolean(putawayContext)}
+        />
+      ) : null}
+      {access.canCycleCount ? (
+        <CycleCountWizardDialog open={cycleOpen} onOpenChange={setCycleOpen} access={access} />
+      ) : null}
+    </>
+  )
+}

package/src/modules/wms/components/backend/LocationEditDialog.tsx

@@ -0,0 +1,185 @@
+"use client"
+
+import * as React from 'react'
+import { z } from 'zod'
+import { CrudForm, type CrudField } from '@open-mercato/ui/backend/CrudForm'
+import { flash } from '@open-mercato/ui/backend/FlashMessages'
+import { useGuardedMutation } from '@open-mercato/ui/backend/injection/useGuardedMutation'
+import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { raiseCrudError } from '@open-mercato/ui/backend/utils/serverErrors'
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@open-mercato/ui/primitives/dialog'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { E } from '#generated/entities.ids.generated'
+import { flashMutationError } from '../../lib/flashMutationError'
+import { loadWarehouseOptions } from './wmsLookupLoaders'
+
+export type LocationDialogRow = {
+  id: string
+  warehouse_id?: string | null
+  warehouse_name?: string | null
+  warehouse_code?: string | null
+  code?: string | null
+  type?: string | null
+  capacity_units?: string | number | null
+  capacity_weight?: string | number | null
+  is_active?: boolean | null
+  updated_at?: string | null
+  updatedAt?: string | null
+}
+
+export type LocationFormValues = {
+  warehouseId: string
+  code: string
+  type: 'zone' | 'aisle' | 'rack' | 'bin' | 'slot' | 'dock' | 'staging'
+  capacityUnits?: number
+  capacityWeight?: number
+  isActive: boolean
+}
+
+export const locationFormSchema = z.object({
+  warehouseId: z.string().uuid(),
+  code: z.string().trim().min(1),
+  type: z.enum(['zone', 'aisle', 'rack', 'bin', 'slot', 'dock', 'staging']),
+  capacityUnits: z.coerce.number().min(0).optional(),
+  capacityWeight: z.coerce.number().min(0).optional(),
+  isActive: z.boolean().default(true),
+})
+
+type LocationEditDialogProps = {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  mode: 'create' | 'edit'
+  row?: LocationDialogRow | null
+  onSaved?: () => void | Promise<void>
+}
+
+export function LocationEditDialog({ open, onOpenChange, mode, row, onSaved }: LocationEditDialogProps) {
+  const t = useT()
+  const { runMutation } = useGuardedMutation<Record<string, unknown>>({ contextId: 'wms-config-locations' })
+  const [submitting, setSubmitting] = React.useState(false)
+
+  const warehouseSeedOptions = React.useMemo(() => {
+    if (mode !== 'edit' || !row?.warehouse_id) return undefined
+    const label = row.warehouse_name?.trim() || row.warehouse_code?.trim() || ''
+    if (!label) return undefined
+    return [{ value: row.warehouse_id, label }]
+  }, [mode, row])
+
+  const fields = React.useMemo<CrudField[]>(() => [
+    {
+      id: 'warehouseId',
+      type: 'combobox',
+      label: t('wms.backend.config.locations.form.warehouse', 'Warehouse'),
+      required: true,
+      loadOptions: loadWarehouseOptions,
+      allowCustomValues: false,
+      seedOptions: warehouseSeedOptions,
+    },
+    { id: 'code', type: 'text', label: t('wms.backend.config.locations.form.code', 'Code'), required: true },
+    {
+      id: 'type',
+      type: 'select',
+      label: t('wms.backend.config.locations.form.type', 'Type'),
+      required: true,
+      options: [
+        { value: 'zone', label: t('wms.backend.config.locations.type.zone', 'Zone') },
+        { value: 'aisle', label: t('wms.backend.config.locations.type.aisle', 'Aisle') },
+        { value: 'rack', label: t('wms.backend.config.locations.type.rack', 'Rack') },
+        { value: 'bin', label: t('wms.backend.config.locations.type.bin', 'Bin') },
+        { value: 'slot', label: t('wms.backend.config.locations.type.slot', 'Slot') },
+        { value: 'dock', label: t('wms.backend.config.locations.type.dock', 'Dock') },
+        { value: 'staging', label: t('wms.backend.config.locations.type.staging', 'Staging') },
+      ],
+    },
+    { id: 'capacityUnits', type: 'number', label: t('wms.backend.config.locations.form.capacityUnits', 'Capacity units') },
+    { id: 'capacityWeight', type: 'number', label: t('wms.backend.config.locations.form.capacityWeight', 'Capacity weight') },
+    { id: 'isActive', type: 'checkbox', label: t('wms.backend.config.locations.form.active', 'Active') },
+  ], [t, warehouseSeedOptions])
+
+  const initialValues = React.useMemo<LocationFormValues>(() => {
+    if (mode === 'edit' && row) {
+      return {
+        warehouseId: row.warehouse_id || '',
+        code: row.code || '',
+        type: (row.type as LocationFormValues['type']) || 'bin',
+        capacityUnits: row.capacity_units == null ? undefined : Number(row.capacity_units),
+        capacityWeight: row.capacity_weight == null ? undefined : Number(row.capacity_weight),
+        isActive: row.is_active !== false,
+      }
+    }
+    return {
+      warehouseId: '',
+      code: '',
+      type: 'bin',
+      capacityUnits: undefined,
+      capacityWeight: undefined,
+      isActive: true,
+    }
+  }, [mode, row])
+
+  const handleSubmit = React.useCallback(async (values: LocationFormValues) => {
+    setSubmitting(true)
+    try {
+      await runMutation({
+        operation: async () => {
+          // Opt out of apiFetch's global 403 flash so flashMutationError can
+          // surface a translated, permission-specific toast instead of a bare
+          // "Forbidden" followed by a second generic Access denied banner.
+          const call = await apiCall(
+            '/api/wms/locations',
+            {
+              method: mode === 'edit' ? 'PUT' : 'POST',
+              headers: { 'x-om-forbidden-redirect': '0' },
+              body: JSON.stringify(mode === 'edit' && row ? { id: row.id, ...values } : values),
+            },
+          )
+          if (!call.ok) {
+            await raiseCrudError(call.response, t('wms.backend.config.locations.errors.save', 'Failed to save location.'))
+          }
+          return call
+        },
+        context: {},
+        mutationPayload: mode === 'edit' && row ? { id: row.id, ...values } : values,
+      })
+      flash(
+        mode === 'edit'
+          ? t('wms.backend.config.locations.flash.updated', 'Location updated')
+          : t('wms.backend.config.locations.flash.created', 'Location created'),
+        'success',
+      )
+      onOpenChange(false)
+      await onSaved?.()
+    } catch (error) {
+      flashMutationError(error, t('wms.backend.config.locations.errors.save', 'Failed to save location.'), t)
+    } finally {
+      setSubmitting(false)
+    }
+  }, [mode, onOpenChange, onSaved, row, runMutation, t])
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-3xl">
+        <DialogHeader>
+          <DialogTitle>
+            {mode === 'edit'
+              ? t('wms.backend.config.locations.dialog.edit', 'Edit location')
+              : t('wms.backend.config.locations.dialog.create', 'Create location')}
+          </DialogTitle>
+        </DialogHeader>
+        <CrudForm<LocationFormValues>
+          schema={locationFormSchema}
+          fields={fields}
+          entityId={E.wms.warehouse_location}
+          initialValues={initialValues}
+          submitLabel={t('common.save', 'Save')}
+          onSubmit={handleSubmit}
+          embedded
+          disableInitialFocus
+          isLoading={submitting}
+          twoColumn
+          optimisticLockUpdatedAt={mode === 'edit' ? (row?.updatedAt ?? row?.updated_at ?? null) : undefined}
+        />
+      </DialogContent>
+    </Dialog>
+  )
+}