@gem-sdk/analytics 2.0.0-dev.1 → 3.0.0-dev.3

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 (59) hide show
  1. package/dist/esm/components/CardPathAnalysis/components/PathAnalysisChart.d.ts +0 -1
  2. package/dist/esm/components/CardPathAnalysis/contexts/PathAnalysisConfigProvider.d.ts +8 -1
  3. package/dist/esm/components/CardPathAnalysis/hooks/usePathAnalysisChart.d.ts +1 -0
  4. package/dist/esm/components/CardPathAnalysis/hooks/usePathAnalysisFunnel.d.ts +2 -1
  5. package/dist/esm/components/GSelectableMetricChartCard/GSelectableMetricChartCard.d.ts +2 -1
  6. package/dist/esm/components/GSelectableMetricChartCard/MetricChartTab.d.ts +2 -1
  7. package/dist/esm/components/MetricDonutChartCard/MetricDonutChartCard.d.ts +2 -1
  8. package/dist/esm/components/OrderAnalytic/OrderListingLatestTable.d.ts +2 -1
  9. package/dist/esm/components/OrderAnalytic/components/OrderListing/OrderListingTable.d.ts +2 -1
  10. package/dist/esm/components/SingleMetricChartCard/SingleMetricChartCard.d.ts +2 -1
  11. package/dist/esm/components/common/chart/MetricInfoBlock.d.ts +2 -1
  12. package/dist/esm/index.js +227 -152
  13. package/dist/esm/index.mjs +227 -152
  14. package/dist/esm/providers/TimezoneProvider.d.ts +11 -0
  15. package/dist/esm/providers/index.d.ts +2 -0
  16. package/dist/esm/shared/charts/components/GFunnelChart/components/types.d.ts +1 -0
  17. package/dist/esm/shared/charts/contexts/GChartProvider.d.ts +1 -1
  18. package/dist/esm/shared/components/GInlineCenter/GInlineCenter.d.ts +1 -1
  19. package/dist/esm/shared/components/GMockDataTooltip/GMockDataTooltip.d.ts +12 -0
  20. package/dist/esm/shared/components/GMockDataTooltip/index.d.ts +1 -0
  21. package/dist/esm/shared/components/index.d.ts +1 -0
  22. package/dist/esm/shared/reports/ui/ReportTable/ReportTable.d.ts +2 -1
  23. package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/Cell.d.ts +2 -1
  24. package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/OrderCell/OrderCellContainer.d.ts +1 -1
  25. package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/OrderIdCell.d.ts +1 -1
  26. package/dist/esm/shared/reports/ui/ReportTable/components/Body/Cell/type.d.ts +1 -0
  27. package/dist/esm/shared/reports/ui/ReportTable/components/Body/Row.d.ts +2 -1
  28. package/dist/esm/shared/reports/ui/ReportTable/components/Footer/Pagination.d.ts +2 -1
  29. package/dist/esm/shared/reports/ui/ReportTable/components/Footer/WrapperFooter.d.ts +2 -1
  30. package/dist/style.css +1 -1
  31. package/dist/umd/esm/components/CardPathAnalysis/components/PathAnalysisChart.d.ts +0 -1
  32. package/dist/umd/esm/components/CardPathAnalysis/contexts/PathAnalysisConfigProvider.d.ts +8 -1
  33. package/dist/umd/esm/components/CardPathAnalysis/hooks/usePathAnalysisChart.d.ts +1 -0
  34. package/dist/umd/esm/components/CardPathAnalysis/hooks/usePathAnalysisFunnel.d.ts +2 -1
  35. package/dist/umd/esm/components/GSelectableMetricChartCard/GSelectableMetricChartCard.d.ts +2 -1
  36. package/dist/umd/esm/components/GSelectableMetricChartCard/MetricChartTab.d.ts +2 -1
  37. package/dist/umd/esm/components/MetricDonutChartCard/MetricDonutChartCard.d.ts +2 -1
  38. package/dist/umd/esm/components/OrderAnalytic/OrderListingLatestTable.d.ts +2 -1
  39. package/dist/umd/esm/components/OrderAnalytic/components/OrderListing/OrderListingTable.d.ts +2 -1
  40. package/dist/umd/esm/components/SingleMetricChartCard/SingleMetricChartCard.d.ts +2 -1
  41. package/dist/umd/esm/components/common/chart/MetricInfoBlock.d.ts +2 -1
  42. package/dist/umd/esm/providers/TimezoneProvider.d.ts +11 -0
  43. package/dist/umd/esm/providers/index.d.ts +2 -0
  44. package/dist/umd/esm/shared/charts/components/GFunnelChart/components/types.d.ts +1 -0
  45. package/dist/umd/esm/shared/charts/contexts/GChartProvider.d.ts +1 -1
  46. package/dist/umd/esm/shared/components/GInlineCenter/GInlineCenter.d.ts +1 -1
  47. package/dist/umd/esm/shared/components/GMockDataTooltip/GMockDataTooltip.d.ts +12 -0
  48. package/dist/umd/esm/shared/components/GMockDataTooltip/index.d.ts +1 -0
  49. package/dist/umd/esm/shared/components/index.d.ts +1 -0
  50. package/dist/umd/esm/shared/reports/ui/ReportTable/ReportTable.d.ts +2 -1
  51. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Body/Cell/Cell.d.ts +2 -1
  52. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Body/Cell/OrderCell/OrderCellContainer.d.ts +1 -1
  53. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Body/Cell/OrderIdCell.d.ts +1 -1
  54. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Body/Cell/type.d.ts +1 -0
  55. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Body/Row.d.ts +2 -1
  56. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Footer/Pagination.d.ts +2 -1
  57. package/dist/umd/esm/shared/reports/ui/ReportTable/components/Footer/WrapperFooter.d.ts +2 -1
  58. package/dist/umd/index.js +1 -1
  59. package/package.json +1 -1
@@ -1246,7 +1246,7 @@ const GPagination = ({ currentPage, totalPages, loading, handlePageChange, ...pa
1246
1246
  return (jsxs(InlineStack, { gap: "500", blockAlign: "center", children: [jsx(Pagination$1, { ...paginationProps, hasPrevious: !loading && hasPrevious, onPrevious: () => handlePageChange(GPaginationDirection.PREVIOUS), hasNext: !loading && hasNext, onNext: () => handlePageChange(GPaginationDirection.NEXT) }), totalPages > 1 && (jsxs(Text, { as: "span", variant: "bodyMd", numeric: true, children: [currentPage, "/", totalPages] }))] }));
1247
1247
  };
1248
1248
 
1249
- const GInlineCenter = ({ align, inlineAlign, width, ...props }) => {
1249
+ const GInlineCenter = ({ align, inlineAlign, width, flexDirection, gap, ...props }) => {
1250
1250
  const stickyStyle = useMemo(() => {
1251
1251
  const style = {};
1252
1252
  return style;
@@ -1255,8 +1255,8 @@ const GInlineCenter = ({ align, inlineAlign, width, ...props }) => {
1255
1255
  ...stickyStyle,
1256
1256
  '--gp-inline-center-box-align': align,
1257
1257
  '--gp-inline-center-box-inline-align': inlineAlign,
1258
- '--gp-inline-center-box-flex-direction': props.flexDirection,
1259
- '--gp-inline-center-box-gap': props.gap ? `${(Number(props.gap) * 4) / 100}px` : undefined,
1258
+ '--gp-inline-center-box-flex-direction': flexDirection,
1259
+ '--gp-inline-center-box-gap': gap ? `${(Number(gap) * 4) / 100}px` : undefined,
1260
1260
  '--gp-inline-center-width': width,
1261
1261
  }, children: jsx(Box, { ...props, minWidth: "0" }) }));
1262
1262
  };
@@ -2439,6 +2439,17 @@ const GBoxCard = ({ children, ...props }) => {
2439
2439
  return (jsx(Box, { ...G_BOX_CARD_DEFAULT_PROPS, ...props, children: children }));
2440
2440
  };
2441
2441
 
2442
+ /**
2443
+ * Wraps its children with a demo-experiment tooltip when `isMockData` is true.
2444
+ * When `isMockData` is false it renders the children untouched.
2445
+ *
2446
+ * Keeps the demo copy in a single place so it only needs to be edited here.
2447
+ */
2448
+ const GMockDataTooltip = ({ isMockData, content, children, ...props }) => {
2449
+ const { t } = useTranslation();
2450
+ return (jsx(GTooltip, { isEnabled: isMockData, content: content ?? t('This is just a demo experiment. Create a real one to view order listing.'), dismissOnMouseOut: true, ...props, children: children }));
2451
+ };
2452
+
2442
2453
  const GChartSkeleton = () => {
2443
2454
  return jsx(GSkeletonDisplayText, { height: "188px" });
2444
2455
  };
@@ -2464,6 +2475,20 @@ const MetricChartProvider = ({ children, minHeight = CHART_MIN_HEIGHT, seriesCol
2464
2475
  }, children: children })] }));
2465
2476
  };
2466
2477
 
2478
+ const TimezoneContext = createContext({ tz: 'UTC' });
2479
+ const TimezoneProvider = ({ children, tz }) => {
2480
+ const [currentTz, setCurrentTz] = useState(() => {
2481
+ setTz(tz);
2482
+ return tz;
2483
+ });
2484
+ useEffect(() => {
2485
+ setTz(tz);
2486
+ setCurrentTz(tz);
2487
+ }, [tz]);
2488
+ return jsx(TimezoneContext.Provider, { value: { tz: currentTz }, children: children });
2489
+ };
2490
+ const useTimezoneContext = () => useContext(TimezoneContext);
2491
+
2467
2492
  const MetricChart = ({ lineChartData, isLoading, isEmptyMetricData, columnTypes, metricKey, }) => {
2468
2493
  const { formatValue, yAxisOptions } = useFormatLineChartData({ metricKey, columnTypes: columnTypes || {} });
2469
2494
  if (!metricKey) {
@@ -2546,24 +2571,26 @@ const MetricDonutChartSkeleton = () => {
2546
2571
 
2547
2572
  const MetricValueSummary = ({ totalValue, hideComparison }) => (jsx(BlockStack, { gap: "200", children: jsxs(InlineStack, { blockAlign: "center", gap: "200", wrap: false, children: [jsx(InlineStack, { blockAlign: "center", gap: "200", children: jsx(Text, { as: "span", variant: "headingSm", children: totalValue.value }) }), !hideComparison && jsx(MetricPercentage, { change: totalValue.change })] }) }));
2548
2573
 
2549
- const MetricInfoBlock = ({ item, isHovered, isLoading, hideComparison, titleVariant = 'headingMd', titleFontWeight, onClickTitle, }) => {
2574
+ const MetricInfoBlock = ({ item, isHovered, isLoading, hideComparison, titleVariant = 'headingMd', titleFontWeight, isMockData, onClickTitle, }) => {
2550
2575
  const { key, title, totalValue } = item;
2551
2576
  const tooltip = ANALYTICS_METRIC_TOOLTIP[key];
2552
2577
  if (isLoading)
2553
2578
  return jsx(MetricInfoSkeleton, {});
2554
- return (jsxs(BlockStack, { gap: "200", children: [jsx("div", { className: "hover:cursor-pointer hover:text-[--p-color-text-link-hover]", onClick: (e) => {
2579
+ return (jsxs(BlockStack, { gap: "200", children: [jsx("div", { className: isMockData ? undefined : 'hover:cursor-pointer hover:text-[--p-color-text-link-hover]', onClick: (e) => {
2580
+ if (isMockData)
2581
+ return;
2555
2582
  e?.stopPropagation();
2556
2583
  onClickTitle?.(key);
2557
- }, children: jsxs(InlineStack, { wrap: false, children: [jsx(Box, { maxWidth: "100%", overflowX: "hidden", children: jsx(GTooltipCard, { tooltip: tooltip, children: jsx(Text, { as: "span", variant: titleVariant, fontWeight: titleFontWeight, truncate: true, children: title }) }) }), isHovered && (jsx("div", { className: "flex h-[20px] w-[20px] items-center", children: jsx(Icon, { source: SvgChevronRightIcon, tone: "inherit" }) }))] }) }), jsx(MetricValueSummary, { totalValue: totalValue, hideComparison: hideComparison })] }));
2584
+ }, children: jsxs(InlineStack, { wrap: false, children: [jsx(Box, { maxWidth: "100%", overflowX: "hidden", children: jsx(GTooltipCard, { tooltip: tooltip, children: jsx(Text, { as: "span", variant: titleVariant, fontWeight: titleFontWeight, truncate: true, children: title }) }) }), isHovered && !isMockData && (jsx("div", { className: "flex h-[20px] w-[20px] items-center", children: jsx(Icon, { source: SvgChevronRightIcon, tone: "inherit" }) }))] }) }), jsx(MetricValueSummary, { totalValue: totalValue, hideComparison: hideComparison })] }));
2558
2585
  };
2559
2586
 
2560
- const MetricChartTab = ({ item, isActive, isLoading, hideComparison, onSelect, onClickTitle, }) => {
2587
+ const MetricChartTab = ({ item, isActive, isLoading, hideComparison, isMockData, onSelect, onClickTitle, }) => {
2561
2588
  const [isHovered, setIsHovered] = useState(false);
2562
2589
  const isHighlighted = isActive || isHovered;
2563
- return (jsx("div", { className: "w-full cursor-pointer overflow-hidden", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onClick: () => onSelect(item.key), children: jsx(Box, { paddingBlock: "150", paddingInline: "300", borderRadius: "200", background: isHighlighted ? 'bg-surface-active' : undefined, children: jsx(MetricInfoBlock, { item: item, isHovered: isHovered, isLoading: isLoading, hideComparison: hideComparison, titleVariant: "headingSm", titleFontWeight: "semibold", onClickTitle: onClickTitle }) }) }));
2590
+ return (jsx("div", { className: "w-full cursor-pointer overflow-hidden", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onClick: () => onSelect(item.key), children: jsx(Box, { paddingBlock: "150", paddingInline: "300", borderRadius: "200", background: isHighlighted ? 'bg-surface-active' : undefined, children: jsx(MetricInfoBlock, { item: item, isHovered: isHovered, isLoading: isLoading, hideComparison: hideComparison, titleVariant: "headingSm", titleFontWeight: "semibold", isMockData: isMockData, onClickTitle: onClickTitle }) }) }));
2564
2591
  };
2565
2592
 
2566
- const GSelectableMetricChartCard = ({ metricInfo, dataChart, defaultActiveTab, isLoading, isEmptyMetricData, hideComparison, currentPeriodLabel = DEFAULT_CURRENT_PERIOD_LABEL, previousPeriodLabel = DEFAULT_PREVIOUS_PERIOD_LABEL, columnTypes, }) => {
2593
+ const GSelectableMetricChartCard = ({ metricInfo, dataChart, defaultActiveTab, isLoading, isEmptyMetricData, hideComparison, currentPeriodLabel = DEFAULT_CURRENT_PERIOD_LABEL, previousPeriodLabel = DEFAULT_PREVIOUS_PERIOD_LABEL, columnTypes, isMockData, onclickMetric, }) => {
2567
2594
  const [activeTab, setActiveTab] = useState(defaultActiveTab);
2568
2595
  const lineChartData = useMemo(() => {
2569
2596
  const chartData = activeTab ? dataChart[activeTab] : undefined;
@@ -2579,7 +2606,7 @@ const GSelectableMetricChartCard = ({ metricInfo, dataChart, defaultActiveTab, i
2579
2606
  gridTemplateColumns: `repeat(${metricInfo.length}, 1fr)`,
2580
2607
  gap: '16px',
2581
2608
  marginBottom: '16px',
2582
- }, children: metricInfo.map((item) => (jsx(MetricChartTab, { item: item, isActive: activeTab === item.key, isLoading: isLoading, hideComparison: hideComparison, onSelect: setActiveTab }, item.key))) }), jsx(MetricChart, { lineChartData: lineChartData, isLoading: isLoading, isEmptyMetricData: isEmptyMetricData, metricKey: activeTab, columnTypes: columnTypes })] }));
2609
+ }, children: metricInfo.map((item) => (jsx(MetricChartTab, { item: item, isActive: activeTab === item.key, isLoading: isLoading, hideComparison: hideComparison, isMockData: isMockData, onSelect: setActiveTab, onClickTitle: onclickMetric }, item.key))) }), jsx(MetricChart, { lineChartData: lineChartData, isLoading: isLoading, isEmptyMetricData: isEmptyMetricData, metricKey: activeTab, columnTypes: columnTypes })] }));
2583
2610
  };
2584
2611
 
2585
2612
  EGroupOperator.OR;
@@ -2670,7 +2697,7 @@ const buildBreakdownDonutData = ({ targets, metricKey, totalsRow, comparisonTota
2670
2697
 
2671
2698
  const DONUT_CHART_MIN_HEIGHT = 294;
2672
2699
  const COMPACT_MAX_WIDTH = 1500;
2673
- const MetricDonutChartCard = ({ label, metricKey, targets, totalsRow, comparisonTotalsRow, sort, isLoading, isEmptyMetricData, minHeight = DONUT_CHART_MIN_HEIGHT, onClick, }) => {
2700
+ const MetricDonutChartCard = ({ label, metricKey, targets, totalsRow, comparisonTotalsRow, sort, isLoading, isEmptyMetricData, minHeight = DONUT_CHART_MIN_HEIGHT, isMockData, onClick, }) => {
2674
2701
  const tooltip = ANALYTICS_METRIC_TOOLTIP[metricKey];
2675
2702
  const { windowWidth, windowSize } = useWindowSize();
2676
2703
  const [isHovered, setIsHovered] = useState(false);
@@ -2682,20 +2709,22 @@ const MetricDonutChartCard = ({ label, metricKey, targets, totalsRow, comparison
2682
2709
  return numberWithCommas(`${value}`);
2683
2710
  };
2684
2711
  const handleClickTitle = (event) => {
2712
+ if (isMockData)
2713
+ return;
2685
2714
  event.stopPropagation();
2686
2715
  onClick();
2687
2716
  };
2688
2717
  const isCompactView = windowWidth.lg && windowSize.width < COMPACT_MAX_WIDTH;
2689
- return (jsx("div", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: jsx(Card, { children: jsxs(BlockStack, { gap: "200", children: [jsx(InlineStack, { children: jsx("div", { className: "hover:cursor-pointer hover:text-[--p-color-text-link-hover]", onClick: handleClickTitle, children: jsxs(InlineStack, { children: [jsx(GTooltipCard, { tooltip: tooltip, children: jsx(Text, { as: "h3", variant: "headingMd", children: label }) }), isHovered && jsx(Icon, { source: SvgChevronRightIcon, tone: "inherit" })] }) }) }), jsx("div", { className: cls('flex items-center justify-center', {
2718
+ return (jsx("div", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: jsx(Card, { children: jsxs(BlockStack, { gap: "200", children: [jsx(InlineStack, { children: jsx("div", { className: isMockData ? undefined : 'hover:cursor-pointer hover:text-[--p-color-text-link-hover]', onClick: handleClickTitle, children: jsxs(InlineStack, { children: [jsx(GTooltipCard, { tooltip: tooltip, children: jsx(Text, { as: "h3", variant: "headingMd", children: label }) }), isHovered && !isMockData && jsx(Icon, { source: SvgChevronRightIcon, tone: "inherit" })] }) }) }), jsx("div", { className: cls('flex items-center justify-center', {
2690
2719
  'max-h-[250px] overflow-hidden': isCompactView,
2691
2720
  }), children: isEmptyMetricData ? (jsx(MetricChartEmpty, { title: "No data yet", description: "Data needs time to gather" })) : (jsx(MetricChartProvider, { minHeight: minHeight, seriesColors: {}, children: jsx(DonutChart, { data: data, legendPosition: "left", showLegendValues: true, showLegend: true, theme: "Light", tooltipOptions: {
2692
2721
  valueFormatter: formatValue,
2693
2722
  }, labelFormatter: formatValue }) })) })] }) }) }));
2694
2723
  };
2695
2724
 
2696
- const SingleMetricChartCard = ({ metricInfo, lineChartData, isLoading, hideComparison, columnTypes, isEmptyMetricData, onClickTitle, }) => {
2725
+ const SingleMetricChartCard = ({ metricInfo, lineChartData, isLoading, hideComparison, columnTypes, isEmptyMetricData, isMockData, onClickTitle, }) => {
2697
2726
  const [isHovered, setIsHovered] = useState(false);
2698
- return (jsx("div", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: jsx(Card, { children: jsxs(BlockStack, { gap: "200", children: [jsx(MetricInfoBlock, { item: metricInfo, isHovered: isHovered, isLoading: isLoading, hideComparison: hideComparison, onClickTitle: onClickTitle }), jsx(MetricChart, { lineChartData: lineChartData, isLoading: isLoading, isEmptyMetricData: isEmptyMetricData, columnTypes: columnTypes, metricKey: metricInfo.key })] }) }) }));
2727
+ return (jsx("div", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: jsx(Card, { children: jsxs(BlockStack, { gap: "200", children: [jsx(MetricInfoBlock, { item: metricInfo, isHovered: isHovered, isLoading: isLoading, hideComparison: hideComparison, isMockData: isMockData, onClickTitle: onClickTitle }), jsx(MetricChart, { lineChartData: lineChartData, isLoading: isLoading, isEmptyMetricData: isEmptyMetricData, columnTypes: columnTypes, metricKey: metricInfo.key })] }) }) }));
2699
2728
  };
2700
2729
 
2701
2730
  var IMAGE_FIRST_SESSION = "data:image/png;base64,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";
@@ -3202,6 +3231,7 @@ const COMPARE_DATE_TIME_FILTERS_MAP = {
3202
3231
  };
3203
3232
 
3204
3233
  const useDateTimeFilter = () => {
3234
+ useTimezoneContext();
3205
3235
  const currentDate = dayjsTzToLocalTZ().startOf('day');
3206
3236
  const mappings = getDateTimeFilterMapping();
3207
3237
  const TODAY_CONFIG = mappings[MainDateTimePickerAlias.TODAY];
@@ -3762,10 +3792,11 @@ const DEFAULT_CONFIG = {
3762
3792
  isEnabledV2: false,
3763
3793
  onView: () => { },
3764
3794
  },
3795
+ autoExpandLevels: false,
3765
3796
  };
3766
3797
  const PathAnalysisConfigContext = createContext(DEFAULT_CONFIG);
3767
- const PathAnalysisConfigProvider = ({ children, pricing, heatmap }) => {
3768
- const value = useMemo(() => ({ pricing, heatmap }), [pricing, heatmap]);
3798
+ const PathAnalysisConfigProvider = ({ children, pricing, heatmap, autoExpandLevels, }) => {
3799
+ const value = useMemo(() => ({ pricing, heatmap, autoExpandLevels }), [pricing, heatmap, autoExpandLevels]);
3769
3800
  return jsx(PathAnalysisConfigContext.Provider, { value: value, children: children });
3770
3801
  };
3771
3802
  const usePathAnalysisConfig = () => useContext(PathAnalysisConfigContext);
@@ -4268,7 +4299,7 @@ const calculateConversionFunnelTrends = ({ pageWithMetric, previousPathAnalytics
4268
4299
  return trends;
4269
4300
  };
4270
4301
 
4271
- const usePathAnalysisFunnel = ({ pathAnalytics, pathAnalysisCacheKey, dataFirstLevels, locationPath, }) => {
4302
+ const usePathAnalysisFunnel = ({ pathAnalytics, pathAnalysisCacheKey, dataFirstLevels, locationPath, autoExpandLevels, }) => {
4272
4303
  const setFirstLevelLocationPath = usePathAnalysisStore((state) => state.setFirstLevelLocationPath);
4273
4304
  const firstLevelLocationPath = usePathAnalysisStore((state) => state.firstLevelLocationPath) || locationPath;
4274
4305
  const setCachedFunnelChartData = useFunnelChartStore((state) => state.setCachedFunnelChartData);
@@ -4379,6 +4410,25 @@ const usePathAnalysisFunnel = ({ pathAnalytics, pathAnalysisCacheKey, dataFirstL
4379
4410
  dynamicLevels: dynamicLevels,
4380
4411
  });
4381
4412
  }, [dynamicLevels]);
4413
+ // Auto-expand the dominant path down every level when the flag is enabled:
4414
+ // first level → highest-traffic child → ... up to MAX_FUNNEL_ADDITIONAL_LEVEL,
4415
+ // stopping as soon as a level has no further paths.
4416
+ useEffect(() => {
4417
+ if (!autoExpandLevels || !pageWithMetric)
4418
+ return;
4419
+ const expandedLevels = [];
4420
+ let currentPage = pageWithMetric;
4421
+ while (expandedLevels.length < MAX_FUNNEL_ADDITIONAL_LEVEL) {
4422
+ const childrenPages = getFunnelChildrenPages(currentPage);
4423
+ if (!childrenPages.length)
4424
+ break;
4425
+ // Pick the dominant child (highest sessions) — matches the top of the "+" popover.
4426
+ const nextPage = childrenPages.reduce((prev, curr) => (curr.metric?.totalSessions || 0) > (prev.metric?.totalSessions || 0) ? curr : prev);
4427
+ expandedLevels.push(nextPage);
4428
+ currentPage = nextPage;
4429
+ }
4430
+ setDynamicLevels(expandedLevels);
4431
+ }, [autoExpandLevels, pageWithMetric]);
4382
4432
  useEffect(() => {
4383
4433
  return () => {
4384
4434
  setFirstLevelLocationPath(undefined);
@@ -4437,12 +4487,14 @@ const PathAnalysisProvider = (props) => {
4437
4487
  const locationPath = analyticsData?.locationPath;
4438
4488
  const shopifyPageType = analyticsData?.shopifyPageType;
4439
4489
  const pathAnalysisCacheKey = JSON.stringify({ mode, campaignVariantID, campaignVersionID });
4490
+ const { autoExpandLevels } = usePathAnalysisConfig();
4440
4491
  const { processedPathAnalytics } = usePathAnalyticsMerger({ pathAnalytics, dataFirstLevels });
4441
4492
  const pathAnalysisFunnelData = usePathAnalysisFunnel({
4442
4493
  pathAnalytics: processedPathAnalytics,
4443
4494
  pathAnalysisCacheKey,
4444
4495
  dataFirstLevels,
4445
4496
  locationPath,
4497
+ autoExpandLevels,
4446
4498
  });
4447
4499
  const isLoading = isLoadingMetric || isFetchingFirstLevelPaths;
4448
4500
  return (jsx(PathAnalysisContext.Provider, { value: {
@@ -23707,6 +23759,10 @@ const ChartContainerWrapper = ({ props, children, height, }) => {
23707
23759
  };
23708
23760
 
23709
23761
  const GChartProvider = ({ children, minHeight = 228, seriesColors, }) => {
23762
+ const [mounted, setMounted] = useState(false);
23763
+ useEffect(() => setMounted(true), []);
23764
+ if (!mounted)
23765
+ return null;
23710
23766
  return (jsxs(Fragment, { children: [jsx("link", { rel: "stylesheet", href: chartStyle }), jsx(PolarisVizProvider, { themes: {
23711
23767
  Light: {
23712
23768
  chartContainer: {
@@ -23814,7 +23870,7 @@ const FunnelSelectionPopover = (props) => {
23814
23870
  const FunnelChartActionIcon = ({ level, isLastLevel, isFinalFixedLevel, actionProps, }) => {
23815
23871
  const { t } = useTranslation();
23816
23872
  const { isMobileView } = useWindowSize();
23817
- const { listFunnelSelection, onAddNextFunnel, onNotify, isDisabledAddICon } = actionProps || {};
23873
+ const { listFunnelSelection, onAddNextFunnel, onNotify, isDisabledAddICon, hideAddIcon } = actionProps || {};
23818
23874
  const lengthDisplayedLevels = actionProps?.lengthDisplayedLevels || 0;
23819
23875
  const [isOpenPathSelectionPopover, setIsOpenPathSelectionPopover] = useState(false);
23820
23876
  if (isLastLevel)
@@ -23822,7 +23878,7 @@ const FunnelChartActionIcon = ({ level, isLastLevel, isFinalFixedLevel, actionPr
23822
23878
  if (level < lengthDisplayedLevels || isFinalFixedLevel) {
23823
23879
  return jsx(Icon, { source: SvgArrowRightIcon });
23824
23880
  }
23825
- if (isMobileView)
23881
+ if (isMobileView || hideAddIcon)
23826
23882
  return null;
23827
23883
  const tooltip = isDisabledAddICon ? t('Funnel step limit reached.') : t('Add funnel step');
23828
23884
  return (jsx(FunnelSelectionPopover, { open: isOpenPathSelectionPopover, onClose: () => setIsOpenPathSelectionPopover(false), listFunnelSelection: listFunnelSelection, onAddNextFunnel: onAddNextFunnel, onNotify: onNotify, activator: jsx(GTooltip, { content: tooltip, children: jsx(Button, { icon: jsx(Icon, { source: SvgPlusIcon }), onClick: () => setIsOpenPathSelectionPopover((prev) => !prev), disabled: isDisabledAddICon }) }) }));
@@ -24057,7 +24113,7 @@ const NON_HEATMAP_PAGE_TYPES = new Set([TemplateType.CHECKOUT]);
24057
24113
  const usePathAnalysisChart = () => {
24058
24114
  const { t } = useTranslation();
24059
24115
  const { getTextPrice } = useConvertMoneyContext();
24060
- const { heatmap } = usePathAnalysisConfig();
24116
+ const { heatmap, autoExpandLevels } = usePathAnalysisConfig();
24061
24117
  const { shopifyPageType, pageWithMetric, nextLevelPages, dynamicLevels, previousPathAnalyticsMap, handleAddNextLevel, handleChangeLevel, getPagesByParentID, handleDeleteLevel, } = usePathAnalysisContext();
24062
24118
  const orderedPages = useMemo(() => [pageWithMetric, ...dynamicLevels].filter(Boolean), [pageWithMetric, dynamicLevels]);
24063
24119
  const chartTooltipPrimaryAction = useMemo(() => {
@@ -24124,12 +24180,15 @@ const usePathAnalysisChart = () => {
24124
24180
  getTextPrice,
24125
24181
  }),
24126
24182
  chartTooltipPrimaryAction: heatmap.isEnabledV2 ? getTooltipAction(item?.pageType ?? undefined) : undefined,
24127
- secondaryActions: [
24128
- {
24129
- onAction: () => onDeleteFunnel(item.id),
24130
- icon: SvgDeleteIcon,
24131
- },
24132
- ],
24183
+ // Auto-expand mode is a read-only view: hide the delete (trash) action.
24184
+ secondaryActions: autoExpandLevels
24185
+ ? undefined
24186
+ : [
24187
+ {
24188
+ onAction: () => onDeleteFunnel(item.id),
24189
+ icon: SvgDeleteIcon,
24190
+ },
24191
+ ],
24133
24192
  title: item.pageTitle ?? undefined,
24134
24193
  });
24135
24194
  // Previous data
@@ -24139,7 +24198,15 @@ const usePathAnalysisChart = () => {
24139
24198
  title: item.pageTitle ?? undefined,
24140
24199
  });
24141
24200
  return acc;
24142
- }, { currentData: [], previousData: [] }), [dynamicLevels, previousPathAnalyticsMap, onDeleteFunnel, getTextPrice, getTooltipAction, heatmap.isEnabledV2]);
24201
+ }, { currentData: [], previousData: [] }), [
24202
+ dynamicLevels,
24203
+ previousPathAnalyticsMap,
24204
+ onDeleteFunnel,
24205
+ getTextPrice,
24206
+ getTooltipAction,
24207
+ heatmap.isEnabledV2,
24208
+ autoExpandLevels,
24209
+ ]);
24143
24210
  const lastLevelPreviousData = previousPathAnalyticsMap[lastLevel?.id ?? ''];
24144
24211
  const funnelData = useMemo(() => {
24145
24212
  const firstLevelKey = pageWithMetric?.pageTitle ||
@@ -24223,6 +24290,9 @@ const usePathAnalysisChart = () => {
24223
24290
  }, [nextLevelPages]);
24224
24291
  //list funnel selection to change funnel
24225
24292
  const getListFunnelByID = (data) => {
24293
+ // Auto-expand mode is read-only: collapse the change-path popover to a static label.
24294
+ if (autoExpandLevels)
24295
+ return [];
24226
24296
  const { level, parentID } = data;
24227
24297
  const availableChildPages = getPagesByParentID({ level, parentID });
24228
24298
  // if (level === 0) {
@@ -24242,6 +24312,7 @@ const usePathAnalysisChart = () => {
24242
24312
  lengthDisplayedLevels,
24243
24313
  listFunnelSelection,
24244
24314
  isDisabledAddICon,
24315
+ hideAddIcon: !!autoExpandLevels,
24245
24316
  funnelData,
24246
24317
  onDeleteFunnel,
24247
24318
  onAddNextFunnel,
@@ -24251,7 +24322,7 @@ const usePathAnalysisChart = () => {
24251
24322
  };
24252
24323
 
24253
24324
  const PathAnalysisChart = ({ funnelColors, isEnabled }) => {
24254
- const { lengthDisplayedLevels, listFunnelSelection, isDisabledAddICon, funnelData, getListFunnelByID, onAddNextFunnel, onChangeFunnel, } = usePathAnalysisChart();
24325
+ const { lengthDisplayedLevels, listFunnelSelection, isDisabledAddICon, hideAddIcon, funnelData, getListFunnelByID, onAddNextFunnel, onChangeFunnel, } = usePathAnalysisChart();
24255
24326
  const dataSeries = useMemo(() => {
24256
24327
  if (!isEnabled)
24257
24328
  return MOCK_DATA_PATH_ANALYSIS;
@@ -24262,6 +24333,7 @@ const PathAnalysisChart = ({ funnelColors, isEnabled }) => {
24262
24333
  lengthDisplayedLevels,
24263
24334
  listFunnelSelection,
24264
24335
  isDisabledAddICon,
24336
+ hideAddIcon,
24265
24337
  getListFunnelByID,
24266
24338
  onAddNextFunnel,
24267
24339
  onChangeFunnel,
@@ -24334,11 +24406,17 @@ const CardJourneyAnalysis = ({ analyticMode, config, ...props }) => {
24334
24406
  return (jsx(PathAnalysisConfigProvider, { ...config, children: jsx(CardPathAnalysis, { analyticMode: analyticMode || EAnalyticMode.ALL_SESSION, ...props, children: jsx(InlineStack, { gap: "200", children: jsx(GTooltipCard, { tooltip: ANALYTICS_METRIC_TOOLTIP[EMetricKey.PAGE_PATH_ANALYSIS], children: jsx(Text, { as: "h3", variant: "headingMd", children: t('Journey analysis') }) }) }) }) }));
24335
24407
  };
24336
24408
 
24337
- var EReportSource;
24338
- (function (EReportSource) {
24339
- EReportSource["CAMPAIGN"] = "campaign";
24340
- EReportSource["PAGE"] = "page";
24341
- })(EReportSource || (EReportSource = {}));
24409
+ var EReportColumnKey;
24410
+ (function (EReportColumnKey) {
24411
+ EReportColumnKey["ORDER_ID"] = "order_id";
24412
+ EReportColumnKey["ORDER_DATE"] = "order_date";
24413
+ EReportColumnKey["TOTAL"] = "total_price";
24414
+ EReportColumnKey["CAMPAIGNS"] = "experiments";
24415
+ EReportColumnKey["TRAFFIC_SOURCE"] = "traffic_source";
24416
+ EReportColumnKey["ITEMS"] = "items";
24417
+ EReportColumnKey["DEVICE"] = "device";
24418
+ EReportColumnKey["VISITOR"] = "visitor_type";
24419
+ })(EReportColumnKey || (EReportColumnKey = {}));
24342
24420
 
24343
24421
  var EReportDataType;
24344
24422
  (function (EReportDataType) {
@@ -24394,17 +24472,74 @@ var IRMetricKey;
24394
24472
  IRMetricKey["VISITOR_BY_TYPE"] = "visitor_type";
24395
24473
  })(IRMetricKey || (IRMetricKey = {}));
24396
24474
 
24397
- var EReportColumnKey;
24398
- (function (EReportColumnKey) {
24399
- EReportColumnKey["ORDER_ID"] = "order_id";
24400
- EReportColumnKey["ORDER_DATE"] = "order_date";
24401
- EReportColumnKey["TOTAL"] = "total_price";
24402
- EReportColumnKey["CAMPAIGNS"] = "experiments";
24403
- EReportColumnKey["TRAFFIC_SOURCE"] = "traffic_source";
24404
- EReportColumnKey["ITEMS"] = "items";
24405
- EReportColumnKey["DEVICE"] = "device";
24406
- EReportColumnKey["VISITOR"] = "visitor_type";
24407
- })(EReportColumnKey || (EReportColumnKey = {}));
24475
+ [IRVariantType.VARIANT_A, IRVariantType.VARIANT_B];
24476
+ ({
24477
+ [IRVariantType.VARIANT_A]: 'Control',
24478
+ [IRVariantType.VARIANT_B]: 'Variant',
24479
+ });
24480
+
24481
+ const COLUMN_SEPARATOR = '___';
24482
+ const DIMENSION_SEPARATOR = '__';
24483
+ const COMPARISON_PREFIX = 'comparison';
24484
+ const PREVIOUS_PERIOD_KEY = 'previous_period';
24485
+ const TOTAL_SUFFIX = 'totals';
24486
+
24487
+ const joinColumnParts = (...parts) => parts.join(COLUMN_SEPARATOR);
24488
+ const getDimensionPathKey = (dimensions, dimensionIndex) => dimensions.slice(0, dimensionIndex + 1).join(DIMENSION_SEPARATOR);
24489
+ function getPreviousColumnName(key) {
24490
+ return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY);
24491
+ }
24492
+ function getPreviousTotalColumnName(key) {
24493
+ return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY, TOTAL_SUFFIX);
24494
+ }
24495
+ function getTotalColumnName(key) {
24496
+ return joinColumnParts(key, TOTAL_SUFFIX);
24497
+ }
24498
+ function getTotalColumnNameByDimensions(dimensions, key, dimensionIndex) {
24499
+ return joinColumnParts(key, getDimensionPathKey(dimensions, dimensionIndex), TOTAL_SUFFIX);
24500
+ }
24501
+ function getPreviousTotalColumnNameByDimensions(dimensions, key, dimensionIndex) {
24502
+ return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY, getDimensionPathKey(dimensions, dimensionIndex), TOTAL_SUFFIX);
24503
+ }
24504
+ function getMetricPreviousValue(row, key) {
24505
+ return row[getPreviousColumnName(key)];
24506
+ }
24507
+
24508
+ const convertOrderItemsToReportTableRows = (orderItems) => {
24509
+ return orderItems.map((orderItem) => {
24510
+ const { events: _events, ...restOrderItem } = orderItem;
24511
+ return {
24512
+ ...restOrderItem,
24513
+ items: typeof orderItem.items === 'string' ? JSON.parse(orderItem.items) : (orderItem.items ?? []),
24514
+ experiments: typeof orderItem.experiments === 'string' ? JSON.parse(orderItem.experiments) : (orderItem.experiments ?? []),
24515
+ };
24516
+ });
24517
+ };
24518
+ const applyTotalToSummaryRow = (rows) => {
24519
+ let totalPrice = 0;
24520
+ let totalItems = 0;
24521
+ rows.forEach((row) => {
24522
+ const rowTotal = row[EReportColumnKey.TOTAL];
24523
+ const rowItems = row[EReportColumnKey.ITEMS];
24524
+ if (typeof rowTotal === 'number') {
24525
+ totalPrice += rowTotal;
24526
+ }
24527
+ if (Array.isArray(rowItems)) {
24528
+ totalItems += rowItems.reduce((acc, item) => acc + Number(item.quantity), 0);
24529
+ }
24530
+ });
24531
+ return rows.map((row, index) => {
24532
+ const totalItemsLabel = totalItems > 1 ? `${totalItems} items` : `${totalItems} item`;
24533
+ return {
24534
+ // Only add totals to first row (used by SummaryRow)
24535
+ ...(index === 0 && {
24536
+ [getTotalColumnName(EReportColumnKey.TOTAL)]: totalPrice,
24537
+ [getTotalColumnName(EReportColumnKey.ITEMS)]: totalItemsLabel,
24538
+ }),
24539
+ ...row,
24540
+ };
24541
+ });
24542
+ };
24408
24543
 
24409
24544
  const ORDER_LISTING_DIMENSION_LAYOUT = {
24410
24545
  width: '158px',
@@ -24614,79 +24749,6 @@ const DEFAULT_SELECTED_COLUMNS_FOR_EXPERIMENT = [
24614
24749
  EReportColumnKey.VISITOR,
24615
24750
  ];
24616
24751
 
24617
- const OrderListingTableEmpty = ({ title, description }) => {
24618
- return (jsx(GBlockCenter, { paddingBlock: "400", children: jsxs(BlockStack, { gap: "400", inlineAlign: "center", children: [jsx("img", { src: ANALYTIC_EMPTY, alt: "No orders", width: 80, height: 80 }), jsxs(BlockStack, { gap: "200", inlineAlign: "center", children: [jsx(Text, { as: "p", variant: "headingSm", fontWeight: "semibold", children: title }), jsx(Text, { as: "p", variant: "bodyMd", tone: "subdued", alignment: "center", children: description })] })] }) }));
24619
- };
24620
-
24621
- [IRVariantType.VARIANT_A, IRVariantType.VARIANT_B];
24622
- ({
24623
- [IRVariantType.VARIANT_A]: 'Control',
24624
- [IRVariantType.VARIANT_B]: 'Variant',
24625
- });
24626
-
24627
- const COLUMN_SEPARATOR = '___';
24628
- const DIMENSION_SEPARATOR = '__';
24629
- const COMPARISON_PREFIX = 'comparison';
24630
- const PREVIOUS_PERIOD_KEY = 'previous_period';
24631
- const TOTAL_SUFFIX = 'totals';
24632
-
24633
- const joinColumnParts = (...parts) => parts.join(COLUMN_SEPARATOR);
24634
- const getDimensionPathKey = (dimensions, dimensionIndex) => dimensions.slice(0, dimensionIndex + 1).join(DIMENSION_SEPARATOR);
24635
- function getPreviousColumnName(key) {
24636
- return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY);
24637
- }
24638
- function getPreviousTotalColumnName(key) {
24639
- return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY, TOTAL_SUFFIX);
24640
- }
24641
- function getTotalColumnName(key) {
24642
- return joinColumnParts(key, TOTAL_SUFFIX);
24643
- }
24644
- function getTotalColumnNameByDimensions(dimensions, key, dimensionIndex) {
24645
- return joinColumnParts(key, getDimensionPathKey(dimensions, dimensionIndex), TOTAL_SUFFIX);
24646
- }
24647
- function getPreviousTotalColumnNameByDimensions(dimensions, key, dimensionIndex) {
24648
- return joinColumnParts(COMPARISON_PREFIX, key, PREVIOUS_PERIOD_KEY, getDimensionPathKey(dimensions, dimensionIndex), TOTAL_SUFFIX);
24649
- }
24650
- function getMetricPreviousValue(row, key) {
24651
- return row[getPreviousColumnName(key)];
24652
- }
24653
-
24654
- const convertOrderItemsToReportTableRows = (orderItems) => {
24655
- return orderItems.map((orderItem) => {
24656
- const { events: _events, ...restOrderItem } = orderItem;
24657
- return {
24658
- ...restOrderItem,
24659
- items: typeof orderItem.items === 'string' ? JSON.parse(orderItem.items) : (orderItem.items ?? []),
24660
- experiments: typeof orderItem.experiments === 'string' ? JSON.parse(orderItem.experiments) : (orderItem.experiments ?? []),
24661
- };
24662
- });
24663
- };
24664
- const applyTotalToSummaryRow = (rows) => {
24665
- let totalPrice = 0;
24666
- let totalItems = 0;
24667
- rows.forEach((row) => {
24668
- const rowTotal = row[EReportColumnKey.TOTAL];
24669
- const rowItems = row[EReportColumnKey.ITEMS];
24670
- if (typeof rowTotal === 'number') {
24671
- totalPrice += rowTotal;
24672
- }
24673
- if (Array.isArray(rowItems)) {
24674
- totalItems += rowItems.reduce((acc, item) => acc + Number(item.quantity), 0);
24675
- }
24676
- });
24677
- return rows.map((row, index) => {
24678
- const totalItemsLabel = totalItems > 1 ? `${totalItems} items` : `${totalItems} item`;
24679
- return {
24680
- // Only add totals to first row (used by SummaryRow)
24681
- ...(index === 0 && {
24682
- [getTotalColumnName(EReportColumnKey.TOTAL)]: totalPrice,
24683
- [getTotalColumnName(EReportColumnKey.ITEMS)]: totalItemsLabel,
24684
- }),
24685
- ...row,
24686
- };
24687
- });
24688
- };
24689
-
24690
24752
  const SKELETON_METRICS = [
24691
24753
  EReportColumnKey.ORDER_DATE,
24692
24754
  EReportColumnKey.TOTAL,
@@ -24772,6 +24834,10 @@ const OrderListingTableSkeleton = ({ rowCount = 5 }) => {
24772
24834
  return (jsxs("div", { className: "GReportTable__Container rounded-xl overflow-hidden", children: [jsxs("div", { className: "GReportTable__Wrapper", children: [jsx("div", { className: "GReportTable__StickyHeader", children: jsxs("div", { children: [jsx(SkeletonHeader, {}), jsx(SkeletonSummaryRow, {})] }) }), jsx("div", { className: "GReportTable__ScrollWrap", children: Array.from({ length: rowCount }).map((_, index) => (jsx(SkeletonRow, {}, index))) })] }), jsx("div", { className: "GReportTable__Pagination", children: jsx(InlineStack, { align: "space-between", blockAlign: "center", gap: "400", children: jsx("div", { className: "w-24", children: jsx(SkeletonBodyText, { lines: 1 }) }) }) })] }));
24773
24835
  };
24774
24836
 
24837
+ const OrderListingTableEmpty = ({ title, description }) => {
24838
+ return (jsx(GBlockCenter, { paddingBlock: "400", children: jsxs(BlockStack, { gap: "400", inlineAlign: "center", children: [jsx("img", { src: ANALYTIC_EMPTY, alt: "No orders", width: 80, height: 80 }), jsxs(BlockStack, { gap: "200", inlineAlign: "center", children: [jsx(Text, { as: "p", variant: "headingSm", fontWeight: "semibold", children: title }), jsx(Text, { as: "p", variant: "bodyMd", tone: "subdued", alignment: "center", children: description })] })] }) }));
24839
+ };
24840
+
24775
24841
  var EOrderDirectionType;
24776
24842
  (function (EOrderDirectionType) {
24777
24843
  EOrderDirectionType["ASC"] = "ASC";
@@ -25182,7 +25248,7 @@ const useReportData = () => {
25182
25248
  };
25183
25249
  };
25184
25250
 
25185
- const Pagination = ({ totalRows, itemCount, viewAllMetricContent = 'order', showViewAllButton, paginationProps, isPaginationHidden, }) => {
25251
+ const Pagination = ({ totalRows, itemCount, viewAllMetricContent = 'order', showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
25186
25252
  const { t } = useTranslation();
25187
25253
  const { onViewAllStoreOrders } = useReportTableActionsContext();
25188
25254
  const isHasTotalRows = Boolean(totalRows && totalRows > 0);
@@ -25197,7 +25263,7 @@ const Pagination = ({ totalRows, itemCount, viewAllMetricContent = 'order', show
25197
25263
  'justify-end': isShowViewAllStoreOrders,
25198
25264
  'justify-center': isHasTotalRows,
25199
25265
  'justify-between': (isHasTotalRows || paginationProps) && isShowViewAllStoreOrders,
25200
- }), children: [paginationProps && jsx(GPagination, { ...paginationProps }), isHasTotalRows && (jsx(Text, { variant: "bodyMd", as: "span", children: t(`${totalRows} rows`) })), isShowViewAllStoreOrders && (jsx(Button, { variant: "plain", onClick: handleClickViewAllStoreOrders, children: getViewAllStoreOrdersText() }))] }));
25266
+ }), children: [paginationProps && jsx(GPagination, { ...paginationProps }), isHasTotalRows && (jsx(Text, { variant: "bodyMd", as: "span", children: t(`${totalRows} rows`) })), isShowViewAllStoreOrders && (jsx(GMockDataTooltip, { isMockData: isMockData, children: jsx(Button, { variant: "plain", disabled: isMockData, onClick: handleClickViewAllStoreOrders, children: getViewAllStoreOrdersText() }) }))] }));
25201
25267
  function getViewAllStoreOrdersText() {
25202
25268
  if (itemCount && itemCount > 1) {
25203
25269
  return t('View all store {{metric}}s by date range ({{itemCount}})', {
@@ -25216,8 +25282,8 @@ const ScrollBar = forwardRef(({ isPaginationHidden }, ref) => {
25216
25282
  });
25217
25283
  ScrollBar.displayName = 'ScrollBar';
25218
25284
 
25219
- const WrapperFooter = ({ scrollbarContainerRef, itemCount, totalPaginationRows, showViewAllButton, paginationProps, isPaginationHidden, }) => {
25220
- return (jsxs("div", { className: "GReportTable__FooterWrapper", children: [scrollbarContainerRef && jsx(ScrollBar, { ref: scrollbarContainerRef, isPaginationHidden: isPaginationHidden }), jsx(Pagination, { totalRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden })] }));
25285
+ const WrapperFooter = ({ scrollbarContainerRef, itemCount, totalPaginationRows, showViewAllButton, paginationProps, isPaginationHidden, isMockData, }) => {
25286
+ return (jsxs("div", { className: "GReportTable__FooterWrapper", children: [scrollbarContainerRef && jsx(ScrollBar, { ref: scrollbarContainerRef, isPaginationHidden: isPaginationHidden }), jsx(Pagination, { totalRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden, isMockData: isMockData })] }));
25221
25287
  };
25222
25288
 
25223
25289
  const PreviousCell = ({ previousValue, isMergedWithPrev }) => {
@@ -25235,16 +25301,21 @@ const DefaultCell = ({ isMergedWithPrev, value, previousValue, columnLayout, isT
25235
25301
  return (jsx(WrapperCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev, columnLayout: columnLayout, children: jsx("div", { className: "w-full min-w-0", children: jsx(GTextTruncated, { as: "span", variant: "bodySm", truncate: true, fontWeight: isTotalRow && !isDimensionCol ? 'semibold' : 'regular', alignment: columnLayout?.align, children: isMergedWithPrev ? '' : toCapitalize(valueString) }) }) }));
25236
25302
  };
25237
25303
 
25304
+ const LoadingData = () => {
25305
+ return (jsx(GInlineCenter, { minHeight: "200px", align: "center", inlineAlign: "center", children: jsx(Spinner, { accessibilityLabel: "Fetching orders", size: "small" }) }));
25306
+ };
25307
+
25308
+ const NoData = () => {
25309
+ const { t } = useTranslation();
25310
+ return (jsx(GInlineCenter, { minHeight: "200px", align: "center", inlineAlign: "center", children: jsx(Text, { as: "p", children: t('No orders found.') }) }));
25311
+ };
25312
+
25238
25313
  const OrderCellBase = ({ value, justifyContent, isPrevious, isTotalRow, interactive, }) => {
25239
25314
  const { onClick, hovering, onHoverChange } = interactive ?? {};
25240
25315
  const ableInteractive = !!interactive;
25241
25316
  return (jsx("div", { className: cls('GReportTable__CellContent--clickable flex h-7 w-full items-center px-[8px] pl-3', { 'hover:bg-surface-hover cursor-pointer': ableInteractive }, { 'GReportTable__CellContent--noClick': !ableInteractive }), style: { justifyContent }, onClick: onClick ?? undefined, onMouseEnter: ableInteractive ? () => onHoverChange?.(true) : undefined, onMouseLeave: ableInteractive ? () => onHoverChange?.(false) : undefined, children: jsxs(InlineStack, { blockAlign: "center", wrap: false, children: [jsx(Text, { as: "span", variant: "bodyMd", fontWeight: isTotalRow ? 'semibold' : 'regular', tone: isPrevious ? 'subdued' : 'inherit', children: value }), jsx(Box, { opacity: hovering && ableInteractive ? '1' : '0', children: jsx(Icon, { source: SvgCaretDownIcon }) })] }) }));
25242
25317
  };
25243
25318
 
25244
- const LoadingData = () => {
25245
- return (jsx(GInlineCenter, { minHeight: "200px", align: "center", inlineAlign: "center", children: jsx(Spinner, { accessibilityLabel: "Fetching orders", size: "small" }) }));
25246
- };
25247
-
25248
25319
  const OrderItem = ({ order }) => {
25249
25320
  const { t } = useTranslation();
25250
25321
  const { onViewOrderJourney, onViewOrderDetails } = useReportTableActionsContext();
@@ -25258,11 +25329,6 @@ const OrderItem = ({ order }) => {
25258
25329
  return (jsx(Box, { padding: "300", borderBlockEndWidth: "025", borderColor: "border", children: jsxs(InlineStack, { align: "space-between", blockAlign: "center", gap: "200", children: [jsxs(BlockStack, { gap: "200", children: [jsx(Text, { as: "p", variant: "bodyMd", children: `ID: ${orderId}` }), jsx(Text, { as: "p", variant: "bodyXs", tone: "subdued", children: formatDate(date) })] }), jsxs(InlineStack, { gap: "100", children: [jsx(Tooltip$1, { content: t('View order details'), children: jsx(Button, { icon: jsx(Icon, { source: SvgOrderIcon, tone: "critical" }), variant: "tertiary", size: "slim", onClick: () => onViewOrderDetails?.(orderId) }) }), jsx(Tooltip$1, { content: t('View order journey'), children: jsx(Button, { icon: jsx(Icon, { source: SvgChartLineIcon, tone: "primary" }), variant: "tertiary", size: "slim", onClick: () => onViewOrderJourney?.(orderId) }) })] })] }) }));
25259
25330
  };
25260
25331
 
25261
- const NoData = () => {
25262
- const { t } = useTranslation();
25263
- return (jsx(GInlineCenter, { minHeight: "200px", align: "center", inlineAlign: "center", children: jsx(Text, { as: "p", children: t('No orders found.') }) }));
25264
- };
25265
-
25266
25332
  const OrderCell = ({ value, columnLayout, orderCellProps, isPrevious, isTotalRow, }) => {
25267
25333
  const { value: itemHovering, setTrue, setFalse } = useToggle(false);
25268
25334
  const { value: active, toggle: toggleActive } = useToggle(false);
@@ -25290,8 +25356,8 @@ const OrderCell = ({ value, columnLayout, orderCellProps, isPrevious, isTotalRow
25290
25356
  }, isPrevious: isPrevious }), onClose: toggleActive, children: jsx(Box, { width: "291px", children: getContent() }) }));
25291
25357
  };
25292
25358
 
25293
- const OrderCellContainer = ({ value, columnLayout, orderCellProps, previousValue, isTotalRow, }) => {
25294
- return (jsxs(BlockStack, { align: "center", children: [jsx(Box, { width: "100%", children: jsx(OrderCell, { value: value, columnLayout: columnLayout, orderCellProps: orderCellProps, isTotalRow: isTotalRow }) }), typeof previousValue === 'string' && (jsx(Box, { width: "100%", children: jsx(OrderCell, { value: previousValue, columnLayout: columnLayout, orderCellProps: orderCellProps, isPrevious: true, isTotalRow: isTotalRow }) }))] }));
25359
+ const OrderCellContainer = ({ value, columnLayout, orderCellProps, previousValue, isTotalRow, isMockData, }) => {
25360
+ return (jsxs(BlockStack, { align: "center", children: [jsx(Box, { width: "100%", children: jsx(OrderCell, { value: value, columnLayout: columnLayout, orderCellProps: orderCellProps, isTotalRow: isTotalRow, isMockData: isMockData }) }), typeof previousValue === 'string' && (jsx(Box, { width: "100%", children: jsx(OrderCell, { value: previousValue, columnLayout: columnLayout, orderCellProps: orderCellProps, isPrevious: true, isTotalRow: isTotalRow, isMockData: isMockData }) }))] }));
25295
25361
  };
25296
25362
 
25297
25363
  var GVariantBadgeType;
@@ -25407,11 +25473,14 @@ const VersionCell = ({ value, previousValue, isMergedWithPrev, columnLayout }) =
25407
25473
  return (jsx(WrapperCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev, columnLayout: columnLayout, children: variantValue && (jsx(GVariantBadge, { variant: variantValue.value, tone: variantValue.value === 'A' ? 'active' : 'inactive', size: "xs" })) }));
25408
25474
  };
25409
25475
 
25410
- const OrderIdCell = ({ value }) => {
25476
+ const OrderIdCell = ({ value, isMockData }) => {
25411
25477
  const { t } = useTranslation();
25412
25478
  const [active, setActive] = useState(false);
25413
25479
  const { onViewOrderJourney, onViewOrderDetails } = useReportTableActionsContext();
25414
25480
  const toggleActive = useCallback(() => setActive((active) => !active), []);
25481
+ if (isMockData) {
25482
+ return (jsx(Text, { as: "span", variant: "bodyMd", tone: "subdued", children: value }));
25483
+ }
25415
25484
  return (jsx(Popover, { active: active, activator: jsx("div", { className: "GReportTable__CellContent--clickable flex h-full w-full cursor-pointer items-center rounded-md pl-3", onClick: toggleActive, children: jsxs(InlineStack, { gap: "200", blockAlign: "center", wrap: false, children: [jsx(Text, { as: "span", variant: "bodyMd", tone: "subdued", children: value }), jsx("span", { className: "opacity-0 group-hover/GReportTable__Row:opacity-100", children: jsx(Icon, { source: SvgCaretDownIcon }) })] }) }), onClose: toggleActive, children: jsx(ActionList, { actionRole: "menuitem", items: [
25416
25485
  {
25417
25486
  id: 'view_order_journey',
@@ -25483,10 +25552,10 @@ const cellMap = {
25483
25552
  return null;
25484
25553
  return jsx(VersionCell, { value: value, isMergedWithPrev: isMergedWithPrev });
25485
25554
  },
25486
- [IRMetricKey.ORDERS]: ({ value, columnLayout, orderCellProps, previousValue, isTotalRow }) => {
25555
+ [IRMetricKey.ORDERS]: ({ value, columnLayout, orderCellProps, previousValue, isTotalRow, isMockData }) => {
25487
25556
  if (!isString(value))
25488
25557
  return null;
25489
- return (jsx(OrderCellContainer, { value: value, columnLayout: columnLayout, orderCellProps: orderCellProps, previousValue: previousValue, isTotalRow: isTotalRow }));
25558
+ return (jsx(OrderCellContainer, { value: value, columnLayout: columnLayout, orderCellProps: orderCellProps, previousValue: previousValue, isTotalRow: isTotalRow, isMockData: isMockData }));
25490
25559
  },
25491
25560
  [EReportColumnKey.ORDER_DATE]: ({ value, isMergedWithPrev }) => {
25492
25561
  if (!isString(value))
@@ -25503,10 +25572,10 @@ const cellMap = {
25503
25572
  return null;
25504
25573
  return jsx(CampaignsCell, { value: value, campaignsCellProps: campaignsCellProps });
25505
25574
  },
25506
- [EReportColumnKey.ORDER_ID]: ({ value }) => {
25575
+ [EReportColumnKey.ORDER_ID]: ({ value, isMockData }) => {
25507
25576
  if (!isString(value))
25508
25577
  return null;
25509
- return jsx(OrderIdCell, { value: value });
25578
+ return jsx(OrderIdCell, { value: value, isMockData: isMockData });
25510
25579
  },
25511
25580
  };
25512
25581
 
@@ -25516,7 +25585,7 @@ const NoneCell = ({ isMergedWithPrev, previousValue, columnLayout }) => {
25516
25585
  return (jsx(WrapperCell, { previousValue: previousValue, isMergedWithPrev: isMergedWithPrev, columnLayout: columnLayout, children: jsx("div", { className: "w-[11px] h-[2px] bg-[#8A8A8A]" }) }));
25517
25586
  };
25518
25587
 
25519
- const Cell = ({ value, isMergedWithPrev, columnLayout, name, isDimensionCol, formatter, hasTooltipCard, previousValue, orderCellProps, campaignsCellProps, isTotalRow, }) => {
25588
+ const Cell = ({ value, isMergedWithPrev, columnLayout, name, isDimensionCol, formatter, hasTooltipCard, previousValue, orderCellProps, campaignsCellProps, isTotalRow, isMockData, }) => {
25520
25589
  const columnLayoutStyles = getColumnLayoutStyles(columnLayout, hasTooltipCard);
25521
25590
  const { formatData } = useReportData();
25522
25591
  const formattedValue = formatData({ value, formatter, name });
@@ -25533,12 +25602,12 @@ const Cell = ({ value, isMergedWithPrev, columnLayout, name, isDimensionCol, for
25533
25602
  if (formattedValue === NONE_VALUE) {
25534
25603
  Renderer = NoneCell;
25535
25604
  }
25536
- return (jsx(Renderer, { value: formattedValue, name: name, isMergedWithPrev: isMergedWithPrev, previousValue: formattedPreviousValue, columnLayout: columnLayout, orderCellProps: orderCellProps, campaignsCellProps: campaignsCellProps, isTotalRow: isTotalRow, isDimensionCol: isDimensionCol }));
25605
+ return (jsx(Renderer, { value: formattedValue, name: name, isMergedWithPrev: isMergedWithPrev, previousValue: formattedPreviousValue, columnLayout: columnLayout, orderCellProps: orderCellProps, campaignsCellProps: campaignsCellProps, isTotalRow: isTotalRow, isDimensionCol: isDimensionCol, isMockData: isMockData }));
25537
25606
  };
25538
25607
  return (jsx("div", { className: cls('GReportTable__Cell', { 'GReportTable__Cell--dimension': isDimensionCol }), style: cellStyles, children: jsx("div", { className: "GReportTable__CellContent", style: columnLayoutStyles, children: renderContent() }) }));
25539
25608
  };
25540
25609
 
25541
- const Row = ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, orderCellProps, isHideCampaignContent, minWidth, }) => {
25610
+ const Row = ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, orderCellProps, isHideCampaignContent, minWidth, isMockData, }) => {
25542
25611
  const checkMergedWithPrev = (col) => {
25543
25612
  const isDimensionCol = dimensions.includes(col);
25544
25613
  let isMergedWithPrev = false;
@@ -25558,7 +25627,7 @@ const Row = ({ row, rowIndex, columns, dimensions, prevRow, columnLayoutMap, ord
25558
25627
  return (jsx("div", { className: "GReportTable__Row group/GReportTable__Row", style: { minWidth }, children: columns.map((col) => {
25559
25628
  const hasTooltipCard = !!col.tooltipCardProps;
25560
25629
  const orderId = row[EReportColumnKey.ORDER_ID]?.toString() ?? '';
25561
- return (jsx(Cell, { value: row[col.name], isTotalRow: row[IS_TOTAL_ROW_FIELD], previousValue: getMetricPreviousValue(row, col.name), isMergedWithPrev: checkMergedWithPrev(col.name), columnLayout: columnLayoutMap[col.name], name: col.name, campaignsCellProps: { orderId, isHideCampaignContent }, isDimensionCol: dimensions.includes(col.name), formatter: col.dataType, hasTooltipCard: hasTooltipCard, orderCellProps: customOrderCellProps }, col.name));
25630
+ return (jsx(Cell, { value: row[col.name], isTotalRow: row[IS_TOTAL_ROW_FIELD], previousValue: getMetricPreviousValue(row, col.name), isMergedWithPrev: checkMergedWithPrev(col.name), columnLayout: columnLayoutMap[col.name], name: col.name, campaignsCellProps: { orderId, isHideCampaignContent }, isDimensionCol: dimensions.includes(col.name), formatter: col.dataType, hasTooltipCard: hasTooltipCard, orderCellProps: customOrderCellProps, isMockData: isMockData }, col.name));
25562
25631
  }) }));
25563
25632
  };
25564
25633
 
@@ -25657,7 +25726,7 @@ WrapperHeader.displayName = 'WrapperHeader';
25657
25726
 
25658
25727
  const mockDimensions = ['session_device_type', 'month', 'session_country', 'session_device_os'];
25659
25728
  const mockMetrics = ['online_store_visitors', 'sessions', 'bounces'];
25660
- const ReportTable = ({ dimensions = mockDimensions, metrics = mockMetrics, data, activeColumn, orderBy, options, paginationProps, itemCount, dimensionLayout, metricLayouts, orderCellProps, isHideCampaignContent = false, showViewAllButton, emptyStateComponent, isLoading, onChangeOrderBy, onViewAllStoreOrders, onViewOrderJourney, onViewOrderDetails, skeletons, }) => {
25729
+ const ReportTable = ({ dimensions = mockDimensions, metrics = mockMetrics, data, activeColumn, orderBy, options, paginationProps, itemCount, dimensionLayout, metricLayouts, orderCellProps, isHideCampaignContent = false, showViewAllButton, emptyStateComponent, isLoading, isMockData, onChangeOrderBy, onViewAllStoreOrders, onViewOrderJourney, onViewOrderDetails, skeletons, }) => {
25661
25730
  const { summary = {}, hideBorderTop, hidePaginationRow } = options ?? {};
25662
25731
  const { columns, rows } = useReportTable({ dimensions, metrics, tableData: data ?? { columns: [], rows: [] } });
25663
25732
  const { headerRef, bodyRef, scrollbarContainerRef, leftShadowRef, rightShadowRef } = useSyncedScroll({ columns });
@@ -25688,15 +25757,15 @@ const ReportTable = ({ dimensions = mockDimensions, metrics = mockMetrics, data,
25688
25757
  return (jsx(ReportTableActionsProvider, { onViewOrderJourney: onViewOrderJourney, onViewOrderDetails: onViewOrderDetails, onViewAllStoreOrders: onViewAllStoreOrders, children: jsxs("div", { className: cls('GReportTable__Container', {
25689
25758
  'GReportTable__Container--border-top': !hideBorderTop,
25690
25759
  'GReportTable__Container--pagination-hidden': isPaginationHidden,
25691
- }), children: [jsxs("div", { className: "GReportTable__Wrapper", children: [jsx(WrapperHeader, { columns: columns, dimensions: dimensions, row: data?.rows[0], ref: headerRef, columnLayoutMap: columnLayoutMap, activeColumn: activeColumn, orderBy: orderBy, summary: summary, onChangeOrderBy: onChangeOrderBy, minWidth: totalTableWidth }), jsx("div", { className: "GReportTable__ScrollWrap", ref: bodyRef, children: rows.map((row, index) => (jsx(Row, { row: row, rowIndex: index, columns: columns, dimensions: dimensions, prevRow: rows[index - 1], columnLayoutMap: columnLayoutMap, orderCellProps: orderCellProps, isHideCampaignContent: isHideCampaignContent, minWidth: totalTableWidth }, index))) })] }), jsx(WrapperFooter, { scrollbarContainerRef: scrollbarContainerRef, totalPaginationRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden }), jsx("div", { className: "GReportTable__LeftShadow", style: { left: tableDimensionLayout.width }, ref: leftShadowRef }), jsx("div", { className: "GReportTable__RightShadow", ref: rightShadowRef })] }) }));
25760
+ }), children: [jsxs("div", { className: "GReportTable__Wrapper", children: [jsx(WrapperHeader, { columns: columns, dimensions: dimensions, row: data?.rows[0], ref: headerRef, columnLayoutMap: columnLayoutMap, activeColumn: activeColumn, orderBy: orderBy, summary: summary, onChangeOrderBy: onChangeOrderBy, minWidth: totalTableWidth }), jsx("div", { className: "GReportTable__ScrollWrap", ref: bodyRef, children: rows.map((row, index) => (jsx(Row, { row: row, rowIndex: index, columns: columns, dimensions: dimensions, prevRow: rows[index - 1], columnLayoutMap: columnLayoutMap, orderCellProps: orderCellProps, isHideCampaignContent: isHideCampaignContent, minWidth: totalTableWidth, isMockData: isMockData }, index))) })] }), jsx(WrapperFooter, { scrollbarContainerRef: scrollbarContainerRef, totalPaginationRows: totalPaginationRows, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: isPaginationHidden, isMockData: isMockData }), jsx("div", { className: "GReportTable__LeftShadow", style: { left: tableDimensionLayout.width }, ref: leftShadowRef }), jsx("div", { className: "GReportTable__RightShadow", ref: rightShadowRef })] }) }));
25692
25761
  function renderEmptyState() {
25693
25762
  return (jsxs("div", { className: cls('GReportTable__Container', {
25694
25763
  'GReportTable__Container--border-top': !hideBorderTop,
25695
- }), children: [emptyStateComponent, jsx(WrapperFooter, { totalPaginationRows: 0, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: true })] }));
25764
+ }), children: [emptyStateComponent, jsx(WrapperFooter, { totalPaginationRows: 0, itemCount: itemCount, showViewAllButton: showViewAllButton, paginationProps: paginationProps, isPaginationHidden: true, isMockData: isMockData })] }));
25696
25765
  }
25697
25766
  };
25698
25767
 
25699
- const OrderListingTable = ({ orders, isLoading, totalStoreOrders, queryValue, paginationProps, tableOptions, onViewAllStoreOrders, onViewOrderJourney, onViewOrderDetails, }) => {
25768
+ const OrderListingTable = ({ orders, isLoading, totalStoreOrders, queryValue, paginationProps, tableOptions, isMockData, onViewAllStoreOrders, onViewOrderJourney, onViewOrderDetails, }) => {
25700
25769
  const { hideSummary, limitRowAmount, hidePaginationRow, hideBorderTop, fixedColumns, isLatestTable } = tableOptions ?? {};
25701
25770
  const { t } = useTranslation();
25702
25771
  const orderBy = useOrderControlStore((state) => state.orderBy);
@@ -25722,7 +25791,7 @@ const OrderListingTable = ({ orders, isLoading, totalStoreOrders, queryValue, pa
25722
25791
  };
25723
25792
  if (isLatestTable && isLoading)
25724
25793
  return jsx(OrderListingTableSkeleton, {});
25725
- return (jsx(Fragment, { children: jsx(ReportTable, { metrics: sortedMetrics, dimensions: ORDER_LISTING_DIMENSIONS, options: getOptionsProps(), paginationProps: paginationProps, data: reportTableData, itemCount: totalStoreOrders, dimensionLayout: ORDER_LISTING_DIMENSION_LAYOUT, metricLayouts: ORDER_LISTING_METRIC_LAYOUTS, orderBy: orderBy ? { [orderBy.field]: orderBy } : undefined, showViewAllButton: showViewAllButton, isHideCampaignContent: !!isLatestTable, emptyStateComponent: renderEmptyState(), onChangeOrderBy: handleChangeOrderBy, onViewAllStoreOrders: onViewAllStoreOrders, onViewOrderJourney: onViewOrderJourney, onViewOrderDetails: onViewOrderDetails }) }));
25794
+ return (jsx(Fragment, { children: jsx(ReportTable, { metrics: sortedMetrics, dimensions: ORDER_LISTING_DIMENSIONS, options: getOptionsProps(), paginationProps: paginationProps, data: reportTableData, itemCount: totalStoreOrders, dimensionLayout: ORDER_LISTING_DIMENSION_LAYOUT, metricLayouts: ORDER_LISTING_METRIC_LAYOUTS, orderBy: orderBy ? { [orderBy.field]: orderBy } : undefined, showViewAllButton: showViewAllButton, isHideCampaignContent: !!isLatestTable, isMockData: isMockData, emptyStateComponent: renderEmptyState(), onChangeOrderBy: handleChangeOrderBy, onViewAllStoreOrders: onViewAllStoreOrders, onViewOrderJourney: onViewOrderJourney, onViewOrderDetails: onViewOrderDetails }) }));
25726
25795
  function renderEmptyState() {
25727
25796
  const isNoOrderWithCurrentFilters = orders.length === 0;
25728
25797
  return (jsx(GBlockCenter, { paddingBlockStart: isNoOrderWithCurrentFilters ? '500' : '0', paddingBlockEnd: isNoOrderWithCurrentFilters ? '800' : '0', children: jsx(GBlockCenter, { paddingBlock: "1600", children: jsx(OrderListingTableEmpty, { title: isNoOrderWithCurrentFilters ? t('No order') : t('No order found'), description: isNoOrderWithCurrentFilters ? t('Try changing the filters') : t('Try changing the filters or search term') }) }) }));
@@ -25740,7 +25809,13 @@ const OrderListingTable = ({ orders, isLoading, totalStoreOrders, queryValue, pa
25740
25809
  };
25741
25810
  var OrderListingTable$1 = memo(OrderListingTable);
25742
25811
 
25743
- const OrderListingLatestTable = ({ source, data, callbacks }) => {
25812
+ var EReportSource;
25813
+ (function (EReportSource) {
25814
+ EReportSource["CAMPAIGN"] = "campaign";
25815
+ EReportSource["PAGE"] = "page";
25816
+ })(EReportSource || (EReportSource = {}));
25817
+
25818
+ const OrderListingLatestTable = ({ source, data, callbacks, isMockData }) => {
25744
25819
  const { orders, isLoading, totalFilteredOrders, totalStoreOrders } = data;
25745
25820
  const { onViewAllOrders, onViewAllStoreOrders, onViewOrderJourney, onViewOrderDetails } = callbacks ?? {};
25746
25821
  const { t } = useTranslation();
@@ -25752,10 +25827,10 @@ const OrderListingLatestTable = ({ source, data, callbacks }) => {
25752
25827
  return ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE;
25753
25828
  return ORDER_LISTING_COLUMNS;
25754
25829
  }, [source]);
25755
- return (jsxs(GBoxCard, { padding: "0", overflowX: "hidden", children: [jsx(Box, { padding: "400", borderStartStartRadius: "400", borderStartEndRadius: "400", background: "bg-fill", children: jsxs(InlineStack, { blockAlign: "center", align: "space-between", children: [jsx(GTextTooltip, { tooltipProps: tooltipContent ? { content: tooltipContent } : undefined, as: "p", variant: "headingMd", fontWeight: "semibold", children: t('Orders from {{source}}', { source: sourceText }) }), !isEmpty && (jsx(Button, { variant: "secondary", onClick: onViewAllOrders, children: t('View {{source}} orders ({{totalOrders}})', {
25756
- source: sourceText,
25757
- totalOrders: totalFilteredOrders,
25758
- }) }))] }) }), isEmpty ? (jsx(OrderListingTableEmpty, { title: t('No order yet'), description: t('There are no orders from this {{source}} yet', { source }) })) : (jsx(OrderListingTable$1, { orders: orders, isLoading: isLoading, totalStoreOrders: totalStoreOrders, onViewAllStoreOrders: onViewAllStoreOrders, onViewOrderJourney: onViewOrderJourney, onViewOrderDetails: onViewOrderDetails, tableOptions: {
25830
+ return (jsxs(GBoxCard, { padding: "0", overflowX: "hidden", children: [jsx(Box, { padding: "400", borderStartStartRadius: "400", borderStartEndRadius: "400", background: "bg-fill", children: jsxs(InlineStack, { blockAlign: "center", align: "space-between", children: [jsx(GTextTooltip, { tooltipProps: tooltipContent ? { content: tooltipContent } : undefined, as: "p", variant: "headingMd", fontWeight: "semibold", children: t('Orders from {{source}}', { source: sourceText }) }), !isEmpty && (jsx(GMockDataTooltip, { isMockData: isMockData, children: jsx(Button, { variant: "secondary", disabled: isMockData, onClick: onViewAllOrders, children: t('View {{source}} orders ({{totalOrders}})', {
25831
+ source: sourceText,
25832
+ totalOrders: totalFilteredOrders,
25833
+ }) }) }))] }) }), isEmpty ? (jsx(OrderListingTableEmpty, { title: t('No order yet'), description: t('There are no orders from this {{source}} yet', { source }) })) : (jsx(OrderListingTable$1, { orders: orders, isLoading: isLoading, totalStoreOrders: totalStoreOrders, isMockData: isMockData, onViewAllStoreOrders: onViewAllStoreOrders, onViewOrderJourney: onViewOrderJourney, onViewOrderDetails: onViewOrderDetails, tableOptions: {
25759
25834
  hideSummary: true,
25760
25835
  hidePaginationRow: true,
25761
25836
  limitRowAmount: ORDER_LISTING_CONFIG.SHOW_LATEST_ORDER_LISTING_AMOUNT,
@@ -25835,4 +25910,4 @@ const useStickyFilterBoxProps = ({ id }) => {
25835
25910
  };
25836
25911
  };
25837
25912
 
25838
- export { ANALYTICS_METRIC_TOOLTIP, AnalyticModeSelector, CAMPAIGN_BACKGROUND_MAIN, CHART_MIN_HEIGHT, COMPARE_DATE_TIME_FILTERS_MAP, CardJourneyAnalysis, CardPathAnalysis, CompareDateTimePickerAlias, ConvertMoneyProvider, CurrencySelector, DATE_TIME_COMPARISON_FILTERS, DEFAULT_CURRENCY_ANALYTIC, DEFAULT_CURRENT_PERIOD_LABEL, DEFAULT_PREVIOUS_PERIOD_LABEL, DEFAULT_SELECTED_COLUMNS_FOR_EXPERIMENT, DateTimeFilterInputs, DateTimeFilters, DateTimePickerContext, DateTimePickerProvider, EJourneyEvent, EReportSource, FUNNEL_POPOVER_KEY, GSelectableMetricChartCard, GTimePicker, IVariantType, MOCK_DATA_PATH_ANALYSIS, MainDateTimePickerAlias, MetricChartProvider, MetricDonutChartCard, ORDER_COLUMN_MAPPING, ORDER_LISTING_COLUMNS, ORDER_LISTING_CONFIG, ORDER_LISTING_DIMENSIONS, ORDER_LISTING_DIMENSION_LAYOUT, ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE, ORDER_LISTING_METRICS, ORDER_LISTING_METRIC_LAYOUTS, OrderListingLatestTable, PLACEHOLDER_VALUE$1 as PLACEHOLDER_VALUE, PREVIOUS_PERIOD_FILTER, PathAnalysisConfigProvider, PathAnalysisContext, PathAnalysisProvider, SERIES_COLORS, SORT_ORDER_LISTING_DEFAULT, SingleMetricChartCard, TARGET_CHANNEL, TARGET_DEVICES, TARGET_VISITOR, THUMB_PRODUCT_DEFAULT, TREND_TONE, convertDateToTz, convertToDateTimeFilters, createLastDaysRange, dayjsTz, dayjsTzToDate, dayjsTzToLocalTZ, formatDate, formatDateTimeRange, formatDayjs, formatMs, formatTime, formatTimeRange, getDateRangeTitle, getDateTimeFilterBase, getDateTimeFilterByAlias, getDateTimeFilterMapping, getEndOfDayBy, getInitialTimezone, getLast12Months, getLast30Days, getLast365Days, getLast7Days, getLast90Days, getLastMonth, getLastYear, getMonthAndYearByDateFilter, getNoComparison, getPreviousMonth, getPreviousPeriod, getPreviousQuarter, getPreviousWeek, getPreviousYear, getToday, getVersionDateDescription, getVersionDateRangeTitle, getYesterday, isDate, isMidnight, isSameDayTimestamp, isValidDate, isValidYearMonthDayDateString, parseYearMonthDayDateString, setTz, useConvertMoneyContext, useCurrencyRatesStore, useDateTimeFilter, useDateTimePicker, useDateTimePickerContext, useFunnelChartStore, useIsStickyById, useOrderColumnsSelectorStore, useOrderControlStore, usePathAnalysisCampaignStore, usePathAnalysisConfig, usePathAnalysisContext, usePathAnalysisStore, useStickyFilterBoxProps, useVersionDateTimeFilters };
25913
+ export { ANALYTICS_METRIC_TOOLTIP, AnalyticModeSelector, CAMPAIGN_BACKGROUND_MAIN, CHART_MIN_HEIGHT, COMPARE_DATE_TIME_FILTERS_MAP, CardJourneyAnalysis, CardPathAnalysis, CompareDateTimePickerAlias, ConvertMoneyProvider, CurrencySelector, DATE_TIME_COMPARISON_FILTERS, DEFAULT_CURRENCY_ANALYTIC, DEFAULT_CURRENT_PERIOD_LABEL, DEFAULT_PREVIOUS_PERIOD_LABEL, DEFAULT_SELECTED_COLUMNS_FOR_EXPERIMENT, DateTimeFilterInputs, DateTimeFilters, DateTimePickerContext, DateTimePickerProvider, EJourneyEvent, EReportSource, FUNNEL_POPOVER_KEY, GSelectableMetricChartCard, GTimePicker, IVariantType, MOCK_DATA_PATH_ANALYSIS, MainDateTimePickerAlias, MetricChartProvider, MetricDonutChartCard, ORDER_COLUMN_MAPPING, ORDER_LISTING_COLUMNS, ORDER_LISTING_CONFIG, ORDER_LISTING_DIMENSIONS, ORDER_LISTING_DIMENSION_LAYOUT, ORDER_LISTING_LATEST_COLUMNS_FOR_PAGE, ORDER_LISTING_METRICS, ORDER_LISTING_METRIC_LAYOUTS, OrderListingLatestTable, PLACEHOLDER_VALUE$1 as PLACEHOLDER_VALUE, PREVIOUS_PERIOD_FILTER, PathAnalysisConfigProvider, PathAnalysisContext, PathAnalysisProvider, SERIES_COLORS, SORT_ORDER_LISTING_DEFAULT, SingleMetricChartCard, TARGET_CHANNEL, TARGET_DEVICES, TARGET_VISITOR, THUMB_PRODUCT_DEFAULT, TREND_TONE, TimezoneProvider, convertDateToTz, convertToDateTimeFilters, createLastDaysRange, dayjsTz, dayjsTzToDate, dayjsTzToLocalTZ, formatDate, formatDateTimeRange, formatDayjs, formatMs, formatTime, formatTimeRange, getDateRangeTitle, getDateTimeFilterBase, getDateTimeFilterByAlias, getDateTimeFilterMapping, getEndOfDayBy, getInitialTimezone, getLast12Months, getLast30Days, getLast365Days, getLast7Days, getLast90Days, getLastMonth, getLastYear, getMonthAndYearByDateFilter, getNoComparison, getPreviousMonth, getPreviousPeriod, getPreviousQuarter, getPreviousWeek, getPreviousYear, getToday, getVersionDateDescription, getVersionDateRangeTitle, getYesterday, isDate, isMidnight, isSameDayTimestamp, isValidDate, isValidYearMonthDayDateString, parseYearMonthDayDateString, setTz, useConvertMoneyContext, useCurrencyRatesStore, useDateTimeFilter, useDateTimePicker, useDateTimePickerContext, useFunnelChartStore, useIsStickyById, useOrderColumnsSelectorStore, useOrderControlStore, usePathAnalysisCampaignStore, usePathAnalysisConfig, usePathAnalysisContext, usePathAnalysisStore, useStickyFilterBoxProps, useTimezoneContext, useVersionDateTimeFilters };