Skip to content

Commit

Permalink
fix: apparition du message avant la fin du fetch
Browse files Browse the repository at this point in the history
  • Loading branch information
@Clemog
Clemog committed Sep 14, 2023
1 parent e69dd65 commit 9514d88
Show file tree
Hide file tree
Showing 5 changed files with 84 additions and 77 deletions.
140 changes: 69 additions & 71 deletions source/components/localisation/Localisation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,83 +43,81 @@ export default ({ title = 'Ma région de simulation' }) => {
return (
<div>
<h2>📍 {t(title)}</h2>
{localisation != null ? (
regionParams ? (
<>
<p>
{localisation?.userChosen ? (
<span>
<Trans>Vous avez choisi </Trans>
{countryName}
</span>
) : iframeLocalisationOption ? (
<span>
<Trans> Vous utilisez la version {versionName} du test</Trans>
</span>
) : (
<span>
<Trans>
Nous avons détecté que vous faites cette simulation depuis{' '}
</Trans>
{countryName}
</span>
)}
<img
src={flag}
aria-hidden="true"
alt="Country Flag"
css={`
height: 1rem;
margin: 0 0.3rem;
vertical-align: sub;
`}
/>
.{' '}
{localisation?.userChosen && (
<button
className="ui__ dashed-button"
onClick={() => {
dispatch(resetLocalisation())
}}
>
<Trans>Revenir chez moi 🔙</Trans>
</button>
)}
</p>
<RegionModelAuthors authors={authors} />
</>
) : (
localisation?.country && (
<p>
<Trans>
Nous avons détecté que vous faites cette simulation depuis
</Trans>{' '}
{countryName}
<img
src={flag}
aria-hidden="true"
css={`
height: 1rem;
margin: 0 0.3rem;
vertical-align: sub;
`}
/>
.
<Trans i18nKey="components.localisation.Localisation.warnMessage">
Pour le moment, il n'existe pas de modèle de calcul pour{' '}
{{ countryName }}, le modèle Français vous est proposé par
défaut.
</Trans>
</p>
)
)
) : (
{!regionParams && localisation?.fetchDone ? (
<p>
<Trans i18nKey="components.localisation.Localisation.warnMessage2">
Nous n'avons pas pu détecter votre pays de simulation, le modèle
Français vous est proposé par défaut.
</Trans>{' '}
</p>
) : regionParams ? (
<>
<p>
{localisation?.userChosen ? (
<span>
<Trans>Vous avez choisi </Trans>
{countryName}
</span>
) : iframeLocalisationOption ? (
<span>
<Trans> Vous utilisez la version {versionName} du test</Trans>
</span>
) : (
<span>
<Trans>
Nous avons détecté que vous faites cette simulation depuis{' '}
</Trans>
{countryName}
</span>
)}
<img
src={flag}
aria-hidden="true"
alt="Country Flag"
css={`
height: 1rem;
margin: 0 0.3rem;
vertical-align: sub;
`}
/>
.{' '}
{localisation?.userChosen && (
<button
className="ui__ dashed-button"
onClick={() => {
dispatch(resetLocalisation())
}}
>
<Trans>Revenir chez moi 🔙</Trans>
</button>
)}
</p>
<RegionModelAuthors authors={authors} />
</>
) : (
localisation?.country && (
<p>
<Trans>
Nous avons détecté que vous faites cette simulation depuis
</Trans>{' '}
{countryName}
<img
src={flag}
aria-hidden="true"
alt="Country Flag"
css={`
height: 1rem;
margin: 0 0.3rem;
vertical-align: sub;
`}
/>
.
<Trans i18nKey="components.localisation.Localisation.warnMessage">
Pour le moment, il n'existe pas de modèle de calcul pour{' '}
{{ countryName }}, le modèle Français vous est proposé par défaut.
</Trans>
</p>
)
)}
{}
<RegionSelector />
Expand Down
6 changes: 5 additions & 1 deletion source/components/localisation/LocalisationMessage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,10 @@ export default (): JSX.Element => {

if (code === defaultModelRegionCode) return

if (localisation == null) return

if (!code && !localisation.fetchDone) return

return (
<IllustratedMessage
emoji="📍"
Expand All @@ -68,7 +72,7 @@ export default (): JSX.Element => {
</span>
)}{' '}
</p>
) : localisation ? (
) : code ? (
<p>
<Trans>
Nous avons détecté que vous faites cette simulation depuis
Expand Down
6 changes: 5 additions & 1 deletion source/components/localisation/useLocalisation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,10 @@ export default () => {
return undefined
}

if (localisation?.fetchDone) {
return undefined
}

const asyncFecthAPI = async () => {
await fetch(API)
.then((res) => {
Expand All @@ -88,8 +92,8 @@ export default () => {
)
})
}

asyncFecthAPI()
dispatch(setLocalisation({ ...localisation, fetchDone: true }))
return undefined
}, [localisation, iframeLocalisationOption, dispatch])

Expand Down
5 changes: 3 additions & 2 deletions source/components/localisation/utils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,9 @@ export type SupportedRegions = {
}

export type Localisation = {
country: { code: RegionCode; name: string }
userChosen: boolean
country?: { code: RegionCode; name: string }
userChosen?: boolean
fetchDone?: boolean
}

export const defaultModelRegionCode = 'FR'
Expand Down
4 changes: 2 additions & 2 deletions source/reducers/rootReducer.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -348,10 +348,10 @@ type LocalisationAction = { type: string } & Localisation

function localisation(
state = null,
{ type, country, userChosen }: LocalisationAction
{ type, country, userChosen, fetchDone = false }: LocalisationAction
): Localisation | null {
if (type === 'SET_LOCALISATION') {
return { country, userChosen }
return { country, userChosen, fetchDone }
} else if (type === 'RESET_LOCALISATION') {
return null
} else {
Expand Down

0 comments on commit 9514d88

Please sign in to comment.