diff --git a/src/components/Analysis/Comparison/Comparison.tsx b/src/components/Analysis/Comparison/Comparison.tsx index f488816e361e183b81eee65bf2b1fc6c512ff24e..78f6ecac820f8256cb0fcaebae26b5e6072a29ed 100644 --- a/src/components/Analysis/Comparison/Comparison.tsx +++ b/src/components/Analysis/Comparison/Comparison.tsx @@ -49,9 +49,11 @@ const Comparison = ({ }, } }, [analysisMonth]) - + const NAVIGATION_HEIGHT = 40 const loaderPlaceholderHeight = - fluidsWithData.length * 84 + (fluidsWithData.length - 1) * 10 + fluidsWithData.length * 84 + + (fluidsWithData.length - 1) * 10 + + NAVIGATION_HEIGHT useEffect(() => { let subscribed = true @@ -66,12 +68,18 @@ const Comparison = ({ ) if (fetchedYearIndicators) { setYearPerformanceIndicators(fetchedYearIndicators) + if ( + fetchedYearIndicators.some( + indicator => indicator.value !== 0 || indicator.compareValue !== 0 + ) + ) { + dispatch(setPeriod('year')) + } } setIsLoading(false) } } populateData() - return () => { subscribed = false } @@ -83,24 +91,28 @@ const Comparison = ({ fluidsWithData, periods.monthPeriod, periods.previousYearPeriod, + dispatch, ]) return ( <div className="comparison"> - <div className="tabs"> - <Button - className={period === 'month' ? 'active' : ''} - onClick={() => dispatch(setPeriod('month'))} - > - {t('analysis.compare.month_tab')} - </Button> - <Button - className={period === 'year' ? 'active' : ''} - onClick={() => dispatch(setPeriod('year'))} - > - {t('analysis.compare.year_tab')} - </Button> - </div> + {!isLoading && ( + <div className="tabs"> + <Button + className={period === 'year' ? 'active' : ''} + onClick={() => dispatch(setPeriod('year'))} + > + {t(`analysis.compare.year_tab`)} + </Button> + <Button + className={period === 'month' ? 'active' : ''} + onClick={() => dispatch(setPeriod('month'))} + > + {t(`analysis.compare.month_tab`)} + </Button> + </div> + )} + <div className="performanceIndicators"> {isLoading && ( <div @@ -129,7 +141,6 @@ const Comparison = ({ comparisonDate={periods.previousMonthPeriod.startDate} /> ))} - {!isLoading && fluidsWithData.map(fluid => ( <FluidPerformanceIndicator