From b7679a4da296a725b288a661031bf66a0ec3949a Mon Sep 17 00:00:00 2001
From: Romain CREY <ext.sopra.rcrey@grandlyon.com>
Date: Tue, 26 May 2020 17:41:41 +0200
Subject: [PATCH] welcome modal in component
---
package.json | 2 +-
.../ViewContainer/HomeViewContainer.tsx | 71 ++-----------------
2 files changed, 6 insertions(+), 67 deletions(-)
diff --git a/package.json b/package.json
index 4484c8f6c..185c02638 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
"build": "yarn run build:css && yarn run build:browser",
"release": "standard-version --no-verify",
"winstack": "start powershell -command docker run --rm -it -p 8080:8080 -p 5984:5984 -p 8025:8025 -v $PWD/build:/data/cozy-app/ecolyo -v $PWD/data/konnectors_sources/:/data/cozy_konnectors/ -v $PWD/data:/usr/local/couchdb/data -v $PWD/docker/disableCSP.yaml:/etc/cozy/cozy.yaml registry.forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/cozy-env",
- "linuxstack": "docker run --rm -it -p 8080:8080 -p 5984:5984 -p 8025:8025 -v $(pwd)/build:/data/cozy-app/ecolyo -v ~/cozy/data/db/konnectors_sources/:/data/cozy_konnectors/ -v ~/cozy/data/db:/usr/local/couchdb/data -v ~/cozy/data/storage:/data/cozy-storage -v $(pwd)/docker/disableCSP.yaml:/etc/cozy/cozy.yaml registry.forge.grandlyon.com/web-et-numerique/llle_project/ecolyo/cozy-env",
+ "linuxstack": "docker run --rm -it -p 8080:8080 -p 5984:5984 -p 8025:8025 -v $(pwd)/build:/data/cozy-app/ecolyo -v ~/cozy/data/db/konnectors_sources/:/data/cozy_konnectors/ -v ~/cozy/data/db:/usr/local/couchdb/data -v ~/cozy/data/storage:/data/cozy-storage -v $(pwd)/docker/disableCSP.yaml:/etc/cozy/cozy.yaml 5fdc0725024f",
"load-data": "cd test && importData.bat"
},
"repository": {
diff --git a/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx
index 7b5a06ecd..7638dde51 100644
--- a/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx
+++ b/src/components/ContainerComponents/ViewContainer/HomeViewContainer.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useContext, useEffect } from 'react'
+import React, { useState, useContext } from 'react'
import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
import CozyBar from 'components/ContainerComponents/CozyBar/CozyBar'
import Header from 'components/ContainerComponents/Header/Header'
@@ -10,39 +10,15 @@ import { AppContext } from 'components/Contexts/AppContextProvider'
import MultliFluidIndicatorsContainer from 'components/ContainerComponents/IndicatorsContainer/MultiFluidIndicatorsContainer'
import ChallengeCardContainer from 'components/ContainerComponents/ChallengeCardContainer/ChallengeCardContainer'
import KonnectorViewerContainer from 'components/ContainerComponents/KonnectorViewerContainer/KonnectorViewerContainer'
-import Modal from 'components/CommonKit/Modal/Modal'
-import StyledButton from 'components/CommonKit/Button/StyledButton'
-import { translate } from 'cozy-ui/react/I18n'
-import { withClient, Client } from 'cozy-client'
-import { USERPROFILE_DOCTYPE } from 'doctypes'
-import useInstanceSettings from 'components/Hooks/userInstanceSettings'
+import WelcomeModalContainer from '../WelcomeModalContainer/WelcomeModalContainer'
-interface HomeViewContainerProps {
- t: Function
- client: Client
-}
-
-const HomeViewContainer: React.FC = ({ t, client }: HomeViewContainerProps) => {
+const HomeViewContainer: React.FC = () => {
const [timeStep, setTimeStep] = useState<TimeStep>(20)
const [resetRefenceDate, setResetReferenceDate] = useState<boolean>(false)
const { fluidTypes } = useContext(AppContext)
const [headerHeight, setHeaderHeight] = useState<number>(0)
- const [modalOpen, setModalOpen] = useState<boolean>(true)
const [isChartLoading, setChartLoading] = useState<boolean>(true)
const [isIndicatorsLoading, setIndicatorsLoading] = useState<boolean>(true)
- const { data: instanceSettings } = useInstanceSettings(client)
-
- async function updateWelcomeModalState() {
- await client
- .query(client.find(USERPROFILE_DOCTYPE).limitBy(1))
- .then(async ({ data }) => {
- const doc = data[0]
- await client.save({
- ...doc,
- haveSeenWelcomeModal: true,
- })
- })
- }
const setChartLoaded = () => {
setChartLoading(false)
@@ -66,46 +42,9 @@ const HomeViewContainer: React.FC = ({ t, client }: HomeViewContainerProps) => {
setHeaderHeight(height)
}
- const handleCloseClick = () => {
- setModalOpen(false)
- updateWelcomeModalState()
- }
-
- useEffect(() => {
- async function getWelcomeModalState() {
- await client
- .query(client.find(USERPROFILE_DOCTYPE).limitBy(1))
- .then(async ({ data }) => {
- const welcomeModalState = data[0].haveSeenWelcomeModal
- setModalOpen(!welcomeModalState)
- })
- }
- getWelcomeModalState()
- }, [])
-
return (
<React.Fragment>
- <Modal
- open={modalOpen}
- handleCloseClick={handleCloseClick}
- yellowBorder="yellow-border"
- >
- <div className="wm-header text-24-bold">
- {t('COMMON.WELCOME_MODAL_TITLE')}
- </div>
- <div className="wm-name text-24-bold">
- {instanceSettings.public_name} !
- </div>
- <div className="wm-perso text-18-bold">
- {t('COMMON.WELCOME_MODAL_PERSO')}
- </div>
- <div className="wm-connect text-18-bold">
- {t('COMMON.WELCOME_MODAL_CONNECT')}
- </div>
- <StyledButton className="button-ok" onClick={handleCloseClick}>
- {t('COMMON.WELCOME_MODAL_OK')}
- </StyledButton>
- </Modal>
+ <WelcomeModalContainer />
<CozyBar />
{fluidTypes && fluidTypes.length > 0 ? (
<>
@@ -153,4 +92,4 @@ const HomeViewContainer: React.FC = ({ t, client }: HomeViewContainerProps) => {
)
}
-export default translate()(withClient(HomeViewContainer))
+export default HomeViewContainer
--
GitLab