diff --git a/src/components/CommonKit/Button/StyledButtonValid.tsx b/src/components/CommonKit/Button/StyledButtonValid.tsx index b7383291700898a61d99b2f753493fb241d58f1b..349cc268d2dbb2c4a1470a33b5b938c67957081d 100644 --- a/src/components/CommonKit/Button/StyledButtonValid.tsx +++ b/src/components/CommonKit/Button/StyledButtonValid.tsx @@ -45,6 +45,9 @@ const BaseButton = withStyles({ fontSize: '1rem', lineHeight: '120%', }, + disabled: { + opacity: '0.4', + }, })(MuiButton) const PrimaryButton = withStyles({ @@ -55,6 +58,9 @@ const PrimaryButton = withStyles({ color: 'var(--textBlack)', fontWeight: 'bold', }, + disabled: { + background: 'var(--blueBackground) !important', + }, })(BaseButton) const SecondaryButton = withStyles({ diff --git a/src/components/ContainerComponents/IndicatorsContainer/MultiFluidIndicatorsContainer.tsx b/src/components/ContainerComponents/IndicatorsContainer/MultiFluidIndicatorsContainer.tsx index eec3a6f671745dd9364b65dad8c8fa0f4dbdac42..37e68b59484d344df7e861b09b0cef94bd328d3d 100644 --- a/src/components/ContainerComponents/IndicatorsContainer/MultiFluidIndicatorsContainer.tsx +++ b/src/components/ContainerComponents/IndicatorsContainer/MultiFluidIndicatorsContainer.tsx @@ -55,6 +55,12 @@ const MultiFluidIndicatorsContainer: React.FC<MultiFluidIndicatorsContainerProps fluidTypes, timeStep ) + console.log( + periods.timePeriod, + timeStep, + fluidTypes, + periods.comparisonTimePeriod + ) const fetchedPerformanceIndicators = await cdm.getPerformanceIndicators( periods.timePeriod, @@ -62,6 +68,10 @@ const MultiFluidIndicatorsContainer: React.FC<MultiFluidIndicatorsContainerProps fluidTypes, periods.comparisonTimePeriod ) + console.log( + 'fetchedPerformanceIndicators', + fetchedPerformanceIndicators + ) if (fetchedPerformanceIndicators) { setPerformanceIndicators(fetchedPerformanceIndicators) diff --git a/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx index 4d2383de17cc99e82c241c326d19ca29c857d67a..7f16a533677658f49c4fc4d3bdac66b9a1e4ac93 100644 --- a/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx +++ b/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx @@ -13,6 +13,8 @@ import { Client, withClient } from 'cozy-client' import StyledButtonValid from 'components/CommonKit/Button/StyledButtonValid' import { ScreenType } from 'enum/screen.enum' import AvailableChallengeIcon from 'assets/png/badges/available-big.png' +import ConsumptionDataManager from 'services/consumptionDataManagerService' +import { DateTime } from 'luxon' interface AvailableChallengeDetailsViewProps { location: any @@ -34,6 +36,9 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails const [challenge, setChallenge] = useState<ChallengeType | null>(null) const [userChallenge, setUserChallenge] = useState<UserChallenge | null>(null) const [headerHeight, setHeaderHeight] = useState<number>(0) + const [lackOfDataForChallenge, setLackOfDataForChallenge] = useState<boolean>( + false + ) const defineHeaderHeight = (height: number) => { setHeaderHeight(height) @@ -71,6 +76,34 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails } useEffect(() => { + const lag = challengeManager.getLagDays(fluidTypes) + console.log('lag', lag) + + const timePeriod = { + startDate: DateTime.local() + .plus({ days: -6 }) + .startOf('day'), + endDate: DateTime.local() + .plus({ days: -lag }) + .endOf('day'), + } + + async function checkPreviousData() { + const cdm = new ConsumptionDataManager(client) + const fetchedPerformanceIndicators = await cdm.getPerformanceIndicators( + timePeriod, + 20, + fluidTypes + ) + if (fetchedPerformanceIndicators) { + fetchedPerformanceIndicators.forEach(element => { + !element.value ? setLackOfDataForChallenge(true) : null + }) + } else { + setLackOfDataForChallenge(true) + } + } + checkPreviousData() if (props.location.state) { setChallenge(props && props.location.state.challenge) } @@ -116,6 +149,7 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails </div> <div className="cp-right-button"> <StyledButtonValid + disabled={lackOfDataForChallenge} color="primary" onClick={handleStartClick} > @@ -124,6 +158,11 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails </StyledButtonValid> </div> </div> + <div className="lack-of-data-challenge"> + {lackOfDataForChallenge + ? t('CHALLENGE.LACK_OF_DATA') + : null} + </div> </div> </div> </div> diff --git a/src/locales/fr.json b/src/locales/fr.json index 8e5b55437e223d9e7d24040abd524c78be766470..de2006ddc82fcd6d9549940413b37aa6439672c5 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -168,6 +168,7 @@ "FULLY_LOCKED": "Ce défi sera disponible dans une prochaine mise à jour", "START": "Allons-y !", "NOT_NOW": "Pas maintenant !", + "LACK_OF_DATA": "Il manque des données de comparaison pour lancer ce défi", "STOP": "Arrêter le défi", "BACK": "I'll be back", "ECOGESTURE": "Voir l'écogeste", diff --git a/src/styles/components/_challenges.scss b/src/styles/components/_challenges.scss index 37c2cbd0a1ce82a7eaab4c8017b4506aa07e1349..0d270b0263529ce98cfcaa0d321978ee15ead4d1 100644 --- a/src/styles/components/_challenges.scss +++ b/src/styles/components/_challenges.scss @@ -511,6 +511,10 @@ width: 100%; } } + .lack-of-data-challenge { + text-align: center; + width: 90%; + } } .cp-follow { width: 90%;