fix: tooltip scrolling and bar chart ordering issue (#218)

Signed-off-by: csirius <[email protected]>
flyteorg · Sep 24, 2021 · 900312d · 900312d
1 parent 001e23a
commit 900312d
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/src/components/Entities/EntityExecutionsBarChart.tsx b/src/components/Entities/EntityExecutionsBarChart.tsx
@@ -35,7 +35,7 @@ export interface EntityExecutionsBarChartProps {
 }
 
 const getExecutionTimeData = (exectuions: Execution[], fillSize = 100) => {
-    const newExecutions = exectuions.map(execution => {
+    const newExecutions = exectuions.reverse().map(execution => {
         const duration = getWorkflowExecutionTimingMS(execution)?.duration || 1;
         return {
             value: duration,
@@ -71,10 +71,14 @@ const getExecutionTimeData = (exectuions: Execution[], fillSize = 100) => {
 };
 
 const getStartExecutionTime = (executions: Execution[]) => {
-    if (executions.length === 0 || !executions[0].closure.startedAt) {
+    if (executions.length === 0) {
         return '';
     }
-    return formatDateUTC(timestampToDate(executions[0].closure.startedAt));
+    const lastExecution = executions[executions.length - 1];
+    if (!lastExecution.closure.startedAt) {
+        return '';
+    }
+    return formatDateUTC(timestampToDate(lastExecution.closure.startedAt));
 };
 
 /**
@@ -90,7 +94,7 @@ export const EntityExecutionsBarChart: React.FC<EntityExecutionsBarChartProps> =
     const filtersState = useWorkflowExecutionFiltersState();
     const sort = {
         key: executionSortFields.createdAt,
-        direction: SortDirection.ASCENDING
+        direction: SortDirection.DESCENDING
     };
 
     const baseFilters = React.useMemo(
@@ -102,7 +106,8 @@ export const EntityExecutionsBarChart: React.FC<EntityExecutionsBarChartProps> =
         { domain, project },
         {
             sort,
-            filter: [...baseFilters, ...filtersState.appliedFilters]
+            filter: [...baseFilters, ...filtersState.appliedFilters],
+            limit: 100
         }
     );
 

diff --git a/src/components/common/BarChart.tsx b/src/components/common/BarChart.tsx
@@ -87,7 +87,9 @@ const BarChartItem: React.FC<BarChartItemProps> = ({
                 <Tooltip
                     title={tooltip}
                     TransitionComponent={Zoom}
-                    onMouseMove={e => setPosition({ x: e.pageX, y: e.pageY })}
+                    onMouseMove={e =>
+                        setPosition({ x: e.pageX, y: e.pageY - window.scrollY })
+                    }
                     PopperProps={{
                         anchorEl: {
                             clientHeight: 0,