diff --git a/src/components/ContainerComponents/FluidChartContainer/FluidChartContainer.tsx b/src/components/ContainerComponents/FluidChartContainer/FluidChartContainer.tsx
index 9ba4a0a1788f6c25519ccde22bad6da27e593862..5837e30ee3193f234c59a47f9519943497e32b24 100644
--- a/src/components/ContainerComponents/FluidChartContainer/FluidChartContainer.tsx
+++ b/src/components/ContainerComponents/FluidChartContainer/FluidChartContainer.tsx
@@ -7,6 +7,7 @@ import { TimeStep } from 'services/dataConsumptionContracts'
import { TypeChallenge, UserChallenge } from 'services/dataChallengeContracts'
import ConsumptionDataManager from 'services/consumptionDataManagerService'
import FluidChartContent from 'components/ContentComponents/FluidChart/FluidChartContent'
+import ActivateHalfHourLoad from 'components/ContentComponents/ConsumptionNavigator/ActivateHalfHourLoad'
interface FluidChartContainerProps {
timeStep: TimeStep
@@ -32,6 +33,7 @@ const FluidChartContainer: React.FC<FluidChartContainerProps> = ({
const [lastDateWithAllData, setLastDateWithAllData] = useState<DateTime>(
DateTime.local()
)
+ const [isMinuteBlocked, setMinuteBlocked] = useState<boolean>(false)
const [referenceDate, setReferenceDate] = useState<DateTime>(DateTime.local())
const [isLoaded, setIsLoaded] = useState<boolean>(false)
const [challenge, setChallenge] = useState<UserChallenge | null>(null)
@@ -46,6 +48,10 @@ const FluidChartContainer: React.FC<FluidChartContainerProps> = ({
useEffect(() => {
let subscribed = true
async function loadData() {
+ const activateHalfHourLoad = !(await consumptionDataManager.checkDoctypeEntries(
+ FluidType.ELECTRICITY,
+ TimeStep.HALF_AN_HOUR
+ ))
const data = await consumptionDataManager.fetchLastDateData(fluidTypes)
const dataWithAllFluids = await consumptionDataManager.fetchLastDateData(
fluidTypes,
@@ -58,6 +64,9 @@ const FluidChartContainer: React.FC<FluidChartContainerProps> = ({
if (subscribed && dataWithAllFluids) {
setLastDateWithAllData(dataWithAllFluids)
}
+ if (subscribed && activateHalfHourLoad) {
+ setMinuteBlocked(true)
+ }
if (subscribed && currentChallenge) {
if (
currentChallenge.challengeType &&
@@ -105,6 +114,7 @@ const FluidChartContainer: React.FC<FluidChartContainerProps> = ({
{isLoaded ? (
<div className="fc-root">
<div className="fc-content">
+ {isMinuteBlocked && timeStep === 10 && <ActivateHalfHourLoad />}
<FluidChartContent
referenceDate={referenceDate}
lastDataDate={lastDataDate}
diff --git a/src/components/ContentComponents/ConsumptionNavigator/ActivateHalfHourLoad.tsx b/src/components/ContentComponents/ConsumptionNavigator/ActivateHalfHourLoad.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a0735d1e3fa712383dc740ce0b1499533a9388fe
--- /dev/null
+++ b/src/components/ContentComponents/ConsumptionNavigator/ActivateHalfHourLoad.tsx
@@ -0,0 +1,38 @@
+import React from 'react'
+import { translate } from 'cozy-ui/react/I18n'
+import StyledOauthButton from 'components/CommonKit/Button/StyledOauthButton'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import iconEnedisLogo from 'assets/icons/visu/enedis-logo.svg'
+import Config from '../../../../config.json'
+
+interface ActivateHalfHourLoadProps {
+ t: Function // translation service
+}
+const ActivateHalfHourLoad = ({ t }: ActivateHalfHourLoadProps) => {
+ const siteLink = Config.fluidConfig[0].siteLink //TODO change here
+
+ return (
+ <div className="cta-box">
+ <div className="cta-box-header header-text text-16-normal">
+ {t('timestep.activate.enedis.info')}
+ </div>
+ <StyledOauthButton
+ className="cta-box-button"
+ type="button"
+ color="primary"
+ onClick={() => window.open(siteLink, '_blank')}
+ >
+ <div className="oauthform-button-content">
+ <div className="oauthform-button-content-icon">
+ <StyledIcon icon={iconEnedisLogo} size={48} />
+ </div>
+ <div className="oauthform-button-text text-18-bold">
+ <div> {t('timestep.activate.enedis.label1')}</div>
+ </div>
+ </div>
+ </StyledOauthButton>
+ </div>
+ )
+}
+
+export default translate()(ActivateHalfHourLoad)
diff --git a/src/components/ContentComponents/FluidChart/FluidChartContent.tsx b/src/components/ContentComponents/FluidChart/FluidChartContent.tsx
index 35844b1d21eb91779a5505a8a59a12a8675c3df5..92019ef5881866eeb162e365fc43dfc1cfa2a201 100644
--- a/src/components/ContentComponents/FluidChart/FluidChartContent.tsx
+++ b/src/components/ContentComponents/FluidChart/FluidChartContent.tsx
@@ -59,13 +59,11 @@ const FluidChartContent: React.FC<FluidChartContentProps> = ({
>()
const [showCompare, setShowCompare] = useState<boolean>(false)
const [isLoaded, setIsLoaded] = useState<boolean>(true)
-
const challengePeriod: ITimePeriod | null =
currentChallenge &&
currentChallenge.startingDate &&
currentChallenge.endingDate &&
new TimePeriod(currentChallenge.startingDate, currentChallenge.endingDate)
-
const handleChangeIndex = (index: number) => {
const date =
index === 0
@@ -140,6 +138,7 @@ const FluidChartContent: React.FC<FluidChartContentProps> = ({
handleChangeIndex={handleChangeIndex}
/>
</div>
+
{isDataLoaded && (
<FluidChartSwipe
fluidTypes={fluidTypes}
diff --git a/src/locales/en.json b/src/locales/en.json
index dfdf54dd78ef588ddcdd1222b48ab66e6e7df5c6..a727191ac90413326db0ff9b0ced3287f3224c57 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -197,5 +197,14 @@
"window": {
"title": "OAuth"
}
+ },
+ "timestep": {
+ "activate": {
+ "enedis": {
+ "info": "Pour visualiser vos consommations à la 1/2 heure, il vous faut valider l'activation de l'enregistrement de votre consommation horaire sur votre compte Enedis",
+ "label1": "Activer sur mon compte Enedis",
+ "activateLink": "https://mon-compte-client.enedis.fr/"
+ }
+ }
}
}
diff --git a/src/services/consumptionDataManagerService.ts b/src/services/consumptionDataManagerService.ts
index 67464a3ff11e366444b7964c044a93e6dd2e0fba..ff2d6ec33e0e4b35a9c6df861ede69c0b3f33605 100644
--- a/src/services/consumptionDataManagerService.ts
+++ b/src/services/consumptionDataManagerService.ts
@@ -287,6 +287,17 @@ export default class ConsumptionDataManager implements IConsumptionDataManager {
return lastDay
}
+ public async checkDoctypeEntries(
+ fluideType: FluidType,
+ timeStep: TimeStep
+ ): Promise<boolean> {
+ const queryResult = await this._queryRunner.getEntries(fluideType, timeStep)
+ if (queryResult.length > 0) {
+ return true
+ }
+ return false
+ }
+
private aggregateGraphData(
singleFluidCharts: ISingleFluidChartData[]
//,withComparison: boolean = true
diff --git a/src/services/queryRunnerService.ts b/src/services/queryRunnerService.ts
index 729da2df1e9972e491e382496fe4c41dd8095bda..a5c0e288929f68824fd7a3de26b09e0b49cc1182 100644
--- a/src/services/queryRunnerService.ts
+++ b/src/services/queryRunnerService.ts
@@ -112,6 +112,17 @@ export class QueryRunner {
return result
}
+ public async getEntries(fluidType: FluidType, timeStep: TimeStep) {
+ let result = null
+ const doctype = this.getRelevantDoctype(fluidType, timeStep)
+ try {
+ result = await this._client.query(this._client.find(doctype).where({}))
+ } catch (error) {
+ return null
+ }
+ return result
+ }
+
private filterDataList(data, timePeriod: ITimePeriod) {
const filteredResult = data.data.filter(entry =>
this.withinDateBoundaries(
@@ -265,7 +276,6 @@ export class QueryRunner {
}
break
}
-
return predicate
}
diff --git a/src/styles/base/_layout.scss b/src/styles/base/_layout.scss
index c7cc19fdf95b2df2683a60b4ef3612ea6d744663..e3665c494934bda5a4f1ff5ebc4d96f1e5d882c5 100644
--- a/src/styles/base/_layout.scss
+++ b/src/styles/base/_layout.scss
@@ -122,6 +122,30 @@ body {
}
}
+.cta-box {
+ background-color:rgba(18, 18, 18, 0.7);
+ position: absolute;
+
+ padding: 1.5rem 1rem 1rem 0rem;
+ z-index: 1;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ height: 50%;
+ .cta-box-header {
+ text-align: center;
+ font-weight: bold;
+ letter-spacing: 0.2px;
+ margin-bottom: 1.5em;
+ color: $text-bright;
+ }
+ .cta-box-button {
+ margin-left: auto;
+ margin-right: auto;
+ width: 80%;
+ }
+}
+
[role='main'] {
/* width */
&::-webkit-scrollbar {