diff --git a/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx
index b13e06a2f97ab742d2f4a2f98f9aa557967c032b..e26737069c50dc62b4247d0136e5ef64969889ea 100644
--- a/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx
+++ b/src/components/ContainerComponents/ViewContainer/AvailableChallengeDetailsViewContainer.tsx
@@ -32,10 +32,10 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails
const challengeManager = new ChallengeManager(client)
const { refreshCurrentChallenge, screenType } = useContext(AppContext)
- const [challengeEcogesture, setChallengeEcogesture] = useState<number>(0)
- const [openEcogestureModal, setOpenEcogestureModal] = useState(false)
+
const [redirect, setRedirect] = useState(false)
const [challenge, setChallenge] = useState<ChallengeType | null>(null)
+ const [userChallenge, setUserChallenge] = useState<UserChallenge | null>(null)
const [headerHeight, setHeaderHeight] = useState<number>(0)
const defineHeaderHeight = (height: number) => {
@@ -49,30 +49,30 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails
[0, 1, 2],
challenge.availableEcogestures
)
+ const chal = await challengeManager.getCurrentChallenge()
+ await setUserChallenge(chal)
await refreshCurrentChallenge()
}
}
- const handleStartClick = () => {
- startChallenge()
+ async function handleStartClick() {
+ await startChallenge()
setRedirect(true)
}
const renderRedirect = () => {
if (redirect) {
- return <Redirect to="/comsumption" />
+ return (
+ <Redirect
+ to={{
+ pathname: '/challenges/ongoing',
+ state: { challenge: userChallenge },
+ }}
+ />
+ )
}
}
- const handleClick = (index: number) => {
- setChallengeEcogesture(index)
- setOpenEcogestureModal(true)
- }
-
- const handleCloseClick = () => {
- setOpenEcogestureModal(false)
- }
-
useEffect(() => {
if (props.location.state) {
setChallenge(props && props.location.state.challenge)
@@ -128,30 +128,8 @@ const AvailableChallengeDetailsViewContainer: React.FC<AvailableChallengeDetails
</div>
</div>
</div>
-
- <div className="cp-bottom">
- <div className="cp-eg-content">
- {t('CHALLENGE.LINKED_ECOGESTURES')}
- <div className="cp-ecogestures">
- {challenge.availableEcogestures.map((eg, index) => (
- <EcogestureCard
- key={index}
- ecogesture={eg}
- handleClick={() => handleClick(index)}
- challengeEcogesture={index + 1}
- />
- ))}
- </div>
- </div>{' '}
- </div>
</div>
</div>
- <EcogestureModal
- opened={openEcogestureModal}
- ecogesture={challenge.availableEcogestures[challengeEcogesture]}
- handleCloseClick={handleCloseClick}
- border={true}
- />
</>
)}
</Content>
diff --git a/src/components/ContainerComponents/ViewContainer/FinishedChallengeDetailsViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/FinishedChallengeDetailsViewContainer.tsx
index 86a27cf2b1d95d3c68efb65f16872ff134a788ea..008240a92b374b1fdb7f5b5d64ef1acf389e604c 100644
--- a/src/components/ContainerComponents/ViewContainer/FinishedChallengeDetailsViewContainer.tsx
+++ b/src/components/ContainerComponents/ViewContainer/FinishedChallengeDetailsViewContainer.tsx
@@ -7,6 +7,7 @@ import { UserChallenge, TypeChallenge } from 'services/dataChallengeContracts'
import StyledSpinner from 'components/CommonKit/Spinner/StyledSpinner'
import StyledIconButton from 'components/CommonKit/IconButton/StyledIconButton'
import DefaultChallengeIcon from 'assets/icons/badges/default.svg'
+import StarIcon from 'assets/icons/visu/challenge/star.svg'
import EcogestureModal from 'components/ContentComponents/EcogestureModal/EcogestureModal'
import EcogestureCard from 'components/ContentComponents/EcogestureCard/EcogestureCard'
import { Client, withClient } from 'cozy-client'
@@ -14,6 +15,7 @@ import { Redirect } from 'react-router-dom'
import { formatNumberValues } from 'utils/utils'
import { AppContext } from 'components/Contexts/AppContextProvider'
import { ScreenType } from 'enum/screen.enum'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
interface FinishedChallengeDetailsViewProps {
location: any
@@ -108,11 +110,30 @@ const FinishedChallengeDetailsViewContainer: React.FC<FinishedChallengeDetailsVi
</div>
)
) : null}
- <StyledIconButton
+ {/* <StyledIconButton
className="cp-icon"
icon={badgeIcon ? badgeIcon : DefaultChallengeIcon}
size={screenType === ScreenType.MOBILE ? 200 : 350}
- />
+ /> */}
+ {/* <StyledIcon
+ className="cm-win-star"
+ icon={StarIcon}
+ size={300}
+ /> */}
+ <div className="cp-win-badge-star">
+ <StyledIcon
+ className="cp-win-badge"
+ icon={badgeIcon ? badgeIcon : DefaultChallengeIcon}
+ size={screenType === ScreenType.MOBILE ? 180 : 200}
+ />
+ {challenge.badge === 1 ? (
+ <StyledIcon
+ className="cp-win-star"
+ icon={StarIcon}
+ size={300}
+ />
+ ) : null}
+ </div>
<div className="cp-description text-16-bold">
{challenge.challengeType &&
challenge.challengeType.description}
diff --git a/src/components/ContainerComponents/ViewContainer/OngoingChallengeDetailsViewContainer.tsx b/src/components/ContainerComponents/ViewContainer/OngoingChallengeDetailsViewContainer.tsx
index 6ff2e9785573ebbefefd3a71b72275e198c60775..67cd375c8283d8a80bf6682181949f3de134d710 100644
--- a/src/components/ContainerComponents/ViewContainer/OngoingChallengeDetailsViewContainer.tsx
+++ b/src/components/ContainerComponents/ViewContainer/OngoingChallengeDetailsViewContainer.tsx
@@ -135,6 +135,16 @@ const OngoingChallengeDetailsViewContainer: React.FC<OngoingChallengeDetailsView
{t('CHALLENGE.LINKED_ECOGESTURES')}
</span>
<div className="cp-ecogestures">
+ {challenge.selectedEcogestures.map((eg, index) => (
+ <EcogestureCard
+ key={index}
+ ecogesture={eg}
+ handleClick={() => handleClick(index)}
+ challengeEcogesture={index + 1}
+ />
+ ))}
+ </div>
+ {/* <div className="cp-ecogestures">
<EcogestureCard
ecogesture={challenge.selectedEcogestures[0]}
handleClick={() => handleClick(0)}
@@ -145,7 +155,7 @@ const OngoingChallengeDetailsViewContainer: React.FC<OngoingChallengeDetailsView
handleClick={() => handleClick(1)}
challengeEcogesture={2}
/>
- </div>
+ </div> */}
</div>
</div>
</div>
diff --git a/src/services/challengeDataMapperService.ts b/src/services/challengeDataMapperService.ts
index 5f096db44806f211d1f2790927b5d6ccc86e02b2..7cc4770d3177eb0d088551533b8a17e6648c997d 100644
--- a/src/services/challengeDataMapperService.ts
+++ b/src/services/challengeDataMapperService.ts
@@ -103,7 +103,6 @@ export default class ChallengeDataMapper {
},
},
}
-
return mappedUserChallenge
}
@@ -144,7 +143,6 @@ export default class ChallengeDataMapper {
userChallengeEntity.badge,
userChallengeEntity._id
)
-
return mappedUserChallenge
}
@@ -169,13 +167,14 @@ export default class ChallengeDataMapper {
}
}
- let filteredAvailableEcogestures = completeAvailableEcogestures.filter(
- eg =>
- fluidTypes &&
- (fluidTypes.includes(eg.fluidTypes[0]) ||
- fluidTypes.includes(eg.fluidTypes[1]) ||
- fluidTypes.includes(eg.fluidTypes[2]))
- )
+ // let filteredAvailableEcogestures = completeAvailableEcogestures.filter(
+ // eg =>
+ // fluidTypes &&
+ // (fluidTypes.includes(eg.fluidTypes[0]) ||
+ // fluidTypes.includes(eg.fluidTypes[1]) ||
+ // fluidTypes.includes(eg.fluidTypes[2]))
+ // )
+ let filteredAvailableEcogestures = completeAvailableEcogestures
const fluidFilteredEcogestures = [...new Set(filteredAvailableEcogestures)]
diff --git a/src/styles/base/_layout.scss b/src/styles/base/_layout.scss
index 2534c69565cfc8827ffa40603d2c6404724ac5ac..3a8b44a639a7a5bc82449da64793a8d8cfde5a02 100644
--- a/src/styles/base/_layout.scss
+++ b/src/styles/base/_layout.scss
@@ -28,9 +28,10 @@ body {
}
[role='banner'] .coz-bar-container {
- padding: 0 3.25em 0 0;
+ padding: 0;
background-color: white;
@media #{$large-phone} {
+ padding: 0 3.25em 0 0;
background-color: unset;
}
}
@@ -122,7 +123,7 @@ body {
}
}
-[role='main']{
+[role='main'] {
/* width */
&::-webkit-scrollbar {
width: 10px;
@@ -135,4 +136,4 @@ body {
&::-webkit-scrollbar-thumb {
background: #6f7074;
}
-}
\ No newline at end of file
+}
diff --git a/src/styles/components/_challenges.scss b/src/styles/components/_challenges.scss
index 6386fdc5ce07874b61497168aae552054c9f7feb..1a99a96a6c9a3993c3c73d51e6161df9a5989f10 100644
--- a/src/styles/components/_challenges.scss
+++ b/src/styles/components/_challenges.scss
@@ -391,6 +391,22 @@
.cp-icon-available {
margin: 2rem;
}
+ .cp-win-badge-star {
+ display: grid;
+ align-items: center;
+ justify-items: center;
+ position: absolute;
+ top: 222px;
+ .cp-win-badge {
+ grid-column: 1;
+ grid-row: 1;
+ z-index: 1;
+ }
+ .cp-win-star {
+ grid-column: 1;
+ grid-row: 1;
+ }
+ }
.cp-date {
color: $text-dark;
text-align: center;