@optifye/dashboard-core 6.12.8 → 6.12.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.d.mts +10 -2
  2. package/dist/index.d.ts +10 -2
  3. package/dist/index.js +104 -56
  4. package/dist/index.mjs +104 -56
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -22,8 +22,10 @@ declare const isWipGatedVideoGridMetricMode: (value: unknown, assemblyEnabled?:
22
22
  interface SkuBreakdownItem {
23
23
  /** UUID — `skus.id`. Stable identifier for selectors and threshold writes. */
24
24
  sku_id: string;
25
- /** Human-readable code — `skus.sku_id` (e.g. `IMT_BIG`). */
25
+ /** Technical code — `skus.sku_id` (e.g. `IMT_BIG`). */
26
26
  sku_code: string;
27
+ /** User-facing label — `skus.display_name`, falling back to `sku_code`. */
28
+ sku_display_name?: string | null;
27
29
  sku_definition: string;
28
30
  is_dummy: boolean;
29
31
  total_output: number;
@@ -44,6 +46,7 @@ interface SkuBreakdownItem {
44
46
  interface SkuSegmentItem {
45
47
  sku_id: string;
46
48
  sku_code: string;
49
+ sku_display_name?: string | null;
47
50
  start_time: string;
48
51
  end_time: string | null;
49
52
  pph_threshold: number;
@@ -52,6 +55,7 @@ interface SkuSegmentItem {
52
55
  interface LineSkuBreakdownItem {
53
56
  sku_id: string;
54
57
  sku_code: string;
58
+ sku_display_name?: string | null;
55
59
  is_dummy: boolean;
56
60
  current_output: number;
57
61
  ideal_output: number;
@@ -94,6 +98,7 @@ interface LineSkuBreakdownItem {
94
98
  interface CurrentWorkspaceSKU {
95
99
  sku_uuid: string;
96
100
  sku_code: string;
101
+ sku_display_name?: string | null;
97
102
  sku_definition: string;
98
103
  start_time: string;
99
104
  is_dummy: boolean;
@@ -1605,6 +1610,7 @@ interface SSEEvent {
1605
1610
  interface SKU {
1606
1611
  id: string;
1607
1612
  sku_id: string;
1613
+ display_name?: string | null;
1608
1614
  sku_definition: string;
1609
1615
  company_id: string;
1610
1616
  line_id: string;
@@ -5723,6 +5729,7 @@ declare const fetchLineDummySkuId: (supabase: {
5723
5729
  interface SkuLookupRow {
5724
5730
  id: string;
5725
5731
  sku_id?: string | null;
5732
+ display_name?: string | null;
5726
5733
  sku_definition?: string | null;
5727
5734
  }
5728
5735
  /**
@@ -5746,6 +5753,7 @@ declare const fetchLineSkuCatalog: (supabase: {
5746
5753
  type LineSkuBreakdownBuiltItem = {
5747
5754
  sku_id: string;
5748
5755
  sku_code: string;
5756
+ sku_display_name?: string | null;
5749
5757
  is_dummy: boolean;
5750
5758
  current_output: number;
5751
5759
  ideal_output: number;
@@ -7840,7 +7848,7 @@ interface HourlyOutputChartProps {
7840
7848
  className?: string;
7841
7849
  /**
7842
7850
  * Optional SKU transition segments. When provided, vertical divider lines
7843
- * with `sku_code` labels are rendered at each transition. Backend already
7851
+ * with display labels are rendered at each transition. Backend already
7844
7852
  * excludes dummy SKUs from this list. (Phase 5, decision #7.)
7845
7853
  */
7846
7854
  skuSegments?: SkuSegmentItem[];
package/dist/index.d.ts CHANGED
@@ -22,8 +22,10 @@ declare const isWipGatedVideoGridMetricMode: (value: unknown, assemblyEnabled?:
22
22
  interface SkuBreakdownItem {
23
23
  /** UUID — `skus.id`. Stable identifier for selectors and threshold writes. */
24
24
  sku_id: string;
25
- /** Human-readable code — `skus.sku_id` (e.g. `IMT_BIG`). */
25
+ /** Technical code — `skus.sku_id` (e.g. `IMT_BIG`). */
26
26
  sku_code: string;
27
+ /** User-facing label — `skus.display_name`, falling back to `sku_code`. */
28
+ sku_display_name?: string | null;
27
29
  sku_definition: string;
28
30
  is_dummy: boolean;
29
31
  total_output: number;
@@ -44,6 +46,7 @@ interface SkuBreakdownItem {
44
46
  interface SkuSegmentItem {
45
47
  sku_id: string;
46
48
  sku_code: string;
49
+ sku_display_name?: string | null;
47
50
  start_time: string;
48
51
  end_time: string | null;
49
52
  pph_threshold: number;
@@ -52,6 +55,7 @@ interface SkuSegmentItem {
52
55
  interface LineSkuBreakdownItem {
53
56
  sku_id: string;
54
57
  sku_code: string;
58
+ sku_display_name?: string | null;
55
59
  is_dummy: boolean;
56
60
  current_output: number;
57
61
  ideal_output: number;
@@ -94,6 +98,7 @@ interface LineSkuBreakdownItem {
94
98
  interface CurrentWorkspaceSKU {
95
99
  sku_uuid: string;
96
100
  sku_code: string;
101
+ sku_display_name?: string | null;
97
102
  sku_definition: string;
98
103
  start_time: string;
99
104
  is_dummy: boolean;
@@ -1605,6 +1610,7 @@ interface SSEEvent {
1605
1610
  interface SKU {
1606
1611
  id: string;
1607
1612
  sku_id: string;
1613
+ display_name?: string | null;
1608
1614
  sku_definition: string;
1609
1615
  company_id: string;
1610
1616
  line_id: string;
@@ -5723,6 +5729,7 @@ declare const fetchLineDummySkuId: (supabase: {
5723
5729
  interface SkuLookupRow {
5724
5730
  id: string;
5725
5731
  sku_id?: string | null;
5732
+ display_name?: string | null;
5726
5733
  sku_definition?: string | null;
5727
5734
  }
5728
5735
  /**
@@ -5746,6 +5753,7 @@ declare const fetchLineSkuCatalog: (supabase: {
5746
5753
  type LineSkuBreakdownBuiltItem = {
5747
5754
  sku_id: string;
5748
5755
  sku_code: string;
5756
+ sku_display_name?: string | null;
5749
5757
  is_dummy: boolean;
5750
5758
  current_output: number;
5751
5759
  ideal_output: number;
@@ -7840,7 +7848,7 @@ interface HourlyOutputChartProps {
7840
7848
  className?: string;
7841
7849
  /**
7842
7850
  * Optional SKU transition segments. When provided, vertical divider lines
7843
- * with `sku_code` labels are rendered at each transition. Backend already
7851
+ * with display labels are rendered at each transition. Backend already
7844
7852
  * excludes dummy SKUs from this list. (Phase 5, decision #7.)
7845
7853
  */
7846
7854
  skuSegments?: SkuSegmentItem[];
package/dist/index.js CHANGED
@@ -4551,11 +4551,12 @@ var fetchLineDummySkuId = async (supabase, lineId, skuTable = "skus") => {
4551
4551
  var fetchLineSkuCatalog = async (supabase, lineId, skuTable = "skus") => {
4552
4552
  if (!supabase || !lineId) return [];
4553
4553
  try {
4554
- const { data } = await supabase.from(skuTable).select("id, sku_id, sku_definition").eq("line_id", lineId).eq("is_active", true);
4554
+ const { data } = await supabase.from(skuTable).select("id, sku_id, display_name, sku_definition").eq("line_id", lineId).eq("is_active", true);
4555
4555
  if (Array.isArray(data)) {
4556
4556
  return data.filter((item) => item && typeof item.id === "string").map((item) => ({
4557
4557
  id: item.id,
4558
4558
  sku_id: typeof item.sku_id === "string" ? item.sku_id : null,
4559
+ display_name: typeof item.display_name === "string" ? item.display_name : null,
4559
4560
  sku_definition: typeof item.sku_definition === "string" ? item.sku_definition : null
4560
4561
  }));
4561
4562
  }
@@ -4576,10 +4577,12 @@ var buildLineSkuBreakdown = (rows, skuCatalog) => {
4576
4577
  if (!skuUuid) return null;
4577
4578
  const meta = catalogById.get(skuUuid);
4578
4579
  const skuCode = meta?.sku_id || skuUuid;
4580
+ const skuDisplayName = meta?.display_name?.trim() || skuCode;
4579
4581
  const isDummy = meta?.sku_definition === "dummy_definition";
4580
4582
  return {
4581
4583
  sku_id: skuUuid,
4582
4584
  sku_code: skuCode,
4585
+ sku_display_name: skuDisplayName,
4583
4586
  is_dummy: isDummy,
4584
4587
  current_output: safeInt(row.current_output),
4585
4588
  ideal_output: safeInt(row.ideal_output),
@@ -13163,6 +13166,7 @@ var normalizeSkuBreakdown = (raw) => {
13163
13166
  return {
13164
13167
  sku_id: typeof item.sku_id === "string" ? item.sku_id : String(item.sku_id ?? ""),
13165
13168
  sku_code: typeof item.sku_code === "string" ? item.sku_code : String(item.sku_code ?? ""),
13169
+ sku_display_name: typeof item.sku_display_name === "string" ? item.sku_display_name : coerceOptionalString(item.sku_display_name),
13166
13170
  sku_definition: typeof item.sku_definition === "string" ? item.sku_definition : String(item.sku_definition ?? ""),
13167
13171
  is_dummy: Boolean(item.is_dummy),
13168
13172
  total_output: coerceNumber(item.total_output, 0),
@@ -13181,6 +13185,7 @@ var normalizeSkuSegment = (raw) => {
13181
13185
  return {
13182
13186
  sku_id: typeof item.sku_id === "string" ? item.sku_id : String(item.sku_id ?? ""),
13183
13187
  sku_code: typeof item.sku_code === "string" ? item.sku_code : String(item.sku_code ?? ""),
13188
+ sku_display_name: typeof item.sku_display_name === "string" ? item.sku_display_name : coerceOptionalString(item.sku_display_name),
13184
13189
  start_time: typeof item.start_time === "string" ? item.start_time : String(item.start_time ?? ""),
13185
13190
  end_time: coerceOptionalString(item.end_time),
13186
13191
  pph_threshold: coerceNumber(item.pph_threshold, 0)
@@ -34456,6 +34461,13 @@ var LineChart = React144__namespace.default.memo(LineChartComponent, (prevProps,
34456
34461
  return true;
34457
34462
  });
34458
34463
  LineChart.displayName = "LineChart";
34464
+
34465
+ // src/lib/utils/skuDisplay.ts
34466
+ var clean = (value) => typeof value === "string" ? value.trim() : "";
34467
+ var getSkuDisplayName = (sku) => {
34468
+ if (!sku) return "SKU";
34469
+ return clean(sku.sku_display_name) || clean(sku.display_name) || clean(sku.sku_code) || clean(sku.sku_id) || clean(sku.id) || "SKU";
34470
+ };
34459
34471
  var formatPercentage = (current, target) => {
34460
34472
  if (!target || target <= 0) return "0.0";
34461
34473
  return (current / target * 100).toFixed(1);
@@ -34532,12 +34544,13 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34532
34544
  const ratio = target > 0 ? Math.min(current / target, 1) : 0;
34533
34545
  const fillColor = "#3b82f6";
34534
34546
  const percentage = formatPercentage(current, target);
34547
+ const skuLabel = getSkuDisplayName(sku);
34535
34548
  return /* @__PURE__ */ jsxRuntime.jsxs(
34536
34549
  "div",
34537
34550
  {
34538
34551
  className: `space-y-1.5 p-2 rounded-lg cursor-pointer transition-all ${isSelected ? "ring-2 ring-blue-500 ring-dashed bg-blue-50/30" : "hover:bg-gray-50"}`,
34539
34552
  onClick: () => onSelect?.(isSelected ? null : sku.sku_id),
34540
- "data-testid": `sku-progress-row-${sku.sku_code}`,
34553
+ "data-testid": `sku-progress-row-${sku.sku_id}`,
34541
34554
  children: [
34542
34555
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [
34543
34556
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 truncate", children: [
@@ -34545,8 +34558,8 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34545
34558
  "span",
34546
34559
  {
34547
34560
  className: "text-sm font-semibold text-gray-800 truncate",
34548
- title: sku.sku_code,
34549
- children: sku.sku_code
34561
+ title: skuLabel,
34562
+ children: skuLabel
34550
34563
  }
34551
34564
  ),
34552
34565
  isLive && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-green-500 shrink-0 shadow-[0_0_4px_rgba(34,197,94,0.6)]", title: "Currently running" })
@@ -34565,7 +34578,7 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34565
34578
  "aria-valuenow": Math.round(current),
34566
34579
  "aria-valuemin": 0,
34567
34580
  "aria-valuemax": Math.round(target),
34568
- "aria-label": `${sku.sku_code} output progress`,
34581
+ "aria-label": `${skuLabel} output progress`,
34569
34582
  children: /* @__PURE__ */ jsxRuntime.jsx(
34570
34583
  "div",
34571
34584
  {
@@ -36536,7 +36549,7 @@ var HourlyOutputChartComponent = ({
36536
36549
  const end = Math.max(start, Math.min(nextOffset, timelineEndOffset));
36537
36550
  return {
36538
36551
  skuId: entry.segment.sku_id,
36539
- label: entry.segment.sku_code,
36552
+ label: getSkuDisplayName(entry.segment),
36540
36553
  start,
36541
36554
  end,
36542
36555
  pphThreshold: entry.segment.pph_threshold ?? pphThreshold
@@ -37412,7 +37425,7 @@ var HourlyOutputChart = React144__namespace.default.memo(
37412
37425
  for (let i = 0; i < prevSegments.length; i += 1) {
37413
37426
  const prevSeg = prevSegments[i];
37414
37427
  const nextSeg = nextSegments[i];
37415
- if (prevSeg.sku_id !== nextSeg.sku_id || prevSeg.sku_code !== nextSeg.sku_code || prevSeg.start_time !== nextSeg.start_time || prevSeg.end_time !== nextSeg.end_time) {
37428
+ if (prevSeg.sku_id !== nextSeg.sku_id || prevSeg.sku_code !== nextSeg.sku_code || prevSeg.sku_display_name !== nextSeg.sku_display_name || prevSeg.start_time !== nextSeg.start_time || prevSeg.end_time !== nextSeg.end_time) {
37416
37429
  return false;
37417
37430
  }
37418
37431
  }
@@ -38401,6 +38414,7 @@ var WorkspaceMetricCardsImpl = ({
38401
38414
  const pphThreshold = activeSku ? activeSku.pph_threshold : workspace.pph_threshold;
38402
38415
  const cycleValue = activeSku ? activeSku.avg_cycle_time : workspace.avg_cycle_time;
38403
38416
  const cycleStandard = activeSku ? activeSku.ideal_cycle_time : workspace.ideal_cycle_time;
38417
+ const displaySkuLabel = displaySku ? getSkuDisplayName(displaySku) : "";
38404
38418
  const efficiencyValue = workspace.avg_efficiency || 0;
38405
38419
  const efficiencyTarget = effectiveLegend.green_min;
38406
38420
  const efficiencyColor = getEfficiencyHexColor(efficiencyValue, effectiveLegend);
@@ -38431,7 +38445,7 @@ var WorkspaceMetricCardsImpl = ({
38431
38445
  /* @__PURE__ */ jsxRuntime.jsxs(Card2, { className: "flex flex-col bg-white shadow-sm h-full min-h-[150px] sm:min-h-0", children: [
38432
38446
  /* @__PURE__ */ jsxRuntime.jsxs(CardHeader2, { className: "pb-2 flex-none text-center", children: [
38433
38447
  /* @__PURE__ */ jsxRuntime.jsx(CardTitle2, { className: "text-lg", children: "PPH" }),
38434
- displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
38448
+ displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
38435
38449
  ] }),
38436
38450
  /* @__PURE__ */ jsxRuntime.jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6 sm:py-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
38437
38451
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-5xl font-bold ${pphValue >= pphThreshold ? "text-green-500" : "text-red-500"}`, children: pphValue.toFixed(1) }),
@@ -38444,7 +38458,7 @@ var WorkspaceMetricCardsImpl = ({
38444
38458
  /* @__PURE__ */ jsxRuntime.jsxs(Card2, { className: "flex flex-col bg-white shadow-sm h-full min-h-[150px] sm:min-h-0", children: [
38445
38459
  /* @__PURE__ */ jsxRuntime.jsxs(CardHeader2, { className: "pb-2 flex-none text-center", children: [
38446
38460
  /* @__PURE__ */ jsxRuntime.jsx(CardTitle2, { className: "text-lg", children: "Avg. Cycle Time" }),
38447
- displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
38461
+ displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
38448
38462
  ] }),
38449
38463
  /* @__PURE__ */ jsxRuntime.jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6 sm:py-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
38450
38464
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-5xl font-bold ${cycleValue > (cycleStandard || 0) ? "text-red-500" : "text-green-500"}`, children: cycleValue.toFixed(1) }),
@@ -51766,7 +51780,7 @@ var LinePdfGenerator = ({
51766
51780
  if (intervalIndex >= 0) {
51767
51781
  if (segmentIndex > 0 || segmentMinutes > hourlyTimeRanges[0]?.start) {
51768
51782
  if (!skuRemarksByIndex[intervalIndex]) skuRemarksByIndex[intervalIndex] = [];
51769
- skuRemarksByIndex[intervalIndex].push(segment.sku_code);
51783
+ skuRemarksByIndex[intervalIndex].push(getSkuDisplayName(segment));
51770
51784
  }
51771
51785
  }
51772
51786
  }
@@ -53780,7 +53794,7 @@ var WorkspacePdfGenerator = ({
53780
53794
  if (intervalIndex >= 0) {
53781
53795
  if (segmentIndex > 0 || segmentMinutes > hourlyIntervals[0]?.start) {
53782
53796
  if (!skuRemarksByIndex[intervalIndex]) skuRemarksByIndex[intervalIndex] = [];
53783
- skuRemarksByIndex[intervalIndex].push(segment.sku_code);
53797
+ skuRemarksByIndex[intervalIndex].push(getSkuDisplayName(segment));
53784
53798
  }
53785
53799
  }
53786
53800
  }
@@ -54445,6 +54459,7 @@ var WorkspaceCycleTimeMetricCards = ({
54445
54459
  }, [activeSku, skuAware, activeSkuId, liveSkuId, skuBreakdown]);
54446
54460
  const cycleValue = activeSku ? activeSku.avg_cycle_time : workspace.avg_cycle_time;
54447
54461
  const cycleStandard = activeSku ? activeSku.ideal_cycle_time : workspace.ideal_cycle_time;
54462
+ const displaySkuLabel = displaySku ? getSkuDisplayName(displaySku) : "";
54448
54463
  const efficiencyValue = workspace.avg_efficiency || 0;
54449
54464
  const efficiencyTarget = effectiveLegend.green_min;
54450
54465
  const efficiencyColor = getEfficiencyHexColor(efficiencyValue, effectiveLegend);
@@ -54472,7 +54487,7 @@ var WorkspaceCycleTimeMetricCards = ({
54472
54487
  /* @__PURE__ */ jsxRuntime.jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
54473
54488
  /* @__PURE__ */ jsxRuntime.jsxs(CardHeader2, { className: "pb-1 pt-5 flex-none text-center", children: [
54474
54489
  /* @__PURE__ */ jsxRuntime.jsx(CardTitle2, { className: "text-[15px] font-bold text-gray-900 tracking-wide", children: "Cycle Time (s)" }),
54475
- displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
54490
+ displaySku && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
54476
54491
  ] }),
54477
54492
  /* @__PURE__ */ jsxRuntime.jsxs(CardContent2, { className: "flex-1 flex flex-col items-center justify-center pb-6", children: [
54478
54493
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-5xl font-bold tracking-tight ${cycleValue > (cycleStandard || 0) ? "text-red-500" : "text-[#34C759]"}`, children: cycleValue.toFixed(1) }),
@@ -66531,6 +66546,7 @@ var MetricCards = React144.memo(({
66531
66546
  (prevProps.skuBreakdown || []).map((sku) => ({
66532
66547
  sku_id: sku.sku_id,
66533
66548
  sku_code: sku.sku_code,
66549
+ sku_display_name: sku.sku_display_name,
66534
66550
  total_output: sku.total_output,
66535
66551
  target_output: sku.target_output,
66536
66552
  avg_pph: sku.avg_pph,
@@ -66546,6 +66562,7 @@ var MetricCards = React144.memo(({
66546
66562
  (nextProps.skuBreakdown || []).map((sku) => ({
66547
66563
  sku_id: sku.sku_id,
66548
66564
  sku_code: sku.sku_code,
66565
+ sku_display_name: sku.sku_display_name,
66549
66566
  total_output: sku.total_output,
66550
66567
  target_output: sku.target_output,
66551
66568
  avg_pph: sku.avg_pph,
@@ -66855,6 +66872,7 @@ var BottomSection = React144.memo(({
66855
66872
  (prevProps.skuSegments || []).map((segment) => ({
66856
66873
  sku_id: segment.sku_id,
66857
66874
  sku_code: segment.sku_code,
66875
+ sku_display_name: segment.sku_display_name,
66858
66876
  start_time: segment.start_time,
66859
66877
  end_time: segment.end_time,
66860
66878
  pph_threshold: segment.pph_threshold
@@ -66864,6 +66882,7 @@ var BottomSection = React144.memo(({
66864
66882
  (nextProps.skuSegments || []).map((segment) => ({
66865
66883
  sku_id: segment.sku_id,
66866
66884
  sku_code: segment.sku_code,
66885
+ sku_display_name: segment.sku_display_name,
66867
66886
  start_time: segment.start_time,
66868
66887
  end_time: segment.end_time,
66869
66888
  pph_threshold: segment.pph_threshold
@@ -67544,6 +67563,7 @@ var KPIDetailView = ({
67544
67563
  }).map((item) => ({
67545
67564
  sku_id: item.sku_id,
67546
67565
  sku_code: item.sku_code,
67566
+ sku_display_name: item.sku_display_name,
67547
67567
  sku_definition: "",
67548
67568
  is_dummy: false,
67549
67569
  total_output: item.current_output ?? 0,
@@ -67608,11 +67628,13 @@ var KPIDetailView = ({
67608
67628
  }, [resolvedLineInfo, selectedSkuRow]);
67609
67629
  const handleSkuChange = React144.useCallback((nextSkuId) => {
67610
67630
  if (nextSkuId === selectedSkuId) return;
67631
+ const selectedSkuOption = nextSkuId === "all" ? null : realSkuOptions.find((item) => item.sku_id === nextSkuId) ?? null;
67611
67632
  setSelectedSkuId(nextSkuId);
67612
67633
  trackCoreEvent("Line Detail SKU Filter Changed", {
67613
67634
  line_id: lineId,
67614
67635
  sku_id: nextSkuId === "all" ? null : nextSkuId,
67615
- sku_code: nextSkuId === "all" ? null : realSkuOptions.find((item) => item.sku_id === nextSkuId)?.sku_code ?? null
67636
+ sku_code: selectedSkuOption?.sku_code ?? null,
67637
+ sku_display_name: selectedSkuOption ? getSkuDisplayName(selectedSkuOption) : null
67616
67638
  });
67617
67639
  }, [lineId, realSkuOptions, selectedSkuId]);
67618
67640
  const handleChartSkuSelect = React144.useCallback(
@@ -73566,6 +73588,7 @@ var SKUSelector = ({
73566
73588
  if (lineId && (sku.line_id ?? "") !== lineId) return false;
73567
73589
  const term = searchTerm.toLowerCase();
73568
73590
  if (term.length === 0) return true;
73591
+ if (getSkuDisplayName(sku).toLowerCase().includes(term)) return true;
73569
73592
  if ((sku.sku_id || "").toLowerCase().includes(term)) return true;
73570
73593
  if ((sku.sku_definition || "").toLowerCase().includes(term)) return true;
73571
73594
  return JSON.stringify(sku.attributes ?? {}).toLowerCase().includes(term);
@@ -73590,7 +73613,7 @@ var SKUSelector = ({
73590
73613
  disabled,
73591
73614
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
73592
73615
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: selectedSKU ? "text-gray-900" : "text-gray-500", children: selectedSKU ? /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
73593
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: selectedSKU.sku_id }),
73616
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: getSkuDisplayName(selectedSKU) }),
73594
73617
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-gray-500 ml-2", children: [
73595
73618
  "(Target: ",
73596
73619
  selectedSKU.production_target,
@@ -73634,7 +73657,7 @@ var SKUSelector = ({
73634
73657
  ${selectedSKU?.id === sku.id ? "bg-blue-50" : ""}
73635
73658
  `,
73636
73659
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
73637
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: sku.sku_id }),
73660
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: getSkuDisplayName(sku) }),
73638
73661
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-gray-500", children: [
73639
73662
  "Target: ",
73640
73663
  sku.production_target,
@@ -73690,44 +73713,50 @@ var SKUList = ({
73690
73713
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
73691
73714
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden lg:block bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "min-w-full divide-y divide-gray-200", children: [
73692
73715
  /* @__PURE__ */ jsxRuntime.jsx("thead", { className: "bg-gray-50", children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
73693
- /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "SKU Code" }),
73716
+ /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "SKU" }),
73694
73717
  /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Definition" }),
73695
73718
  /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Line" }),
73696
73719
  /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Production Target" }),
73697
73720
  /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Status" }),
73698
73721
  /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Created" })
73699
73722
  ] }) }),
73700
- /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "bg-white divide-y divide-gray-200", children: skus.map((sku) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "hover:bg-gray-50 transition-colors duration-150", children: [
73701
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold text-gray-900", children: sku.sku_id }) }),
73702
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700 max-w-md truncate", title: sku.sku_definition || "", children: sku.sku_definition || /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400", children: "\u2014" }) }) }),
73703
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) }) }),
73704
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-gray-700", children: formatTarget(sku.production_target) }) }),
73705
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) }),
73706
- /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: formatCreatedAt(sku.created_at) })
73707
- ] }, sku.id)) })
73723
+ /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "bg-white divide-y divide-gray-200", children: skus.map((sku) => {
73724
+ const displayName = getSkuDisplayName(sku);
73725
+ return /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "hover:bg-gray-50 transition-colors duration-150", children: [
73726
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold text-gray-900", children: displayName }) }),
73727
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700 max-w-md truncate", title: sku.sku_definition || "", children: sku.sku_definition || /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400", children: "\u2014" }) }) }),
73728
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) }) }),
73729
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-gray-700", children: formatTarget(sku.production_target) }) }),
73730
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) }),
73731
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: formatCreatedAt(sku.created_at) })
73732
+ ] }, sku.id);
73733
+ }) })
73708
73734
  ] }) }) }),
73709
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden space-y-3 sm:space-y-4", children: skus.map((sku) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-200 p-4 hover:shadow-md transition-all duration-200", children: [
73710
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between mb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
73711
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base sm:text-lg font-semibold text-gray-900 truncate", children: sku.sku_id }),
73712
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) })
73713
- ] }) }),
73714
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73715
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Definition" }),
73716
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700 break-words", children: sku.sku_definition || /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400 italic", children: "\u2014" }) })
73717
- ] }),
73718
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73719
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Line" }),
73720
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) })
73721
- ] }),
73722
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73723
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Production Target" }),
73724
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm sm:text-base font-medium text-gray-700", children: formatTarget(sku.production_target) })
73725
- ] }),
73726
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-gray-500", children: [
73727
- "Created: ",
73728
- formatCreatedAt(sku.created_at)
73729
- ] })
73730
- ] }, sku.id)) })
73735
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden space-y-3 sm:space-y-4", children: skus.map((sku) => {
73736
+ const displayName = getSkuDisplayName(sku);
73737
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-200 p-4 hover:shadow-md transition-all duration-200", children: [
73738
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between mb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
73739
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base sm:text-lg font-semibold text-gray-900 truncate", children: displayName }),
73740
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) })
73741
+ ] }) }),
73742
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73743
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Definition" }),
73744
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700 break-words", children: sku.sku_definition || /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400 italic", children: "\u2014" }) })
73745
+ ] }),
73746
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73747
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Line" }),
73748
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) })
73749
+ ] }),
73750
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3", children: [
73751
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Production Target" }),
73752
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm sm:text-base font-medium text-gray-700", children: formatTarget(sku.production_target) })
73753
+ ] }),
73754
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-gray-500", children: [
73755
+ "Created: ",
73756
+ formatCreatedAt(sku.created_at)
73757
+ ] })
73758
+ ] }, sku.id);
73759
+ }) })
73731
73760
  ] });
73732
73761
  };
73733
73762
  var TargetsViewUI = ({
@@ -73958,7 +73987,7 @@ var TargetsViewUI = ({
73958
73987
  className: "w-full sm:w-auto rounded-lg border border-gray-300 bg-white px-3 py-1.5 text-sm shadow-sm focus:border-blue-500 focus:ring-blue-500 transition-all duration-200 hover:border-gray-400",
73959
73988
  "aria-label": `SKU for ${formattedName}`,
73960
73989
  children: realSkuOptions.map((row) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: row.sku_uuid, children: [
73961
- row.sku_code,
73990
+ getSkuDisplayName(row),
73962
73991
  workspace.currentSku && !workspace.currentSku.is_dummy && workspace.currentSku.sku_uuid === row.sku_uuid ? " (active)" : ""
73963
73992
  ] }, row.sku_uuid))
73964
73993
  }
@@ -74225,8 +74254,14 @@ var TargetsView = ({
74225
74254
  const skuMetaByUuid = React144.useMemo(() => {
74226
74255
  const map = /* @__PURE__ */ new Map();
74227
74256
  skuCatalog.forEach((sku) => {
74257
+ const skuCode = sku.sku_id || sku.id;
74228
74258
  map.set(sku.id, {
74229
- sku_code: sku.sku_id || sku.id,
74259
+ sku_code: skuCode,
74260
+ sku_display_name: getSkuDisplayName({
74261
+ display_name: sku.display_name,
74262
+ sku_code: skuCode,
74263
+ id: sku.id
74264
+ }),
74230
74265
  is_dummy: sku.sku_definition === "dummy_definition",
74231
74266
  line_id: sku.line_id
74232
74267
  });
@@ -74238,11 +74273,20 @@ var TargetsView = ({
74238
74273
  skuCatalog.forEach((sku) => {
74239
74274
  if (sku.sku_definition === "dummy_definition") return;
74240
74275
  const list = map.get(sku.line_id) || [];
74241
- list.push({ sku_uuid: sku.id, sku_code: sku.sku_id || sku.id });
74276
+ const skuCode = sku.sku_id || sku.id;
74277
+ list.push({
74278
+ sku_uuid: sku.id,
74279
+ sku_code: skuCode,
74280
+ sku_display_name: getSkuDisplayName({
74281
+ display_name: sku.display_name,
74282
+ sku_code: skuCode,
74283
+ id: sku.id
74284
+ })
74285
+ });
74242
74286
  map.set(sku.line_id, list);
74243
74287
  });
74244
74288
  map.forEach((list) => list.sort(
74245
- (a, b) => a.sku_code.localeCompare(b.sku_code, void 0, { numeric: true })
74289
+ (a, b) => a.sku_display_name.localeCompare(b.sku_display_name, void 0, { numeric: true })
74246
74290
  ));
74247
74291
  return map;
74248
74292
  }, [skuCatalog]);
@@ -74390,8 +74434,9 @@ var TargetsView = ({
74390
74434
  const meta = skuMetaByUuid.get(skuUuid);
74391
74435
  skuRowsMap.set(skuUuid, {
74392
74436
  sku_uuid: skuUuid,
74393
- sku_code: meta?.sku_code || skuUuid,
74394
- is_dummy: meta?.is_dummy ?? false,
74437
+ sku_code: payload?.sku_code || meta?.sku_code || skuUuid,
74438
+ sku_display_name: payload?.sku_display_name || meta?.sku_display_name || payload?.sku_code || meta?.sku_code || skuUuid,
74439
+ is_dummy: payload?.is_dummy ?? meta?.is_dummy ?? false,
74395
74440
  pph_threshold: payload?.pph_threshold ? Math.round(payload.pph_threshold) : "",
74396
74441
  ideal_cycle_time: payload?.ideal_cycle_time ?? "",
74397
74442
  total_day_output: payload?.total_day_output ?? "",
@@ -74444,10 +74489,11 @@ var TargetsView = ({
74444
74489
  const lineDummySkuUuidFallback = dummySkuByLine.get(lineId) || null;
74445
74490
  const buildEmptySkuRows = () => {
74446
74491
  const rows = [];
74447
- lineNonDummySkusFallback.forEach(({ sku_uuid, sku_code }) => {
74492
+ lineNonDummySkusFallback.forEach(({ sku_uuid, sku_code, sku_display_name }) => {
74448
74493
  rows.push({
74449
74494
  sku_uuid,
74450
74495
  sku_code,
74496
+ sku_display_name,
74451
74497
  is_dummy: false,
74452
74498
  pph_threshold: "",
74453
74499
  ideal_cycle_time: "",
@@ -74460,6 +74506,7 @@ var TargetsView = ({
74460
74506
  rows.push({
74461
74507
  sku_uuid: lineDummySkuUuidFallback,
74462
74508
  sku_code: meta?.sku_code || lineDummySkuUuidFallback,
74509
+ sku_display_name: meta?.sku_display_name || meta?.sku_code || lineDummySkuUuidFallback,
74463
74510
  is_dummy: true,
74464
74511
  pph_threshold: "",
74465
74512
  ideal_cycle_time: "",
@@ -74786,6 +74833,7 @@ var TargetsView = ({
74786
74833
  rowsToSave = fallback ? [{
74787
74834
  sku_uuid: fallback.sku_uuid,
74788
74835
  sku_code: "",
74836
+ sku_display_name: "",
74789
74837
  is_dummy: true,
74790
74838
  pph_threshold: fallback.pph_threshold,
74791
74839
  ideal_cycle_time: fallback.ideal_cycle_time,
@@ -76853,7 +76901,7 @@ var SKUManagementView = () => {
76853
76901
  if (activeFilter === "inactive" && sku.is_active) return false;
76854
76902
  if (lineFilter !== "all" && sku.line_id !== lineFilter) return false;
76855
76903
  if (term.length === 0) return true;
76856
- return (sku.sku_id || "").toLowerCase().includes(term);
76904
+ return getSkuDisplayName(sku).toLowerCase().includes(term) || (sku.sku_id || "").toLowerCase().includes(term);
76857
76905
  });
76858
76906
  }, [skus, searchTerm, lineFilter, activeFilter]);
76859
76907
  const handleBack = () => {
@@ -76893,9 +76941,9 @@ var SKUManagementView = () => {
76893
76941
  type: "search",
76894
76942
  value: searchTerm,
76895
76943
  onChange: (event) => setSearchTerm(event.target.value),
76896
- placeholder: "Search by SKU code",
76944
+ placeholder: "Search by SKU",
76897
76945
  className: "w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500",
76898
- "aria-label": "Search SKUs by code"
76946
+ "aria-label": "Search SKUs"
76899
76947
  }
76900
76948
  )
76901
76949
  ] }),
package/dist/index.mjs CHANGED
@@ -4522,11 +4522,12 @@ var fetchLineDummySkuId = async (supabase, lineId, skuTable = "skus") => {
4522
4522
  var fetchLineSkuCatalog = async (supabase, lineId, skuTable = "skus") => {
4523
4523
  if (!supabase || !lineId) return [];
4524
4524
  try {
4525
- const { data } = await supabase.from(skuTable).select("id, sku_id, sku_definition").eq("line_id", lineId).eq("is_active", true);
4525
+ const { data } = await supabase.from(skuTable).select("id, sku_id, display_name, sku_definition").eq("line_id", lineId).eq("is_active", true);
4526
4526
  if (Array.isArray(data)) {
4527
4527
  return data.filter((item) => item && typeof item.id === "string").map((item) => ({
4528
4528
  id: item.id,
4529
4529
  sku_id: typeof item.sku_id === "string" ? item.sku_id : null,
4530
+ display_name: typeof item.display_name === "string" ? item.display_name : null,
4530
4531
  sku_definition: typeof item.sku_definition === "string" ? item.sku_definition : null
4531
4532
  }));
4532
4533
  }
@@ -4547,10 +4548,12 @@ var buildLineSkuBreakdown = (rows, skuCatalog) => {
4547
4548
  if (!skuUuid) return null;
4548
4549
  const meta = catalogById.get(skuUuid);
4549
4550
  const skuCode = meta?.sku_id || skuUuid;
4551
+ const skuDisplayName = meta?.display_name?.trim() || skuCode;
4550
4552
  const isDummy = meta?.sku_definition === "dummy_definition";
4551
4553
  return {
4552
4554
  sku_id: skuUuid,
4553
4555
  sku_code: skuCode,
4556
+ sku_display_name: skuDisplayName,
4554
4557
  is_dummy: isDummy,
4555
4558
  current_output: safeInt(row.current_output),
4556
4559
  ideal_output: safeInt(row.ideal_output),
@@ -13134,6 +13137,7 @@ var normalizeSkuBreakdown = (raw) => {
13134
13137
  return {
13135
13138
  sku_id: typeof item.sku_id === "string" ? item.sku_id : String(item.sku_id ?? ""),
13136
13139
  sku_code: typeof item.sku_code === "string" ? item.sku_code : String(item.sku_code ?? ""),
13140
+ sku_display_name: typeof item.sku_display_name === "string" ? item.sku_display_name : coerceOptionalString(item.sku_display_name),
13137
13141
  sku_definition: typeof item.sku_definition === "string" ? item.sku_definition : String(item.sku_definition ?? ""),
13138
13142
  is_dummy: Boolean(item.is_dummy),
13139
13143
  total_output: coerceNumber(item.total_output, 0),
@@ -13152,6 +13156,7 @@ var normalizeSkuSegment = (raw) => {
13152
13156
  return {
13153
13157
  sku_id: typeof item.sku_id === "string" ? item.sku_id : String(item.sku_id ?? ""),
13154
13158
  sku_code: typeof item.sku_code === "string" ? item.sku_code : String(item.sku_code ?? ""),
13159
+ sku_display_name: typeof item.sku_display_name === "string" ? item.sku_display_name : coerceOptionalString(item.sku_display_name),
13155
13160
  start_time: typeof item.start_time === "string" ? item.start_time : String(item.start_time ?? ""),
13156
13161
  end_time: coerceOptionalString(item.end_time),
13157
13162
  pph_threshold: coerceNumber(item.pph_threshold, 0)
@@ -34427,6 +34432,13 @@ var LineChart = React144__default.memo(LineChartComponent, (prevProps, nextProps
34427
34432
  return true;
34428
34433
  });
34429
34434
  LineChart.displayName = "LineChart";
34435
+
34436
+ // src/lib/utils/skuDisplay.ts
34437
+ var clean = (value) => typeof value === "string" ? value.trim() : "";
34438
+ var getSkuDisplayName = (sku) => {
34439
+ if (!sku) return "SKU";
34440
+ return clean(sku.sku_display_name) || clean(sku.display_name) || clean(sku.sku_code) || clean(sku.sku_id) || clean(sku.id) || "SKU";
34441
+ };
34430
34442
  var formatPercentage = (current, target) => {
34431
34443
  if (!target || target <= 0) return "0.0";
34432
34444
  return (current / target * 100).toFixed(1);
@@ -34503,12 +34515,13 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34503
34515
  const ratio = target > 0 ? Math.min(current / target, 1) : 0;
34504
34516
  const fillColor = "#3b82f6";
34505
34517
  const percentage = formatPercentage(current, target);
34518
+ const skuLabel = getSkuDisplayName(sku);
34506
34519
  return /* @__PURE__ */ jsxs(
34507
34520
  "div",
34508
34521
  {
34509
34522
  className: `space-y-1.5 p-2 rounded-lg cursor-pointer transition-all ${isSelected ? "ring-2 ring-blue-500 ring-dashed bg-blue-50/30" : "hover:bg-gray-50"}`,
34510
34523
  onClick: () => onSelect?.(isSelected ? null : sku.sku_id),
34511
- "data-testid": `sku-progress-row-${sku.sku_code}`,
34524
+ "data-testid": `sku-progress-row-${sku.sku_id}`,
34512
34525
  children: [
34513
34526
  /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [
34514
34527
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 truncate", children: [
@@ -34516,8 +34529,8 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34516
34529
  "span",
34517
34530
  {
34518
34531
  className: "text-sm font-semibold text-gray-800 truncate",
34519
- title: sku.sku_code,
34520
- children: sku.sku_code
34532
+ title: skuLabel,
34533
+ children: skuLabel
34521
34534
  }
34522
34535
  ),
34523
34536
  isLive && /* @__PURE__ */ jsx("div", { className: "w-2 h-2 rounded-full bg-green-500 shrink-0 shadow-[0_0_4px_rgba(34,197,94,0.6)]", title: "Currently running" })
@@ -34536,7 +34549,7 @@ var SkuRow = ({ sku, isSelected, isLive, onSelect }) => {
34536
34549
  "aria-valuenow": Math.round(current),
34537
34550
  "aria-valuemin": 0,
34538
34551
  "aria-valuemax": Math.round(target),
34539
- "aria-label": `${sku.sku_code} output progress`,
34552
+ "aria-label": `${skuLabel} output progress`,
34540
34553
  children: /* @__PURE__ */ jsx(
34541
34554
  "div",
34542
34555
  {
@@ -36507,7 +36520,7 @@ var HourlyOutputChartComponent = ({
36507
36520
  const end = Math.max(start, Math.min(nextOffset, timelineEndOffset));
36508
36521
  return {
36509
36522
  skuId: entry.segment.sku_id,
36510
- label: entry.segment.sku_code,
36523
+ label: getSkuDisplayName(entry.segment),
36511
36524
  start,
36512
36525
  end,
36513
36526
  pphThreshold: entry.segment.pph_threshold ?? pphThreshold
@@ -37383,7 +37396,7 @@ var HourlyOutputChart = React144__default.memo(
37383
37396
  for (let i = 0; i < prevSegments.length; i += 1) {
37384
37397
  const prevSeg = prevSegments[i];
37385
37398
  const nextSeg = nextSegments[i];
37386
- if (prevSeg.sku_id !== nextSeg.sku_id || prevSeg.sku_code !== nextSeg.sku_code || prevSeg.start_time !== nextSeg.start_time || prevSeg.end_time !== nextSeg.end_time) {
37399
+ if (prevSeg.sku_id !== nextSeg.sku_id || prevSeg.sku_code !== nextSeg.sku_code || prevSeg.sku_display_name !== nextSeg.sku_display_name || prevSeg.start_time !== nextSeg.start_time || prevSeg.end_time !== nextSeg.end_time) {
37387
37400
  return false;
37388
37401
  }
37389
37402
  }
@@ -38372,6 +38385,7 @@ var WorkspaceMetricCardsImpl = ({
38372
38385
  const pphThreshold = activeSku ? activeSku.pph_threshold : workspace.pph_threshold;
38373
38386
  const cycleValue = activeSku ? activeSku.avg_cycle_time : workspace.avg_cycle_time;
38374
38387
  const cycleStandard = activeSku ? activeSku.ideal_cycle_time : workspace.ideal_cycle_time;
38388
+ const displaySkuLabel = displaySku ? getSkuDisplayName(displaySku) : "";
38375
38389
  const efficiencyValue = workspace.avg_efficiency || 0;
38376
38390
  const efficiencyTarget = effectiveLegend.green_min;
38377
38391
  const efficiencyColor = getEfficiencyHexColor(efficiencyValue, effectiveLegend);
@@ -38402,7 +38416,7 @@ var WorkspaceMetricCardsImpl = ({
38402
38416
  /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm h-full min-h-[150px] sm:min-h-0", children: [
38403
38417
  /* @__PURE__ */ jsxs(CardHeader2, { className: "pb-2 flex-none text-center", children: [
38404
38418
  /* @__PURE__ */ jsx(CardTitle2, { className: "text-lg", children: "PPH" }),
38405
- displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
38419
+ displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
38406
38420
  ] }),
38407
38421
  /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6 sm:py-3", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
38408
38422
  /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold ${pphValue >= pphThreshold ? "text-green-500" : "text-red-500"}`, children: pphValue.toFixed(1) }),
@@ -38415,7 +38429,7 @@ var WorkspaceMetricCardsImpl = ({
38415
38429
  /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm h-full min-h-[150px] sm:min-h-0", children: [
38416
38430
  /* @__PURE__ */ jsxs(CardHeader2, { className: "pb-2 flex-none text-center", children: [
38417
38431
  /* @__PURE__ */ jsx(CardTitle2, { className: "text-lg", children: "Avg. Cycle Time" }),
38418
- displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
38432
+ displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
38419
38433
  ] }),
38420
38434
  /* @__PURE__ */ jsx(CardContent2, { className: "flex-1 flex items-center justify-center py-6 sm:py-3", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
38421
38435
  /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold ${cycleValue > (cycleStandard || 0) ? "text-red-500" : "text-green-500"}`, children: cycleValue.toFixed(1) }),
@@ -51737,7 +51751,7 @@ var LinePdfGenerator = ({
51737
51751
  if (intervalIndex >= 0) {
51738
51752
  if (segmentIndex > 0 || segmentMinutes > hourlyTimeRanges[0]?.start) {
51739
51753
  if (!skuRemarksByIndex[intervalIndex]) skuRemarksByIndex[intervalIndex] = [];
51740
- skuRemarksByIndex[intervalIndex].push(segment.sku_code);
51754
+ skuRemarksByIndex[intervalIndex].push(getSkuDisplayName(segment));
51741
51755
  }
51742
51756
  }
51743
51757
  }
@@ -53751,7 +53765,7 @@ var WorkspacePdfGenerator = ({
53751
53765
  if (intervalIndex >= 0) {
53752
53766
  if (segmentIndex > 0 || segmentMinutes > hourlyIntervals[0]?.start) {
53753
53767
  if (!skuRemarksByIndex[intervalIndex]) skuRemarksByIndex[intervalIndex] = [];
53754
- skuRemarksByIndex[intervalIndex].push(segment.sku_code);
53768
+ skuRemarksByIndex[intervalIndex].push(getSkuDisplayName(segment));
53755
53769
  }
53756
53770
  }
53757
53771
  }
@@ -54416,6 +54430,7 @@ var WorkspaceCycleTimeMetricCards = ({
54416
54430
  }, [activeSku, skuAware, activeSkuId, liveSkuId, skuBreakdown]);
54417
54431
  const cycleValue = activeSku ? activeSku.avg_cycle_time : workspace.avg_cycle_time;
54418
54432
  const cycleStandard = activeSku ? activeSku.ideal_cycle_time : workspace.ideal_cycle_time;
54433
+ const displaySkuLabel = displaySku ? getSkuDisplayName(displaySku) : "";
54419
54434
  const efficiencyValue = workspace.avg_efficiency || 0;
54420
54435
  const efficiencyTarget = effectiveLegend.green_min;
54421
54436
  const efficiencyColor = getEfficiencyHexColor(efficiencyValue, effectiveLegend);
@@ -54443,7 +54458,7 @@ var WorkspaceCycleTimeMetricCards = ({
54443
54458
  /* @__PURE__ */ jsxs(Card2, { className: "flex flex-col bg-white shadow-sm border border-gray-200 h-full min-h-[150px] sm:min-h-0 rounded-xl", children: [
54444
54459
  /* @__PURE__ */ jsxs(CardHeader2, { className: "pb-1 pt-5 flex-none text-center", children: [
54445
54460
  /* @__PURE__ */ jsx(CardTitle2, { className: "text-[15px] font-bold text-gray-900 tracking-wide", children: "Cycle Time (s)" }),
54446
- displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySku.sku_code, children: displaySku.sku_code })
54461
+ displaySku && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-blue-600 mt-1 truncate px-2", title: displaySkuLabel, children: displaySkuLabel })
54447
54462
  ] }),
54448
54463
  /* @__PURE__ */ jsxs(CardContent2, { className: "flex-1 flex flex-col items-center justify-center pb-6", children: [
54449
54464
  /* @__PURE__ */ jsx("p", { className: `text-5xl font-bold tracking-tight ${cycleValue > (cycleStandard || 0) ? "text-red-500" : "text-[#34C759]"}`, children: cycleValue.toFixed(1) }),
@@ -66502,6 +66517,7 @@ var MetricCards = memo$1(({
66502
66517
  (prevProps.skuBreakdown || []).map((sku) => ({
66503
66518
  sku_id: sku.sku_id,
66504
66519
  sku_code: sku.sku_code,
66520
+ sku_display_name: sku.sku_display_name,
66505
66521
  total_output: sku.total_output,
66506
66522
  target_output: sku.target_output,
66507
66523
  avg_pph: sku.avg_pph,
@@ -66517,6 +66533,7 @@ var MetricCards = memo$1(({
66517
66533
  (nextProps.skuBreakdown || []).map((sku) => ({
66518
66534
  sku_id: sku.sku_id,
66519
66535
  sku_code: sku.sku_code,
66536
+ sku_display_name: sku.sku_display_name,
66520
66537
  total_output: sku.total_output,
66521
66538
  target_output: sku.target_output,
66522
66539
  avg_pph: sku.avg_pph,
@@ -66826,6 +66843,7 @@ var BottomSection = memo$1(({
66826
66843
  (prevProps.skuSegments || []).map((segment) => ({
66827
66844
  sku_id: segment.sku_id,
66828
66845
  sku_code: segment.sku_code,
66846
+ sku_display_name: segment.sku_display_name,
66829
66847
  start_time: segment.start_time,
66830
66848
  end_time: segment.end_time,
66831
66849
  pph_threshold: segment.pph_threshold
@@ -66835,6 +66853,7 @@ var BottomSection = memo$1(({
66835
66853
  (nextProps.skuSegments || []).map((segment) => ({
66836
66854
  sku_id: segment.sku_id,
66837
66855
  sku_code: segment.sku_code,
66856
+ sku_display_name: segment.sku_display_name,
66838
66857
  start_time: segment.start_time,
66839
66858
  end_time: segment.end_time,
66840
66859
  pph_threshold: segment.pph_threshold
@@ -67515,6 +67534,7 @@ var KPIDetailView = ({
67515
67534
  }).map((item) => ({
67516
67535
  sku_id: item.sku_id,
67517
67536
  sku_code: item.sku_code,
67537
+ sku_display_name: item.sku_display_name,
67518
67538
  sku_definition: "",
67519
67539
  is_dummy: false,
67520
67540
  total_output: item.current_output ?? 0,
@@ -67579,11 +67599,13 @@ var KPIDetailView = ({
67579
67599
  }, [resolvedLineInfo, selectedSkuRow]);
67580
67600
  const handleSkuChange = useCallback((nextSkuId) => {
67581
67601
  if (nextSkuId === selectedSkuId) return;
67602
+ const selectedSkuOption = nextSkuId === "all" ? null : realSkuOptions.find((item) => item.sku_id === nextSkuId) ?? null;
67582
67603
  setSelectedSkuId(nextSkuId);
67583
67604
  trackCoreEvent("Line Detail SKU Filter Changed", {
67584
67605
  line_id: lineId,
67585
67606
  sku_id: nextSkuId === "all" ? null : nextSkuId,
67586
- sku_code: nextSkuId === "all" ? null : realSkuOptions.find((item) => item.sku_id === nextSkuId)?.sku_code ?? null
67607
+ sku_code: selectedSkuOption?.sku_code ?? null,
67608
+ sku_display_name: selectedSkuOption ? getSkuDisplayName(selectedSkuOption) : null
67587
67609
  });
67588
67610
  }, [lineId, realSkuOptions, selectedSkuId]);
67589
67611
  const handleChartSkuSelect = useCallback(
@@ -73537,6 +73559,7 @@ var SKUSelector = ({
73537
73559
  if (lineId && (sku.line_id ?? "") !== lineId) return false;
73538
73560
  const term = searchTerm.toLowerCase();
73539
73561
  if (term.length === 0) return true;
73562
+ if (getSkuDisplayName(sku).toLowerCase().includes(term)) return true;
73540
73563
  if ((sku.sku_id || "").toLowerCase().includes(term)) return true;
73541
73564
  if ((sku.sku_definition || "").toLowerCase().includes(term)) return true;
73542
73565
  return JSON.stringify(sku.attributes ?? {}).toLowerCase().includes(term);
@@ -73561,7 +73584,7 @@ var SKUSelector = ({
73561
73584
  disabled,
73562
73585
  children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
73563
73586
  /* @__PURE__ */ jsx("span", { className: selectedSKU ? "text-gray-900" : "text-gray-500", children: selectedSKU ? /* @__PURE__ */ jsxs("div", { children: [
73564
- /* @__PURE__ */ jsx("span", { className: "font-medium", children: selectedSKU.sku_id }),
73587
+ /* @__PURE__ */ jsx("span", { className: "font-medium", children: getSkuDisplayName(selectedSKU) }),
73565
73588
  /* @__PURE__ */ jsxs("span", { className: "text-sm text-gray-500 ml-2", children: [
73566
73589
  "(Target: ",
73567
73590
  selectedSKU.production_target,
@@ -73605,7 +73628,7 @@ var SKUSelector = ({
73605
73628
  ${selectedSKU?.id === sku.id ? "bg-blue-50" : ""}
73606
73629
  `,
73607
73630
  children: /* @__PURE__ */ jsxs("div", { children: [
73608
- /* @__PURE__ */ jsx("div", { className: "font-medium", children: sku.sku_id }),
73631
+ /* @__PURE__ */ jsx("div", { className: "font-medium", children: getSkuDisplayName(sku) }),
73609
73632
  /* @__PURE__ */ jsxs("div", { className: "text-xs text-gray-500", children: [
73610
73633
  "Target: ",
73611
73634
  sku.production_target,
@@ -73661,44 +73684,50 @@ var SKUList = ({
73661
73684
  return /* @__PURE__ */ jsxs(Fragment, { children: [
73662
73685
  /* @__PURE__ */ jsx("div", { className: "hidden lg:block bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-gray-200", children: [
73663
73686
  /* @__PURE__ */ jsx("thead", { className: "bg-gray-50", children: /* @__PURE__ */ jsxs("tr", { children: [
73664
- /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "SKU Code" }),
73687
+ /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "SKU" }),
73665
73688
  /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Definition" }),
73666
73689
  /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Line" }),
73667
73690
  /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Production Target" }),
73668
73691
  /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Status" }),
73669
73692
  /* @__PURE__ */ jsx("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Created" })
73670
73693
  ] }) }),
73671
- /* @__PURE__ */ jsx("tbody", { className: "bg-white divide-y divide-gray-200", children: skus.map((sku) => /* @__PURE__ */ jsxs("tr", { className: "hover:bg-gray-50 transition-colors duration-150", children: [
73672
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-900", children: sku.sku_id }) }),
73673
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4", children: /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700 max-w-md truncate", title: sku.sku_definition || "", children: sku.sku_definition || /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: "\u2014" }) }) }),
73674
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) }) }),
73675
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-gray-700", children: formatTarget(sku.production_target) }) }),
73676
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) }),
73677
- /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: formatCreatedAt(sku.created_at) })
73678
- ] }, sku.id)) })
73694
+ /* @__PURE__ */ jsx("tbody", { className: "bg-white divide-y divide-gray-200", children: skus.map((sku) => {
73695
+ const displayName = getSkuDisplayName(sku);
73696
+ return /* @__PURE__ */ jsxs("tr", { className: "hover:bg-gray-50 transition-colors duration-150", children: [
73697
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-gray-900", children: displayName }) }),
73698
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4", children: /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700 max-w-md truncate", title: sku.sku_definition || "", children: sku.sku_definition || /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: "\u2014" }) }) }),
73699
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) }) }),
73700
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-gray-700", children: formatTarget(sku.production_target) }) }),
73701
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) }),
73702
+ /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap text-sm text-gray-500", children: formatCreatedAt(sku.created_at) })
73703
+ ] }, sku.id);
73704
+ }) })
73679
73705
  ] }) }) }),
73680
- /* @__PURE__ */ jsx("div", { className: "lg:hidden space-y-3 sm:space-y-4", children: skus.map((sku) => /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-200 p-4 hover:shadow-md transition-all duration-200", children: [
73681
- /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between mb-3", children: /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
73682
- /* @__PURE__ */ jsx("h3", { className: "text-base sm:text-lg font-semibold text-gray-900 truncate", children: sku.sku_id }),
73683
- /* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) })
73684
- ] }) }),
73685
- /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73686
- /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Definition" }),
73687
- /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700 break-words", children: sku.sku_definition || /* @__PURE__ */ jsx("span", { className: "text-gray-400 italic", children: "\u2014" }) })
73688
- ] }),
73689
- /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73690
- /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Line" }),
73691
- /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) })
73692
- ] }),
73693
- /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73694
- /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Production Target" }),
73695
- /* @__PURE__ */ jsx("div", { className: "text-sm sm:text-base font-medium text-gray-700", children: formatTarget(sku.production_target) })
73696
- ] }),
73697
- /* @__PURE__ */ jsxs("div", { className: "text-xs text-gray-500", children: [
73698
- "Created: ",
73699
- formatCreatedAt(sku.created_at)
73700
- ] })
73701
- ] }, sku.id)) })
73706
+ /* @__PURE__ */ jsx("div", { className: "lg:hidden space-y-3 sm:space-y-4", children: skus.map((sku) => {
73707
+ const displayName = getSkuDisplayName(sku);
73708
+ return /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-sm border border-gray-200 p-4 hover:shadow-md transition-all duration-200", children: [
73709
+ /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between mb-3", children: /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
73710
+ /* @__PURE__ */ jsx("h3", { className: "text-base sm:text-lg font-semibold text-gray-900 truncate", children: displayName }),
73711
+ /* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx("span", { className: `inline-flex px-2 py-1 text-xs font-semibold rounded-full ${sku.is_active ? "bg-green-100 text-green-800" : "bg-gray-100 text-gray-800"}`, children: sku.is_active ? "Active" : "Inactive" }) })
73712
+ ] }) }),
73713
+ /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73714
+ /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Definition" }),
73715
+ /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700 break-words", children: sku.sku_definition || /* @__PURE__ */ jsx("span", { className: "text-gray-400 italic", children: "\u2014" }) })
73716
+ ] }),
73717
+ /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73718
+ /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Line" }),
73719
+ /* @__PURE__ */ jsx("div", { className: "text-sm text-gray-700", children: formatLine(sku, lineNames) })
73720
+ ] }),
73721
+ /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
73722
+ /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider mb-1", children: "Production Target" }),
73723
+ /* @__PURE__ */ jsx("div", { className: "text-sm sm:text-base font-medium text-gray-700", children: formatTarget(sku.production_target) })
73724
+ ] }),
73725
+ /* @__PURE__ */ jsxs("div", { className: "text-xs text-gray-500", children: [
73726
+ "Created: ",
73727
+ formatCreatedAt(sku.created_at)
73728
+ ] })
73729
+ ] }, sku.id);
73730
+ }) })
73702
73731
  ] });
73703
73732
  };
73704
73733
  var TargetsViewUI = ({
@@ -73929,7 +73958,7 @@ var TargetsViewUI = ({
73929
73958
  className: "w-full sm:w-auto rounded-lg border border-gray-300 bg-white px-3 py-1.5 text-sm shadow-sm focus:border-blue-500 focus:ring-blue-500 transition-all duration-200 hover:border-gray-400",
73930
73959
  "aria-label": `SKU for ${formattedName}`,
73931
73960
  children: realSkuOptions.map((row) => /* @__PURE__ */ jsxs("option", { value: row.sku_uuid, children: [
73932
- row.sku_code,
73961
+ getSkuDisplayName(row),
73933
73962
  workspace.currentSku && !workspace.currentSku.is_dummy && workspace.currentSku.sku_uuid === row.sku_uuid ? " (active)" : ""
73934
73963
  ] }, row.sku_uuid))
73935
73964
  }
@@ -74196,8 +74225,14 @@ var TargetsView = ({
74196
74225
  const skuMetaByUuid = useMemo(() => {
74197
74226
  const map = /* @__PURE__ */ new Map();
74198
74227
  skuCatalog.forEach((sku) => {
74228
+ const skuCode = sku.sku_id || sku.id;
74199
74229
  map.set(sku.id, {
74200
- sku_code: sku.sku_id || sku.id,
74230
+ sku_code: skuCode,
74231
+ sku_display_name: getSkuDisplayName({
74232
+ display_name: sku.display_name,
74233
+ sku_code: skuCode,
74234
+ id: sku.id
74235
+ }),
74201
74236
  is_dummy: sku.sku_definition === "dummy_definition",
74202
74237
  line_id: sku.line_id
74203
74238
  });
@@ -74209,11 +74244,20 @@ var TargetsView = ({
74209
74244
  skuCatalog.forEach((sku) => {
74210
74245
  if (sku.sku_definition === "dummy_definition") return;
74211
74246
  const list = map.get(sku.line_id) || [];
74212
- list.push({ sku_uuid: sku.id, sku_code: sku.sku_id || sku.id });
74247
+ const skuCode = sku.sku_id || sku.id;
74248
+ list.push({
74249
+ sku_uuid: sku.id,
74250
+ sku_code: skuCode,
74251
+ sku_display_name: getSkuDisplayName({
74252
+ display_name: sku.display_name,
74253
+ sku_code: skuCode,
74254
+ id: sku.id
74255
+ })
74256
+ });
74213
74257
  map.set(sku.line_id, list);
74214
74258
  });
74215
74259
  map.forEach((list) => list.sort(
74216
- (a, b) => a.sku_code.localeCompare(b.sku_code, void 0, { numeric: true })
74260
+ (a, b) => a.sku_display_name.localeCompare(b.sku_display_name, void 0, { numeric: true })
74217
74261
  ));
74218
74262
  return map;
74219
74263
  }, [skuCatalog]);
@@ -74361,8 +74405,9 @@ var TargetsView = ({
74361
74405
  const meta = skuMetaByUuid.get(skuUuid);
74362
74406
  skuRowsMap.set(skuUuid, {
74363
74407
  sku_uuid: skuUuid,
74364
- sku_code: meta?.sku_code || skuUuid,
74365
- is_dummy: meta?.is_dummy ?? false,
74408
+ sku_code: payload?.sku_code || meta?.sku_code || skuUuid,
74409
+ sku_display_name: payload?.sku_display_name || meta?.sku_display_name || payload?.sku_code || meta?.sku_code || skuUuid,
74410
+ is_dummy: payload?.is_dummy ?? meta?.is_dummy ?? false,
74366
74411
  pph_threshold: payload?.pph_threshold ? Math.round(payload.pph_threshold) : "",
74367
74412
  ideal_cycle_time: payload?.ideal_cycle_time ?? "",
74368
74413
  total_day_output: payload?.total_day_output ?? "",
@@ -74415,10 +74460,11 @@ var TargetsView = ({
74415
74460
  const lineDummySkuUuidFallback = dummySkuByLine.get(lineId) || null;
74416
74461
  const buildEmptySkuRows = () => {
74417
74462
  const rows = [];
74418
- lineNonDummySkusFallback.forEach(({ sku_uuid, sku_code }) => {
74463
+ lineNonDummySkusFallback.forEach(({ sku_uuid, sku_code, sku_display_name }) => {
74419
74464
  rows.push({
74420
74465
  sku_uuid,
74421
74466
  sku_code,
74467
+ sku_display_name,
74422
74468
  is_dummy: false,
74423
74469
  pph_threshold: "",
74424
74470
  ideal_cycle_time: "",
@@ -74431,6 +74477,7 @@ var TargetsView = ({
74431
74477
  rows.push({
74432
74478
  sku_uuid: lineDummySkuUuidFallback,
74433
74479
  sku_code: meta?.sku_code || lineDummySkuUuidFallback,
74480
+ sku_display_name: meta?.sku_display_name || meta?.sku_code || lineDummySkuUuidFallback,
74434
74481
  is_dummy: true,
74435
74482
  pph_threshold: "",
74436
74483
  ideal_cycle_time: "",
@@ -74757,6 +74804,7 @@ var TargetsView = ({
74757
74804
  rowsToSave = fallback ? [{
74758
74805
  sku_uuid: fallback.sku_uuid,
74759
74806
  sku_code: "",
74807
+ sku_display_name: "",
74760
74808
  is_dummy: true,
74761
74809
  pph_threshold: fallback.pph_threshold,
74762
74810
  ideal_cycle_time: fallback.ideal_cycle_time,
@@ -76824,7 +76872,7 @@ var SKUManagementView = () => {
76824
76872
  if (activeFilter === "inactive" && sku.is_active) return false;
76825
76873
  if (lineFilter !== "all" && sku.line_id !== lineFilter) return false;
76826
76874
  if (term.length === 0) return true;
76827
- return (sku.sku_id || "").toLowerCase().includes(term);
76875
+ return getSkuDisplayName(sku).toLowerCase().includes(term) || (sku.sku_id || "").toLowerCase().includes(term);
76828
76876
  });
76829
76877
  }, [skus, searchTerm, lineFilter, activeFilter]);
76830
76878
  const handleBack = () => {
@@ -76864,9 +76912,9 @@ var SKUManagementView = () => {
76864
76912
  type: "search",
76865
76913
  value: searchTerm,
76866
76914
  onChange: (event) => setSearchTerm(event.target.value),
76867
- placeholder: "Search by SKU code",
76915
+ placeholder: "Search by SKU",
76868
76916
  className: "w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500",
76869
- "aria-label": "Search SKUs by code"
76917
+ "aria-label": "Search SKUs"
76870
76918
  }
76871
76919
  )
76872
76920
  ] }),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@optifye/dashboard-core",
3
- "version": "6.12.8",
3
+ "version": "6.12.9",
4
4
  "description": "Reusable UI & logic for Optifye dashboard",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",