-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: mise en place du premier formulaire (description) en mode édition
- Loading branch information
Showing
22 changed files
with
772 additions
and
73 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,85 @@ | ||
import { useQuery } from "@tanstack/react-query"; | ||
import { FC, useState } from "react"; | ||
import RQKeys from "../../../modules/espaceco/RQKeys"; | ||
import api from "../../api"; | ||
import { datastoreNavItems } from "../../../config/datastoreNavItems"; | ||
import AppLayout from "../../../components/Layout/AppLayout"; | ||
import { useTranslation } from "../../../i18n/i18n"; | ||
import LoadingText from "../../../components/Utils/LoadingText"; | ||
import { fr } from "@codegouvfr/react-dsfr"; | ||
import Alert from "@codegouvfr/react-dsfr/Alert"; | ||
import Button from "@codegouvfr/react-dsfr/Button"; | ||
import { routes } from "../../../router/router"; | ||
import Tabs from "@codegouvfr/react-dsfr/Tabs"; | ||
import Description from "./management/Description"; | ||
import { CommunityResponseDTO } from "../../../@types/espaceco"; | ||
import { CartesApiException } from "../../../modules/jsonFetch"; | ||
|
||
type ManageCommunityProps = { | ||
communityId: number; | ||
}; | ||
|
||
const navItems = datastoreNavItems(); | ||
|
||
const ManageCommunity: FC<ManageCommunityProps> = ({ communityId }) => { | ||
const { t } = useTranslation("ManageCommunity"); | ||
|
||
const communityQuery = useQuery<CommunityResponseDTO, CartesApiException>({ | ||
queryKey: RQKeys.community(communityId), | ||
queryFn: () => api.community.getCommunity(communityId), | ||
staleTime: 3600000, | ||
}); | ||
|
||
const [selectedTabId, setSelectedTabId] = useState("tab1"); | ||
|
||
return ( | ||
<AppLayout navItems={navItems} documentTitle={t("title", { name: communityQuery.data?.name })}> | ||
<h1>{t("title", { name: communityQuery.data?.name })}</h1> | ||
{communityQuery.isLoading ? ( | ||
<LoadingText message={t("loading")} /> | ||
) : communityQuery.isError ? ( | ||
<Alert | ||
severity="error" | ||
closable={false} | ||
title={t("fetch_failed")} | ||
description={ | ||
<> | ||
<p>{communityQuery.error?.message}</p> | ||
<Button linkProps={routes.espaceco_community_list().link}>{t("back_to_list")}</Button> | ||
</> | ||
} | ||
/> | ||
) : ( | ||
communityQuery.data !== undefined && ( | ||
<div className={fr.cx("fr-container", "fr-py-2w")}> | ||
<Tabs | ||
selectedTabId={selectedTabId} | ||
tabs={[ | ||
{ tabId: "tab1", label: t("tab1") }, | ||
{ tabId: "tab2", label: t("tab2") }, | ||
{ tabId: "tab3", label: t("tab3") }, | ||
{ tabId: "tab4", label: t("tab4") }, | ||
{ tabId: "tab5", label: t("tab5") }, | ||
{ tabId: "tab6", label: t("tab6") }, | ||
]} | ||
onTabChange={setSelectedTabId} | ||
> | ||
<> | ||
{(() => { | ||
switch (selectedTabId) { | ||
case "tab1": | ||
return <Description community={communityQuery.data} />; | ||
default: | ||
return <p>`Content of ${selectedTabId}`</p>; | ||
} | ||
})()} | ||
</> | ||
</Tabs> | ||
</div> | ||
) | ||
)} | ||
</AppLayout> | ||
); | ||
}; | ||
|
||
export default ManageCommunity; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,95 @@ | ||
import { declareComponentKeys } from "i18nifty"; | ||
import { Translations } from "../../../i18n/i18n"; | ||
|
||
export type logoAction = "add" | "modify" | "delete"; | ||
|
||
// traductions | ||
export const { i18n } = declareComponentKeys< | ||
| { K: "title"; P: { name: string | undefined }; R: string } | ||
| "loading" | ||
| "fetch_failed" | ||
| "back_to_list" | ||
| "tab1" | ||
| "tab2" | ||
| "tab3" | ||
| "tab4" | ||
| "tab5" | ||
| "tab6" | ||
| "desc.name" | ||
| "desc.hint_name" | ||
| "desc.description" | ||
| "desc.hint_description" | ||
| "desc.logo" | ||
| "desc.logo.title" | ||
| { K: "logo_action"; P: { action: logoAction }; R: string } | ||
| "logo_confirm_delete_modal.title" | ||
| "modal.logo.title" | ||
| "modal.logo.file_hint" | ||
| "desc.keywords" | ||
>()("ManageCommunity"); | ||
|
||
export const ManageCommunityFrTranslations: Translations<"fr">["ManageCommunity"] = { | ||
title: ({ name }) => (name === undefined ? "Gérer le guichet" : `Gérer le guichet - ${name}`), | ||
loading: "Recherche du guichet en cours ...", | ||
fetch_failed: "La récupération des informations sur le guichet a échoué", | ||
back_to_list: "Retour à la liste des guichets", | ||
tab1: "Description", | ||
tab2: "Bases de données", | ||
tab3: "Zoom, centrage", | ||
tab4: "Couches de la carte", | ||
tab5: "Outils", | ||
tab6: "Signalements", | ||
"desc.name": "Nom du guichet", | ||
"desc.hint_name": "Donnez un nom clair et compréhensible", | ||
"desc.description": "Description", | ||
"desc.hint_description": "Bref résumé narratif de l'objectif du guichet", | ||
"desc.logo": "Logo (optionnel)", | ||
"desc.logo.title": "Ajouter, modifier ou supprimer le logo du guichet", | ||
logo_action: ({ action }) => { | ||
switch (action) { | ||
case "add": | ||
return "Ajouter un logo"; | ||
case "modify": | ||
return "Remplacer le logo"; | ||
case "delete": | ||
return "Supprimer le logo"; | ||
} | ||
}, | ||
"logo_confirm_delete_modal.title": "Êtes-vous sûr de vouloir supprimer le logo de ce guichet ?", | ||
"modal.logo.title": "Logo du guichet", | ||
"modal.logo.file_hint": "Taille maximale : 5 Mo. Formats acceptés : jpg, png", | ||
"desc.keywords": "Mots-clés (optionnel)", | ||
}; | ||
|
||
export const ManageCommunityEnTranslations: Translations<"en">["ManageCommunity"] = { | ||
title: ({ name }) => (name === undefined ? "Manage front office" : `Manage front office - ${name}`), | ||
loading: undefined, | ||
fetch_failed: undefined, | ||
back_to_list: undefined, | ||
tab1: undefined, | ||
tab2: undefined, | ||
tab3: undefined, | ||
tab4: undefined, | ||
tab5: undefined, | ||
tab6: undefined, | ||
"desc.name": undefined, | ||
"desc.hint_name": undefined, | ||
"desc.description": undefined, | ||
"desc.hint_description": undefined, | ||
"desc.logo": undefined, | ||
"desc.logo.title": undefined, | ||
logo_action: ({ action }) => { | ||
switch (action) { | ||
case "add": | ||
return "Add logo"; | ||
case "modify": | ||
return "Replace logo"; | ||
case "delete": | ||
return "Delete logo"; | ||
} | ||
}, | ||
"logo_confirm_delete_modal.title": undefined, | ||
"modal.logo.title": undefined, | ||
"modal.logo.file_hint": undefined, | ||
"desc.keywords": undefined, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.