diff --git a/src/components/Analysis/AnalysisConsumptionRow.tsx b/src/components/Analysis/AnalysisConsumptionRow.tsx
index 64e667d5824689ad63ff765383ea7b1f5f505067..ee96f105dc44a1cb6510efdaf87bb46717b771f9 100644
--- a/src/components/Analysis/AnalysisConsumptionRow.tsx
+++ b/src/components/Analysis/AnalysisConsumptionRow.tsx
@@ -104,7 +104,9 @@ const AnalysisConsumptionRow: React.FC<AnalysisConsumptionRowProps> = ({
}
}
return (
- <div className={`consumption-${FluidType[fluid].toLowerCase()}`}>
+ <div
+ className={`consumption-${FluidType[fluid].toLowerCase()} analysisRow`}
+ >
<div className="user-graph">
<div
className={classNames('price', 'text-15-bold', {
diff --git a/src/components/Analysis/analysisConsumptionRow.scss b/src/components/Analysis/analysisConsumptionRow.scss
index 460c2c58fa955f442f0e35791607781fc3b74556..2079dd10bcb6a4e410822290a0603ced17ab7d36 100644
--- a/src/components/Analysis/analysisConsumptionRow.scss
+++ b/src/components/Analysis/analysisConsumptionRow.scss
@@ -90,15 +90,18 @@
}
}
}
-.icon-container {
- flex-basis: 10%;
- display: flex;
- justify-content: center;
- svg {
- align-self: center;
- width: 40px;
+.analysisRow {
+ .icon-container {
+ flex-basis: 10%;
+ display: flex;
+ justify-content: center;
+ svg {
+ align-self: center;
+ width: 40px;
+ }
}
}
+
.container-graph {
flex-basis: 50%;
display: flex;
diff --git a/src/components/Ecogesture/EcogestureCard.spec.tsx b/src/components/Ecogesture/EcogestureCard.spec.tsx
index 3cedda23b443140952e3187ce7b4dbf13b2b847c..3146ddbdb375ff02e25230b93ed77e1859ba5775 100644
--- a/src/components/Ecogesture/EcogestureCard.spec.tsx
+++ b/src/components/Ecogesture/EcogestureCard.spec.tsx
@@ -8,7 +8,7 @@ import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
import { Provider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
-import { act } from 'react-dom/test-utils'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -40,7 +40,7 @@ describe('EcogestureCard component', () => {
global: globalStateData,
},
})
- mockImportIconbyId.mockReturnValue('')
+ mockImportIconbyId.mockReturnValueOnce('')
const wrapper = mount(
<Provider store={store}>
<BrowserRouter>
@@ -48,10 +48,8 @@ describe('EcogestureCard component', () => {
</BrowserRouter>
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
+ await waitForComponentToPaint(wrapper)
+
expect(toJson(wrapper)).toMatchSnapshot()
})
it('should be with default icon', async () => {
@@ -60,7 +58,7 @@ describe('EcogestureCard component', () => {
global: globalStateData,
},
})
- mockImportIconbyId.mockReturnValue(null)
+ mockImportIconbyId.mockReturnValue(undefined)
const wrapper = mount(
<Provider store={store}>
<BrowserRouter>
@@ -68,10 +66,8 @@ describe('EcogestureCard component', () => {
</BrowserRouter>
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
+ await waitForComponentToPaint(wrapper)
+
expect(wrapper.find('.Icon').exists()).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureCard.tsx b/src/components/Ecogesture/EcogestureCard.tsx
index 082e2727d97993fba473cfe580ef7fb9f51a1b21..5e9311124a90512a769afd1cdf4dd0caf24326c9 100644
--- a/src/components/Ecogesture/EcogestureCard.tsx
+++ b/src/components/Ecogesture/EcogestureCard.tsx
@@ -33,7 +33,7 @@ const EcogestureCard: React.FC<EcogestureCardProps> = ({
return (
<Link
- to={`/ecogestures/${ecogesture.id}`}
+ to={`/ecogesture/${ecogesture.id}`}
component={RouterLink}
className="ecogesture-list-item"
>
diff --git a/src/components/Ecogesture/EcogestureError.spec.tsx b/src/components/Ecogesture/EcogestureEmptyList.spec.tsx
similarity index 51%
rename from src/components/Ecogesture/EcogestureError.spec.tsx
rename to src/components/Ecogesture/EcogestureEmptyList.spec.tsx
index 810c48e44d2a1d9730401002edb515f2a455fa86..79aa75d28f875bdeb25eebf80f32d8bc1eb487b4 100644
--- a/src/components/Ecogesture/EcogestureError.spec.tsx
+++ b/src/components/Ecogesture/EcogestureEmptyList.spec.tsx
@@ -5,7 +5,8 @@ import { profileData } from '../../../tests/__mocks__/profile.mock'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
import { Provider } from 'react-redux'
import Button from '@material-ui/core/Button'
-import EcogestureError from './EcogestureError'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import toJson from 'enzyme-to-json'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -16,16 +17,10 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
-const mockHistoryPush = jest.fn()
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- useHistory: () => ({
- push: mockHistoryPush,
- }),
-}))
-const mockStore = configureStore([])
-describe('EcogestureError component', () => {
+const mockStore = configureStore([])
+const mockChangeTab = jest.fn()
+describe('EcogestureEmptyList component', () => {
it('should be rendered correctly', () => {
const store = mockStore({
ecolyo: {
@@ -35,12 +30,12 @@ describe('EcogestureError component', () => {
})
const wrapper = mount(
<Provider store={store}>
- <EcogestureError />
+ <EcogestureEmptyList setTab={mockChangeTab} isObjective={true} />
</Provider>
)
- expect(wrapper.find(Button).exists()).toBeTruthy()
+ expect(toJson(wrapper)).toMatchSnapshot()
})
- it('should redirect to profile type form', () => {
+ it('should return to all ecogestures', () => {
const store = mockStore({
ecolyo: {
profile: profileData,
@@ -49,12 +44,31 @@ describe('EcogestureError component', () => {
})
const wrapper = mount(
<Provider store={store}>
- <EcogestureError />
+ <EcogestureEmptyList setTab={mockChangeTab} isObjective={false} />
</Provider>
)
wrapper
- .find('.btn-highlight')
+ .find(Button)
.first()
.simulate('click')
+ expect(mockChangeTab).toHaveBeenCalledTimes(1)
+ })
+ it('should return to all ecogestures', () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureEmptyList setTab={mockChangeTab} isObjective={false} />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ //test tinder launch
})
})
diff --git a/src/components/Ecogesture/EcogestureEmptyList.tsx b/src/components/Ecogesture/EcogestureEmptyList.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1e79cd76393e4be14d1bc177f090a1b831d71aaa
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureEmptyList.tsx
@@ -0,0 +1,67 @@
+import React from 'react'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import Button from '@material-ui/core/Button'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import doingIcon from 'assets/icons/ico/doing-enabled.svg'
+import objectiveIcon from 'assets/icons/ico/objective-enabled.svg'
+
+import './ecogestureEmptyList.scss'
+
+interface EcogestureEmptyListProps {
+ setTab: React.Dispatch<React.SetStateAction<number>>
+ isObjective: boolean
+}
+const EcogestureEmptyList: React.FC<EcogestureEmptyListProps> = ({
+ setTab,
+ isObjective,
+}: EcogestureEmptyListProps) => {
+ const { t } = useI18n()
+
+ return (
+ <div className="ec-empty-container">
+ <div className="ec-empty-content">
+ <StyledIcon
+ className="icon-big"
+ icon={isObjective ? objectiveIcon : doingIcon}
+ size={150}
+ />
+ <div className="text-16-normal text">
+ {isObjective
+ ? t('ecogesture.emptyList.obj1')
+ : t('ecogesture.emptyList.doing1')}
+ </div>
+ <div className="text-16-normal text">
+ {isObjective
+ ? t('ecogesture.emptyList.obj2')
+ : t('ecogesture.emptyList.doing2')}
+ </div>
+ <div className="btn-container">
+ <Button
+ aria-label={t('ecogesture.emptyList.btn1')}
+ onClick={() => setTab(2)}
+ classes={{
+ root: 'btn-secondary-negative btn1',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.emptyList.btn1')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture.emptyList.btn2')}
+ onClick={() => {
+ console.log('tinder')
+ }}
+ classes={{
+ root: 'btn-highlight',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.emptyList.btn2')}
+ </Button>
+ </div>
+ </div>
+ </div>
+ )
+}
+
+export default EcogestureEmptyList
diff --git a/src/components/Ecogesture/EcogestureError.tsx b/src/components/Ecogesture/EcogestureError.tsx
deleted file mode 100644
index 8dc6110cc007442dbe4f91e3884d29f70487fcc1..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureError.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { useHistory } from 'react-router-dom'
-import Button from '@material-ui/core/Button'
-import './ecogestureError.scss'
-
-const EcogestureError: React.FC = () => {
- const { t } = useI18n()
- const history = useHistory()
- const goToForm = () => {
- history.push('/profileType')
- }
- return (
- <div className="ec-error-container">
- <div className="ec-error-content">
- <div className="ec-error-title text-16-normal">
- {t('ecogesture.adjust_profil.description')}
- </div>
- <Button
- aria-label={t('ecogesture.accessibility.button_go_to_profil')}
- onClick={goToForm}
- classes={{
- root: 'btn-highlight',
- label: 'text-16-bold',
- }}
- >
- {t('ecogesture.adjust_profil.button_go_to_profil')}
- </Button>
- </div>
- </div>
- )
-}
-
-export default EcogestureError
diff --git a/src/components/Ecogesture/EcogestureInfoModal.spec.tsx b/src/components/Ecogesture/EcogestureInfoModal.spec.tsx
deleted file mode 100644
index aa58956ee7579e83a06c2193f67edfb489a7224c..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureInfoModal.spec.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import React from 'react'
-import { mount } from 'enzyme'
-import EcogestureInfoModal from './EcogestureInfoModal'
-import Button from '@material-ui/core/Button'
-import toJson from 'enzyme-to-json'
-
-jest.mock('cozy-ui/transpiled/react/I18n', () => {
- return {
- useI18n: jest.fn(() => {
- return {
- t: (str: string) => str,
- }
- }),
- }
-})
-
-const mockHandleCloseClick = jest.fn()
-
-describe('EcogestureInfoModal component', () => {
- it('should be rendered correctly', () => {
- const wrapper = mount(
- <EcogestureInfoModal
- open={true}
- handleCloseClick={mockHandleCloseClick}
- />
- )
- expect(toJson(wrapper)).toMatchSnapshot()
- expect(wrapper.find('.info-header').exists()).toBeTruthy()
- expect(wrapper.find('.info-title').exists()).toBeTruthy()
- expect(wrapper.find('.info-detail').exists()).toBeTruthy()
- expect(wrapper.find(Button).exists()).toBeTruthy()
- })
-
- it('should be call handleCloseClick when click on button', () => {
- const wrapper = mount(
- <EcogestureInfoModal
- open={true}
- handleCloseClick={mockHandleCloseClick}
- />
- )
- wrapper
- .find(Button)
- .first()
- .simulate('click')
- expect(mockHandleCloseClick).toHaveBeenCalled()
- })
-})
diff --git a/src/components/Ecogesture/EcogestureInfoModal.tsx b/src/components/Ecogesture/EcogestureInfoModal.tsx
deleted file mode 100644
index f346c70f6fe42f6f72181a7effa826f9b233e771..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/EcogestureInfoModal.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from 'react'
-import './ecogestureInfoModal.scss'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import Button from '@material-ui/core/Button'
-import Dialog from '@material-ui/core/Dialog'
-import HeaderQuestion from 'assets/icons/ico/header-question.svg'
-
-interface EcogestureInfoModalProps {
- open: boolean
- handleCloseClick: () => void
-}
-
-const EcogestureInfoModal: React.FC<EcogestureInfoModalProps> = ({
- open,
- handleCloseClick,
-}: EcogestureInfoModalProps) => {
- const { t } = useI18n()
- return (
- <Dialog
- open={open}
- onClose={handleCloseClick}
- aria-labelledby={'accessibility-title'}
- classes={{
- root: 'modal-root',
- paper: 'modal-paper',
- }}
- >
- <div id={'accessibility-title'}>
- {t('ecogesture_info_modal.accessibility.window_title')}
- </div>
- <div className="info-header">
- <Icon icon={HeaderQuestion} size={80} />
- </div>
- <div className="info-content">
- <div className="info-title text-20-bold">
- {t('ecogesture_info_modal.header')}
- </div>
- <div className="info-detail text-16-normal">
- {t('ecogesture_info_modal.text')}
- </div>
- <Button
- aria-label={t('ecogesture_info_modal.accessibility.button_close')}
- onClick={handleCloseClick}
- classes={{
- root: 'btn-secondary-negative',
- label: 'text-14-normal',
- }}
- >
- {t('ecogesture_info_modal.button_close')}
- </Button>
- </div>
- </Dialog>
- )
-}
-
-export default EcogestureInfoModal
diff --git a/src/components/Ecogesture/EcogestureInitModal.spec.tsx b/src/components/Ecogesture/EcogestureInitModal.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..5a87a6f1eca474760c2304f9e0f8df21beaaef6d
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureInitModal.spec.tsx
@@ -0,0 +1,96 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import configureStore from 'redux-mock-store'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
+import { Provider } from 'react-redux'
+import EcogestureInitModal from './EcogestureInitModal'
+import { Button } from '@material-ui/core'
+import { mockInitialProfileState } from '../../../tests/__mocks__/store'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+const mockImportIconbyId = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ importIconbyId: jest.fn(() => {
+ return mockImportIconbyId
+ }),
+ }
+})
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+
+const mockStore = configureStore([])
+const mockHandleClose = jest.fn()
+describe('EcogestureInitModal component', () => {
+ it('should be rendered correctly', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ profile: mockInitialProfileState,
+ challenge: challengeStateData,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal open={true} handleCloseClick={mockHandleClose} />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should go back ', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ profile: mockInitialProfileState,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal open={true} handleCloseClick={mockHandleClose} />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(mockHistoryPush).toHaveBeenCalledWith('/consumption')
+ })
+ it('should close modal and update profile', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ profile: mockInitialProfileState,
+ challenge: challengeStateData,
+ },
+ })
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureInitModal open={true} handleCloseClick={mockHandleClose} />
+ </Provider>
+ )
+ wrapper
+ .find(Button)
+ .at(1)
+ .simulate('click')
+ expect(mockHandleClose).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/src/components/Ecogesture/EcogestureInitModal.tsx b/src/components/Ecogesture/EcogestureInitModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..6eebbbfac15e51534283e59290f39f2ff3447ba3
--- /dev/null
+++ b/src/components/Ecogesture/EcogestureInitModal.tsx
@@ -0,0 +1,80 @@
+import React, { useCallback } from 'react'
+import Dialog from '@material-ui/core/Dialog'
+import { Button, IconButton } from '@material-ui/core'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import CloseIcon from 'assets/icons/ico/close.svg'
+import './ecogestureInitModal.scss'
+import { useHistory } from 'react-router-dom'
+interface EcogestureInitModalProps {
+ open: boolean
+ handleCloseClick: () => void
+}
+const EcogestureInitModal: React.FC<EcogestureInitModalProps> = ({
+ open,
+ handleCloseClick,
+}: EcogestureInitModalProps) => {
+ const history = useHistory()
+ const { t } = useI18n()
+ const goBack = useCallback(() => {
+ history.push('/consumption')
+ }, [history])
+ return (
+ <Dialog
+ open={open}
+ onClose={handleCloseClick}
+ aria-labelledby={'accessibility-title'}
+ classes={{
+ root: 'modal-root',
+ paper: 'modal-paper',
+ }}
+ >
+ <div id={'accessibility-title'}>
+ {t('feedback.accessibility.window_title')}
+ </div>
+ <IconButton
+ aria-label={t('feedback.accessibility.button_close')}
+ className="modal-paper-close-button"
+ onClick={handleCloseClick}
+ >
+ <Icon icon={CloseIcon} size={16} />
+ </IconButton>
+ <div className="eg-init-modal">
+ <div className="title text-20-bold">
+ {t('ecogesture.initModal.title')}
+ </div>
+ <div className="text-16-normal text">
+ {t('ecogesture.initModal.text1')}
+ </div>
+ <div className="text-16-normal text">
+ {t('ecogesture.initModal.text2')}
+ </div>
+ <div className="buttons-container">
+ <Button
+ aria-label={t('ecogesture.initModal.btn1')}
+ onClick={goBack}
+ className="btn1"
+ classes={{
+ root: 'btn-secondary-negative',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.initModal.btn1')}
+ </Button>
+ <Button
+ aria-label={t('ecogesture.initModal.btn2')}
+ onClick={handleCloseClick}
+ classes={{
+ root: 'btn-profile-next rounded',
+ label: 'text-16-bold',
+ }}
+ >
+ {t('ecogesture.initModal.btn2')}
+ </Button>
+ </div>
+ </div>
+ </Dialog>
+ )
+}
+
+export default EcogestureInitModal
diff --git a/src/components/Ecogesture/EcogestureList.spec.tsx b/src/components/Ecogesture/EcogestureList.spec.tsx
index 83b087bbd1f43eda3b9be8f0fc68d955924644c6..58cc2649500282b31cc14ce0558984d6621c6128 100644
--- a/src/components/Ecogesture/EcogestureList.spec.tsx
+++ b/src/components/Ecogesture/EcogestureList.spec.tsx
@@ -6,6 +6,10 @@ import { Provider } from 'react-redux'
import configureStore from 'redux-mock-store'
import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import { BrowserRouter } from 'react-router-dom'
+import { Button, MenuItem } from '@material-ui/core'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -16,10 +20,12 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
+jest.mock('components/Ecogesture/EcogestureCard', () => 'mock-ecogesturecard')
+
const mockStore = configureStore([])
describe('EcogesturesList component', () => {
- it('should be rendered correctly', () => {
+ it('should be rendered correctly', async () => {
const store = mockStore({
ecolyo: {
global: globalStateData,
@@ -28,9 +34,39 @@ describe('EcogesturesList component', () => {
})
const wrapper = mount(
<Provider store={store}>
- <EcogestureList filteredByProfile={false} />
+ <BrowserRouter>
+ <EcogestureList list={ecogesturesData} />
+ </BrowserRouter>
</Provider>
)
+ await waitForComponentToPaint(wrapper)
expect(toJson(wrapper)).toMatchSnapshot()
})
+ it('should open the filter menu and select all ecogesture', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <EcogestureList list={ecogesturesData} />
+ </BrowserRouter>
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+ wrapper.find('.filter-button').simulate('click')
+ wrapper
+ .find(Button)
+ .first()
+ .simulate('click')
+ expect(wrapper.find('.filter-menu').exists()).toBeTruthy()
+ wrapper
+ .find(MenuItem)
+ .at(1)
+ .simulate('click')
+ expect(wrapper.find('.ecogestures').text()).toBe('ecogesture.HEATING')
+ })
})
diff --git a/src/components/Ecogesture/EcogestureList.tsx b/src/components/Ecogesture/EcogestureList.tsx
index 94e9a62855499a070d229742e21a5f75ea055333..f791c5e697fd3eaf979788df503370cca4224c8d 100644
--- a/src/components/Ecogesture/EcogestureList.tsx
+++ b/src/components/Ecogesture/EcogestureList.tsx
@@ -1,49 +1,29 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState } from 'react'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import { useClient } from 'cozy-client'
-
import { Ecogesture } from 'models'
-import EcogestureService from 'services/ecogesture.service'
+
import { Menu, MenuItem, ListItemIcon } from '@material-ui/core/'
import SortIcon from 'assets/icons/ico/sort.svg'
import CheckIcon from 'assets/icons/ico/check.svg'
-import QuestionIcon from 'assets/icons/ico/efficiency-question.svg'
-import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
import EcogestureCard from 'components/Ecogesture/EcogestureCard'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import Button from '@material-ui/core/Button'
import './ecogestureList.scss'
-import { ProfileType } from 'models/profileType.model'
import { Usage } from 'enum/ecogesture.enum'
-import EcogestureInfoModal from './EcogestureInfoModal'
-import { getSeason } from 'utils/utils'
-import { FluidType } from 'enum/fluid.enum'
interface EcogestureListProps {
- filteredByProfile: boolean
- profileType?: ProfileType
+ list: Ecogesture[]
}
const EcogestureList: React.FC<EcogestureListProps> = ({
- filteredByProfile,
- profileType,
+ list,
}: EcogestureListProps) => {
const { t } = useI18n()
- const client = useClient()
-
- const [ecogestures, setEcogestures] = useState<Ecogesture[] | null>(null)
- const [isLoaded, setisLoaded] = useState(false)
const [activeFilter, setactiveFilter] = useState<string>(Usage[Usage.ALL])
const [openDropDown, setopenDropDown] = useState<boolean>(false)
- const [openInfoModal, setOpenInfoModal] = useState<boolean>(false)
-
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)
- const toggleInfoModal = () => {
- setOpenInfoModal(prev => !prev)
- }
-
const toggleDropDown = () => {
setopenDropDown(prev => !prev)
}
@@ -80,140 +60,89 @@ const EcogestureList: React.FC<EcogestureListProps> = ({
}
}
- useEffect(() => {
- let subscribed = true
- async function loadEcogestures() {
- const ecogestureService = new EcogestureService(client)
- const dataAll = await ecogestureService.getAllEcogestures(getSeason())
- if (subscribed && dataAll) {
- setEcogestures(dataAll)
- if (filteredByProfile && profileType) {
- setEcogestures(
- EcogestureService.getEcogestureListByProfile(dataAll, profileType)
- )
- } else {
- setEcogestures(dataAll)
- }
- }
- setisLoaded(true)
- }
- loadEcogestures()
- return () => {
- subscribed = false
- }
- }, [client, filteredByProfile, profileType])
-
return (
<div className="ecogesture-root">
- <>
- <div className="efficiency-button-content">
- <div className="filters text-16-normal">
- <div
- className="filter-button"
- onClick={() => toggleDropDown()}
- tabIndex={0}
- onBlur={e => {
- if (e.relatedTarget === null) toggleDropDown()
- }}
- >
- <Button
- classes={{
- root: 'btn-secondary-negative',
- label: 'text-14-normal',
- }}
- aria-controls="simple-menu"
- aria-haspopup="true"
- aria-label={t(`ecogesture.MENU_TITLE`)}
- onClick={toggleMenu}
- variant="contained"
- >
- <StyledIcon icon={SortIcon} size={20} />
- <span
- className={
- openDropDown ? 'ecogestures opened' : 'ecogestures'
- }
- >
- {activeFilter === 'ALL'
- ? t(`ecogesture.MENU_TITLE`)
- : t(`ecogesture.${activeFilter}`)}
- </span>
- </Button>
- <Menu
- anchorEl={anchorEl}
- keepMounted
- open={Boolean(anchorEl)}
- onClose={() => closeMenu()}
- PopoverClasses={{
- paper: 'filter-menu',
- }}
- variant="menu"
- MenuListProps={{ className: 'filter-menu-list' }}
- >
- {Object.values(Usage).map((usage, key) => {
- return (
- typeof usage !== 'number' && (
- <MenuItem
- classes={{
- root: `${
- usage === activeFilter ? 'item-active' : ''
- }`,
- }}
- key={key}
- selected={usage === activeFilter}
- onClick={() => closeMenu(usage)}
- >
- {t(`ecogesture.${usage}`)}
- {usage === activeFilter && (
- <ListItemIcon classes={{ root: 'filter-menu-icon' }}>
- <StyledIcon icon={CheckIcon} size={13} />
- </ListItemIcon>
- )}
- </MenuItem>
- )
- )
- })}
- </Menu>
- </div>
- </div>
- {filteredByProfile && (
+ <div className="efficiency-button-content">
+ <div className="filters text-16-normal">
+ <div
+ className="filter-button"
+ onClick={() => toggleDropDown()}
+ tabIndex={0}
+ onBlur={e => {
+ if (e.relatedTarget === null) toggleDropDown()
+ }}
+ >
<Button
classes={{
- root: 'btn-secondary-negative btn-info',
+ root: 'btn-secondary-negative',
label: 'text-14-normal',
}}
- aria-controls="ecogesture-info"
+ aria-controls="simple-menu"
aria-haspopup="true"
- onClick={toggleInfoModal}
+ aria-label={t(`ecogesture.MENU_TITLE`)}
+ onClick={toggleMenu}
variant="contained"
>
- <StyledIcon icon={QuestionIcon} size={40} />
+ <StyledIcon icon={SortIcon} size={20} />
+ <span
+ className={openDropDown ? 'ecogestures opened' : 'ecogestures'}
+ >
+ {activeFilter === 'ALL'
+ ? t(`ecogesture.MENU_TITLE`)
+ : t(`ecogesture.${activeFilter}`)}
+ </span>
</Button>
- )}
+ <Menu
+ anchorEl={anchorEl}
+ keepMounted
+ open={Boolean(anchorEl)}
+ onClose={() => closeMenu()}
+ PopoverClasses={{
+ paper: 'filter-menu',
+ }}
+ variant="menu"
+ MenuListProps={{ className: 'filter-menu-list' }}
+ >
+ {Object.values(Usage).map((usage, key) => {
+ return (
+ typeof usage !== 'number' && (
+ <MenuItem
+ classes={{
+ root: `${usage === activeFilter ? 'item-active' : ''}`,
+ }}
+ key={key}
+ selected={usage === activeFilter}
+ onClick={() => closeMenu(usage)}
+ >
+ {t(`ecogesture.${usage}`)}
+ {usage === activeFilter && (
+ <ListItemIcon classes={{ root: 'filter-menu-icon' }}>
+ <StyledIcon icon={CheckIcon} size={13} />
+ </ListItemIcon>
+ )}
+ </MenuItem>
+ )
+ )
+ })}
+ </Menu>
+ </div>
</div>
- <div className="ecogesture-content">
- {!ecogestures || !isLoaded ? (
- <div className="ecogesture-content-loading">
- <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ <div className="ecogesture-content">
+ {list && activeFilter === Usage[Usage.ALL] ? (
+ list.map((ecogesture, index) => (
+ <EcogestureCard ecogesture={ecogesture} key={index} />
+ ))
+ ) : list && activeFilter !== Usage[Usage.ALL] ? (
+ filterEcogesture(list)
+ ) : (
+ <div className="ec-filter-error">
+ <div className="text-16-normal">
+ {t('ecogesture.no_ecogesture')}
</div>
- ) : ecogestures && activeFilter === Usage[Usage.ALL] ? (
- ecogestures.map((ecogesture, index) => (
- <EcogestureCard ecogesture={ecogesture} key={index} />
- ))
- ) : ecogestures && activeFilter !== Usage[Usage.ALL] ? (
- filterEcogesture(ecogestures)
- ) : (
- <div className="ec-filter-error">
- <div className="text-16-normal">
- {t('ecogesture.no_ecogesture')}
- </div>
- </div>
- )}
- </div>
- </>
- <EcogestureInfoModal
- open={openInfoModal}
- handleCloseClick={toggleInfoModal}
- />
+ </div>
+ )}
+ </div>
</div>
)
}
diff --git a/src/components/Ecogesture/EcogestureModal.spec.tsx b/src/components/Ecogesture/EcogestureModal.spec.tsx
index 727fd4ca90e6d46cd0ce88d48a6bcf8ce18b881c..561d8020c68246c657b1b072d0b8edf1e6adb371 100644
--- a/src/components/Ecogesture/EcogestureModal.spec.tsx
+++ b/src/components/Ecogesture/EcogestureModal.spec.tsx
@@ -6,6 +6,7 @@ import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
import { Provider } from 'react-redux'
+import { act } from 'react-dom/test-utils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -28,7 +29,7 @@ jest.mock('utils/utils', () => {
const mockStore = configureStore([])
describe('EcogestureModal component', () => {
- it('should be rendered correctly', () => {
+ it('should be rendered correctly', async () => {
const store = mockStore({
ecolyo: {
global: globalStateData,
@@ -46,6 +47,10 @@ describe('EcogestureModal component', () => {
/>
</Provider>
)
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
expect(wrapper.find('.em-title').text()).toEqual(
ecogesturesData[0].shortName
)
diff --git a/src/components/Ecogesture/EcogestureView.spec.tsx b/src/components/Ecogesture/EcogestureView.spec.tsx
index baba729c0016026591b381f015cc15346ead7e1f..96898cfc97a37e00150ae217b7cdf76fb7fe540c 100644
--- a/src/components/Ecogesture/EcogestureView.spec.tsx
+++ b/src/components/Ecogesture/EcogestureView.spec.tsx
@@ -8,7 +8,14 @@ import {
mockInitialEcolyoState,
} from '../../../tests/__mocks__/store'
import EcogestureView from 'components/Ecogesture/EcogestureView'
-import { Tab } from '@material-ui/core'
+import { IconButton, Tab } from '@material-ui/core'
+import toJson from 'enzyme-to-json'
+import EcogestureInitModal from './EcogestureInitModal'
+import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
+import { Season } from 'enum/ecogesture.enum'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import * as profileActions from 'store/profile/profile.actions'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -19,17 +26,52 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}),
}
})
+const mockgetAllEcogestures = jest.fn()
+jest.mock('services/ecogesture.service', () => {
+ return jest.fn(() => {
+ return {
+ getAllEcogestures: mockgetAllEcogestures,
+ }
+ })
+})
+const mockgetProfile = jest.fn()
+const mockUpdateProfile = jest.fn()
+jest.mock('services/profile.service', () => {
+ return jest.fn(() => {
+ return {
+ getProfile: mockgetProfile,
+ updateProfile: mockUpdateProfile,
+ }
+ })
+})
-jest.mock('components/Header/CozyBar', () => () => <div id="cozybar"></div>)
-jest.mock('components/Ecogesture/EcogestureList', () => () => (
- <div id="ecogesturelist"></div>
-))
-jest.mock('components/Ecogesture/EcogestureError', () => () => (
- <div id="ecogestureerror"></div>
-))
-
+jest.mock('components/Header/CozyBar', () => 'mock-cozybar')
+jest.mock('components/Header/Header', () => 'mock-header')
+jest.mock('components/Ecogesture/EcogestureList', () => 'mock-ecogesturelist')
+jest.mock('components/Content/Content', () => 'mock-content')
+const mockgetSeason = jest.fn()
+jest.mock('utils/utils', () => {
+ return {
+ getSeason: jest.fn(() => {
+ return mockgetSeason
+ }),
+ }
+})
const useSelectorSpy = jest.spyOn(reactRedux, 'useSelector')
+const mockHistoryGoBack = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useLocation: () => {
+ return {
+ search: '',
+ }
+ },
+ useHistory: () => ({
+ push: mockHistoryGoBack,
+ }),
+}))
+
describe('EcogestureView component', () => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let store: any
@@ -37,34 +79,93 @@ describe('EcogestureView component', () => {
store = createMockStore(mockInitialEcolyoState)
})
- it('should be rendered correctly', () => {
+ it('should be rendered correctly', async () => {
+ useSelectorSpy.mockReturnValue({
+ ...mockInitialEcolyoState.profile,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: true,
+ })
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(Tab).length).toBe(3)
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
+ it('should render ecogesture init modal', async () => {
+ const updateProfileSpy = jest.spyOn(profileActions, 'updateProfile')
+
useSelectorSpy.mockReturnValue({
...mockInitialEcolyoState.profile,
isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: false,
})
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
const wrapper = mount(
<Provider store={store}>
<EcogestureView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Tab).length).toBe(2)
- expect(wrapper.find('#ecogesturelist').length).toBe(2)
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureInitModal).exists()).toBeTruthy()
+ wrapper
+ .find(IconButton)
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(updateProfileSpy).toHaveBeenCalledWith({
+ haveSeenEcogestureModal: true,
+ })
})
- it('should be rendered with EcogestureError', () => {
+ it('should render empty list', async () => {
+ useSelectorSpy.mockReturnValue({
+ ...mockInitialEcolyoState.profile,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: false,
+ })
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce([])
+ const wrapper = mount(
+ <Provider store={store}>
+ <EcogestureView />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
+ })
+ it('should change tab', async () => {
useSelectorSpy.mockReturnValue({
...mockInitialEcolyoState.profile,
- isProfileTypeCompleted: false,
+ isProfileTypeCompleted: true,
+ haveSeenEcogestureModal: true,
})
+ mockgetSeason.mockReturnValue(Season.WINTER)
+ mockgetAllEcogestures.mockResolvedValueOnce(ecogesturesData)
const wrapper = mount(
<Provider store={store}>
<EcogestureView />
</Provider>
)
- expect(wrapper.find('#cozybar')).toBeTruthy()
- expect(wrapper.find(Tab).length).toBe(2)
- expect(wrapper.find('#ecogesturelist').length).toBe(1)
- expect(wrapper.find('#ecogestureerror').length).toBe(1)
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find(Tab)
+ .first()
+ .simulate('click')
+ mockgetAllEcogestures.mockResolvedValueOnce([])
+
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find(EcogestureEmptyList).exists()).toBeTruthy()
})
})
diff --git a/src/components/Ecogesture/EcogestureView.tsx b/src/components/Ecogesture/EcogestureView.tsx
index 160f7c9733bfac26169401901b1debea80838a66..94c4a3381eea398670ac5f6f656a38e32d2414b8 100644
--- a/src/components/Ecogesture/EcogestureView.tsx
+++ b/src/components/Ecogesture/EcogestureView.tsx
@@ -1,4 +1,5 @@
-import React, { useState } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
+import { useClient, useQuery } from 'cozy-client'
import EcogestureList from 'components/Ecogesture/EcogestureList'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
@@ -7,9 +8,18 @@ import { Tabs, Tab } from '@material-ui/core'
import './ecogestureView.scss'
import classNames from 'classnames'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import EcogestureError from './EcogestureError'
-import { useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
import { AppStore } from 'store'
+import { Ecogesture } from 'models'
+import EcogestureService from 'services/ecogesture.service'
+import { getSeason } from 'utils/utils'
+import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
+import { FluidType } from 'enum/fluid.enum'
+import EcogestureEmptyList from './EcogestureEmptyList'
+import { EcogestureStatus } from 'enum/ecogesture.enum'
+import EcogestureInitModal from './EcogestureInitModal'
+import { updateProfile } from 'store/profile/profile.actions'
+import { useHistory, useLocation } from 'react-router-dom'
interface TabPanelProps {
children?: React.ReactNode
@@ -39,67 +49,173 @@ const EcogestureView: React.FC = () => {
setHeaderHeight(height)
}
const { t } = useI18n()
- const profile = useSelector((state: AppStore) => state.ecolyo.profile)
+ const client = useClient()
+ const dispatch = useDispatch()
+ const tab = new URLSearchParams(useLocation().search).get('tab')
+
const profileType = useSelector((state: AppStore) => state.ecolyo.profileType)
- const [value, setValue] = useState<number>(0)
+ const { haveSeenEcogestureModal } = useSelector(
+ (state: AppStore) => state.ecolyo.profile
+ )
+ const [tabValue, setTabValue] = useState<EcogestureStatus>(
+ tab ? parseInt(tab) : EcogestureStatus.ALL
+ )
+ const history = useHistory()
+ const [isLoaded, setIsLoaded] = useState<boolean>(false)
+ const [allEcogestureList, setAllEcogestureList] = useState<Ecogesture[]>([])
+ const [doingEcogestureList, setDoingEcogestureList] = useState<Ecogesture[]>(
+ []
+ )
+ const [objectiveEcogestureList, setObjectiveEcogestureList] = useState<
+ Ecogesture[]
+ >([])
+ const [openEcogestureInitModal, setOpenEcogestureInitModal] = useState<
+ boolean
+ >(!haveSeenEcogestureModal)
- const handleChange = () => {
- value === 0 ? setValue(1) : setValue(0)
- }
+ const handleCloseEcogestureInitModal = useCallback(async () => {
+ dispatch(updateProfile({ haveSeenEcogestureModal: true }))
+ setOpenEcogestureInitModal(false)
+ //TODO go to tinder ecogesture
+ }, [dispatch])
+
+ const handleChange = useCallback(
+ (event: React.ChangeEvent<{}>, newValue: any) => {
+ event.preventDefault()
+ const params = new URLSearchParams()
+ params.append('tab', newValue.toString())
+ history.push({ search: params.toString() })
+ setTabValue(newValue)
+ },
+ [history]
+ )
- const tabProps = (index: number) => {
+ const tabProps = useCallback((index: number) => {
return {
id: `simple-tab-${index}`,
'aria-controls': `simple-tabpanel-${index}`,
}
- }
+ }, [])
+
+ const getLabel = useCallback(
+ (_tab: number) => {
+ return (
+ <>
+ {t(`ecogesture.title_tab_${_tab}`)}
+ <br></br>
+ {_tab === EcogestureStatus.OBJECTIVE &&
+ `(${objectiveEcogestureList.length})`}
+ {_tab === EcogestureStatus.DOING && `(${doingEcogestureList.length})`}
+ {_tab === EcogestureStatus.ALL && `(${allEcogestureList.length})`}
+ </>
+ )
+ },
+ [
+ allEcogestureList.length,
+ doingEcogestureList.length,
+ objectiveEcogestureList.length,
+ t,
+ ]
+ )
+
+ useEffect(() => {
+ let subscribed = true
+ async function loadEcogestures() {
+ const ecogestureService = new EcogestureService(client)
+ const dataAll = await ecogestureService.getAllEcogestures(getSeason())
+ if (subscribed && dataAll) {
+ const doing = dataAll.filter(ecogesture => ecogesture.doing === true)
+ const objective = dataAll.filter(
+ ecogesture => ecogesture.objective === true
+ )
+ setAllEcogestureList(dataAll)
+ setObjectiveEcogestureList(objective)
+ setDoingEcogestureList(doing)
+ }
+ setIsLoaded(true)
+ }
+ loadEcogestures()
+ return () => {
+ subscribed = false
+ }
+ }, [client, profileType])
return (
<>
<CozyBar titleKey={'common.title_ecogestures'} />
- <Header
- setHeaderHeight={defineHeaderHeight}
- desktopTitleKey={'common.title_ecogestures'}
- >
- <Tabs
- value={value}
- className="ecogestures-tabs"
- aria-label="ecogestures-tabs"
- onChange={handleChange}
- TabIndicatorProps={{ className: 'indicator-tab' }}
- centered={true}
- >
- <Tab
- label={t('ecogesture.title_tab_1')}
- className={classNames('single-tab', {
- ['active']: value === 0,
- })}
- {...tabProps(0)}
- ></Tab>
- <Tab
- label={t('ecogesture.title_tab_2')}
- className={classNames('single-tab', {
- ['active']: value === 1,
- })}
- {...tabProps(1)}
- ></Tab>
- </Tabs>
- </Header>
- <Content height={headerHeight}>
- <TabPanel value={value} index={0}>
- <EcogestureList filteredByProfile={false} />
- </TabPanel>
- <TabPanel value={value} index={1}>
- {profile.isProfileTypeCompleted ? (
- <EcogestureList
- filteredByProfile={true}
- profileType={profileType}
- />
- ) : (
- <EcogestureError />
- )}
- </TabPanel>
- </Content>
+ {!isLoaded ? (
+ <Content height={headerHeight}>
+ <div className="ecogesture-spinner" aria-busy="true">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ ) : (
+ <>
+ <Header
+ setHeaderHeight={defineHeaderHeight}
+ desktopTitleKey={'common.title_ecogestures'}
+ >
+ <Tabs
+ value={tabValue}
+ className="ecogestures-tabs"
+ aria-label="ecogestures-tabs"
+ onChange={handleChange}
+ TabIndicatorProps={{ className: 'indicator-tab' }}
+ centered={true}
+ >
+ <Tab
+ label={getLabel(EcogestureStatus.OBJECTIVE)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.OBJECTIVE,
+ })}
+ {...tabProps(EcogestureStatus.OBJECTIVE)}
+ ></Tab>
+ <Tab
+ label={getLabel(EcogestureStatus.DOING)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.DOING,
+ })}
+ {...tabProps(EcogestureStatus.DOING)}
+ ></Tab>
+ <Tab
+ label={getLabel(EcogestureStatus.ALL)}
+ className={classNames('single-tab', {
+ ['active']: tabValue === EcogestureStatus.ALL,
+ })}
+ {...tabProps(EcogestureStatus.ALL)}
+ ></Tab>
+ </Tabs>
+ </Header>
+ <Content height={headerHeight}>
+ <TabPanel value={tabValue} index={EcogestureStatus.OBJECTIVE}>
+ {objectiveEcogestureList.length ? (
+ <EcogestureList list={objectiveEcogestureList} />
+ ) : (
+ <EcogestureEmptyList setTab={setTabValue} isObjective={true} />
+ )}
+ </TabPanel>
+
+ <TabPanel value={tabValue} index={EcogestureStatus.DOING}>
+ {doingEcogestureList.length ? (
+ <EcogestureList list={doingEcogestureList} />
+ ) : (
+ <EcogestureEmptyList setTab={setTabValue} isObjective={false} />
+ )}
+ </TabPanel>
+ <TabPanel value={tabValue} index={EcogestureStatus.ALL}>
+ {allEcogestureList.length && (
+ <EcogestureList list={allEcogestureList} />
+ )}
+ </TabPanel>
+ </Content>
+ </>
+ )}
+ {openEcogestureInitModal && (
+ <EcogestureInitModal
+ open={openEcogestureInitModal}
+ handleCloseClick={handleCloseEcogestureInitModal}
+ />
+ )}
</>
)
}
diff --git a/src/components/Ecogesture/SingleEcogesture.spec.tsx b/src/components/Ecogesture/SingleEcogesture.spec.tsx
index f33822e810073aac9f631657df7488397888750a..8f45017fcaf5eb431b6a1d88e135d84c4bdc2df0 100644
--- a/src/components/Ecogesture/SingleEcogesture.spec.tsx
+++ b/src/components/Ecogesture/SingleEcogesture.spec.tsx
@@ -4,11 +4,11 @@ import { mount } from 'enzyme'
import { Provider } from 'react-redux'
import SingleEcogesture from 'components/Ecogesture/SingleEcogesture'
import toJson from 'enzyme-to-json'
-import { act } from 'react-dom/test-utils'
import { challengeStateData } from '../../../tests/__mocks__/challengeStateData.mock'
import { ecogesturesData } from '../../../tests/__mocks__/ecogesturesData.mock'
import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
+import { waitForComponentToPaint } from '../../../tests/__mocks__/testUtils'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -67,13 +67,15 @@ describe('SingleEcogesture component', () => {
const wrapper = mount(
<Provider store={store}>
- <SingleEcogesture match={{ params: { id: 'ECOGESTURE0001' } }} />
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
+ await waitForComponentToPaint(wrapper)
+
expect(toJson(wrapper)).toMatchSnapshot()
})
it('should change doing status', async () => {
@@ -87,20 +89,23 @@ describe('SingleEcogesture component', () => {
mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
mockImportIconbyId.mockReturnValue('')
const updatedEcogesture = { ...ecogesturesData[0], doing: true }
+ mockupdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
const wrapper = mount(
<Provider store={store}>
- <SingleEcogesture match={{ params: { id: 'ECOGESTURE0001' } }} />
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
+ await waitForComponentToPaint(wrapper)
wrapper
.find('.doing-btn')
.first()
.simulate('click')
+ await waitForComponentToPaint(wrapper)
expect(mockupdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
@@ -115,21 +120,56 @@ describe('SingleEcogesture component', () => {
mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
mockImportIconbyId.mockReturnValue('icontest')
const updatedEcogesture = { ...ecogesturesData[0], objective: true }
+ mockupdateEcogesture.mockResolvedValueOnce(updatedEcogesture)
const wrapper = mount(
<Provider store={store}>
- <SingleEcogesture match={{ params: { id: 'ECOGESTURE0001' } }} />
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
</Provider>
)
- await act(async () => {
- await new Promise(resolve => setTimeout(resolve))
- wrapper.update()
- })
+ await waitForComponentToPaint(wrapper)
+
wrapper
.find('.objective-btn')
.first()
.simulate('click')
-
+ await waitForComponentToPaint(wrapper)
expect(mockupdateEcogesture).toHaveBeenCalledWith(updatedEcogesture)
})
+ it('should toggle more details', async () => {
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ challenge: challengeStateData,
+ },
+ })
+
+ mockgetEcogesturesByIds.mockResolvedValue([ecogesturesData[0]])
+ mockImportIconbyId.mockReturnValue(undefined)
+
+ const wrapper = mount(
+ <Provider store={store}>
+ <SingleEcogesture
+ match={{
+ params: { id: 'ECOGESTURE0001' },
+ }}
+ />
+ </Provider>
+ )
+ await waitForComponentToPaint(wrapper)
+
+ wrapper
+ .find('.toggle-text')
+ .first()
+ .simulate('click')
+ await waitForComponentToPaint(wrapper)
+
+ expect(wrapper.find('.toggle-text').text()).toBe(
+ 'ecogesture_modal.show_less'
+ )
+ })
})
diff --git a/src/components/Ecogesture/SingleEcogesture.tsx b/src/components/Ecogesture/SingleEcogesture.tsx
index 4b1236c285ff69ff1f19014a2632b278e8f5d22e..96154c6c9c667603003ebb574e2bd079f663b76e 100644
--- a/src/components/Ecogesture/SingleEcogesture.tsx
+++ b/src/components/Ecogesture/SingleEcogesture.tsx
@@ -123,11 +123,16 @@ const SingleEcogesture: React.FC<SingleEcogestureProps> = ({
setValidExploration,
])
- return isLoading ? (
- <div className="loader-container">
- <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
- </div>
- ) : ecogesture ? (
+ if (isLoading) {
+ return (
+ <Content height={headerHeight}>
+ <div className="se-loader-container">
+ <StyledSpinner size="5em" fluidType={FluidType.MULTIFLUID} />
+ </div>
+ </Content>
+ )
+ }
+ return ecogesture ? (
<>
<CozyBar
titleKey={ecogesture && ecogesture.shortName}
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
index ea003d24e16c7e060da13f102d4f015f636618ad..67d64db1063b18850e5fae93aaf9785652fb26be 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureCard.spec.tsx.snap
@@ -86,7 +86,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = `
"render": [Function],
}
}
- to="/ecogestures/ECOGESTURE001"
+ to="/ecogesture/ECOGESTURE001"
>
<ForwardRef(Link)
className="ecogesture-list-item"
@@ -114,7 +114,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = `
"render": [Function],
}
}
- to="/ecogestures/ECOGESTURE001"
+ to="/ecogesture/ECOGESTURE001"
>
<WithStyles(ForwardRef(Typography))
className="MuiLink-root MuiLink-underlineHover ecogesture-list-item"
@@ -135,7 +135,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = `
}
onBlur={[Function]}
onFocus={[Function]}
- to="/ecogestures/ECOGESTURE001"
+ to="/ecogesture/ECOGESTURE001"
variant="inherit"
>
<ForwardRef(Typography)
@@ -191,25 +191,25 @@ exports[`EcogestureCard component should be rendered correctly 1`] = `
}
onBlur={[Function]}
onFocus={[Function]}
- to="/ecogestures/ECOGESTURE001"
+ to="/ecogesture/ECOGESTURE001"
variant="inherit"
>
<Link
className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
onBlur={[Function]}
onFocus={[Function]}
- to="/ecogestures/ECOGESTURE001"
+ to="/ecogesture/ECOGESTURE001"
>
<LinkAnchor
className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
- href="/ecogestures/ECOGESTURE001"
+ href="/ecogesture/ECOGESTURE001"
navigate={[Function]}
onBlur={[Function]}
onFocus={[Function]}
>
<a
className="MuiTypography-root MuiLink-root MuiLink-underlineHover ecogesture-list-item MuiTypography-colorPrimary"
- href="/ecogestures/ECOGESTURE001"
+ href="/ecogesture/ECOGESTURE001"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..dd45ee676b600e22e47fcbbc3852162321378196
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureEmptyList.spec.tsx.snap
@@ -0,0 +1,343 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureEmptyList component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureEmptyList
+ isObjective={true}
+ setTab={[MockFunction]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureInfoModal.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureInfoModal.spec.tsx.snap
deleted file mode 100644
index 5ce43e8fc2c4987aca0cbee221ce0a712f7b06e6..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/__snapshots__/EcogestureInfoModal.spec.tsx.snap
+++ /dev/null
@@ -1,853 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`EcogestureInfoModal component should be rendered correctly 1`] = `
-<EcogestureInfoModal
- handleCloseClick={[MockFunction]}
- open={true}
->
- <WithStyles(ForwardRef(Dialog))
- aria-labelledby="accessibility-title"
- classes={
- Object {
- "paper": "modal-paper",
- "root": "modal-root",
- }
- }
- onClose={[MockFunction]}
- open={true}
- >
- <ForwardRef(Dialog)
- aria-labelledby="accessibility-title"
- classes={
- Object {
- "container": "MuiDialog-container",
- "paper": "MuiDialog-paper modal-paper",
- "paperFullScreen": "MuiDialog-paperFullScreen",
- "paperFullWidth": "MuiDialog-paperFullWidth",
- "paperScrollBody": "MuiDialog-paperScrollBody",
- "paperScrollPaper": "MuiDialog-paperScrollPaper",
- "paperWidthFalse": "MuiDialog-paperWidthFalse",
- "paperWidthLg": "MuiDialog-paperWidthLg",
- "paperWidthMd": "MuiDialog-paperWidthMd",
- "paperWidthSm": "MuiDialog-paperWidthSm",
- "paperWidthXl": "MuiDialog-paperWidthXl",
- "paperWidthXs": "MuiDialog-paperWidthXs",
- "root": "MuiDialog-root modal-root",
- "scrollBody": "MuiDialog-scrollBody",
- "scrollPaper": "MuiDialog-scrollPaper",
- }
- }
- onClose={[MockFunction]}
- open={true}
- >
- <ForwardRef(Modal)
- BackdropComponent={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "Naked": Object {
- "$$typeof": Symbol(react.forward_ref),
- "propTypes": Object {
- "children": [Function],
- "className": [Function],
- "classes": [Function],
- "invisible": [Function],
- "open": [Function],
- "transitionDuration": [Function],
- },
- "render": [Function],
- },
- "displayName": "WithStyles(ForwardRef(Backdrop))",
- "options": Object {
- "defaultTheme": Object {
- "breakpoints": Object {
- "between": [Function],
- "down": [Function],
- "keys": Array [
- "xs",
- "sm",
- "md",
- "lg",
- "xl",
- ],
- "only": [Function],
- "up": [Function],
- "values": Object {
- "lg": 1280,
- "md": 960,
- "sm": 600,
- "xl": 1920,
- "xs": 0,
- },
- "width": [Function],
- },
- "direction": "ltr",
- "mixins": Object {
- "gutters": [Function],
- "toolbar": Object {
- "@media (min-width:0px) and (orientation: landscape)": Object {
- "minHeight": 48,
- },
- "@media (min-width:600px)": Object {
- "minHeight": 64,
- },
- "minHeight": 56,
- },
- },
- "overrides": Object {},
- "palette": Object {
- "action": Object {
- "active": "rgba(0, 0, 0, 0.54)",
- "disabled": "rgba(0, 0, 0, 0.26)",
- "disabledBackground": "rgba(0, 0, 0, 0.12)",
- "hover": "rgba(0, 0, 0, 0.08)",
- "hoverOpacity": 0.08,
- "selected": "rgba(0, 0, 0, 0.14)",
- },
- "augmentColor": [Function],
- "background": Object {
- "default": "#fafafa",
- "paper": "#fff",
- },
- "common": Object {
- "black": "#000",
- "white": "#fff",
- },
- "contrastThreshold": 3,
- "divider": "rgba(0, 0, 0, 0.12)",
- "error": Object {
- "contrastText": "#fff",
- "dark": "#d32f2f",
- "light": "#e57373",
- "main": "#f44336",
- },
- "getContrastText": [Function],
- "grey": Object {
- "100": "#f5f5f5",
- "200": "#eeeeee",
- "300": "#e0e0e0",
- "400": "#bdbdbd",
- "50": "#fafafa",
- "500": "#9e9e9e",
- "600": "#757575",
- "700": "#616161",
- "800": "#424242",
- "900": "#212121",
- "A100": "#d5d5d5",
- "A200": "#aaaaaa",
- "A400": "#303030",
- "A700": "#616161",
- },
- "info": Object {
- "contrastText": "#fff",
- "dark": "#1976d2",
- "light": "#64b5f6",
- "main": "#2196f3",
- },
- "primary": Object {
- "contrastText": "#fff",
- "dark": "#303f9f",
- "light": "#7986cb",
- "main": "#3f51b5",
- },
- "secondary": Object {
- "contrastText": "#fff",
- "dark": "#c51162",
- "light": "#ff4081",
- "main": "#f50057",
- },
- "success": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#388e3c",
- "light": "#81c784",
- "main": "#4caf50",
- },
- "text": Object {
- "disabled": "rgba(0, 0, 0, 0.38)",
- "hint": "rgba(0, 0, 0, 0.38)",
- "primary": "rgba(0, 0, 0, 0.87)",
- "secondary": "rgba(0, 0, 0, 0.54)",
- },
- "tonalOffset": 0.2,
- "type": "light",
- "warning": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#f57c00",
- "light": "#ffb74d",
- "main": "#ff9800",
- },
- },
- "props": Object {},
- "shadows": Array [
- "none",
- "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
- "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
- "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
- "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
- "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
- "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
- "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
- "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
- "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
- "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
- "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
- "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
- "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
- "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
- "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
- "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
- "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
- "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
- ],
- "shape": Object {
- "borderRadius": 4,
- },
- "spacing": [Function],
- "transitions": Object {
- "create": [Function],
- "duration": Object {
- "complex": 375,
- "enteringScreen": 225,
- "leavingScreen": 195,
- "short": 250,
- "shorter": 200,
- "shortest": 150,
- "standard": 300,
- },
- "easing": Object {
- "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
- "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
- "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
- "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
- },
- "getAutoHeightDuration": [Function],
- },
- "typography": Object {
- "body1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.5,
- },
- "body2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 400,
- "letterSpacing": "0.01071em",
- "lineHeight": 1.43,
- },
- "button": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.02857em",
- "lineHeight": 1.75,
- "textTransform": "uppercase",
- },
- "caption": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.03333em",
- "lineHeight": 1.66,
- },
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": 14,
- "fontWeightBold": 700,
- "fontWeightLight": 300,
- "fontWeightMedium": 500,
- "fontWeightRegular": 400,
- "h1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "6rem",
- "fontWeight": 300,
- "letterSpacing": "-0.01562em",
- "lineHeight": 1.167,
- },
- "h2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3.75rem",
- "fontWeight": 300,
- "letterSpacing": "-0.00833em",
- "lineHeight": 1.2,
- },
- "h3": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.167,
- },
- "h4": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "2.125rem",
- "fontWeight": 400,
- "letterSpacing": "0.00735em",
- "lineHeight": 1.235,
- },
- "h5": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.5rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.334,
- },
- "h6": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.25rem",
- "fontWeight": 500,
- "letterSpacing": "0.0075em",
- "lineHeight": 1.6,
- },
- "htmlFontSize": 16,
- "overline": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.08333em",
- "lineHeight": 2.66,
- "textTransform": "uppercase",
- },
- "pxToRem": [Function],
- "round": [Function],
- "subtitle1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.75,
- },
- "subtitle2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.00714em",
- "lineHeight": 1.57,
- },
- },
- "zIndex": Object {
- "appBar": 1100,
- "drawer": 1200,
- "mobileStepper": 1000,
- "modal": 1300,
- "snackbar": 1400,
- "speedDial": 1050,
- "tooltip": 1500,
- },
- },
- "name": "MuiBackdrop",
- },
- "propTypes": Object {
- "classes": [Function],
- "innerRef": [Function],
- },
- "render": [Function],
- "useStyles": [Function],
- }
- }
- BackdropProps={
- Object {
- "transitionDuration": Object {
- "enter": 225,
- "exit": 195,
- },
- }
- }
- className="MuiDialog-root modal-root"
- closeAfterTransition={true}
- disableBackdropClick={false}
- disableEscapeKeyDown={false}
- onClose={[MockFunction]}
- open={true}
- >
- <ForwardRef(Portal)
- disablePortal={false}
- >
- <Portal
- containerInfo={
- <body
- style="padding-right: 0px; overflow: hidden;"
- >
- <div
- class="MuiDialog-root modal-root"
- role="presentation"
- style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px;"
- >
- <div
- aria-hidden="true"
- class="MuiBackdrop-root"
- style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
- />
- <div
- data-test="sentinelStart"
- tabindex="0"
- />
- <div
- class="MuiDialog-container MuiDialog-scrollPaper"
- role="none presentation"
- style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
- tabindex="-1"
- >
- <div
- aria-labelledby="accessibility-title"
- class="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
- role="dialog"
- >
- <div
- id="accessibility-title"
- >
- ecogesture_info_modal.accessibility.window_title
- </div>
- <div
- class="info-header"
- >
- <svg
- class="styles__icon___23x3R"
- height="80"
- width="80"
- >
- <use
- xlink:href="#test-file-stub"
- />
- </svg>
- </div>
- <div
- class="info-content"
- >
- <div
- class="info-title text-20-bold"
- >
- ecogesture_info_modal.header
- </div>
- <div
- class="info-detail text-16-normal"
- >
- ecogesture_info_modal.text
- </div>
- <button
- aria-label="ecogesture_info_modal.accessibility.button_close"
- class="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
- tabindex="0"
- type="button"
- >
- <span
- class="MuiButton-label text-14-normal"
- >
- ecogesture_info_modal.button_close
- </span>
- <span
- class="MuiTouchRipple-root"
- />
- </button>
- </div>
- </div>
- </div>
- <div
- data-test="sentinelEnd"
- tabindex="0"
- />
- </div>
- </body>
- }
- >
- <div
- className="MuiDialog-root modal-root"
- onKeyDown={[Function]}
- role="presentation"
- style={
- Object {
- "bottom": 0,
- "left": 0,
- "position": "fixed",
- "right": 0,
- "top": 0,
- "zIndex": 1300,
- }
- }
- >
- <WithStyles(ForwardRef(Backdrop))
- onClick={[Function]}
- open={true}
- transitionDuration={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- >
- <ForwardRef(Backdrop)
- classes={
- Object {
- "invisible": "MuiBackdrop-invisible",
- "root": "MuiBackdrop-root",
- }
- }
- onClick={[Function]}
- open={true}
- transitionDuration={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- >
- <ForwardRef(Fade)
- in={true}
- onClick={[Function]}
- timeout={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- >
- <Transition
- appear={true}
- enter={true}
- exit={true}
- in={true}
- mountOnEnter={false}
- onClick={[Function]}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- timeout={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- unmountOnExit={false}
- >
- <div
- aria-hidden={true}
- className="MuiBackdrop-root"
- onClick={[Function]}
- style={
- Object {
- "opacity": 1,
- "visibility": undefined,
- }
- }
- />
- </Transition>
- </ForwardRef(Fade)>
- </ForwardRef(Backdrop)>
- </WithStyles(ForwardRef(Backdrop))>
- <TrapFocus
- disableAutoFocus={false}
- disableEnforceFocus={false}
- disableRestoreFocus={false}
- getDoc={[Function]}
- isEnabled={[Function]}
- open={true}
- >
- <div
- data-test="sentinelStart"
- tabIndex={0}
- />
- <ForwardRef(Fade)
- appear={true}
- in={true}
- onEnter={[Function]}
- onExited={[Function]}
- role="none presentation"
- tabIndex="-1"
- timeout={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- >
- <Transition
- appear={true}
- enter={true}
- exit={true}
- in={true}
- mountOnEnter={false}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- role="none presentation"
- tabIndex="-1"
- timeout={
- Object {
- "enter": 225,
- "exit": 195,
- }
- }
- unmountOnExit={false}
- >
- <div
- className="MuiDialog-container MuiDialog-scrollPaper"
- onClick={[Function]}
- onMouseDown={[Function]}
- role="none presentation"
- style={
- Object {
- "opacity": 1,
- "visibility": undefined,
- }
- }
- tabIndex="-1"
- >
- <WithStyles(ForwardRef(Paper))
- aria-labelledby="accessibility-title"
- className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
- elevation={24}
- role="dialog"
- >
- <ForwardRef(Paper)
- aria-labelledby="accessibility-title"
- className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
- classes={
- Object {
- "elevation0": "MuiPaper-elevation0",
- "elevation1": "MuiPaper-elevation1",
- "elevation10": "MuiPaper-elevation10",
- "elevation11": "MuiPaper-elevation11",
- "elevation12": "MuiPaper-elevation12",
- "elevation13": "MuiPaper-elevation13",
- "elevation14": "MuiPaper-elevation14",
- "elevation15": "MuiPaper-elevation15",
- "elevation16": "MuiPaper-elevation16",
- "elevation17": "MuiPaper-elevation17",
- "elevation18": "MuiPaper-elevation18",
- "elevation19": "MuiPaper-elevation19",
- "elevation2": "MuiPaper-elevation2",
- "elevation20": "MuiPaper-elevation20",
- "elevation21": "MuiPaper-elevation21",
- "elevation22": "MuiPaper-elevation22",
- "elevation23": "MuiPaper-elevation23",
- "elevation24": "MuiPaper-elevation24",
- "elevation3": "MuiPaper-elevation3",
- "elevation4": "MuiPaper-elevation4",
- "elevation5": "MuiPaper-elevation5",
- "elevation6": "MuiPaper-elevation6",
- "elevation7": "MuiPaper-elevation7",
- "elevation8": "MuiPaper-elevation8",
- "elevation9": "MuiPaper-elevation9",
- "outlined": "MuiPaper-outlined",
- "root": "MuiPaper-root",
- "rounded": "MuiPaper-rounded",
- }
- }
- elevation={24}
- role="dialog"
- >
- <div
- aria-labelledby="accessibility-title"
- className="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
- role="dialog"
- >
- <div
- id="accessibility-title"
- >
- ecogesture_info_modal.accessibility.window_title
- </div>
- <div
- className="info-header"
- >
- <Icon
- icon="test-file-stub"
- size={80}
- spin={false}
- >
- <Component
- className="styles__icon___23x3R"
- height={80}
- style={Object {}}
- width={80}
- >
- <svg
- className="styles__icon___23x3R"
- height={80}
- style={Object {}}
- width={80}
- >
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </div>
- <div
- className="info-content"
- >
- <div
- className="info-title text-20-bold"
- >
- ecogesture_info_modal.header
- </div>
- <div
- className="info-detail text-16-normal"
- >
- ecogesture_info_modal.text
- </div>
- <WithStyles(ForwardRef(Button))
- aria-label="ecogesture_info_modal.accessibility.button_close"
- classes={
- Object {
- "label": "text-14-normal",
- "root": "btn-secondary-negative",
- }
- }
- onClick={[MockFunction]}
- >
- <ForwardRef(Button)
- aria-label="ecogesture_info_modal.accessibility.button_close"
- classes={
- Object {
- "colorInherit": "MuiButton-colorInherit",
- "contained": "MuiButton-contained",
- "containedPrimary": "MuiButton-containedPrimary",
- "containedSecondary": "MuiButton-containedSecondary",
- "containedSizeLarge": "MuiButton-containedSizeLarge",
- "containedSizeSmall": "MuiButton-containedSizeSmall",
- "disableElevation": "MuiButton-disableElevation",
- "disabled": "Mui-disabled",
- "endIcon": "MuiButton-endIcon",
- "focusVisible": "Mui-focusVisible",
- "fullWidth": "MuiButton-fullWidth",
- "iconSizeLarge": "MuiButton-iconSizeLarge",
- "iconSizeMedium": "MuiButton-iconSizeMedium",
- "iconSizeSmall": "MuiButton-iconSizeSmall",
- "label": "MuiButton-label text-14-normal",
- "outlined": "MuiButton-outlined",
- "outlinedPrimary": "MuiButton-outlinedPrimary",
- "outlinedSecondary": "MuiButton-outlinedSecondary",
- "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
- "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
- "root": "MuiButton-root btn-secondary-negative",
- "sizeLarge": "MuiButton-sizeLarge",
- "sizeSmall": "MuiButton-sizeSmall",
- "startIcon": "MuiButton-startIcon",
- "text": "MuiButton-text",
- "textPrimary": "MuiButton-textPrimary",
- "textSecondary": "MuiButton-textSecondary",
- "textSizeLarge": "MuiButton-textSizeLarge",
- "textSizeSmall": "MuiButton-textSizeSmall",
- }
- }
- onClick={[MockFunction]}
- >
- <WithStyles(ForwardRef(ButtonBase))
- aria-label="ecogesture_info_modal.accessibility.button_close"
- className="MuiButton-root btn-secondary-negative MuiButton-text"
- component="button"
- disabled={false}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
- onClick={[MockFunction]}
- type="button"
- >
- <ForwardRef(ButtonBase)
- aria-label="ecogesture_info_modal.accessibility.button_close"
- className="MuiButton-root btn-secondary-negative MuiButton-text"
- classes={
- Object {
- "disabled": "Mui-disabled",
- "focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
- }
- }
- component="button"
- disabled={false}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
- onClick={[MockFunction]}
- type="button"
- >
- <button
- aria-label="ecogesture_info_modal.accessibility.button_close"
- className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text"
- disabled={false}
- onBlur={[Function]}
- onClick={[MockFunction]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- tabIndex={0}
- type="button"
- >
- <span
- className="MuiButton-label text-14-normal"
- >
- ecogesture_info_modal.button_close
- </span>
- <NoSsr>
- <WithStyles(memo)
- center={false}
- >
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
- >
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </button>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(Button)>
- </WithStyles(ForwardRef(Button))>
- </div>
- </div>
- </ForwardRef(Paper)>
- </WithStyles(ForwardRef(Paper))>
- </div>
- </Transition>
- </ForwardRef(Fade)>
- <div
- data-test="sentinelEnd"
- tabIndex={0}
- />
- </TrapFocus>
- </div>
- </Portal>
- </ForwardRef(Portal)>
- </ForwardRef(Modal)>
- </ForwardRef(Dialog)>
- </WithStyles(ForwardRef(Dialog))>
-</EcogestureInfoModal>
-`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..e5b3f77a52540cde009154744e6bfef336cdf21a
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureInitModal.spec.tsx.snap
@@ -0,0 +1,1144 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureInitModal component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureInitModal
+ handleCloseClick={[MockFunction]}
+ open={true}
+ >
+ <WithStyles(ForwardRef(Dialog))
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "paper": "modal-paper",
+ "root": "modal-root",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Dialog)
+ aria-labelledby="accessibility-title"
+ classes={
+ Object {
+ "container": "MuiDialog-container",
+ "paper": "MuiDialog-paper modal-paper",
+ "paperFullScreen": "MuiDialog-paperFullScreen",
+ "paperFullWidth": "MuiDialog-paperFullWidth",
+ "paperScrollBody": "MuiDialog-paperScrollBody",
+ "paperScrollPaper": "MuiDialog-paperScrollPaper",
+ "paperWidthFalse": "MuiDialog-paperWidthFalse",
+ "paperWidthLg": "MuiDialog-paperWidthLg",
+ "paperWidthMd": "MuiDialog-paperWidthMd",
+ "paperWidthSm": "MuiDialog-paperWidthSm",
+ "paperWidthXl": "MuiDialog-paperWidthXl",
+ "paperWidthXs": "MuiDialog-paperWidthXs",
+ "root": "MuiDialog-root modal-root",
+ "scrollBody": "MuiDialog-scrollBody",
+ "scrollPaper": "MuiDialog-scrollPaper",
+ }
+ }
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Modal)
+ BackdropComponent={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "Naked": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "children": [Function],
+ "className": [Function],
+ "classes": [Function],
+ "invisible": [Function],
+ "open": [Function],
+ "transitionDuration": [Function],
+ },
+ "render": [Function],
+ },
+ "displayName": "WithStyles(ForwardRef(Backdrop))",
+ "options": Object {
+ "defaultTheme": Object {
+ "breakpoints": Object {
+ "between": [Function],
+ "down": [Function],
+ "keys": Array [
+ "xs",
+ "sm",
+ "md",
+ "lg",
+ "xl",
+ ],
+ "only": [Function],
+ "up": [Function],
+ "values": Object {
+ "lg": 1280,
+ "md": 960,
+ "sm": 600,
+ "xl": 1920,
+ "xs": 0,
+ },
+ "width": [Function],
+ },
+ "direction": "ltr",
+ "mixins": Object {
+ "gutters": [Function],
+ "toolbar": Object {
+ "@media (min-width:0px) and (orientation: landscape)": Object {
+ "minHeight": 48,
+ },
+ "@media (min-width:600px)": Object {
+ "minHeight": 64,
+ },
+ "minHeight": 56,
+ },
+ },
+ "overrides": Object {},
+ "palette": Object {
+ "action": Object {
+ "active": "rgba(0, 0, 0, 0.54)",
+ "disabled": "rgba(0, 0, 0, 0.26)",
+ "disabledBackground": "rgba(0, 0, 0, 0.12)",
+ "hover": "rgba(0, 0, 0, 0.08)",
+ "hoverOpacity": 0.08,
+ "selected": "rgba(0, 0, 0, 0.14)",
+ },
+ "augmentColor": [Function],
+ "background": Object {
+ "default": "#fafafa",
+ "paper": "#fff",
+ },
+ "common": Object {
+ "black": "#000",
+ "white": "#fff",
+ },
+ "contrastThreshold": 3,
+ "divider": "rgba(0, 0, 0, 0.12)",
+ "error": Object {
+ "contrastText": "#fff",
+ "dark": "#d32f2f",
+ "light": "#e57373",
+ "main": "#f44336",
+ },
+ "getContrastText": [Function],
+ "grey": Object {
+ "100": "#f5f5f5",
+ "200": "#eeeeee",
+ "300": "#e0e0e0",
+ "400": "#bdbdbd",
+ "50": "#fafafa",
+ "500": "#9e9e9e",
+ "600": "#757575",
+ "700": "#616161",
+ "800": "#424242",
+ "900": "#212121",
+ "A100": "#d5d5d5",
+ "A200": "#aaaaaa",
+ "A400": "#303030",
+ "A700": "#616161",
+ },
+ "info": Object {
+ "contrastText": "#fff",
+ "dark": "#1976d2",
+ "light": "#64b5f6",
+ "main": "#2196f3",
+ },
+ "primary": Object {
+ "contrastText": "#fff",
+ "dark": "#303f9f",
+ "light": "#7986cb",
+ "main": "#3f51b5",
+ },
+ "secondary": Object {
+ "contrastText": "#fff",
+ "dark": "#c51162",
+ "light": "#ff4081",
+ "main": "#f50057",
+ },
+ "success": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#388e3c",
+ "light": "#81c784",
+ "main": "#4caf50",
+ },
+ "text": Object {
+ "disabled": "rgba(0, 0, 0, 0.38)",
+ "hint": "rgba(0, 0, 0, 0.38)",
+ "primary": "rgba(0, 0, 0, 0.87)",
+ "secondary": "rgba(0, 0, 0, 0.54)",
+ },
+ "tonalOffset": 0.2,
+ "type": "light",
+ "warning": Object {
+ "contrastText": "rgba(0, 0, 0, 0.87)",
+ "dark": "#f57c00",
+ "light": "#ffb74d",
+ "main": "#ff9800",
+ },
+ },
+ "props": Object {},
+ "shadows": Array [
+ "none",
+ "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
+ "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
+ "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
+ "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
+ "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
+ "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
+ "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
+ "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
+ "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
+ "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
+ "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
+ "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
+ "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
+ "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
+ "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
+ "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
+ "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
+ "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
+ "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
+ "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
+ "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
+ ],
+ "shape": Object {
+ "borderRadius": 4,
+ },
+ "spacing": [Function],
+ "transitions": Object {
+ "create": [Function],
+ "duration": Object {
+ "complex": 375,
+ "enteringScreen": 225,
+ "leavingScreen": 195,
+ "short": 250,
+ "shorter": 200,
+ "shortest": 150,
+ "standard": 300,
+ },
+ "easing": Object {
+ "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
+ "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
+ "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
+ "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
+ },
+ "getAutoHeightDuration": [Function],
+ },
+ "typography": Object {
+ "body1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.5,
+ },
+ "body2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.01071em",
+ "lineHeight": 1.43,
+ },
+ "button": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.02857em",
+ "lineHeight": 1.75,
+ "textTransform": "uppercase",
+ },
+ "caption": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.03333em",
+ "lineHeight": 1.66,
+ },
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": 14,
+ "fontWeightBold": 700,
+ "fontWeightLight": 300,
+ "fontWeightMedium": 500,
+ "fontWeightRegular": 400,
+ "h1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "6rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.01562em",
+ "lineHeight": 1.167,
+ },
+ "h2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3.75rem",
+ "fontWeight": 300,
+ "letterSpacing": "-0.00833em",
+ "lineHeight": 1.2,
+ },
+ "h3": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "3rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.167,
+ },
+ "h4": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "2.125rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00735em",
+ "lineHeight": 1.235,
+ },
+ "h5": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.5rem",
+ "fontWeight": 400,
+ "letterSpacing": "0em",
+ "lineHeight": 1.334,
+ },
+ "h6": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1.25rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.0075em",
+ "lineHeight": 1.6,
+ },
+ "htmlFontSize": 16,
+ "overline": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.75rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.08333em",
+ "lineHeight": 2.66,
+ "textTransform": "uppercase",
+ },
+ "pxToRem": [Function],
+ "round": [Function],
+ "subtitle1": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "1rem",
+ "fontWeight": 400,
+ "letterSpacing": "0.00938em",
+ "lineHeight": 1.75,
+ },
+ "subtitle2": Object {
+ "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
+ "fontSize": "0.875rem",
+ "fontWeight": 500,
+ "letterSpacing": "0.00714em",
+ "lineHeight": 1.57,
+ },
+ },
+ "zIndex": Object {
+ "appBar": 1100,
+ "drawer": 1200,
+ "mobileStepper": 1000,
+ "modal": 1300,
+ "snackbar": 1400,
+ "speedDial": 1050,
+ "tooltip": 1500,
+ },
+ },
+ "name": "MuiBackdrop",
+ },
+ "propTypes": Object {
+ "classes": [Function],
+ "innerRef": [Function],
+ },
+ "render": [Function],
+ "useStyles": [Function],
+ }
+ }
+ BackdropProps={
+ Object {
+ "transitionDuration": Object {
+ "enter": 225,
+ "exit": 195,
+ },
+ }
+ }
+ className="MuiDialog-root modal-root"
+ closeAfterTransition={true}
+ disableBackdropClick={false}
+ disableEscapeKeyDown={false}
+ onClose={[MockFunction]}
+ open={true}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body
+ style="padding-right: 0px; overflow: hidden;"
+ >
+ <div
+ class="MuiDialog-root modal-root"
+ role="presentation"
+ style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px;"
+ >
+ <div
+ aria-hidden="true"
+ class="MuiBackdrop-root"
+ style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
+ />
+ <div
+ data-test="sentinelStart"
+ tabindex="0"
+ />
+ <div
+ class="MuiDialog-container MuiDialog-scrollPaper"
+ role="none presentation"
+ style="opacity: 1; webkit-transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;"
+ tabindex="-1"
+ >
+ <div
+ aria-labelledby="accessibility-title"
+ class="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ id="accessibility-title"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <button
+ aria-label="feedback.accessibility.button_close"
+ class="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <svg
+ class="styles__icon___23x3R"
+ height="16"
+ width="16"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <div
+ class="eg-init-modal"
+ >
+ <div
+ class="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ class="text-16-normal text"
+ >
+ ecogesture.initModal.text1
+ </div>
+ <div
+ class="text-16-normal text"
+ >
+ ecogesture.initModal.text2
+ </div>
+ <div
+ class="buttons-container"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn1"
+ class="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn1
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ class="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
+ }
+ >
+ <div
+ className="MuiDialog-root modal-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "zIndex": 1300,
+ }
+ }
+ >
+ <WithStyles(ForwardRef(Backdrop))
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Backdrop)
+ classes={
+ Object {
+ "invisible": "MuiBackdrop-invisible",
+ "root": "MuiBackdrop-root",
+ }
+ }
+ onClick={[Function]}
+ open={true}
+ transitionDuration={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <ForwardRef(Fade)
+ in={true}
+ onClick={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onClick={[Function]}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ aria-hidden={true}
+ className="MuiBackdrop-root"
+ onClick={[Function]}
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ />
+ </Transition>
+ </ForwardRef(Fade)>
+ </ForwardRef(Backdrop)>
+ </WithStyles(ForwardRef(Backdrop))>
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={true}
+ >
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Fade)
+ appear={true}
+ in={true}
+ onEnter={[Function]}
+ onExited={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ >
+ <Transition
+ appear={true}
+ enter={true}
+ exit={true}
+ in={true}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
+ role="none presentation"
+ tabIndex="-1"
+ timeout={
+ Object {
+ "enter": 225,
+ "exit": 195,
+ }
+ }
+ unmountOnExit={false}
+ >
+ <div
+ className="MuiDialog-container MuiDialog-scrollPaper"
+ onClick={[Function]}
+ onMouseDown={[Function]}
+ role="none presentation"
+ style={
+ Object {
+ "opacity": 1,
+ "visibility": undefined,
+ }
+ }
+ tabIndex="-1"
+ >
+ <WithStyles(ForwardRef(Paper))
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ elevation={24}
+ role="dialog"
+ >
+ <ForwardRef(Paper)
+ aria-labelledby="accessibility-title"
+ className="MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={24}
+ role="dialog"
+ >
+ <div
+ aria-labelledby="accessibility-title"
+ className="MuiPaper-root MuiDialog-paper modal-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthSm MuiPaper-elevation24 MuiPaper-rounded"
+ role="dialog"
+ >
+ <div
+ id="accessibility-title"
+ >
+ feedback.accessibility.window_title
+ </div>
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="feedback.accessibility.button_close"
+ className="modal-paper-close-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="feedback.accessibility.button_close"
+ centerRipple={true}
+ className="MuiIconButton-root modal-paper-close-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[MockFunction]}
+ >
+ <button
+ aria-label="feedback.accessibility.button_close"
+ className="MuiButtonBase-root MuiIconButton-root modal-paper-close-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <Icon
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ <div
+ className="eg-init-modal"
+ >
+ <div
+ className="title text-20-bold"
+ >
+ ecogesture.initModal.title
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.initModal.text1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.initModal.text2
+ </div>
+ <div
+ className="buttons-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.initModal.btn1"
+ className="btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.initModal.btn1"
+ className="btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-text btn1"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-profile-next rounded",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.initModal.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-profile-next rounded",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[MockFunction]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButton-root btn-profile-next rounded MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[MockFunction]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.initModal.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-profile-next rounded MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[MockFunction]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.initModal.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </div>
+ </Transition>
+ </ForwardRef(Fade)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Dialog)>
+ </WithStyles(ForwardRef(Dialog))>
+ </EcogestureInitModal>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
index e828213acd413bbff53e93fe255a8e68c666f799..5bd3246cad019983124174b143d715035d9491a3 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureList.spec.tsx.snap
@@ -13,571 +13,637 @@ exports[`EcogesturesList component should be rendered correctly 1`] = `
}
}
>
- <EcogestureList
- filteredByProfile={false}
- >
- <div
- className="ecogesture-root"
+ <BrowserRouter>
+ <Router
+ history={
+ Object {
+ "action": "POP",
+ "block": [Function],
+ "createHref": [Function],
+ "go": [Function],
+ "goBack": [Function],
+ "goForward": [Function],
+ "length": 1,
+ "listen": [Function],
+ "location": Object {
+ "hash": "",
+ "pathname": "/",
+ "search": "",
+ "state": undefined,
+ },
+ "push": [Function],
+ "replace": [Function],
+ }
+ }
>
- <div
- className="efficiency-button-content"
+ <EcogestureList
+ list={
+ Array [
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ },
+ Object {
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 0,
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à l'intérieur. Le climatiseur n'est pas là pour refroidir la rue mais bien la pièce.",
+ "longName": "Je ferme mes fenêtres quand la climatisation est en marche",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
+ },
+ Object {
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 4,
+ 5,
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "Utilisez la température la plus basse possible : de nombreux produits nettoyants sont efficaces à froid et un cycle à 90 °C consomme 3 fois plus d'énergie qu'un lavage à 40 °C. En effet, 80 % de l'énergie consommée par un lave-linge ou un lave-vaisselle sert au chauffage de l'eau ! Que ce soit pour la vaisselle ou le linge, les programmes de lavage intensif consomment jusqu'à 40 % de plus. Si possible, rincez à l'eau froide : la température de rinçage n'a pas d'effet sur le nettoyage du linge ou de la vaisselle. Attention cependant avec les tissus qui peuvent rétrécir : ce qui fait rétrécir, c'est le passage d'une température à une autre. Mieux vaut alors faire le cycle complet à l'eau froide pour les premiers lavages de tissus sensibles. Pour du linge ou de la vaisselle peu sales, utilisez la touche \\"Eco\\". Elle réduit la température de lavage et allonge sa durée (c’est le chauffage de l’eau qui consomme le plus). Vous économiserez jusqu’à 45 % par rapport aux cycles longs. Néanmoins, pour vous prémunir contre les bouchons de graisse dans les canalisations, faites quand même un cycle à chaud une fois par mois environ.",
+ "longName": "J’utilise le plus souvent les cycles courts à basse température pour laver le linge et la vaisselle.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
+ },
+ ]
+ }
>
<div
- className="filters text-16-normal"
+ className="ecogesture-root"
>
<div
- className="filter-button"
- onBlur={[Function]}
- onClick={[Function]}
- tabIndex={0}
+ className="efficiency-button-content"
>
- <WithStyles(ForwardRef(Button))
- aria-controls="simple-menu"
- aria-haspopup="true"
- aria-label="ecogesture.MENU_TITLE"
- classes={
- Object {
- "label": "text-14-normal",
- "root": "btn-secondary-negative",
- }
- }
- onClick={[Function]}
- variant="contained"
+ <div
+ className="filters text-16-normal"
>
- <ForwardRef(Button)
- aria-controls="simple-menu"
- aria-haspopup="true"
- aria-label="ecogesture.MENU_TITLE"
- classes={
- Object {
- "colorInherit": "MuiButton-colorInherit",
- "contained": "MuiButton-contained",
- "containedPrimary": "MuiButton-containedPrimary",
- "containedSecondary": "MuiButton-containedSecondary",
- "containedSizeLarge": "MuiButton-containedSizeLarge",
- "containedSizeSmall": "MuiButton-containedSizeSmall",
- "disableElevation": "MuiButton-disableElevation",
- "disabled": "Mui-disabled",
- "endIcon": "MuiButton-endIcon",
- "focusVisible": "Mui-focusVisible",
- "fullWidth": "MuiButton-fullWidth",
- "iconSizeLarge": "MuiButton-iconSizeLarge",
- "iconSizeMedium": "MuiButton-iconSizeMedium",
- "iconSizeSmall": "MuiButton-iconSizeSmall",
- "label": "MuiButton-label text-14-normal",
- "outlined": "MuiButton-outlined",
- "outlinedPrimary": "MuiButton-outlinedPrimary",
- "outlinedSecondary": "MuiButton-outlinedSecondary",
- "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
- "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
- "root": "MuiButton-root btn-secondary-negative",
- "sizeLarge": "MuiButton-sizeLarge",
- "sizeSmall": "MuiButton-sizeSmall",
- "startIcon": "MuiButton-startIcon",
- "text": "MuiButton-text",
- "textPrimary": "MuiButton-textPrimary",
- "textSecondary": "MuiButton-textSecondary",
- "textSizeLarge": "MuiButton-textSizeLarge",
- "textSizeSmall": "MuiButton-textSizeSmall",
- }
- }
+ <div
+ className="filter-button"
+ onBlur={[Function]}
onClick={[Function]}
- variant="contained"
+ tabIndex={0}
>
- <WithStyles(ForwardRef(ButtonBase))
+ <WithStyles(ForwardRef(Button))
aria-controls="simple-menu"
aria-haspopup="true"
aria-label="ecogesture.MENU_TITLE"
- className="MuiButton-root btn-secondary-negative MuiButton-contained"
- component="button"
- disabled={false}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
+ classes={
+ Object {
+ "label": "text-14-normal",
+ "root": "btn-secondary-negative",
+ }
+ }
onClick={[Function]}
- type="button"
+ variant="contained"
>
- <ForwardRef(ButtonBase)
+ <ForwardRef(Button)
aria-controls="simple-menu"
aria-haspopup="true"
aria-label="ecogesture.MENU_TITLE"
- className="MuiButton-root btn-secondary-negative MuiButton-contained"
classes={
Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
"disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-14-normal",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
}
}
- component="button"
- disabled={false}
- focusRipple={true}
- focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- type="button"
+ variant="contained"
>
- <button
+ <WithStyles(ForwardRef(ButtonBase))
aria-controls="simple-menu"
aria-haspopup="true"
aria-label="ecogesture.MENU_TITLE"
- className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-contained"
+ className="MuiButton-root btn-secondary-negative MuiButton-contained"
+ component="button"
disabled={false}
- onBlur={[Function]}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
- tabIndex={0}
type="button"
>
- <span
- className="MuiButton-label text-14-normal"
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ className="MuiButton-root btn-secondary-negative MuiButton-contained"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
>
- <StyledIcon
- icon="test-file-stub"
- size={20}
+ <button
+ aria-controls="simple-menu"
+ aria-haspopup="true"
+ aria-label="ecogesture.MENU_TITLE"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative MuiButton-contained"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
>
- <Icon
- aria-hidden={true}
- icon="test-file-stub"
- size={20}
- spin={false}
+ <span
+ className="MuiButton-label text-14-normal"
>
- <Component
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={20}
- style={Object {}}
- width={20}
+ <StyledIcon
+ icon="test-file-stub"
+ size={20}
>
- <svg
+ <Icon
aria-hidden={true}
- className="styles__icon___23x3R"
- height={20}
- style={Object {}}
- width={20}
+ icon="test-file-stub"
+ size={20}
+ spin={false}
>
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </StyledIcon>
- <span
- className="ecogestures"
- >
- ecogesture.MENU_TITLE
- </span>
- </span>
- <NoSsr>
- <WithStyles(memo)
- center={false}
- >
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={20}
+ style={Object {}}
+ width={20}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={20}
+ style={Object {}}
+ width={20}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
<span
- className="MuiTouchRipple-root"
+ className="ecogestures"
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
+ ecogesture.MENU_TITLE
</span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </button>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(Button)>
- </WithStyles(ForwardRef(Button))>
- <WithStyles(ForwardRef(Menu))
- MenuListProps={
- Object {
- "className": "filter-menu-list",
- }
- }
- PopoverClasses={
- Object {
- "paper": "filter-menu",
- }
- }
- anchorEl={null}
- keepMounted={true}
- onClose={[Function]}
- open={false}
- variant="menu"
- >
- <ForwardRef(Menu)
- MenuListProps={
- Object {
- "className": "filter-menu-list",
- }
- }
- PopoverClasses={
- Object {
- "paper": "filter-menu",
- }
- }
- anchorEl={null}
- classes={
- Object {
- "list": "MuiMenu-list",
- "paper": "MuiMenu-paper",
- }
- }
- keepMounted={true}
- onClose={[Function]}
- open={false}
- variant="menu"
- >
- <WithStyles(ForwardRef(Popover))
- PaperProps={
- Object {
- "classes": Object {
- "root": "MuiMenu-paper",
- },
- }
- }
- anchorEl={null}
- anchorOrigin={
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Menu))
+ MenuListProps={
Object {
- "horizontal": "left",
- "vertical": "top",
+ "className": "filter-menu-list",
}
}
- classes={
+ PopoverClasses={
Object {
"paper": "filter-menu",
}
}
- getContentAnchorEl={[Function]}
+ anchorEl={null}
keepMounted={true}
onClose={[Function]}
- onEntering={[Function]}
open={false}
- transformOrigin={
- Object {
- "horizontal": "left",
- "vertical": "top",
- }
- }
- transitionDuration="auto"
+ variant="menu"
>
- <ForwardRef(Popover)
- PaperProps={
+ <ForwardRef(Menu)
+ MenuListProps={
Object {
- "classes": Object {
- "root": "MuiMenu-paper",
- },
+ "className": "filter-menu-list",
}
}
- anchorEl={null}
- anchorOrigin={
+ PopoverClasses={
Object {
- "horizontal": "left",
- "vertical": "top",
+ "paper": "filter-menu",
}
}
+ anchorEl={null}
classes={
Object {
- "paper": "MuiPopover-paper filter-menu",
- "root": "MuiPopover-root",
+ "list": "MuiMenu-list",
+ "paper": "MuiMenu-paper",
}
}
- getContentAnchorEl={[Function]}
keepMounted={true}
onClose={[Function]}
- onEntering={[Function]}
open={false}
- transformOrigin={
- Object {
- "horizontal": "left",
- "vertical": "top",
- }
- }
- transitionDuration="auto"
+ variant="menu"
>
- <ForwardRef(Modal)
- BackdropProps={
+ <WithStyles(ForwardRef(Popover))
+ PaperProps={
+ Object {
+ "classes": Object {
+ "root": "MuiMenu-paper",
+ },
+ }
+ }
+ anchorEl={null}
+ anchorOrigin={
Object {
- "invisible": true,
+ "horizontal": "left",
+ "vertical": "top",
}
}
- className="MuiPopover-root"
+ classes={
+ Object {
+ "paper": "filter-menu",
+ }
+ }
+ getContentAnchorEl={[Function]}
keepMounted={true}
onClose={[Function]}
+ onEntering={[Function]}
open={false}
+ transformOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ transitionDuration="auto"
>
- <ForwardRef(Portal)
- disablePortal={false}
+ <ForwardRef(Popover)
+ PaperProps={
+ Object {
+ "classes": Object {
+ "root": "MuiMenu-paper",
+ },
+ }
+ }
+ anchorEl={null}
+ anchorOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ classes={
+ Object {
+ "paper": "MuiPopover-paper filter-menu",
+ "root": "MuiPopover-root",
+ }
+ }
+ getContentAnchorEl={[Function]}
+ keepMounted={true}
+ onClose={[Function]}
+ onEntering={[Function]}
+ open={false}
+ transformOrigin={
+ Object {
+ "horizontal": "left",
+ "vertical": "top",
+ }
+ }
+ transitionDuration="auto"
>
- <Portal
- containerInfo={
- <body>
- <div
- aria-hidden="true"
- class="MuiPopover-root"
- role="presentation"
- style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px; visibility: hidden;"
- >
- <div
- data-test="sentinelStart"
- tabindex="0"
- />
- <div
- class="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
- style="opacity: 0; transform: scale(0.75, 0.5625); visibility: hidden;"
- tabindex="-1"
- >
- <ul
- class="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
- role="menu"
- tabindex="-1"
+ <ForwardRef(Modal)
+ BackdropProps={
+ Object {
+ "invisible": true,
+ }
+ }
+ className="MuiPopover-root"
+ keepMounted={true}
+ onClose={[Function]}
+ open={false}
+ >
+ <ForwardRef(Portal)
+ disablePortal={false}
+ >
+ <Portal
+ containerInfo={
+ <body>
+ <div
+ aria-hidden="true"
+ class="MuiPopover-root"
+ role="presentation"
+ style="position: fixed; z-index: 1300; right: 0px; bottom: 0px; top: 0px; left: 0px; visibility: hidden;"
>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
- role="menuitem"
+ <div
+ data-test="sentinelStart"
+ tabindex="0"
+ />
+ <div
+ class="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
+ style="opacity: 0; transform: scale(0.75, 0.5625); visibility: hidden;"
tabindex="-1"
>
- ecogesture.ALL
- <div
- class="MuiListItemIcon-root filter-menu-icon"
+ <ul
+ class="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
+ role="menu"
+ tabindex="-1"
>
- <svg
- aria-hidden="true"
- class="styles__icon___23x3R"
- height="13"
- width="13"
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ role="menuitem"
+ tabindex="-1"
>
- <use
- xlink:href="#test-file-stub"
+ ecogesture.ALL
+ <div
+ class="MuiListItemIcon-root filter-menu-icon"
+ >
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="13"
+ width="13"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ </div>
+ <span
+ class="MuiTouchRipple-root"
/>
- </svg>
- </div>
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.HEATING
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.AIR_CONDITIONING
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.ECS
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.COLD_WATER
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.ELECTRICITY_SPECIFIC
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- <li
- aria-disabled="false"
- class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- role="menuitem"
- tabindex="-1"
- >
- ecogesture.COOKING
- <span
- class="MuiTouchRipple-root"
- />
- </li>
- </ul>
- </div>
- <div
- data-test="sentinelEnd"
- tabindex="0"
- />
- </div>
- </body>
- }
- >
- <div
- className="MuiPopover-root"
- onKeyDown={[Function]}
- role="presentation"
- style={
- Object {
- "bottom": 0,
- "left": 0,
- "position": "fixed",
- "right": 0,
- "top": 0,
- "visibility": "hidden",
- "zIndex": 1300,
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.HEATING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.AIR_CONDITIONING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.ECS
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.COLD_WATER
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.ELECTRICITY_SPECIFIC
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ <li
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ ecogesture.COOKING
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </li>
+ </ul>
+ </div>
+ <div
+ data-test="sentinelEnd"
+ tabindex="0"
+ />
+ </div>
+ </body>
}
- }
- >
- <ForwardRef(SimpleBackdrop)
- invisible={true}
- onClick={[Function]}
- open={false}
- />
- <TrapFocus
- disableAutoFocus={false}
- disableEnforceFocus={false}
- disableRestoreFocus={false}
- getDoc={[Function]}
- isEnabled={[Function]}
- open={false}
>
<div
- data-test="sentinelStart"
- tabIndex={0}
- />
- <ForwardRef(Grow)
- appear={true}
- in={false}
- onEnter={[Function]}
- onEntering={[Function]}
- onExited={[Function]}
- tabIndex="-1"
- timeout="auto"
+ className="MuiPopover-root"
+ onKeyDown={[Function]}
+ role="presentation"
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "fixed",
+ "right": 0,
+ "top": 0,
+ "visibility": "hidden",
+ "zIndex": 1300,
+ }
+ }
>
- <Transition
- addEndListener={[Function]}
- appear={true}
- enter={true}
- exit={true}
- in={false}
- mountOnEnter={false}
- onEnter={[Function]}
- onEntered={[Function]}
- onEntering={[Function]}
- onExit={[Function]}
- onExited={[Function]}
- onExiting={[Function]}
- tabIndex="-1"
- timeout={null}
- unmountOnExit={false}
+ <ForwardRef(SimpleBackdrop)
+ invisible={true}
+ onClick={[Function]}
+ open={false}
+ />
+ <TrapFocus
+ disableAutoFocus={false}
+ disableEnforceFocus={false}
+ disableRestoreFocus={false}
+ getDoc={[Function]}
+ isEnabled={[Function]}
+ open={false}
>
- <WithStyles(ForwardRef(Paper))
- className="MuiPopover-paper filter-menu"
- classes={
- Object {
- "root": "MuiMenu-paper",
- }
- }
- elevation={8}
- style={
- Object {
- "opacity": 0,
- "transform": "scale(0.75, 0.5625)",
- "visibility": "hidden",
- }
- }
+ <div
+ data-test="sentinelStart"
+ tabIndex={0}
+ />
+ <ForwardRef(Grow)
+ appear={true}
+ in={false}
+ onEnter={[Function]}
+ onEntering={[Function]}
+ onExited={[Function]}
tabIndex="-1"
+ timeout="auto"
>
- <ForwardRef(Paper)
- className="MuiPopover-paper filter-menu"
- classes={
- Object {
- "elevation0": "MuiPaper-elevation0",
- "elevation1": "MuiPaper-elevation1",
- "elevation10": "MuiPaper-elevation10",
- "elevation11": "MuiPaper-elevation11",
- "elevation12": "MuiPaper-elevation12",
- "elevation13": "MuiPaper-elevation13",
- "elevation14": "MuiPaper-elevation14",
- "elevation15": "MuiPaper-elevation15",
- "elevation16": "MuiPaper-elevation16",
- "elevation17": "MuiPaper-elevation17",
- "elevation18": "MuiPaper-elevation18",
- "elevation19": "MuiPaper-elevation19",
- "elevation2": "MuiPaper-elevation2",
- "elevation20": "MuiPaper-elevation20",
- "elevation21": "MuiPaper-elevation21",
- "elevation22": "MuiPaper-elevation22",
- "elevation23": "MuiPaper-elevation23",
- "elevation24": "MuiPaper-elevation24",
- "elevation3": "MuiPaper-elevation3",
- "elevation4": "MuiPaper-elevation4",
- "elevation5": "MuiPaper-elevation5",
- "elevation6": "MuiPaper-elevation6",
- "elevation7": "MuiPaper-elevation7",
- "elevation8": "MuiPaper-elevation8",
- "elevation9": "MuiPaper-elevation9",
- "outlined": "MuiPaper-outlined",
- "root": "MuiPaper-root MuiMenu-paper",
- "rounded": "MuiPaper-rounded",
- }
- }
- elevation={8}
- style={
- Object {
- "opacity": 0,
- "transform": "scale(0.75, 0.5625)",
- "visibility": "hidden",
- }
- }
+ <Transition
+ addEndListener={[Function]}
+ appear={true}
+ enter={true}
+ exit={true}
+ in={false}
+ mountOnEnter={false}
+ onEnter={[Function]}
+ onEntered={[Function]}
+ onEntering={[Function]}
+ onExit={[Function]}
+ onExited={[Function]}
+ onExiting={[Function]}
tabIndex="-1"
+ timeout={null}
+ unmountOnExit={false}
>
- <div
- className="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
+ <WithStyles(ForwardRef(Paper))
+ className="MuiPopover-paper filter-menu"
+ classes={
+ Object {
+ "root": "MuiMenu-paper",
+ }
+ }
+ elevation={8}
style={
Object {
"opacity": 0,
@@ -587,1563 +653,1297 @@ exports[`EcogesturesList component should be rendered correctly 1`] = `
}
tabIndex="-1"
>
- <ForwardRef(MenuList)
- actions={
+ <ForwardRef(Paper)
+ className="MuiPopover-paper filter-menu"
+ classes={
+ Object {
+ "elevation0": "MuiPaper-elevation0",
+ "elevation1": "MuiPaper-elevation1",
+ "elevation10": "MuiPaper-elevation10",
+ "elevation11": "MuiPaper-elevation11",
+ "elevation12": "MuiPaper-elevation12",
+ "elevation13": "MuiPaper-elevation13",
+ "elevation14": "MuiPaper-elevation14",
+ "elevation15": "MuiPaper-elevation15",
+ "elevation16": "MuiPaper-elevation16",
+ "elevation17": "MuiPaper-elevation17",
+ "elevation18": "MuiPaper-elevation18",
+ "elevation19": "MuiPaper-elevation19",
+ "elevation2": "MuiPaper-elevation2",
+ "elevation20": "MuiPaper-elevation20",
+ "elevation21": "MuiPaper-elevation21",
+ "elevation22": "MuiPaper-elevation22",
+ "elevation23": "MuiPaper-elevation23",
+ "elevation24": "MuiPaper-elevation24",
+ "elevation3": "MuiPaper-elevation3",
+ "elevation4": "MuiPaper-elevation4",
+ "elevation5": "MuiPaper-elevation5",
+ "elevation6": "MuiPaper-elevation6",
+ "elevation7": "MuiPaper-elevation7",
+ "elevation8": "MuiPaper-elevation8",
+ "elevation9": "MuiPaper-elevation9",
+ "outlined": "MuiPaper-outlined",
+ "root": "MuiPaper-root MuiMenu-paper",
+ "rounded": "MuiPaper-rounded",
+ }
+ }
+ elevation={8}
+ style={
Object {
- "current": Object {
- "adjustStyleForScrollbar": [Function],
- },
+ "opacity": 0,
+ "transform": "scale(0.75, 0.5625)",
+ "visibility": "hidden",
}
}
- autoFocus={false}
- autoFocusItem={false}
- className="MuiMenu-list filter-menu-list"
- onKeyDown={[Function]}
- variant="menu"
+ tabIndex="-1"
>
- <WithStyles(ForwardRef(List))
- className="MuiMenu-list filter-menu-list"
- onKeyDown={[Function]}
- role="menu"
- tabIndex={-1}
+ <div
+ className="MuiPaper-root MuiMenu-paper MuiPopover-paper filter-menu MuiPaper-elevation8 MuiPaper-rounded"
+ style={
+ Object {
+ "opacity": 0,
+ "transform": "scale(0.75, 0.5625)",
+ "visibility": "hidden",
+ }
+ }
+ tabIndex="-1"
>
- <ForwardRef(List)
- className="MuiMenu-list filter-menu-list"
- classes={
+ <ForwardRef(MenuList)
+ actions={
Object {
- "dense": "MuiList-dense",
- "padding": "MuiList-padding",
- "root": "MuiList-root",
- "subheader": "MuiList-subheader",
+ "current": Object {
+ "adjustStyleForScrollbar": [Function],
+ },
}
}
+ autoFocus={false}
+ autoFocusItem={false}
+ className="MuiMenu-list filter-menu-list"
onKeyDown={[Function]}
- role="menu"
- tabIndex={-1}
+ variant="menu"
>
- <ul
- className="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
+ <WithStyles(ForwardRef(List))
+ className="MuiMenu-list filter-menu-list"
onKeyDown={[Function]}
role="menu"
tabIndex={-1}
>
- <WithStyles(ForwardRef(MenuItem))
+ <ForwardRef(List)
+ className="MuiMenu-list filter-menu-list"
classes={
Object {
- "root": "item-active",
+ "dense": "MuiList-dense",
+ "padding": "MuiList-padding",
+ "root": "MuiList-root",
+ "subheader": "MuiList-subheader",
}
}
- key=".$.$0"
- onClick={[Function]}
- selected={true}
+ onKeyDown={[Function]}
+ role="menu"
+ tabIndex={-1}
>
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root item-active",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={true}
+ <ul
+ className="MuiList-root MuiMenu-list filter-menu-list MuiList-padding"
+ onKeyDown={[Function]}
+ role="menu"
+ tabIndex={-1}
>
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "item-active",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$0"
onClick={[Function]}
- role="menuitem"
selected={true}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root item-active",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={true}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={true}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={true}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.ALL
- <WithStyles(ForwardRef(ListItemIcon))
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
classes={
Object {
- "root": "filter-menu-icon",
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
}
}
- key=".1"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(ListItemIcon)
- classes={
- Object {
- "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
- "root": "MuiListItemIcon-root filter-menu-icon",
- }
- }
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root item-active Mui-selected MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button Mui-selected"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <div
- className="MuiListItemIcon-root filter-menu-icon"
+ ecogesture.ALL
+ <WithStyles(ForwardRef(ListItemIcon))
+ classes={
+ Object {
+ "root": "filter-menu-icon",
+ }
+ }
+ key=".1"
>
- <StyledIcon
- icon="test-file-stub"
- size={13}
+ <ForwardRef(ListItemIcon)
+ classes={
+ Object {
+ "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
+ "root": "MuiListItemIcon-root filter-menu-icon",
+ }
+ }
>
- <Icon
- aria-hidden={true}
- icon="test-file-stub"
- size={13}
- spin={false}
+ <div
+ className="MuiListItemIcon-root filter-menu-icon"
>
- <Component
- aria-hidden={true}
- className="styles__icon___23x3R"
- height={13}
- style={Object {}}
- width={13}
+ <StyledIcon
+ icon="test-file-stub"
+ size={13}
>
- <svg
+ <Icon
aria-hidden={true}
- className="styles__icon___23x3R"
- height={13}
- style={Object {}}
- width={13}
+ icon="test-file-stub"
+ size={13}
+ spin={false}
>
- <use
- xlinkHref="#test-file-stub"
- />
- </svg>
- </Component>
- </Icon>
- </StyledIcon>
- </div>
- </ForwardRef(ListItemIcon)>
- </WithStyles(ForwardRef(ListItemIcon))>
- <NoSsr>
- <WithStyles(memo)
- center={false}
- >
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={13}
+ style={Object {}}
+ width={13}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={13}
+ style={Object {}}
+ width={13}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </div>
+ </ForwardRef(ListItemIcon)>
+ </WithStyles(ForwardRef(ListItemIcon))>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$1"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$1"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.HEATING
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.HEATING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$2"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$2"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.AIR_CONDITIONING
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.AIR_CONDITIONING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$3"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$3"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.ECS
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.ECS
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$4"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$4"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.COLD_WATER
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.COLD_WATER
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$5"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$5"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.ELECTRICITY_SPECIFIC
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.ELECTRICITY_SPECIFIC
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- <WithStyles(ForwardRef(MenuItem))
- classes={
- Object {
- "root": "",
- }
- }
- key=".$.$6"
- onClick={[Function]}
- selected={false}
- >
- <ForwardRef(MenuItem)
- classes={
- Object {
- "dense": "MuiMenuItem-dense",
- "gutters": "MuiMenuItem-gutters",
- "root": "MuiMenuItem-root",
- "selected": "Mui-selected",
- }
- }
- onClick={[Function]}
- selected={false}
- >
- <WithStyles(ForwardRef(ListItem))
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ <WithStyles(ForwardRef(MenuItem))
classes={
Object {
- "dense": "MuiMenuItem-dense",
+ "root": "",
}
}
- component="li"
- disableGutters={false}
+ key=".$.$6"
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <ForwardRef(ListItem)
- button={true}
- className="MuiMenuItem-root MuiMenuItem-gutters"
+ <ForwardRef(MenuItem)
classes={
Object {
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
- "button": "MuiListItem-button",
- "container": "MuiListItem-container",
- "dense": "MuiListItem-dense MuiMenuItem-dense",
- "disabled": "Mui-disabled",
- "divider": "MuiListItem-divider",
- "focusVisible": "Mui-focusVisible",
- "gutters": "MuiListItem-gutters",
- "root": "MuiListItem-root",
- "secondaryAction": "MuiListItem-secondaryAction",
+ "dense": "MuiMenuItem-dense",
+ "gutters": "MuiMenuItem-gutters",
+ "root": "MuiMenuItem-root",
"selected": "Mui-selected",
}
}
- component="li"
- disableGutters={false}
onClick={[Function]}
- role="menuitem"
selected={false}
- tabIndex={-1}
>
- <WithStyles(ForwardRef(ButtonBase))
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <WithStyles(ForwardRef(ListItem))
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
+ classes={
+ Object {
+ "dense": "MuiMenuItem-dense",
+ }
+ }
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <ForwardRef(ButtonBase)
- className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ <ForwardRef(ListItem)
+ button={true}
+ className="MuiMenuItem-root MuiMenuItem-gutters"
classes={
Object {
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
+ "button": "MuiListItem-button",
+ "container": "MuiListItem-container",
+ "dense": "MuiListItem-dense MuiMenuItem-dense",
"disabled": "Mui-disabled",
+ "divider": "MuiListItem-divider",
"focusVisible": "Mui-focusVisible",
- "root": "MuiButtonBase-root",
+ "gutters": "MuiListItem-gutters",
+ "root": "MuiListItem-root",
+ "secondaryAction": "MuiListItem-secondaryAction",
+ "selected": "Mui-selected",
}
}
component="li"
- disabled={false}
- focusVisibleClassName="Mui-focusVisible"
+ disableGutters={false}
onClick={[Function]}
role="menuitem"
+ selected={false}
tabIndex={-1}
>
- <li
- aria-disabled={false}
- className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
- onBlur={[Function]}
+ <WithStyles(ForwardRef(ButtonBase))
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
onClick={[Function]}
- onDragLeave={[Function]}
- onFocus={[Function]}
- onKeyDown={[Function]}
- onKeyUp={[Function]}
- onMouseDown={[Function]}
- onMouseLeave={[Function]}
- onMouseUp={[Function]}
- onTouchEnd={[Function]}
- onTouchMove={[Function]}
- onTouchStart={[Function]}
role="menuitem"
tabIndex={-1}
>
- ecogesture.COOKING
- <NoSsr>
- <WithStyles(memo)
- center={false}
+ <ForwardRef(ButtonBase)
+ className="MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="li"
+ disabled={false}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ role="menuitem"
+ tabIndex={-1}
+ >
+ <li
+ aria-disabled={false}
+ className="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="menuitem"
+ tabIndex={-1}
>
- <ForwardRef(TouchRipple)
- center={false}
- classes={
- Object {
- "child": "MuiTouchRipple-child",
- "childLeaving": "MuiTouchRipple-childLeaving",
- "childPulsate": "MuiTouchRipple-childPulsate",
- "ripple": "MuiTouchRipple-ripple",
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
- "rippleVisible": "MuiTouchRipple-rippleVisible",
- "root": "MuiTouchRipple-root",
- }
- }
- >
- <span
- className="MuiTouchRipple-root"
+ ecogesture.COOKING
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
>
- <TransitionGroup
- childFactory={[Function]}
- component={null}
- exit={true}
- />
- </span>
- </ForwardRef(TouchRipple)>
- </WithStyles(memo)>
- </NoSsr>
- </li>
- </ForwardRef(ButtonBase)>
- </WithStyles(ForwardRef(ButtonBase))>
- </ForwardRef(ListItem)>
- </WithStyles(ForwardRef(ListItem))>
- </ForwardRef(MenuItem)>
- </WithStyles(ForwardRef(MenuItem))>
- </ul>
- </ForwardRef(List)>
- </WithStyles(ForwardRef(List))>
- </ForwardRef(MenuList)>
- </div>
- </ForwardRef(Paper)>
- </WithStyles(ForwardRef(Paper))>
- </Transition>
- </ForwardRef(Grow)>
- <div
- data-test="sentinelEnd"
- tabIndex={0}
- />
- </TrapFocus>
- </div>
- </Portal>
- </ForwardRef(Portal)>
- </ForwardRef(Modal)>
- </ForwardRef(Popover)>
- </WithStyles(ForwardRef(Popover))>
- </ForwardRef(Menu)>
- </WithStyles(ForwardRef(Menu))>
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </li>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(ListItem)>
+ </WithStyles(ForwardRef(ListItem))>
+ </ForwardRef(MenuItem)>
+ </WithStyles(ForwardRef(MenuItem))>
+ </ul>
+ </ForwardRef(List)>
+ </WithStyles(ForwardRef(List))>
+ </ForwardRef(MenuList)>
+ </div>
+ </ForwardRef(Paper)>
+ </WithStyles(ForwardRef(Paper))>
+ </Transition>
+ </ForwardRef(Grow)>
+ <div
+ data-test="sentinelEnd"
+ tabIndex={0}
+ />
+ </TrapFocus>
+ </div>
+ </Portal>
+ </ForwardRef(Portal)>
+ </ForwardRef(Modal)>
+ </ForwardRef(Popover)>
+ </WithStyles(ForwardRef(Popover))>
+ </ForwardRef(Menu)>
+ </WithStyles(ForwardRef(Menu))>
+ </div>
+ </div>
</div>
- </div>
- </div>
- <div
- className="ecogesture-content"
- >
- <div
- className="ecogesture-content-loading"
- >
- <StyledSpinner
- fluidType={3}
- size="5em"
+ <div
+ className="ecogesture-content"
>
- <WithStyles(WithStyles(ForwardRef(CircularProgress)))
- size="5em"
- >
- <WithStyles(ForwardRef(CircularProgress))
- classes={
- Object {
- "root": "WithStyles(ForwardRef(CircularProgress))-root-1",
- }
+ <mock-ecogesturecard
+ ecogesture={
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
}
- size="5em"
- >
- <ForwardRef(CircularProgress)
- classes={
- Object {
- "circle": "MuiCircularProgress-circle",
- "circleDisableShrink": "MuiCircularProgress-circleDisableShrink",
- "circleIndeterminate": "MuiCircularProgress-circleIndeterminate",
- "circleStatic": "MuiCircularProgress-circleStatic",
- "colorPrimary": "MuiCircularProgress-colorPrimary",
- "colorSecondary": "MuiCircularProgress-colorSecondary",
- "indeterminate": "MuiCircularProgress-indeterminate",
- "root": "MuiCircularProgress-root WithStyles(ForwardRef(CircularProgress))-root-1",
- "static": "MuiCircularProgress-static",
- "svg": "MuiCircularProgress-svg",
- }
- }
- size="5em"
- >
- <div
- className="MuiCircularProgress-root WithStyles(ForwardRef(CircularProgress))-root-1 MuiCircularProgress-colorPrimary MuiCircularProgress-indeterminate"
- role="progressbar"
- style={
- Object {
- "height": "5em",
- "width": "5em",
- }
- }
- >
- <svg
- className="MuiCircularProgress-svg"
- viewBox="22 22 44 44"
- >
- <circle
- className="MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate"
- cx={44}
- cy={44}
- fill="none"
- r={20.2}
- strokeWidth={3.6}
- style={Object {}}
- />
- </svg>
- </div>
- </ForwardRef(CircularProgress)>
- </WithStyles(ForwardRef(CircularProgress))>
- </WithStyles(WithStyles(ForwardRef(CircularProgress)))>
- </StyledSpinner>
- </div>
- </div>
- <EcogestureInfoModal
- handleCloseClick={[Function]}
- open={false}
- >
- <WithStyles(ForwardRef(Dialog))
- aria-labelledby="accessibility-title"
- classes={
- Object {
- "paper": "modal-paper",
- "root": "modal-root",
- }
- }
- onClose={[Function]}
- open={false}
- >
- <ForwardRef(Dialog)
- aria-labelledby="accessibility-title"
- classes={
- Object {
- "container": "MuiDialog-container",
- "paper": "MuiDialog-paper modal-paper",
- "paperFullScreen": "MuiDialog-paperFullScreen",
- "paperFullWidth": "MuiDialog-paperFullWidth",
- "paperScrollBody": "MuiDialog-paperScrollBody",
- "paperScrollPaper": "MuiDialog-paperScrollPaper",
- "paperWidthFalse": "MuiDialog-paperWidthFalse",
- "paperWidthLg": "MuiDialog-paperWidthLg",
- "paperWidthMd": "MuiDialog-paperWidthMd",
- "paperWidthSm": "MuiDialog-paperWidthSm",
- "paperWidthXl": "MuiDialog-paperWidthXl",
- "paperWidthXs": "MuiDialog-paperWidthXs",
- "root": "MuiDialog-root modal-root",
- "scrollBody": "MuiDialog-scrollBody",
- "scrollPaper": "MuiDialog-scrollPaper",
}
- }
- onClose={[Function]}
- open={false}
- >
- <ForwardRef(Modal)
- BackdropComponent={
+ key="0"
+ />
+ <mock-ecogesturecard
+ ecogesture={
Object {
- "$$typeof": Symbol(react.forward_ref),
- "Naked": Object {
- "$$typeof": Symbol(react.forward_ref),
- "propTypes": Object {
- "children": [Function],
- "className": [Function],
- "classes": [Function],
- "invisible": [Function],
- "open": [Function],
- "transitionDuration": [Function],
- },
- "render": [Function],
- },
- "displayName": "WithStyles(ForwardRef(Backdrop))",
- "options": Object {
- "defaultTheme": Object {
- "breakpoints": Object {
- "between": [Function],
- "down": [Function],
- "keys": Array [
- "xs",
- "sm",
- "md",
- "lg",
- "xl",
- ],
- "only": [Function],
- "up": [Function],
- "values": Object {
- "lg": 1280,
- "md": 960,
- "sm": 600,
- "xl": 1920,
- "xs": 0,
- },
- "width": [Function],
- },
- "direction": "ltr",
- "mixins": Object {
- "gutters": [Function],
- "toolbar": Object {
- "@media (min-width:0px) and (orientation: landscape)": Object {
- "minHeight": 48,
- },
- "@media (min-width:600px)": Object {
- "minHeight": 64,
- },
- "minHeight": 56,
- },
- },
- "overrides": Object {},
- "palette": Object {
- "action": Object {
- "active": "rgba(0, 0, 0, 0.54)",
- "disabled": "rgba(0, 0, 0, 0.26)",
- "disabledBackground": "rgba(0, 0, 0, 0.12)",
- "hover": "rgba(0, 0, 0, 0.08)",
- "hoverOpacity": 0.08,
- "selected": "rgba(0, 0, 0, 0.14)",
- },
- "augmentColor": [Function],
- "background": Object {
- "default": "#fafafa",
- "paper": "#fff",
- },
- "common": Object {
- "black": "#000",
- "white": "#fff",
- },
- "contrastThreshold": 3,
- "divider": "rgba(0, 0, 0, 0.12)",
- "error": Object {
- "contrastText": "#fff",
- "dark": "#d32f2f",
- "light": "#e57373",
- "main": "#f44336",
- },
- "getContrastText": [Function],
- "grey": Object {
- "100": "#f5f5f5",
- "200": "#eeeeee",
- "300": "#e0e0e0",
- "400": "#bdbdbd",
- "50": "#fafafa",
- "500": "#9e9e9e",
- "600": "#757575",
- "700": "#616161",
- "800": "#424242",
- "900": "#212121",
- "A100": "#d5d5d5",
- "A200": "#aaaaaa",
- "A400": "#303030",
- "A700": "#616161",
- },
- "info": Object {
- "contrastText": "#fff",
- "dark": "#1976d2",
- "light": "#64b5f6",
- "main": "#2196f3",
- },
- "primary": Object {
- "contrastText": "#fff",
- "dark": "#303f9f",
- "light": "#7986cb",
- "main": "#3f51b5",
- },
- "secondary": Object {
- "contrastText": "#fff",
- "dark": "#c51162",
- "light": "#ff4081",
- "main": "#f50057",
- },
- "success": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#388e3c",
- "light": "#81c784",
- "main": "#4caf50",
- },
- "text": Object {
- "disabled": "rgba(0, 0, 0, 0.38)",
- "hint": "rgba(0, 0, 0, 0.38)",
- "primary": "rgba(0, 0, 0, 0.87)",
- "secondary": "rgba(0, 0, 0, 0.54)",
- },
- "tonalOffset": 0.2,
- "type": "light",
- "warning": Object {
- "contrastText": "rgba(0, 0, 0, 0.87)",
- "dark": "#f57c00",
- "light": "#ffb74d",
- "main": "#ff9800",
- },
- },
- "props": Object {},
- "shadows": Array [
- "none",
- "0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)",
- "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
- "0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)",
- "0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)",
- "0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)",
- "0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)",
- "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)",
- "0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)",
- "0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)",
- "0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)",
- "0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)",
- "0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)",
- "0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)",
- "0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)",
- "0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)",
- "0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)",
- "0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)",
- "0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)",
- "0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)",
- "0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)",
- "0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)",
- ],
- "shape": Object {
- "borderRadius": 4,
- },
- "spacing": [Function],
- "transitions": Object {
- "create": [Function],
- "duration": Object {
- "complex": 375,
- "enteringScreen": 225,
- "leavingScreen": 195,
- "short": 250,
- "shorter": 200,
- "shortest": 150,
- "standard": 300,
- },
- "easing": Object {
- "easeIn": "cubic-bezier(0.4, 0, 1, 1)",
- "easeInOut": "cubic-bezier(0.4, 0, 0.2, 1)",
- "easeOut": "cubic-bezier(0.0, 0, 0.2, 1)",
- "sharp": "cubic-bezier(0.4, 0, 0.6, 1)",
- },
- "getAutoHeightDuration": [Function],
- },
- "typography": Object {
- "body1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.5,
- },
- "body2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 400,
- "letterSpacing": "0.01071em",
- "lineHeight": 1.43,
- },
- "button": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.02857em",
- "lineHeight": 1.75,
- "textTransform": "uppercase",
- },
- "caption": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.03333em",
- "lineHeight": 1.66,
- },
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": 14,
- "fontWeightBold": 700,
- "fontWeightLight": 300,
- "fontWeightMedium": 500,
- "fontWeightRegular": 400,
- "h1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "6rem",
- "fontWeight": 300,
- "letterSpacing": "-0.01562em",
- "lineHeight": 1.167,
- },
- "h2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3.75rem",
- "fontWeight": 300,
- "letterSpacing": "-0.00833em",
- "lineHeight": 1.2,
- },
- "h3": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "3rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.167,
- },
- "h4": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "2.125rem",
- "fontWeight": 400,
- "letterSpacing": "0.00735em",
- "lineHeight": 1.235,
- },
- "h5": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.5rem",
- "fontWeight": 400,
- "letterSpacing": "0em",
- "lineHeight": 1.334,
- },
- "h6": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1.25rem",
- "fontWeight": 500,
- "letterSpacing": "0.0075em",
- "lineHeight": 1.6,
- },
- "htmlFontSize": 16,
- "overline": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.75rem",
- "fontWeight": 400,
- "letterSpacing": "0.08333em",
- "lineHeight": 2.66,
- "textTransform": "uppercase",
- },
- "pxToRem": [Function],
- "round": [Function],
- "subtitle1": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "1rem",
- "fontWeight": 400,
- "letterSpacing": "0.00938em",
- "lineHeight": 1.75,
- },
- "subtitle2": Object {
- "fontFamily": "\\"Roboto\\", \\"Helvetica\\", \\"Arial\\", sans-serif",
- "fontSize": "0.875rem",
- "fontWeight": 500,
- "letterSpacing": "0.00714em",
- "lineHeight": 1.57,
- },
- },
- "zIndex": Object {
- "appBar": 1100,
- "drawer": 1200,
- "mobileStepper": 1000,
- "modal": 1300,
- "snackbar": 1400,
- "speedDial": 1050,
- "tooltip": 1500,
- },
- },
- "name": "MuiBackdrop",
- },
- "propTypes": Object {
- "classes": [Function],
- "innerRef": [Function],
- },
- "render": [Function],
- "useStyles": [Function],
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 0,
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à l'intérieur. Le climatiseur n'est pas là pour refroidir la rue mais bien la pièce.",
+ "longName": "Je ferme mes fenêtres quand la climatisation est en marche",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
}
}
- BackdropProps={
+ key="1"
+ />
+ <mock-ecogesturecard
+ ecogesture={
Object {
- "transitionDuration": Object {
- "enter": 225,
- "exit": 195,
- },
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 4,
+ 5,
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "Utilisez la température la plus basse possible : de nombreux produits nettoyants sont efficaces à froid et un cycle à 90 °C consomme 3 fois plus d'énergie qu'un lavage à 40 °C. En effet, 80 % de l'énergie consommée par un lave-linge ou un lave-vaisselle sert au chauffage de l'eau ! Que ce soit pour la vaisselle ou le linge, les programmes de lavage intensif consomment jusqu'à 40 % de plus. Si possible, rincez à l'eau froide : la température de rinçage n'a pas d'effet sur le nettoyage du linge ou de la vaisselle. Attention cependant avec les tissus qui peuvent rétrécir : ce qui fait rétrécir, c'est le passage d'une température à une autre. Mieux vaut alors faire le cycle complet à l'eau froide pour les premiers lavages de tissus sensibles. Pour du linge ou de la vaisselle peu sales, utilisez la touche \\"Eco\\". Elle réduit la température de lavage et allonge sa durée (c’est le chauffage de l’eau qui consomme le plus). Vous économiserez jusqu’à 45 % par rapport aux cycles longs. Néanmoins, pour vous prémunir contre les bouchons de graisse dans les canalisations, faites quand même un cycle à chaud une fois par mois environ.",
+ "longName": "J’utilise le plus souvent les cycles courts à basse température pour laver le linge et la vaisselle.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
}
}
- className="MuiDialog-root modal-root"
- closeAfterTransition={true}
- disableBackdropClick={false}
- disableEscapeKeyDown={false}
- onClose={[Function]}
- open={false}
+ key="2"
/>
- </ForwardRef(Dialog)>
- </WithStyles(ForwardRef(Dialog))>
- </EcogestureInfoModal>
- </div>
- </EcogestureList>
+ </div>
+ </div>
+ </EcogestureList>
+ </Router>
+ </BrowserRouter>
</Provider>
`;
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..2930dc1c918ec4f27e2aa1f5d42742e2c256952a
--- /dev/null
+++ b/src/components/Ecogesture/__snapshots__/EcogestureView.spec.tsx.snap
@@ -0,0 +1,1349 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EcogestureView component should be rendered correctly 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <EcogestureView>
+ <mock-cozybar
+ titleKey="common.title_ecogestures"
+ />
+ <mock-header
+ desktopTitleKey="common.title_ecogestures"
+ setHeaderHeight={[Function]}
+ >
+ <WithStyles(ForwardRef(Tabs))
+ TabIndicatorProps={
+ Object {
+ "className": "indicator-tab",
+ }
+ }
+ aria-label="ecogestures-tabs"
+ centered={true}
+ className="ecogestures-tabs"
+ onChange={[Function]}
+ value={2}
+ >
+ <ForwardRef(Tabs)
+ TabIndicatorProps={
+ Object {
+ "className": "indicator-tab",
+ }
+ }
+ aria-label="ecogestures-tabs"
+ centered={true}
+ className="ecogestures-tabs"
+ classes={
+ Object {
+ "centered": "MuiTabs-centered",
+ "fixed": "MuiTabs-fixed",
+ "flexContainer": "MuiTabs-flexContainer",
+ "flexContainerVertical": "MuiTabs-flexContainerVertical",
+ "indicator": "MuiTabs-indicator",
+ "root": "MuiTabs-root",
+ "scrollButtons": "MuiTabs-scrollButtons",
+ "scrollButtonsDesktop": "MuiTabs-scrollButtonsDesktop",
+ "scrollable": "MuiTabs-scrollable",
+ "scroller": "MuiTabs-scroller",
+ "vertical": "MuiTabs-vertical",
+ }
+ }
+ onChange={[Function]}
+ value={2}
+ >
+ <div
+ aria-label="ecogestures-tabs"
+ className="MuiTabs-root ecogestures-tabs"
+ >
+ <div
+ className="MuiTabs-scroller MuiTabs-fixed"
+ onScroll={[Function]}
+ style={
+ Object {
+ "marginBottom": null,
+ "overflow": "hidden",
+ }
+ }
+ >
+ <div
+ className="MuiTabs-flexContainer MuiTabs-centered"
+ role="tablist"
+ >
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-0"
+ className="single-tab"
+ fullWidth={false}
+ id="simple-tab-0"
+ indicator={false}
+ key=".0"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={0}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-0"
+ className="single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-0"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={0}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-0"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-0"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-0"
+ aria-selected={false}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ id="simple-tab-0"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-1"
+ className="single-tab"
+ fullWidth={false}
+ id="simple-tab-1"
+ indicator={false}
+ key=".1"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={1}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-1"
+ className="single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-1"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={false}
+ textColor="inherit"
+ value={1}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-1"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiTab-root MuiTab-textColorInherit single-tab"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-1"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-1"
+ aria-selected={false}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ disabled={false}
+ id="simple-tab-1"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_1
+ <br />
+ (0)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ <WithStyles(ForwardRef(Tab))
+ aria-controls="simple-tabpanel-2"
+ className="single-tab active"
+ fullWidth={false}
+ id="simple-tab-2"
+ indicator={false}
+ key=".2"
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={true}
+ textColor="inherit"
+ value={2}
+ >
+ <ForwardRef(Tab)
+ aria-controls="simple-tabpanel-2"
+ className="single-tab active"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "fullWidth": "MuiTab-fullWidth",
+ "labelIcon": "MuiTab-labelIcon",
+ "root": "MuiTab-root",
+ "selected": "Mui-selected",
+ "textColorInherit": "MuiTab-textColorInherit",
+ "textColorPrimary": "MuiTab-textColorPrimary",
+ "textColorSecondary": "MuiTab-textColorSecondary",
+ "wrapped": "MuiTab-wrapped",
+ "wrapper": "MuiTab-wrapper",
+ }
+ }
+ fullWidth={false}
+ id="simple-tab-2"
+ indicator={false}
+ label={
+ <React.Fragment>
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </React.Fragment>
+ }
+ onChange={[Function]}
+ selected={true}
+ textColor="inherit"
+ value={2}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-2"
+ onClick={[Function]}
+ role="tab"
+ >
+ <ForwardRef(ButtonBase)
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ id="simple-tab-2"
+ onClick={[Function]}
+ role="tab"
+ >
+ <button
+ aria-controls="simple-tabpanel-2"
+ aria-selected={true}
+ className="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ disabled={false}
+ id="simple-tab-2"
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ role="tab"
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Tab)>
+ </WithStyles(ForwardRef(Tab))>
+ </div>
+ <WithStyles(ForwardRef(TabIndicator))
+ className="indicator-tab"
+ color="secondary"
+ orientation="horizontal"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ >
+ <ForwardRef(TabIndicator)
+ className="indicator-tab"
+ classes={
+ Object {
+ "colorPrimary": "PrivateTabIndicator-colorPrimary-3",
+ "colorSecondary": "PrivateTabIndicator-colorSecondary-4",
+ "root": "PrivateTabIndicator-root-2",
+ "vertical": "PrivateTabIndicator-vertical-5",
+ }
+ }
+ color="secondary"
+ orientation="horizontal"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ >
+ <span
+ className="PrivateTabIndicator-root-2 PrivateTabIndicator-colorSecondary-4 indicator-tab"
+ style={
+ Object {
+ "left": 0,
+ "width": 0,
+ }
+ }
+ />
+ </ForwardRef(TabIndicator)>
+ </WithStyles(ForwardRef(TabIndicator))>
+ </div>
+ </div>
+ </ForwardRef(Tabs)>
+ </WithStyles(ForwardRef(Tabs))>
+ </mock-header>
+ <mock-content
+ height={0}
+ >
+ <TabPanel
+ index={0}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-0"
+ hidden={true}
+ id="simple-tabpanel-0"
+ role="tabpanel"
+ >
+ <EcogestureEmptyList
+ isObjective={true}
+ setTab={[Function]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.obj2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+ </div>
+ </TabPanel>
+ <TabPanel
+ index={1}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-1"
+ hidden={true}
+ id="simple-tabpanel-1"
+ role="tabpanel"
+ >
+ <EcogestureEmptyList
+ isObjective={false}
+ setTab={[Function]}
+ >
+ <div
+ className="ec-empty-container"
+ >
+ <div
+ className="ec-empty-content"
+ >
+ <StyledIcon
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ >
+ <Icon
+ aria-hidden={true}
+ className="icon-big"
+ icon="test-file-stub"
+ size={150}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <svg
+ aria-hidden={true}
+ className="icon-big styles__icon___23x3R"
+ height={150}
+ style={Object {}}
+ width={150}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.doing1
+ </div>
+ <div
+ className="text-16-normal text"
+ >
+ ecogesture.emptyList.doing2
+ </div>
+ <div
+ className="btn-container"
+ >
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-secondary-negative btn1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn1"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-secondary-negative btn1",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ className="MuiButtonBase-root MuiButton-root btn-secondary-negative btn1 MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ <WithStyles(ForwardRef(Button))
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "label": "text-16-bold",
+ "root": "btn-highlight",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(Button)
+ aria-label="ecogesture.emptyList.btn2"
+ classes={
+ Object {
+ "colorInherit": "MuiButton-colorInherit",
+ "contained": "MuiButton-contained",
+ "containedPrimary": "MuiButton-containedPrimary",
+ "containedSecondary": "MuiButton-containedSecondary",
+ "containedSizeLarge": "MuiButton-containedSizeLarge",
+ "containedSizeSmall": "MuiButton-containedSizeSmall",
+ "disableElevation": "MuiButton-disableElevation",
+ "disabled": "Mui-disabled",
+ "endIcon": "MuiButton-endIcon",
+ "focusVisible": "Mui-focusVisible",
+ "fullWidth": "MuiButton-fullWidth",
+ "iconSizeLarge": "MuiButton-iconSizeLarge",
+ "iconSizeMedium": "MuiButton-iconSizeMedium",
+ "iconSizeSmall": "MuiButton-iconSizeSmall",
+ "label": "MuiButton-label text-16-bold",
+ "outlined": "MuiButton-outlined",
+ "outlinedPrimary": "MuiButton-outlinedPrimary",
+ "outlinedSecondary": "MuiButton-outlinedSecondary",
+ "outlinedSizeLarge": "MuiButton-outlinedSizeLarge",
+ "outlinedSizeSmall": "MuiButton-outlinedSizeSmall",
+ "root": "MuiButton-root btn-highlight",
+ "sizeLarge": "MuiButton-sizeLarge",
+ "sizeSmall": "MuiButton-sizeSmall",
+ "startIcon": "MuiButton-startIcon",
+ "text": "MuiButton-text",
+ "textPrimary": "MuiButton-textPrimary",
+ "textSecondary": "MuiButton-textSecondary",
+ "textSizeLarge": "MuiButton-textSizeLarge",
+ "textSizeSmall": "MuiButton-textSizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButton-root btn-highlight MuiButton-text"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ component="button"
+ disabled={false}
+ focusRipple={true}
+ focusVisibleClassName="Mui-focusVisible"
+ onClick={[Function]}
+ type="button"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ className="MuiButtonBase-root MuiButton-root btn-highlight MuiButton-text"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiButton-label text-16-bold"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ <NoSsr>
+ <WithStyles(memo)
+ center={false}
+ >
+ <ForwardRef(TouchRipple)
+ center={false}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </NoSsr>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(Button)>
+ </WithStyles(ForwardRef(Button))>
+ </div>
+ </div>
+ </div>
+ </EcogestureEmptyList>
+ </div>
+ </TabPanel>
+ <TabPanel
+ index={2}
+ value={2}
+ >
+ <div
+ aria-labelledby="simple-tab-2"
+ hidden={false}
+ id="simple-tabpanel-2"
+ role="tabpanel"
+ >
+ <mock-ecogesturelist
+ list={
+ Array [
+ Object {
+ "_id": "ECOGESTURE001",
+ "_rev": "1-67f1ea36efdd892c96bf64a8943154cd",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [],
+ "fluidTypes": Array [
+ 0,
+ 2,
+ ],
+ "id": "ECOGESTURE001",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "On se demande parfois si cela vaut le coup de \\"couper le chauffage\\" quand on s’absente… dès qu’il s’agit d’un week-end la réponse est « oui sûrement » ! Attention cependant au retour à ne pas faire de la surchauffe ! L’idéal est bien évidemment de régler sa programmation pour que le chauffage se relance quelques heures avant votre retour…",
+ "longName": "Je baisse le chauffage en mode hors gel lorsque je m'absente plus de 2 jours.",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Hiver",
+ "shortName": "Bonhomme de neige",
+ "usage": 1,
+ },
+ Object {
+ "_id": "ECOGESTURE002",
+ "_rev": "1-ef7ddd778254e3b7d331a88fd17f606d",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": false,
+ "actionDuration": 3,
+ "actionName": null,
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 4,
+ "equipment": true,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 0,
+ ],
+ "fluidTypes": Array [
+ 0,
+ ],
+ "id": "ECOGESTURE002",
+ "impactLevel": 8,
+ "investment": null,
+ "longDescription": "Cela permet de garder la fraicheur à l'intérieur. Le climatiseur n'est pas là pour refroidir la rue mais bien la pièce.",
+ "longName": "Je ferme mes fenêtres quand la climatisation est en marche",
+ "objective": false,
+ "room": Array [
+ 0,
+ ],
+ "season": "Eté",
+ "shortName": "Coup de vent",
+ "usage": 2,
+ },
+ Object {
+ "_id": "ECOGESTURE0013",
+ "_rev": "1-0b2761dd4aef79556c7aef144060fde6",
+ "_type": "com.grandlyon.ecolyo.ecogesture",
+ "action": true,
+ "actionDuration": 3,
+ "actionName": "J’utilise le cycle court à basse température pour laver le linge et la vaisselle.",
+ "difficulty": 1,
+ "doing": false,
+ "efficiency": 1,
+ "equipment": false,
+ "equipmentInstallation": true,
+ "equipmentType": Array [
+ 4,
+ 5,
+ ],
+ "fluidTypes": Array [
+ 1,
+ ],
+ "id": "ECOGESTURE0013",
+ "impactLevel": 2,
+ "investment": null,
+ "longDescription": "Utilisez la température la plus basse possible : de nombreux produits nettoyants sont efficaces à froid et un cycle à 90 °C consomme 3 fois plus d'énergie qu'un lavage à 40 °C. En effet, 80 % de l'énergie consommée par un lave-linge ou un lave-vaisselle sert au chauffage de l'eau ! Que ce soit pour la vaisselle ou le linge, les programmes de lavage intensif consomment jusqu'à 40 % de plus. Si possible, rincez à l'eau froide : la température de rinçage n'a pas d'effet sur le nettoyage du linge ou de la vaisselle. Attention cependant avec les tissus qui peuvent rétrécir : ce qui fait rétrécir, c'est le passage d'une température à une autre. Mieux vaut alors faire le cycle complet à l'eau froide pour les premiers lavages de tissus sensibles. Pour du linge ou de la vaisselle peu sales, utilisez la touche \\"Eco\\". Elle réduit la température de lavage et allonge sa durée (c’est le chauffage de l’eau qui consomme le plus). Vous économiserez jusqu’à 45 % par rapport aux cycles longs. Néanmoins, pour vous prémunir contre les bouchons de graisse dans les canalisations, faites quand même un cycle à chaud une fois par mois environ.",
+ "longName": "J’utilise le plus souvent les cycles courts à basse température pour laver le linge et la vaisselle.",
+ "objective": false,
+ "room": Array [
+ 1,
+ 3,
+ 2,
+ ],
+ "season": "Sans saison",
+ "shortName": "Accelerateur de particules",
+ "usage": 5,
+ },
+ ]
+ }
+ />
+ </div>
+ </TabPanel>
+ </mock-content>
+ </EcogestureView>
+</Provider>
+`;
diff --git a/src/components/Ecogesture/ecogestureError.scss b/src/components/Ecogesture/ecogestureEmptyList.scss
similarity index 64%
rename from src/components/Ecogesture/ecogestureError.scss
rename to src/components/Ecogesture/ecogestureEmptyList.scss
index c89ffaf796a6b7d8602260cea1c5e0f76be76487..1326c2218c7732de283dd89296326555b3de8ee0 100644
--- a/src/components/Ecogesture/ecogestureError.scss
+++ b/src/components/Ecogesture/ecogestureEmptyList.scss
@@ -1,12 +1,10 @@
@import '../../styles/base/color';
@import '../../styles/base/breakpoint';
-.ec-error-container {
+.ec-empty-container {
margin-top: 6rem;
- @media (min-width: $width-phone) {
- margin-top: 2rem;
- }
- .ec-error-content {
+
+ .ec-empty-content {
color: $grey-bright;
text-align: center;
padding: 0 0.5rem;
@@ -18,8 +16,14 @@
@media (min-width: $width-desktop) {
max-width: 35%;
}
- }
- .ec-error-title {
- padding: 0 1.5rem;
+ .text {
+ margin: 1rem 0;
+ }
+ .btn-container {
+ display: flex;
+ button.btn1 {
+ margin-right: 1rem;
+ }
+ }
}
}
diff --git a/src/components/Ecogesture/ecogestureInfoModal.scss b/src/components/Ecogesture/ecogestureInfoModal.scss
deleted file mode 100644
index dd1033c0e872746bf451d18993b06493b6fd9f13..0000000000000000000000000000000000000000
--- a/src/components/Ecogesture/ecogestureInfoModal.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-@import 'src/styles/base/breakpoint';
-@import 'src/styles/base/color';
-
-.info-header {
- margin: 1rem;
-}
-
-.info-content {
- margin: 0 1.25rem 2.125rem;
- text-align: center;
- .info-title {
- color: $white;
- text-indent: -10px;
- }
- .info-detail {
- margin: 1rem 0;
- color: $grey-bright;
- }
-}
-
-#accessibility-title {
- display: none;
-}
diff --git a/src/components/Ecogesture/ecogestureInitModal.scss b/src/components/Ecogesture/ecogestureInitModal.scss
new file mode 100644
index 0000000000000000000000000000000000000000..4c99819dd632e2b2ca4523fe3260298a57455ee4
--- /dev/null
+++ b/src/components/Ecogesture/ecogestureInitModal.scss
@@ -0,0 +1,22 @@
+@import '../../styles/base/color';
+
+.eg-init-modal {
+ color: $grey-bright;
+ margin: 1rem 0;
+ .title {
+ text-align: center;
+ color: $gold-shadow;
+ }
+ .text {
+ margin: 1rem 0;
+ }
+ .buttons-container {
+ display: flex;
+ button {
+ min-height: 45px;
+ }
+ button.btn1 {
+ margin-right: 1rem;
+ }
+ }
+}
diff --git a/src/components/Ecogesture/ecogestureView.scss b/src/components/Ecogesture/ecogestureView.scss
index 4752507bd50e2272c66694025864d32b80368ade..048a4fc2dc699f97f56575fa67bf073335b58de8 100644
--- a/src/components/Ecogesture/ecogestureView.scss
+++ b/src/components/Ecogesture/ecogestureView.scss
@@ -1,5 +1,12 @@
@import 'src/styles/base/color';
+.ecogesture-spinner {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ min-height: inherit;
+}
.ecogestures-tabs {
background: transparent;
color: $soft-grey;
@@ -8,7 +15,7 @@
margin: 0 1rem;
box-sizing: border-box;
.single-tab {
- width: 50%;
+ width: 32%;
text-transform: initial;
font-size: 1rem;
font-weight: 400;
diff --git a/src/components/Ecogesture/singleEcogesture.scss b/src/components/Ecogesture/singleEcogesture.scss
index f4a84f86c3765e674f1bdc6fb695128251b8687a..2c4d323fc51a9a5007b72e692b6c5f9d6f3b3ca3 100644
--- a/src/components/Ecogesture/singleEcogesture.scss
+++ b/src/components/Ecogesture/singleEcogesture.scss
@@ -1,5 +1,11 @@
@import 'src/styles/base/color';
+.se-loader-container {
+ min-height: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
.single-ecogesture {
color: $grey-bright;
display: flex;
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 85bdd9e7cd7afd0372b5ed083e87c3c2b9befb57..b33ca876deb8ec3fe6dbfb7cb3423aadec9c2692 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -14,6 +14,7 @@ import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
import FeedbacksIcon from 'assets/icons/ico/feedbacks.svg'
import HammerLeft from 'assets/icons/ico/hammer-left.svg'
import HammerRight from 'assets/icons/ico/hammer-right.svg'
+import { EcogestureStatus } from 'enum/ecogesture.enum'
interface HeaderProps {
textKey?: string
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index 76ce704b67bd22b59be4853190110ea818df6ef9..2401f45d13872a34f9c04f082d6d6d3a062d8370 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -9,6 +9,7 @@ import ActionView from 'components/Action/ActionView'
import UnSubscribe from 'components/Options/UnSubscribe'
import TermsView from 'components/Terms/TermsView'
import { TermsStatus } from 'models'
+import { EcogestureStatus } from 'enum/ecogesture.enum'
const ConsumptionView = lazy(() => import('components/Home/ConsumptionView'))
@@ -62,9 +63,9 @@ const Routes: React.FC<RouteProps> = ({ termsStatus }: RouteProps) => {
<Route path={`/challenges/exploration`} component={ExplorationView} />
<Route path={`/challenges/action`} exact component={ActionView} />
<Route path={`/challenges/`} component={ChallengeView} exact />
-
- <Route path="/ecogestures/:id" component={SingleEcogesture} />
- <Route path="/ecogestures" component={EcogestureView} />
+ <Route path="/ecogesture/:id" component={SingleEcogesture} />
+ <Route path={`/ecogestures`} component={EcogestureView} />
+ <Route path={`/ecogestures`} component={EcogestureView} />
<Route path={'/options/FAQ'} component={FAQView} />
<Route path={`/options/legalnotice`} component={LegalNoticeView} />
<Route path={`/options/gcu`} component={GCUView} />
diff --git a/src/db/profileData.json b/src/db/profileData.json
index e39e2015078379b2685947c5341949516ce5bd81..bbd3db0efaa3bf6dc0e26b4e0a8dbd227e1fa0e5 100644
--- a/src/db/profileData.json
+++ b/src/db/profileData.json
@@ -15,6 +15,7 @@
"isProfileTypeCompleted": false,
"onboarding": {
"isWelcomeSeen": false
- }
+ },
+ "haveSeenEcogestureModal": false
}
]
diff --git a/src/enum/ecogesture.enum.ts b/src/enum/ecogesture.enum.ts
index 7cb2f7c697701f193fde6e3c1bf170819448f85a..4ea5854e53f7a2591949440cee0991260b281071 100644
--- a/src/enum/ecogesture.enum.ts
+++ b/src/enum/ecogesture.enum.ts
@@ -42,3 +42,9 @@ export enum EquipmentType {
BOILER = 16,
HYDRAULIC_HEATING = 17,
}
+
+export enum EcogestureStatus {
+ OBJECTIVE = 0,
+ DOING = 1,
+ ALL = 2,
+}
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 25da55c7720cc28e96ce0276024891df96ab9088..81bc688b91996f54a04a4f0795a0f711584981e7 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -355,8 +355,9 @@
}
},
"ecogesture": {
- "title_tab_1": "Tous les écogestes",
- "title_tab_2": "Écogestes adaptés à votre profil",
+ "title_tab_0": "Objectifs",
+ "title_tab_1": "Je fais déjà",
+ "title_tab_2": "Tous",
"MENU_TITLE": "Filtrer",
"ALL": "Tous les usages",
"HEATING": "Chauffage",
@@ -378,7 +379,22 @@
"button_go_to_profil": "Aller à la page de profil"
},
"doing": "Je fais déjà",
- "objective": "Objectif"
+ "objective": "Objectif",
+ "emptyList": {
+ "obj1": "Les écogestes sont des actions qui vous permettent de réduire vos consommations et donc vos factures.",
+ "obj2": "Vous pouvez sélectionner ceux à mettre en objectifs et ceux que vous appliquez déjà.",
+ "doing1": "Aucun écogeste n’est indiqué comme déjà appliqué actuellement.",
+ "doing2": "Vous pouvez consulter tous les écogestes et ajouter les gestes que vous mettez déjà en pratique dans cette section.",
+ "btn1": "Voir tous les écogestes",
+ "btn2": "Sélectionner"
+ },
+ "initModal": {
+ "title": "Sélectionner mes écogestes",
+ "text1": "Les écogestes sont des actions qui vous permettent de réduire vos consommations et donc vos factures.",
+ "text2": "Vous pouvez sélectionner ceux à mettre en objectifs et ceux que vous appliquez déjà.",
+ "btn1": "Plus tard",
+ "btn2": "C'est parti !"
+ }
},
"ecogesture_modal": {
"title_ecogesture": "Écogeste",
diff --git a/src/models/profile.model.ts b/src/models/profile.model.ts
index f28a546c819f69d4c4fc31da5262684fe43336a3..616295738d0cd52c8a55dd352bd215a2baecf343 100644
--- a/src/models/profile.model.ts
+++ b/src/models/profile.model.ts
@@ -22,6 +22,7 @@ export interface ProfileEntity {
onboarding: Onboarding
mailToken: string
partnersIssueDate: string
+ haveSeenEcogestureModal: boolean
_id?: string
_rev?: string
}
diff --git a/src/store/profile/profile.reducer.ts b/src/store/profile/profile.reducer.ts
index 94fdf371c201f22d05bbd299111d5da1e177a3cb..65ac46a8a515c136788e9f29e85add98ecc921a2 100644
--- a/src/store/profile/profile.reducer.ts
+++ b/src/store/profile/profile.reducer.ts
@@ -26,6 +26,7 @@ const initialState: Profile = {
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
}
export const profileReducer: Reducer<Profile> = (
diff --git a/tests/__mocks__/profile.mock.ts b/tests/__mocks__/profile.mock.ts
index fa8a65ba639eead6c7876f43225c4b6af7c717ed..1b8a7b9022c76032dc936fe93106da60d8d33652 100644
--- a/tests/__mocks__/profile.mock.ts
+++ b/tests/__mocks__/profile.mock.ts
@@ -29,4 +29,5 @@ export const profileData: Profile = {
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
}
diff --git a/tests/__mocks__/store.ts b/tests/__mocks__/store.ts
index 12e187a9ad7100c2c0f94b6719e9239600d3925e..7e59847f825b6bc0b9c319ae476bcd4f377e9957 100644
--- a/tests/__mocks__/store.ts
+++ b/tests/__mocks__/store.ts
@@ -123,6 +123,7 @@ export const mockInitialProfileState: Profile = {
onboarding: {
isWelcomeSeen: false,
},
+ haveSeenEcogestureModal: false,
}
export const mockInitialProfileTypeState: ProfileType = {