@open-mercato/core 0.6.4-develop.4121.1.0d7f20d229 → 0.6.4-develop.4133.1.48fc6c8f7b

package/src/modules/dashboards/api/widgets/data/schema.ts

@@ -0,0 +1,90 @@
+import { z } from 'zod'
+
+export const aggregateFunctionSchema = z.enum(['count', 'sum', 'avg', 'min', 'max'])
+export const dateGranularitySchema = z.enum(['day', 'week', 'month', 'quarter', 'year'])
+export const dateRangePresetSchema = z.enum([
+  'today',
+  'yesterday',
+  'this_week',
+  'last_week',
+  'this_month',
+  'last_month',
+  'this_quarter',
+  'last_quarter',
+  'this_year',
+  'last_year',
+  'last_7_days',
+  'last_30_days',
+  'last_90_days',
+])
+
+export const filterOperatorSchema = z.enum([
+  'eq',
+  'neq',
+  'gt',
+  'gte',
+  'lt',
+  'lte',
+  'in',
+  'not_in',
+  'is_null',
+  'is_not_null',
+])
+
+export const widgetDataRequestSchema = z.object({
+  entityType: z.string().min(1),
+  metric: z.object({
+    field: z.string().min(1),
+    aggregate: aggregateFunctionSchema,
+  }),
+  groupBy: z
+    .object({
+      field: z.string().min(1),
+      granularity: dateGranularitySchema.optional(),
+      limit: z.number().int().min(1).max(100).optional(),
+      resolveLabels: z.boolean().optional(),
+    })
+    .optional(),
+  filters: z
+    .array(
+      z.object({
+        field: z.string().min(1),
+        operator: filterOperatorSchema,
+        value: z.unknown().optional(),
+      }),
+    )
+    .optional(),
+  dateRange: z
+    .object({
+      field: z.string().min(1),
+      preset: dateRangePresetSchema,
+    })
+    .optional(),
+  comparison: z
+    .object({
+      type: z.enum(['previous_period', 'previous_year']),
+    })
+    .optional(),
+})
+
+export const widgetDataItemSchema = z.object({
+  groupKey: z.unknown(),
+  groupLabel: z.string().optional(),
+  value: z.number().nullable(),
+})
+
+export const widgetDataResponseSchema = z.object({
+  value: z.number().nullable(),
+  data: z.array(widgetDataItemSchema),
+  comparison: z
+    .object({
+      value: z.number().nullable(),
+      change: z.number(),
+      direction: z.enum(['up', 'down', 'unchanged']),
+    })
+    .optional(),
+  metadata: z.object({
+    fetchedAt: z.string(),
+    recordCount: z.number(),
+  }),
+})

package/src/modules/dashboards/lib/widgetDataBatch.ts

@@ -0,0 +1,89 @@
+import type { WidgetDataRequest, WidgetDataResponse } from '../services/widgetDataService'
+
+export type WidgetDataBatchEntry = {
+  id: string
+  request: WidgetDataRequest
+}
+
+export type WidgetDataBatchResult =
+  | { id: string; ok: true; data: WidgetDataResponse }
+  | { id: string; ok: false; error: string }
+
+export type WidgetDataBatchDeps = {
+  getRequiredFeatures: (entityType: string) => string[] | null
+  checkFeatures: (features: string[]) => Promise<boolean>
+  fetchOne: (request: WidgetDataRequest) => Promise<WidgetDataResponse>
+  describeError: (error: unknown) => string
+}
+
+/**
+ * Resolves per-entity-type feature access for a batch of widget requests while
+ * collapsing the common case to a single RBAC resolution. The happy path checks
+ * the union of all required features once; only when the union check fails do we
+ * fall back to per-entity-type checks so a single privileged entity type does
+ * not reject widgets the caller is allowed to see.
+ */
+export async function resolveEntityFeatureAccess(
+  entityTypes: string[],
+  getRequiredFeatures: (entityType: string) => string[] | null,
+  checkFeatures: (features: string[]) => Promise<boolean>,
+): Promise<Map<string, boolean>> {
+  const access = new Map<string, boolean>()
+  const featuresByEntity = new Map<string, string[]>()
+  const unionFeatures = new Set<string>()
+
+  for (const entityType of new Set(entityTypes)) {
+    const features = getRequiredFeatures(entityType) ?? []
+    featuresByEntity.set(entityType, features)
+    if (features.length === 0) {
+      access.set(entityType, true)
+    } else {
+      for (const feature of features) unionFeatures.add(feature)
+    }
+  }
+
+  const gated = [...featuresByEntity.entries()].filter(([, features]) => features.length > 0)
+  if (gated.length === 0) return access
+
+  if (await checkFeatures([...unionFeatures])) {
+    for (const [entityType] of gated) access.set(entityType, true)
+    return access
+  }
+
+  for (const [entityType, features] of gated) {
+    access.set(entityType, await checkFeatures(features))
+  }
+  return access
+}
+
+/**
+ * Runs a batch of widget-data requests against shared request-scoped
+ * dependencies (a single container, RBAC resolution, org-scope, and EM fork).
+ * Feature access is resolved once up front; each request is then executed
+ * concurrently with per-widget error isolation so one bad request never fails
+ * the whole batch.
+ */
+export async function runWidgetDataBatch(
+  entries: WidgetDataBatchEntry[],
+  deps: WidgetDataBatchDeps,
+): Promise<WidgetDataBatchResult[]> {
+  const access = await resolveEntityFeatureAccess(
+    entries.map((entry) => entry.request.entityType),
+    deps.getRequiredFeatures,
+    deps.checkFeatures,
+  )
+
+  return Promise.all(
+    entries.map(async (entry): Promise<WidgetDataBatchResult> => {
+      if (access.get(entry.request.entityType) === false) {
+        return { id: entry.id, ok: false, error: 'Forbidden' }
+      }
+      try {
+        const data = await deps.fetchOne(entry.request)
+        return { id: entry.id, ok: true, data }
+      } catch (error) {
+        return { id: entry.id, ok: false, error: deps.describeError(error) }
+      }
+    }),
+  )
+}

package/src/modules/dashboards/widgets/dashboard/aov-kpi/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { KpiCard, type KpiTrend } from '@open-mercato/ui/backend/charts'
 import {
@@ -15,7 +15,7 @@ import { DEFAULT_SETTINGS, hydrateSettings, type AovKpiSettings } from './config
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 import { formatCurrencyWithDecimals } from '../../../lib/formatters'
 
-async function fetchAovData(settings: AovKpiSettings): Promise<WidgetDataResponse> {
+async function fetchAovData(settings: AovKpiSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -29,18 +29,7 @@ async function fetchAovData(settings: AovKpiSettings): Promise<WidgetDataRespons
     comparison: settings.showComparison ? { type: 'previous_period' } : undefined,
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch AOV data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const AovKpiWidget: React.FC<DashboardWidgetComponentProps<AovKpiSettings>> = ({
@@ -57,12 +46,13 @@ const AovKpiWidget: React.FC<DashboardWidgetComponentProps<AovKpiSettings>> = ({
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const data = await fetchAovData(hydrated)
+      const data = await fetchAovData(hydrated, fetchWidgetData)
       setValue(data.value)
       if (data.comparison) {
         setTrend({
@@ -79,7 +69,7 @@ const AovKpiWidget: React.FC<DashboardWidgetComponentProps<AovKpiSettings>> = ({
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/new-customers-kpi/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { KpiCard, type KpiTrend } from '@open-mercato/ui/backend/charts'
 import {
@@ -14,7 +14,7 @@ import {
 import { DEFAULT_SETTINGS, hydrateSettings, type NewCustomersKpiSettings } from './config'
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 
-async function fetchNewCustomersData(settings: NewCustomersKpiSettings): Promise<WidgetDataResponse> {
+async function fetchNewCustomersData(settings: NewCustomersKpiSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'customers:entities',
     metric: {
@@ -28,18 +28,7 @@ async function fetchNewCustomersData(settings: NewCustomersKpiSettings): Promise
     comparison: settings.showComparison ? { type: 'previous_period' } : undefined,
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch new customers data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const NewCustomersKpiWidget: React.FC<DashboardWidgetComponentProps<NewCustomersKpiSettings>> = ({
@@ -56,12 +45,13 @@ const NewCustomersKpiWidget: React.FC<DashboardWidgetComponentProps<NewCustomers
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const data = await fetchNewCustomersData(hydrated)
+      const data = await fetchNewCustomersData(hydrated, fetchWidgetData)
       setValue(data.value)
       if (data.comparison) {
         setTrend({
@@ -78,7 +68,7 @@ const NewCustomersKpiWidget: React.FC<DashboardWidgetComponentProps<NewCustomers
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/orders-by-status/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { PieChart, type PieChartDataItem } from '@open-mercato/ui/backend/charts'
 import {
@@ -20,7 +20,7 @@ import {
 import { DEFAULT_SETTINGS, hydrateSettings, type OrdersByStatusSettings } from './config'
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 
-async function fetchOrdersByStatusData(settings: OrdersByStatusSettings): Promise<WidgetDataResponse> {
+async function fetchOrdersByStatusData(settings: OrdersByStatusSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -36,18 +36,7 @@ async function fetchOrdersByStatusData(settings: OrdersByStatusSettings): Promis
     },
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch orders by status data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const ORDER_STATUS_KEYS: Record<string, string> = {
@@ -82,12 +71,13 @@ const OrdersByStatusWidget: React.FC<DashboardWidgetComponentProps<OrdersByStatu
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const result = await fetchOrdersByStatusData(hydrated)
+      const result = await fetchOrdersByStatusData(hydrated, fetchWidgetData)
       const chartData = result.data.map((item) => ({
         name: formatStatusLabel(item.groupKey as string | null, t),
         value: item.value ?? 0,
@@ -100,7 +90,7 @@ const OrdersByStatusWidget: React.FC<DashboardWidgetComponentProps<OrdersByStatu
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/orders-kpi/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { KpiCard, type KpiTrend } from '@open-mercato/ui/backend/charts'
 import {
@@ -14,7 +14,7 @@ import {
 import { DEFAULT_SETTINGS, hydrateSettings, type OrdersKpiSettings } from './config'
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 
-async function fetchOrdersData(settings: OrdersKpiSettings): Promise<WidgetDataResponse> {
+async function fetchOrdersData(settings: OrdersKpiSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -28,18 +28,7 @@ async function fetchOrdersData(settings: OrdersKpiSettings): Promise<WidgetDataR
     comparison: settings.showComparison ? { type: 'previous_period' } : undefined,
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch orders data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const OrdersKpiWidget: React.FC<DashboardWidgetComponentProps<OrdersKpiSettings>> = ({
@@ -56,12 +45,13 @@ const OrdersKpiWidget: React.FC<DashboardWidgetComponentProps<OrdersKpiSettings>
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const data = await fetchOrdersData(hydrated)
+      const data = await fetchOrdersData(hydrated, fetchWidgetData)
       setValue(data.value)
       if (data.comparison) {
         setTrend({
@@ -78,7 +68,7 @@ const OrdersKpiWidget: React.FC<DashboardWidgetComponentProps<OrdersKpiSettings>
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/pipeline-summary/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { BarChart, type BarChartDataItem } from '@open-mercato/ui/backend/charts'
 import {
@@ -14,7 +14,7 @@ import { DEFAULT_SETTINGS, hydrateSettings, type PipelineSummarySettings } from
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 import { formatCurrencyCompact } from '../../../lib/formatters'
 
-async function fetchPipelineData(settings: PipelineSummarySettings): Promise<WidgetDataResponse> {
+async function fetchPipelineData(settings: PipelineSummarySettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'customers:deals',
     metric: {
@@ -31,18 +31,7 @@ async function fetchPipelineData(settings: PipelineSummarySettings): Promise<Wid
     },
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch pipeline data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 function formatStageLabel(stage: unknown, t: (key: string, fallback: string) => string): string {
@@ -69,12 +58,13 @@ const PipelineSummaryWidget: React.FC<DashboardWidgetComponentProps<PipelineSumm
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const result = await fetchPipelineData(hydrated)
+      const result = await fetchPipelineData(hydrated, fetchWidgetData)
       const chartData = result.data
         .filter((item) => item.groupKey != null && item.groupKey !== '' && String(item.groupKey) !== '0')
         .map((item) => ({
@@ -89,7 +79,7 @@ const PipelineSummaryWidget: React.FC<DashboardWidgetComponentProps<PipelineSumm
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/revenue-kpi/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { KpiCard, type KpiTrend } from '@open-mercato/ui/backend/charts'
 import {
@@ -15,7 +15,7 @@ import { DEFAULT_SETTINGS, hydrateSettings, type RevenueKpiSettings } from './co
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 import { formatCurrency } from '../../../lib/formatters'
 
-async function fetchRevenueData(settings: RevenueKpiSettings): Promise<WidgetDataResponse> {
+async function fetchRevenueData(settings: RevenueKpiSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -29,18 +29,7 @@ async function fetchRevenueData(settings: RevenueKpiSettings): Promise<WidgetDat
     comparison: settings.showComparison ? { type: 'previous_period' } : undefined,
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch revenue data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const RevenueKpiWidget: React.FC<DashboardWidgetComponentProps<RevenueKpiSettings>> = ({
@@ -57,12 +46,13 @@ const RevenueKpiWidget: React.FC<DashboardWidgetComponentProps<RevenueKpiSetting
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const data = await fetchRevenueData(hydrated)
+      const data = await fetchRevenueData(hydrated, fetchWidgetData)
       setValue(data.value)
       if (data.comparison) {
         setTrend({
@@ -79,7 +69,7 @@ const RevenueKpiWidget: React.FC<DashboardWidgetComponentProps<RevenueKpiSetting
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/revenue-trend/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'
 import { LineChart, type LineChartDataItem } from '@open-mercato/ui/backend/charts'
 import {
@@ -22,7 +22,7 @@ import { DEFAULT_SETTINGS, hydrateSettings, type RevenueTrendSettings } from './
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 import { formatCurrencyCompact } from '../../../lib/formatters'
 
-async function fetchRevenueTrendData(settings: RevenueTrendSettings): Promise<WidgetDataResponse> {
+async function fetchRevenueTrendData(settings: RevenueTrendSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -39,18 +39,7 @@ async function fetchRevenueTrendData(settings: RevenueTrendSettings): Promise<Wi
     },
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch revenue trend data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 function formatDate(dateStr: string | null, granularity: DateGranularity, locale?: string): string {
@@ -125,12 +114,13 @@ const RevenueTrendWidget: React.FC<DashboardWidgetComponentProps<RevenueTrendSet
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const result = await fetchRevenueTrendData(hydrated)
+      const result = await fetchRevenueTrendData(hydrated, fetchWidgetData)
       const sortedData = [...result.data].sort((a, b) => {
         const aTime = new Date(a.groupKey as string || 0).getTime()
         const bTime = new Date(b.groupKey as string || 0).getTime()
@@ -148,7 +138,7 @@ const RevenueTrendWidget: React.FC<DashboardWidgetComponentProps<RevenueTrendSet
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, locale, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, locale, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})

package/src/modules/dashboards/widgets/dashboard/sales-by-region/widget.client.tsx

@@ -2,7 +2,7 @@
 
 import * as React from 'react'
 import type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'
-import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useWidgetData, type WidgetDataFetcher } from '@open-mercato/ui/backend/dashboard/widgetData'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { BarChart, type BarChartDataItem } from '@open-mercato/ui/backend/charts'
 import { DateRangeSelect, type DateRangePreset } from '@open-mercato/ui/backend/date-range'
@@ -11,7 +11,7 @@ import { DEFAULT_SETTINGS, hydrateSettings, type SalesByRegionSettings } from '.
 import type { WidgetDataResponse } from '../../../services/widgetDataService'
 import { formatCurrencyCompact } from '../../../lib/formatters'
 
-async function fetchSalesByRegionData(settings: SalesByRegionSettings): Promise<WidgetDataResponse> {
+async function fetchSalesByRegionData(settings: SalesByRegionSettings, fetchWidgetData: WidgetDataFetcher): Promise<WidgetDataResponse> {
   const body = {
     entityType: 'sales:orders',
     metric: {
@@ -28,18 +28,7 @@ async function fetchSalesByRegionData(settings: SalesByRegionSettings): Promise<
     },
   }
 
-  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  })
-
-  if (!call.ok) {
-    const errorMsg = (call.result as Record<string, unknown>)?.error
-    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch sales by region data')
-  }
-
-  return call.result as WidgetDataResponse
+  return fetchWidgetData<WidgetDataResponse>(body)
 }
 
 const SalesByRegionWidget: React.FC<DashboardWidgetComponentProps<SalesByRegionSettings>> = ({
@@ -55,12 +44,13 @@ const SalesByRegionWidget: React.FC<DashboardWidgetComponentProps<SalesByRegionS
   const [loading, setLoading] = React.useState(true)
   const [error, setError] = React.useState<string | null>(null)
 
+  const fetchWidgetData = useWidgetData()
   const refresh = React.useCallback(async () => {
     onRefreshStateChange?.(true)
     setLoading(true)
     setError(null)
     try {
-      const result = await fetchSalesByRegionData(hydrated)
+      const result = await fetchSalesByRegionData(hydrated, fetchWidgetData)
       const chartData = result.data.map((item) => ({
         region: String(item.groupKey || t('dashboards.analytics.labels.unknown', 'Unknown')),
         Revenue: item.value ?? 0,
@@ -73,7 +63,7 @@ const SalesByRegionWidget: React.FC<DashboardWidgetComponentProps<SalesByRegionS
       setLoading(false)
       onRefreshStateChange?.(false)
     }
-  }, [hydrated, onRefreshStateChange, t])
+  }, [hydrated, fetchWidgetData, onRefreshStateChange, t])
 
   React.useEffect(() => {
     refresh().catch(() => {})