@open-mercato/core 0.8.1-develop.7228.1.b7ea09d2d3 → 0.8.1-develop.7238.1.3abe669ea5

package/src/modules/availability/backend/availability/policies/create/page.tsx

@@ -0,0 +1,105 @@
+"use client"
+import * as React from 'react'
+import { useRouter } from 'next/navigation'
+import { CrudForm } from '@open-mercato/ui/backend/CrudForm'
+import { createCrud } from '@open-mercato/ui/backend/utils/crud'
+import { createCrudFormError } from '@open-mercato/ui/backend/utils/serverErrors'
+import { flash } from '@open-mercato/ui/backend/FlashMessages'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { useOrganizationScopeDetail } from '@open-mercato/shared/lib/frontend/useOrganizationScope'
+import { ScopeFields, type PolicyScope } from '../ScopeFields'
+import { ResolutionPreviewPanel } from '../ResolutionPreviewPanel'
+import { buildPolicyFieldGroups } from '../formGroups'
+
+type FormValues = {
+  isStockManaged?: boolean
+  allowBackorder?: boolean
+  backorderLeadTimeDays?: number | string | null
+  preorderReleaseAt?: string | null
+  lowStockThreshold?: number | string | null
+  minOrderQuantity?: number | string | null
+  maxOrderQuantity?: number | string | null
+  quantityIncrement?: number | string | null
+  hideWhenOutOfStock?: boolean
+  isActive?: boolean
+}
+
+function toNullableInt(value: number | string | null | undefined): number | null {
+  if (value === null || value === undefined || value === '') return null
+  const parsed = typeof value === 'number' ? value : parseInt(value, 10)
+  return Number.isFinite(parsed) ? parsed : null
+}
+
+export default function AvailabilityPolicyCreatePage() {
+  const t = useT()
+  const router = useRouter()
+  const { organizationId, tenantId } = useOrganizationScopeDetail()
+  const [scope, setScope] = React.useState<PolicyScope>({ productId: '', variantId: '', storeId: '' })
+
+  const groups = React.useMemo(() => buildPolicyFieldGroups(t), [t])
+
+  return (
+    <CrudForm<FormValues>
+      title={t('availability.policies.create.title')}
+      titleHeadingLevel={1}
+      backHref="/backend/availability/policies"
+      fields={[]}
+      groups={groups}
+      submitLabel={t('availability.policies.form.action.create')}
+      cancelHref="/backend/availability/policies"
+      contentHeader={(
+        <div className="space-y-4">
+          <ScopeFields value={scope} onChange={setScope} />
+          <ResolutionPreviewPanel
+            productId={scope.productId}
+            variantId={scope.variantId || null}
+            storeId={scope.storeId || null}
+          />
+        </div>
+      )}
+      onSubmit={async (values) => {
+        if (scope.variantId && !scope.productId) {
+          throw createCrudFormError(
+            t('availability.policies.errors.variantRequiresProduct'),
+            { productId: t('availability.policies.errors.variantRequiresProduct') },
+          )
+        }
+        if (values.allowBackorder && toNullableInt(values.backorderLeadTimeDays) == null) {
+          throw createCrudFormError(
+            t('availability.policies.errors.backorderRequiresLeadTime'),
+            { backorderLeadTimeDays: t('availability.policies.errors.backorderRequiresLeadTime') },
+          )
+        }
+        const min = toNullableInt(values.minOrderQuantity)
+        const max = toNullableInt(values.maxOrderQuantity)
+        if (min != null && max != null && max < min) {
+          throw createCrudFormError(
+            t('availability.policies.errors.maxBelowMin'),
+            { maxOrderQuantity: t('availability.policies.errors.maxBelowMin') },
+          )
+        }
+
+        const payload = {
+          organizationId,
+          tenantId,
+          productId: scope.productId || null,
+          variantId: scope.variantId || null,
+          storeId: scope.storeId || null,
+          isStockManaged: !!values.isStockManaged,
+          allowBackorder: !!values.allowBackorder,
+          backorderLeadTimeDays: toNullableInt(values.backorderLeadTimeDays),
+          preorderReleaseAt: values.preorderReleaseAt || null,
+          lowStockThreshold: toNullableInt(values.lowStockThreshold),
+          minOrderQuantity: min,
+          maxOrderQuantity: max,
+          quantityIncrement: toNullableInt(values.quantityIncrement),
+          hideWhenOutOfStock: !!values.hideWhenOutOfStock,
+          isActive: values.isActive !== false,
+        }
+        await createCrud('availability/policies', payload)
+        flash(t('availability.policies.flash.created'), 'success')
+        router.push('/backend/availability/policies')
+      }}
+    />
+  )
+}

package/src/modules/availability/backend/availability/policies/formGroups.ts

@@ -0,0 +1,77 @@
+import type { CrudFormGroup } from '@open-mercato/ui/backend/CrudForm'
+
+/**
+ * Shared field groups for the create and edit policy forms. Scope fields
+ * (productId/variantId/storeId) live outside this list — see `ScopeFields`.
+ */
+export function buildPolicyFieldGroups(t: (key: string) => string): CrudFormGroup[] {
+  return [
+    {
+      id: 'sell-policy',
+      column: 1,
+      title: t('availability.policies.form.group.sellPolicy'),
+      fields: [
+        {
+          id: 'isStockManaged',
+          type: 'checkbox',
+          label: t('availability.policies.form.field.isStockManaged'),
+          description: t('availability.policies.form.field.isStockManaged.help'),
+        },
+        {
+          id: 'allowBackorder',
+          type: 'checkbox',
+          label: t('availability.policies.form.field.allowBackorder'),
+        },
+        {
+          id: 'backorderLeadTimeDays',
+          type: 'number',
+          label: t('availability.policies.form.field.backorderLeadTimeDays'),
+          description: t('availability.policies.form.field.backorderLeadTimeDays.help'),
+        },
+        {
+          id: 'preorderReleaseAt',
+          type: 'datetime-local',
+          label: t('availability.policies.form.field.preorderReleaseAt'),
+        },
+      ],
+    },
+    {
+      id: 'thresholds',
+      column: 2,
+      title: t('availability.policies.form.group.thresholds'),
+      fields: [
+        {
+          id: 'lowStockThreshold',
+          type: 'number',
+          label: t('availability.policies.form.field.lowStockThreshold'),
+        },
+        {
+          id: 'minOrderQuantity',
+          type: 'number',
+          label: t('availability.policies.form.field.minOrderQuantity'),
+        },
+        {
+          id: 'maxOrderQuantity',
+          type: 'number',
+          label: t('availability.policies.form.field.maxOrderQuantity'),
+        },
+        {
+          id: 'quantityIncrement',
+          type: 'number',
+          label: t('availability.policies.form.field.quantityIncrement'),
+        },
+        {
+          id: 'hideWhenOutOfStock',
+          type: 'checkbox',
+          label: t('availability.policies.form.field.hideWhenOutOfStock'),
+        },
+        {
+          id: 'isActive',
+          type: 'checkbox',
+          label: t('availability.policies.form.field.isActive'),
+          defaultValue: true,
+        },
+      ],
+    },
+  ]
+}

package/src/modules/availability/backend/availability/policies/page.meta.ts

@@ -0,0 +1,12 @@
+export const metadata = {
+  requireAuth: true,
+  requireFeatures: ['availability.policies.view'],
+  pageTitle: 'Availability Policies',
+  pageTitleKey: 'availability.policies.nav.title',
+  pageGroup: 'Availability',
+  pageGroupKey: 'availability.nav.group',
+  pageOrder: 10,
+  pageContext: 'settings' as const,
+  icon: 'boxes',
+  breadcrumb: [{ label: 'Availability Policies', labelKey: 'availability.policies.nav.title' }],
+}

package/src/modules/availability/backend/availability/policies/page.tsx

@@ -0,0 +1,196 @@
+"use client"
+import * as React from 'react'
+import Link from 'next/link'
+import { Page, PageBody } from '@open-mercato/ui/backend/Page'
+import { DataTable } from '@open-mercato/ui/backend/DataTable'
+import type { LegacyColumnDef as ColumnDef } from '@tanstack/react-table/legacy'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { RowActions } from '@open-mercato/ui/backend/RowActions'
+import { apiCall, withScopedApiRequestHeaders } from '@open-mercato/ui/backend/utils/apiCall'
+import { buildOptimisticLockHeader } from '@open-mercato/ui/backend/utils/optimisticLock'
+import { flash } from '@open-mercato/ui/backend/FlashMessages'
+import { useOrganizationScopeVersion } from '@open-mercato/shared/lib/frontend/useOrganizationScope'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { useConfirmDialog } from '@open-mercato/ui/backend/confirm-dialog'
+import type { FilterDef, FilterValues } from '@open-mercato/ui/backend/FilterBar'
+
+type Row = {
+  id: string
+  storeId: string | null
+  productId: string | null
+  variantId: string | null
+  isStockManaged: boolean
+  allowBackorder: boolean
+  isActive: boolean
+  updatedAt: string | null
+}
+
+type ResponsePayload = {
+  items: Row[]
+  total: number
+  page?: number
+  pageSize?: number
+  totalPages: number
+  totalIsCapped?: boolean
+}
+
+function ScopeCell({ value, allLabel }: { value: string | null; allLabel: string }) {
+  if (!value) return <span className="text-muted-foreground">{allLabel}</span>
+  return <code className="text-xs">{value}</code>
+}
+
+export default function AvailabilityPoliciesListPage() {
+  const [rows, setRows] = React.useState<Row[]>([])
+  const [page, setPage] = React.useState(1)
+  const [total, setTotal] = React.useState(0)
+  const [totalPages, setTotalPages] = React.useState(1)
+  const [totalIsCapped, setTotalIsCapped] = React.useState(false)
+  const [isLoading, setIsLoading] = React.useState(true)
+  const [reloadToken, setReloadToken] = React.useState(0)
+  const scopeVersion = useOrganizationScopeVersion()
+  const t = useT()
+  const { confirm, ConfirmDialogElement } = useConfirmDialog()
+  const [filterValues, setFilterValues] = React.useState<FilterValues>({})
+
+  const filters = React.useMemo<FilterDef[]>(() => [
+    { id: 'productId', label: t('availability.policies.list.columns.product'), type: 'text' },
+    { id: 'storeId', label: t('availability.policies.list.columns.store'), type: 'text' },
+    {
+      id: 'isActive',
+      label: t('availability.policies.list.columns.active'),
+      type: 'select',
+      options: [
+        { value: 'true', label: t('common.yes') },
+        { value: 'false', label: t('common.no') },
+      ],
+    },
+  ], [t])
+
+  React.useEffect(() => {
+    let cancelled = false
+    async function load() {
+      setIsLoading(true)
+      try {
+        const params = new URLSearchParams()
+        params.set('page', String(page))
+        params.set('pageSize', '50')
+        const productId = typeof filterValues.productId === 'string' ? filterValues.productId.trim() : ''
+        const storeId = typeof filterValues.storeId === 'string' ? filterValues.storeId.trim() : ''
+        const isActive = typeof filterValues.isActive === 'string' ? filterValues.isActive : ''
+        if (productId) params.set('productId', productId)
+        if (storeId) params.set('storeId', storeId)
+        if (isActive) params.set('isActive', isActive)
+        const fallback: ResponsePayload = { items: [], total: 0, page, totalPages: 1 }
+        const call = await apiCall<ResponsePayload>(`/api/availability/policies?${params.toString()}`, undefined, { fallback })
+        if (!call.ok) {
+          const errorPayload = call.result as { error?: string } | undefined
+          const message = typeof errorPayload?.error === 'string' ? errorPayload.error : t('availability.policies.list.error.loadFailed')
+          flash(message, 'error')
+          return
+        }
+        const payload = call.result ?? fallback
+        if (!cancelled) {
+          setRows(Array.isArray(payload.items) ? payload.items : [])
+          setTotal(payload.total || 0)
+          setTotalPages(payload.totalPages || 1)
+          setTotalIsCapped(payload?.totalIsCapped === true)
+        }
+      } catch (error) {
+        if (!cancelled) {
+          const message = error instanceof Error ? error.message : t('availability.policies.list.error.loadFailed')
+          flash(message, 'error')
+        }
+      } finally {
+        if (!cancelled) setIsLoading(false)
+      }
+    }
+    load()
+    return () => { cancelled = true }
+  }, [page, reloadToken, scopeVersion, filterValues, t])
+
+  const handleDelete = React.useCallback(async (row: Row) => {
+    const confirmed = await confirm({ title: t('availability.policies.list.confirmDelete'), variant: 'destructive' })
+    if (!confirmed) return
+    try {
+      const call = await withScopedApiRequestHeaders(buildOptimisticLockHeader(row.updatedAt), () =>
+        apiCall<{ error?: string }>(`/api/availability/policies?id=${encodeURIComponent(row.id)}`, { method: 'DELETE' }, { fallback: null }),
+      )
+      if (!call.ok) {
+        const errorPayload = call.result as { error?: string } | undefined
+        const message = typeof errorPayload?.error === 'string' ? errorPayload.error : t('availability.policies.list.error.deleteFailed')
+        flash(message, 'error')
+        return
+      }
+      flash(t('availability.policies.list.success.deleted'), 'success')
+      setReloadToken((token) => token + 1)
+    } catch (error) {
+      const message = error instanceof Error ? error.message : t('availability.policies.list.error.deleteFailed')
+      flash(message, 'error')
+    }
+  }, [confirm, t])
+
+  const columns = React.useMemo<ColumnDef<Row>[]>(() => [
+    {
+      accessorKey: 'productId',
+      header: t('availability.policies.list.columns.product'),
+      cell: ({ row }) => <ScopeCell value={row.original.productId} allLabel={t('availability.policies.list.storeDefault')} />,
+    },
+    {
+      accessorKey: 'variantId',
+      header: t('availability.policies.list.columns.variant'),
+      cell: ({ row }) => <ScopeCell value={row.original.variantId} allLabel={t('availability.policies.list.allVariants')} />,
+    },
+    {
+      accessorKey: 'storeId',
+      header: t('availability.policies.list.columns.store'),
+      cell: ({ row }) => <ScopeCell value={row.original.storeId} allLabel={t('availability.policies.list.allStores')} />,
+    },
+    {
+      accessorKey: 'isStockManaged',
+      header: t('availability.policies.list.columns.stockManaged'),
+      cell: ({ row }) => (row.original.isStockManaged ? t('common.yes') : t('common.no')),
+    },
+    {
+      accessorKey: 'allowBackorder',
+      header: t('availability.policies.list.columns.backorder'),
+      cell: ({ row }) => (row.original.allowBackorder ? t('common.yes') : t('common.no')),
+    },
+    {
+      accessorKey: 'isActive',
+      header: t('availability.policies.list.columns.active'),
+      cell: ({ row }) => (row.original.isActive ? t('common.yes') : t('common.no')),
+    },
+  ], [t])
+
+  return (
+    <Page>
+      <PageBody>
+        <DataTable
+          title={t('availability.policies.list.title')}
+          titleHeadingLevel={1}
+          actions={(
+            <Button asChild>
+              <Link href="/backend/availability/policies/create">{t('availability.policies.list.actions.create')}</Link>
+            </Button>
+          )}
+          columns={columns}
+          data={rows}
+          filters={filters}
+          filterValues={filterValues}
+          onFiltersApply={(values) => { setFilterValues(values); setPage(1) }}
+          onFiltersClear={() => { setFilterValues({}); setPage(1) }}
+          perspective={{ tableId: 'availability.policies.list' }}
+          rowActions={(row) => (
+            <RowActions items={[
+              { id: 'edit', label: t('common.edit'), href: `/backend/availability/policies/${row.id}` },
+              { id: 'delete', label: t('common.delete'), destructive: true, onSelect: () => { void handleDelete(row) } },
+            ]} />
+          )}
+          pagination={{ page, pageSize: 50, total, totalPages, totalIsCapped, onPageChange: setPage }}
+          isLoading={isLoading}
+        />
+      </PageBody>
+      {ConfirmDialogElement}
+    </Page>
+  )
+}