From fe96d20f8974991e1f423cf6fda9c0e29d3036f4 Mon Sep 17 00:00:00 2001
From: DimaAmega <dima.amega1@gmail.com>
Date: Tue, 9 Jul 2024 15:24:46 +0400
Subject: [PATCH] UI: fix show-in-order

---
 .../evidently-ui-lib/src/widgets/BigGraphWidgetContent.tsx    | 3 ++-
 ui/packages/evidently-ui-lib/src/widgets/RichDataWidget.tsx   | 4 +++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/ui/packages/evidently-ui-lib/src/widgets/BigGraphWidgetContent.tsx b/ui/packages/evidently-ui-lib/src/widgets/BigGraphWidgetContent.tsx
index 6547200714..339a21d8fb 100644
--- a/ui/packages/evidently-ui-lib/src/widgets/BigGraphWidgetContent.tsx
+++ b/ui/packages/evidently-ui-lib/src/widgets/BigGraphWidgetContent.tsx
@@ -10,6 +10,7 @@ interface BigGraphWidgetProps extends AdditionalGraphInfo {
 
 const BigGraphWidgetContent: React.FunctionComponent<BigGraphWidgetProps> = (props) => {
   const viewParams = useDashboardViewParams()
+  const isHistogram = props.data.some(({ type }) => type === 'histogram')
 
   return (
     <div>
@@ -20,7 +21,7 @@ const BigGraphWidgetContent: React.FunctionComponent<BigGraphWidgetProps> = (pro
           title: undefined,
           xaxis: {
             ...props.layout?.xaxis,
-            type: viewParams?.isXaxisAsCategorical ? 'category' : undefined
+            type: viewParams?.isXaxisAsCategorical && !isHistogram ? 'category' : undefined
           }
         }}
         config={{ responsive: true }}
diff --git a/ui/packages/evidently-ui-lib/src/widgets/RichDataWidget.tsx b/ui/packages/evidently-ui-lib/src/widgets/RichDataWidget.tsx
index bf39019308..d948beae1b 100644
--- a/ui/packages/evidently-ui-lib/src/widgets/RichDataWidget.tsx
+++ b/ui/packages/evidently-ui-lib/src/widgets/RichDataWidget.tsx
@@ -26,6 +26,8 @@ const RichDataWidget: React.FunctionComponent<RichDataParams & { widgetSize: num
 ) => {
   const [details, setDetails] = useState<boolean>(false)
   const viewParams = useDashboardViewParams()
+  const isHistogram = props.graph?.data.some(({ type }) => type === 'histogram')
+
   return (
     <React.Fragment>
       <Grid container spacing={2} justifyContent="center" alignItems="center">
@@ -66,7 +68,7 @@ const RichDataWidget: React.FunctionComponent<RichDataParams & { widgetSize: num
                 title: undefined,
                 xaxis: {
                   ...props.graph.layout?.xaxis,
-                  type: viewParams?.isXaxisAsCategorical ? 'category' : undefined
+                  type: viewParams?.isXaxisAsCategorical && !isHistogram ? 'category' : undefined
                 }
               }}
               config={{ responsive: true }}