@open-mercato/core 0.6.6-develop.6257.1.6d0af84d26 → 0.6.6-develop.6286.1.d985c5c374

package/src/modules/data_sync/backend/data-sync/runs/[id]/page.tsx

@@ -5,6 +5,7 @@ import { Page, PageBody } from '@open-mercato/ui/backend/Page'
 import { FormHeader } from '@open-mercato/ui/backend/forms'
 import { Card, CardHeader, CardTitle, CardContent } from '@open-mercato/ui/primitives/card'
 import { Badge } from '@open-mercato/ui/primitives/badge'
+import { StatusBadge } from '@open-mercato/ui/primitives/status-badge'
 import { Button } from '@open-mercato/ui/primitives/button'
 import { LogList, type LogListEntry } from '@open-mercato/ui/backend/LogList'
 import { Progress } from '@open-mercato/ui/primitives/progress'
@@ -15,6 +16,7 @@ import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { LoadingMessage, ErrorMessage, RecordNotFoundState } from '@open-mercato/ui/backend/detail'
 import { useAppEvent } from '@open-mercato/ui/backend/injection/useAppEvent'
 import { RotateCcw, XCircle } from 'lucide-react'
+import { getSyncRunStatusVariant } from '../../../../lib/syncRunStatus'
 
 type SyncRunDetail = {
   id: string
@@ -69,15 +71,6 @@ function formatEtaSeconds(seconds: number): string {
   return `${hours}h ${minutes}m`
 }
 
-const STATUS_STYLES: Record<string, string> = {
-  pending: 'bg-gray-100 text-gray-800',
-  running: 'bg-blue-100 text-blue-800',
-  completed: 'bg-green-100 text-green-800',
-  failed: 'bg-red-100 text-red-800',
-  cancelled: 'bg-yellow-100 text-yellow-800',
-  paused: 'bg-orange-100 text-orange-800',
-}
-
 type SyncRunDetailPageProps = {
   params?: {
     id?: string | string[]
@@ -284,9 +277,9 @@ export default function SyncRunDetailPage({ params }: SyncRunDetailPageProps) {
           statusBadge={(
             <div className="mt-2 flex flex-wrap gap-2">
               <Badge variant="outline">{t(`data_sync.dashboard.direction.${run.direction}`)}</Badge>
-              <Badge variant="secondary" className={STATUS_STYLES[run.status] ?? ''}>
+              <StatusBadge variant={getSyncRunStatusVariant(run.status)}>
                 {t(`data_sync.dashboard.status.${run.status}`)}
-              </Badge>
+              </StatusBadge>
               {run.triggeredBy ? <Badge variant="outline">{run.triggeredBy}</Badge> : null}
             </div>
           )}
@@ -312,9 +305,9 @@ export default function SyncRunDetailPage({ params }: SyncRunDetailPageProps) {
           <CardHeader>
             <div className="flex items-center justify-between gap-3">
               <CardTitle>{t('data_sync.runs.detail.progress')}</CardTitle>
-              <Badge variant="secondary" className={STATUS_STYLES[progressStatus] ?? ''}>
+              <StatusBadge variant={getSyncRunStatusVariant(progressStatus)}>
                 {t(`data_sync.dashboard.status.${progressStatus}`)}
-              </Badge>
+              </StatusBadge>
             </div>
           </CardHeader>
           <CardContent className="space-y-3">
@@ -355,37 +348,37 @@ export default function SyncRunDetailPage({ params }: SyncRunDetailPageProps) {
         <div className="grid grid-cols-2 sm:grid-cols-4 gap-4">
           <Card>
             <CardContent className="pt-6 text-center">
-              <div className="text-2xl font-bold text-green-600">{run.createdCount}</div>
+              <div className="text-2xl font-bold text-status-success-text">{run.createdCount}</div>
               <p className="text-sm text-muted-foreground">{t('data_sync.runs.detail.counters.created')}</p>
             </CardContent>
           </Card>
           <Card>
             <CardContent className="pt-6 text-center">
-              <div className="text-2xl font-bold text-blue-600">{run.updatedCount}</div>
+              <div className="text-2xl font-bold text-status-info-text">{run.updatedCount}</div>
               <p className="text-sm text-muted-foreground">{t('data_sync.runs.detail.counters.updated')}</p>
             </CardContent>
           </Card>
           <Card>
             <CardContent className="pt-6 text-center">
-              <div className="text-2xl font-bold text-gray-600">{run.skippedCount}</div>
+              <div className="text-2xl font-bold text-muted-foreground">{run.skippedCount}</div>
               <p className="text-sm text-muted-foreground">{t('data_sync.runs.detail.counters.skipped')}</p>
             </CardContent>
           </Card>
           <Card>
             <CardContent className="pt-6 text-center">
-              <div className="text-2xl font-bold text-red-600">{run.failedCount}</div>
+              <div className="text-2xl font-bold text-status-error-text">{run.failedCount}</div>
               <p className="text-sm text-muted-foreground">{t('data_sync.runs.detail.counters.failed')}</p>
             </CardContent>
           </Card>
         </div>
 
         {run.lastError && (
-          <Card className="border-red-200 bg-red-50">
+          <Card className="border-status-error-border bg-status-error-bg">
             <CardHeader>
-              <CardTitle className="text-red-800">{t('data_sync.runs.detail.error')}</CardTitle>
+              <CardTitle className="text-status-error-text">{t('data_sync.runs.detail.error')}</CardTitle>
             </CardHeader>
             <CardContent>
-              <pre className="text-sm text-red-700 whitespace-pre-wrap">{run.lastError}</pre>
+              <pre className="text-sm text-status-error-text whitespace-pre-wrap">{run.lastError}</pre>
             </CardContent>
           </Card>
         )}

package/src/modules/data_sync/components/IntegrationScheduleTab.tsx

@@ -18,8 +18,10 @@ import {
   SelectValue,
 } from '@open-mercato/ui/primitives/select'
 import { Spinner } from '@open-mercato/ui/primitives/spinner'
+import { Switch } from '@open-mercato/ui/primitives/switch'
 import { useOrganizationScopeVersion } from '@open-mercato/shared/lib/frontend/useOrganizationScope'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { getSyncSummaryVariant } from '../lib/syncRunStatus'
 import {
   CalendarClock,
   Play,
@@ -360,13 +362,13 @@ export function IntegrationScheduleTab(props: IntegrationScheduleTabProps) {
       <div className="flex flex-wrap items-start justify-between gap-3">
         <div className="space-y-2">
           <div className="flex flex-wrap items-center gap-2">
-            <Badge variant="outline" className={props.isEnabled ? 'border-emerald-300 text-emerald-700' : 'border-amber-300 text-amber-700'}>
+            <Badge variant={getSyncSummaryVariant(props.isEnabled ? 'enabled' : 'disabled')}>
               {props.isEnabled ? <ShieldCheck className="mr-2 h-3.5 w-3.5" /> : <ShieldAlert className="mr-2 h-3.5 w-3.5" />}
               {props.isEnabled
                 ? t('data_sync.dashboard.start.status.enabled', 'Integration enabled')
                 : t('data_sync.dashboard.start.status.disabled', 'Integration disabled')}
             </Badge>
-            <Badge variant="outline" className={props.hasCredentials ? 'border-sky-300 text-sky-700' : 'border-amber-300 text-amber-700'}>
+            <Badge variant={getSyncSummaryVariant(props.hasCredentials ? 'ready' : 'missing')}>
               <CalendarClock className="mr-2 h-3.5 w-3.5" />
               {props.hasCredentials
                 ? t('data_sync.dashboard.start.status.credentialsReady', 'Credentials ready')
@@ -477,22 +479,22 @@ export function IntegrationScheduleTab(props: IntegrationScheduleTabProps) {
                     </td>
                     <td className="px-3 py-3">
                       <label className="flex min-h-10 items-center gap-2 text-sm">
-                        <input
-                          type="checkbox"
+                        <Switch
                           checked={scheduleState.fullSync}
-                          onChange={(event) => updateScheduleEditor(row.key, { fullSync: event.target.checked }, row.entityType)}
+                          onCheckedChange={(checked) => updateScheduleEditor(row.key, { fullSync: checked }, row.entityType)}
                           disabled={controlsDisabled}
+                          aria-label={t('data_sync.dashboard.start.fullSync', 'Run as full sync')}
                         />
                         <span>{t('data_sync.integrationTab.fullSyncShort', 'Full')}</span>
                       </label>
                     </td>
                     <td className="px-3 py-3">
                       <label className="flex min-h-10 items-center gap-2 text-sm">
-                        <input
-                          type="checkbox"
+                        <Switch
                           checked={scheduleState.isEnabled}
-                          onChange={(event) => updateScheduleEditor(row.key, { isEnabled: event.target.checked }, row.entityType)}
+                          onCheckedChange={(checked) => updateScheduleEditor(row.key, { isEnabled: checked }, row.entityType)}
                           disabled={controlsDisabled}
+                          aria-label={t('data_sync.dashboard.schedule.enabled', 'Schedule enabled')}
                         />
                         <span>{scheduleState.isEnabled ? t('data_sync.dashboard.schedule.status.shortEnabled', 'Scheduled') : t('data_sync.dashboard.schedule.status.shortDisabled', 'Paused')}</span>
                       </label>

package/src/modules/data_sync/lib/id-mapping.ts

@@ -1,5 +1,5 @@
 import type { EntityManager } from '@mikro-orm/postgresql'
-import { findOneWithDecryption } from '@open-mercato/shared/lib/encryption/find'
+import { findOneWithDecryption, findWithDecryption } from '@open-mercato/shared/lib/encryption/find'
 import { SyncExternalIdMapping } from '../../integrations/data/entities'
 
 type MappingScope = {
@@ -119,6 +119,63 @@ export function createExternalIdMappingService(em: EntityManager) {
       await em.persist(created).flush()
       return created
     },
+
+    async deleteExternalIdMapping(
+      integrationId: string,
+      entityType: string,
+      localId: string,
+      scope: MappingScope,
+    ): Promise<boolean> {
+      const row = await findOneWithDecryption(
+        em,
+        SyncExternalIdMapping,
+        {
+        integrationId,
+        internalEntityType: entityType,
+        internalEntityId: localId,
+        organizationId: scope.organizationId,
+        tenantId: scope.tenantId,
+        deletedAt: null,
+        },
+        undefined,
+        scope,
+      )
+      if (!row) return false
+      row.deletedAt = new Date()
+      await em.flush()
+      return true
+    },
+
+    async deleteExternalIdMappings(
+      integrationId: string,
+      entityType: string,
+      localIds: string[],
+      scope: MappingScope,
+    ): Promise<number> {
+      const uniqueLocalIds = Array.from(new Set(localIds))
+      if (uniqueLocalIds.length === 0) return 0
+      const rows = await findWithDecryption(
+        em,
+        SyncExternalIdMapping,
+        {
+        integrationId,
+        internalEntityType: entityType,
+        internalEntityId: { $in: uniqueLocalIds },
+        organizationId: scope.organizationId,
+        tenantId: scope.tenantId,
+        deletedAt: null,
+        },
+        undefined,
+        scope,
+      )
+      if (rows.length === 0) return 0
+      const now = new Date()
+      for (const row of rows) {
+        row.deletedAt = now
+      }
+      await em.flush()
+      return rows.length
+    },
   }
 }
 

package/src/modules/data_sync/lib/sync-engine.ts

@@ -435,7 +435,7 @@ export function createSyncEngine(deps: EngineDeps) {
           scope: { organizationId: scope.organizationId, tenantId: scope.tenantId },
           runId: run.id,
         })) {
-          if (run.progressJobId && await progressService.isCancellationRequested(run.progressJobId, scope.tenantId)) {
+          if (run.progressJobId && await progressService.isCancellationRequested(run.progressJobId, scope.tenantId, scope.organizationId)) {
             await finalizeRun(run.id, 'cancelled', scope, undefined, operationalTelemetry)
             return
           }
@@ -579,7 +579,7 @@ export function createSyncEngine(deps: EngineDeps) {
           scope: { organizationId: scope.organizationId, tenantId: scope.tenantId },
           runId: run.id,
         })) {
-          if (run.progressJobId && await progressService.isCancellationRequested(run.progressJobId, scope.tenantId)) {
+          if (run.progressJobId && await progressService.isCancellationRequested(run.progressJobId, scope.tenantId, scope.organizationId)) {
             await finalizeRun(run.id, 'cancelled', scope, undefined, operationalTelemetry)
             return
           }

package/src/modules/data_sync/lib/syncRunStatus.ts

@@ -0,0 +1,39 @@
+import type { StatusBadgeVariant, StatusMap } from '@open-mercato/ui/primitives/status-badge'
+
+export type SyncRunStatus = 'pending' | 'running' | 'completed' | 'failed' | 'cancelled' | 'paused'
+
+export const syncRunStatusVariants: StatusMap<SyncRunStatus> = {
+  pending: 'neutral',
+  running: 'info',
+  completed: 'success',
+  failed: 'error',
+  cancelled: 'warning',
+  paused: 'warning',
+}
+
+export function getSyncRunStatusVariant(status: string): StatusBadgeVariant {
+  return syncRunStatusVariants[status as SyncRunStatus] ?? 'neutral'
+}
+
+export type SyncSummaryKind =
+  | 'enabled'
+  | 'disabled'
+  | 'ready'
+  | 'missing'
+  | 'scheduled'
+  | 'paused'
+  | 'none'
+
+export const syncSummaryVariants: Record<SyncSummaryKind, StatusBadgeVariant> = {
+  enabled: 'success',
+  ready: 'success',
+  disabled: 'neutral',
+  missing: 'warning',
+  scheduled: 'info',
+  paused: 'warning',
+  none: 'neutral',
+}
+
+export function getSyncSummaryVariant(kind: SyncSummaryKind): StatusBadgeVariant {
+  return syncSummaryVariants[kind] ?? 'neutral'
+}

package/src/modules/entities/api/records.ts

@@ -382,6 +382,13 @@ export async function POST(req: Request) {
     if (entityKind === 'system') return systemEntityRecordsRejection(entityId)
     const isCustomEntity = entityKind === 'custom'
     await assertEntityAclForRequest({ auth, entityId, action: 'manage', isCustomEntity, rbac })
+    // Strip reserved record/system columns the edit form echoes back from the loaded record
+    // (`id`, plus `updated_at`/`updatedAt` used for optimistic locking). They are not custom
+    // fields; without this they validate as cf_id / cf_updated_at / cf_updatedAt and are
+    // rejected as "Unknown custom field", which fails EVERY custom-entity edit-form save.
+    for (const reservedKey of ['id', 'created_at', 'createdAt', 'updated_at', 'updatedAt', 'deleted_at', 'deletedAt']) {
+      delete (values as any)[reservedKey]
+    }
     const norm = normalizeValues(values)
 
     // Validate against custom field definitions
@@ -448,6 +455,13 @@ export async function PUT(req: Request) {
     if (entityKind === 'system') return systemEntityRecordsRejection(entityId)
     const isCustomEntity = entityKind === 'custom'
     await assertEntityAclForRequest({ auth, entityId, action: 'manage', isCustomEntity, rbac })
+    // Strip reserved record/system columns the edit form echoes back from the loaded record
+    // (`id`, plus `updated_at`/`updatedAt` used for optimistic locking). They are not custom
+    // fields; without this they validate as cf_id / cf_updated_at / cf_updatedAt and are
+    // rejected as "Unknown custom field", which fails EVERY custom-entity edit-form save.
+    for (const reservedKey of ['id', 'created_at', 'createdAt', 'updated_at', 'updatedAt', 'deleted_at', 'deletedAt']) {
+      delete (values as any)[reservedKey]
+    }
     const norm = normalizeValues(values)
 
     // Validate against custom field definitions

package/src/modules/feature_toggles/api/global/route.ts

@@ -49,6 +49,21 @@ const listFields = [
   'updated_at',
 ]
 
+export const transformFeatureToggleListItem = (item: Record<string, unknown>) => {
+  if (!item) return item
+  return {
+    id: item.id,
+    identifier: item.identifier,
+    name: item.name,
+    description: item.description ?? null,
+    category: item.category ?? null,
+    type: item.type,
+    defaultValue: item.default_value,
+    createdAt: item.created_at,
+    updatedAt: item.updated_at,
+  }
+}
+
 const buildFilters = (query: FeatureToggleListQuery): Record<string, unknown> => {
   const filters: Record<string, unknown> = {}
   const search = query.search?.trim()
@@ -105,20 +120,7 @@ const crud = makeCrudRoute({
       updatedAt: 'updated_at',
       type: 'type',
     },
-    transformItem: (item: Record<string, unknown>) => {
-      if (!item) return item
-      return {
-        id: item.id,
-        identifier: item.identifier,
-        name: item.name,
-        description: item.description ?? null,
-        category: item.category ?? null,
-        type: item.type,
-        defaultValue: item.default_value,
-        created_at: item.created_at,
-        updated_at: item.updated_at,
-      }
-    },
+    transformItem: transformFeatureToggleListItem,
     buildFilters: async (query) => buildFilters(query),
   },
   actions: {

package/src/modules/feature_toggles/api/openapi.ts

@@ -28,8 +28,8 @@ export const featureToggleSchema = z
         category: z.string().nullable().optional(),
         type: toggleTypeSchema,
         defaultValue: z.any().nullable().optional(),
-        created_at: z.string().optional(),
-        updated_at: z.string().optional(),
+        createdAt: z.string().nullable().optional(),
+        updatedAt: z.string().nullable().optional(),
     })
     .passthrough()
 

package/src/modules/feature_toggles/commands/global.ts

@@ -6,6 +6,7 @@ import { ToggleCreateInput, toggleCreateSchema, ToggleUpdateInput, toggleUpdateS
 import { resolveTranslations } from '@open-mercato/shared/lib/i18n/server'
 import { registerCommand } from '@open-mercato/shared/lib/commands'
 import { CrudHttpError } from '@open-mercato/shared/lib/crud/errors'
+import { enforceCommandOptimisticLock } from '@open-mercato/shared/lib/crud/optimistic-lock-command'
 import { buildChanges, emitCrudSideEffects, emitCrudUndoSideEffects, requireId } from '@open-mercato/shared/lib/commands/helpers'
 import { extractUndoPayload } from '@open-mercato/shared/lib/commands/undo'
 import { resolveRedoSnapshot } from '@open-mercato/shared/lib/commands/redo'
@@ -49,6 +50,8 @@ type ToggleUndoPayload = {
 
 const featureToggleCrudIndexer = { entityType: E.feature_toggles.feature_toggle }
 
+const FEATURE_TOGGLE_LOCK_RESOURCE_KIND = 'feature_toggles.feature_toggle'
+
 function featureToggleIdentifiers(
   toggle: FeatureToggle | ToggleSnapshot,
   ctx: { auth?: { tenantId?: string | null } | null },
@@ -217,6 +220,12 @@ const updateToggleCommand: CommandHandler<ToggleUpdateInput, { toggleId: string
     const em = (ctx.container.resolve('em') as EntityManager).fork()
     const toggle = await em.findOne(FeatureToggle, { id: parsed.id, deletedAt: null })
     if (!toggle) throw new CrudHttpError(404, { error: 'Toggle not found' })
+    enforceCommandOptimisticLock({
+      resourceKind: FEATURE_TOGGLE_LOCK_RESOURCE_KIND,
+      resourceId: toggle.id,
+      current: toggle.updatedAt ?? null,
+      request: ctx.request ?? null,
+    })
     const previousIdentifier = toggle.identifier
     if (parsed.identifier && parsed.identifier !== toggle.identifier) {
       const existing = await em.findOne(FeatureToggle, { identifier: parsed.identifier })
@@ -344,6 +353,12 @@ const deleteToggleCommand: CommandHandler<{ body?: Record<string, unknown>; quer
     const em = (ctx.container.resolve('em') as EntityManager).fork()
     const toggle = await em.findOne(FeatureToggle, { id, deletedAt: null })
     if (!toggle) throw new CrudHttpError(404, { error: 'Feature toggle not found' })
+    enforceCommandOptimisticLock({
+      resourceKind: FEATURE_TOGGLE_LOCK_RESOURCE_KIND,
+      resourceId: toggle.id,
+      current: toggle.updatedAt ?? null,
+      request: ctx.request ?? null,
+    })
     const featureTogglesService = ctx.container.resolve('featureTogglesService') as FeatureTogglesService
     await featureTogglesService.invalidateIsEnabledCacheByIdentifierTag(toggle.identifier)
 

package/src/modules/inbox_ops/backend/inbox-ops/page.tsx

@@ -148,6 +148,13 @@ export default function InboxOpsProposalsPage() {
     if (initialLoadComplete) loadProposals()
   }, [page, statusFilter, categoryFilter, search, scopeVersion]) // eslint-disable-line react-hooks/exhaustive-deps
 
+  React.useEffect(() => {
+    if (initialLoadComplete) {
+      loadCounts()
+      loadSettings()
+    }
+  }, [scopeVersion]) // eslint-disable-line react-hooks/exhaustive-deps
+
   const handleCopyAddress = React.useCallback(() => {
     if (settings?.inboxAddress) {
       navigator.clipboard.writeText(settings.inboxAddress)

package/src/modules/messages/components/message-detail/hooks/useMessageDetails.ts

@@ -61,7 +61,9 @@ export function useMessageDetails(id: string) {
     attachments: queryState.attachments,
     isArchived,
     onDeleted: () => router.push('/backend/messages'),
+    onMarkedUnread: () => router.push('/backend/messages'),
     refreshDetailWithoutAutoMarkRead: queryState.refreshDetailWithoutAutoMarkRead,
+    suppressAutoMarkRead: queryState.suppressAutoMarkRead,
   })
 
   const conversationState = useMessageDetailsConversation({

package/src/modules/messages/components/message-detail/hooks/useMessageDetailsActions.ts

@@ -18,6 +18,7 @@ import { isSafeNavigationHref, parseObjectActionId, toErrorMessage } from '../ut
 
 type RequestAndRefreshOptions = {
   skipDetailAutoMarkRead?: boolean
+  onSuccess?: () => void
 }
 
 type ConversationActionKind =
@@ -42,7 +43,9 @@ type UseMessageDetailsActionsInput = {
   attachments: MessageAttachment[] | undefined
   isArchived: boolean
   onDeleted: () => void
+  onMarkedUnread: () => void
   refreshDetailWithoutAutoMarkRead: () => Promise<MessageDetail | null>
+  suppressAutoMarkRead: () => void
 }
 
 export function useMessageDetailsActions({
@@ -53,7 +56,9 @@ export function useMessageDetailsActions({
   attachments,
   isArchived,
   onDeleted,
+  onMarkedUnread,
   refreshDetailWithoutAutoMarkRead,
+  suppressAutoMarkRead,
 }: UseMessageDetailsActionsInput) {
   const [replyOpen, setReplyOpen] = React.useState(false)
   const [forwardOpen, setForwardOpen] = React.useState(false)
@@ -93,6 +98,7 @@ export function useMessageDetailsActions({
         context: { resourceKind: 'message', messageId: id, action: 'state-change', retryLastMutation },
         mutationPayload: { messageId: id, action: 'state-change', url, method },
       })
+      options?.onSuccess?.()
     } catch (err) {
       flash(
         err instanceof Error
@@ -203,14 +209,15 @@ export function useMessageDetailsActions({
   }, [id, runConversationAction, t])
 
   const markConversationUnread = React.useCallback(async (messageId?: string) => {
+    suppressAutoMarkRead()
     const targetMessageId = messageId ?? id
     await runConversationAction('markAllUnread', {
       url: `/api/messages/${encodeURIComponent(targetMessageId)}/conversation/read`,
       method: 'DELETE',
       successMessage: t('messages.flash.conversationMarkedUnread', 'Conversation marked unread.'),
-      skipDetailAutoMarkRead: true,
+      onSuccess: onMarkedUnread,
     })
-  }, [id, runConversationAction, t])
+  }, [id, onMarkedUnread, runConversationAction, suppressAutoMarkRead, t])
 
   const markConversationRead = React.useCallback(async (messageId?: string) => {
     const targetMessageId = messageId ?? id
@@ -385,12 +392,15 @@ export function useMessageDetailsActions({
   }, [detail?.actionData?.actions])
 
   const toggleRead = React.useCallback(async () => {
+    if (detail?.isRead) {
+      suppressAutoMarkRead()
+    }
     await requestAndRefresh(
       `/api/messages/${encodeURIComponent(id)}/read`,
       detail?.isRead ? 'DELETE' : 'PUT',
-      detail?.isRead ? { skipDetailAutoMarkRead: true } : undefined,
+      detail?.isRead ? { skipDetailAutoMarkRead: true, onSuccess: onMarkedUnread } : undefined,
     )
-  }, [detail?.isRead, id, requestAndRefresh])
+  }, [detail?.isRead, id, onMarkedUnread, requestAndRefresh, suppressAutoMarkRead])
 
   const toggleArchive = React.useCallback(async () => {
     await requestAndRefresh(

package/src/modules/messages/components/message-detail/hooks/useMessageDetailsQueries.ts

@@ -26,10 +26,19 @@ export function useMessageDetailsQueries({
     [id, scopeVersion],
   )
 
+  const suppressAutoMarkReadRef = React.useRef(false)
+
+  React.useEffect(() => {
+    suppressAutoMarkReadRef.current = false
+  }, [id])
+
   const detailQuery = useQuery<MessageDetail | null>({
     queryKey: detailQueryKey,
     queryFn: async () => {
-      const call = await apiCall<MessageDetail>(`/api/messages/${encodeURIComponent(id)}`)
+      const detailUrl = suppressAutoMarkReadRef.current
+        ? `/api/messages/${encodeURIComponent(id)}?skipMarkRead=1`
+        : `/api/messages/${encodeURIComponent(id)}`
+      const call = await apiCall<MessageDetail>(detailUrl)
       if (call.status === 404) {
         return null
       }
@@ -97,6 +106,10 @@ export function useMessageDetailsQueries({
     return call.result
   }, [detailQueryKey, id, queryClient, t])
 
+  const suppressAutoMarkRead = React.useCallback(() => {
+    suppressAutoMarkReadRef.current = true
+  }, [])
+
   const listItemComponentKey = detail?.typeDefinition.ui?.listItemComponent ?? null
   const contentComponentKey = detail?.typeDefinition.ui?.contentComponent ?? null
   const actionsComponentKey = detail?.typeDefinition.ui?.actionsComponent ?? null
@@ -111,6 +124,7 @@ export function useMessageDetailsQueries({
     attachmentsQuery,
     attachments,
     refreshDetailWithoutAutoMarkRead,
+    suppressAutoMarkRead,
     listItemComponentKey,
     contentComponentKey,
     actionsComponentKey,

package/src/modules/payment_gateways/api/cancel/route.ts

@@ -2,6 +2,7 @@ import { NextResponse } from 'next/server'
 import { getAuthFromRequest } from '@open-mercato/shared/lib/auth/server'
 import { createRequestContainer } from '@open-mercato/shared/lib/di/container'
 import { readJsonSafe } from '@open-mercato/shared/lib/http/readJsonSafe'
+import { isCrudHttpError } from '@open-mercato/shared/lib/crud/errors'
 import { cancelSchema } from '../../data/validators'
 import type { PaymentGatewayService } from '../../lib/gateway-service'
 import { paymentGatewaysTag } from '../openapi'
@@ -73,6 +74,9 @@ export async function POST(req: Request) {
     })
     return NextResponse.json(result)
   } catch (err: unknown) {
+    if (isCrudHttpError(err)) {
+      return NextResponse.json(err.body, { status: err.status })
+    }
     const message = err instanceof Error ? err.message : 'Cancel failed'
     return NextResponse.json({ error: message }, { status: 502 })
   }
@@ -87,6 +91,7 @@ export const openApi = {
       tags: [paymentGatewaysTag],
       responses: [
         { status: 200, description: 'Payment cancelled' },
+        { status: 409, description: 'Invalid payment status transition' },
         { status: 422, description: 'Invalid payload' },
         { status: 502, description: 'Gateway provider error' },
       ],

package/src/modules/payment_gateways/api/capture/route.ts

@@ -2,6 +2,7 @@ import { NextResponse } from 'next/server'
 import { getAuthFromRequest } from '@open-mercato/shared/lib/auth/server'
 import { createRequestContainer } from '@open-mercato/shared/lib/di/container'
 import { readJsonSafe } from '@open-mercato/shared/lib/http/readJsonSafe'
+import { isCrudHttpError } from '@open-mercato/shared/lib/crud/errors'
 import { captureSchema } from '../../data/validators'
 import type { PaymentGatewayService } from '../../lib/gateway-service'
 import { paymentGatewaysTag } from '../openapi'
@@ -73,6 +74,9 @@ export async function POST(req: Request) {
     })
     return NextResponse.json(result)
   } catch (err: unknown) {
+    if (isCrudHttpError(err)) {
+      return NextResponse.json(err.body, { status: err.status })
+    }
     const message = err instanceof Error ? err.message : 'Capture failed'
     return NextResponse.json({ error: message }, { status: 502 })
   }
@@ -87,6 +91,7 @@ export const openApi = {
       tags: [paymentGatewaysTag],
       responses: [
         { status: 200, description: 'Payment captured' },
+        { status: 409, description: 'Invalid payment status transition' },
         { status: 422, description: 'Invalid payload' },
         { status: 502, description: 'Gateway provider error' },
       ],

package/src/modules/payment_gateways/api/refund/route.ts

@@ -2,6 +2,7 @@ import { NextResponse } from 'next/server'
 import { getAuthFromRequest } from '@open-mercato/shared/lib/auth/server'
 import { createRequestContainer } from '@open-mercato/shared/lib/di/container'
 import { readJsonSafe } from '@open-mercato/shared/lib/http/readJsonSafe'
+import { isCrudHttpError } from '@open-mercato/shared/lib/crud/errors'
 import { refundSchema } from '../../data/validators'
 import type { PaymentGatewayService } from '../../lib/gateway-service'
 import { paymentGatewaysTag } from '../openapi'
@@ -74,6 +75,9 @@ export async function POST(req: Request) {
     })
     return NextResponse.json(result)
   } catch (err: unknown) {
+    if (isCrudHttpError(err)) {
+      return NextResponse.json(err.body, { status: err.status })
+    }
     const message = err instanceof Error ? err.message : 'Refund failed'
     return NextResponse.json({ error: message }, { status: 502 })
   }
@@ -88,6 +92,7 @@ export const openApi = {
       tags: [paymentGatewaysTag],
       responses: [
         { status: 200, description: 'Payment refunded' },
+        { status: 409, description: 'Invalid payment status transition' },
         { status: 422, description: 'Invalid payload' },
         { status: 502, description: 'Gateway provider error' },
       ],