Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(frontend): fix libelles Aménagements + desc filtre #14

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 26 additions & 19 deletions frontend/src/controls/Table/AmenagementTableLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -179,30 +179,37 @@ export default function AmenagementTableLayout(props: { modeAffichage: ModeAffic
modeAffichage={props.modeAffichage}
/>
<Flex className="w-100" justify="space-between" align="center">
<span className="legende">{getCountLibelle(count, "aménagement")}</span>
<span className="legende">
{getCountLibelle(
count,
props.modeAffichage === ModeAffichageAmenagement.ParAmenagement
? "aménagement"
: "bénéficiaire",
)}
</span>

<div className="d-block">
{JSON.stringify(getFiltreAmenagementDefault(auth.user as Utilisateur)) !==
JSON.stringify(filtreAmenagement) && (
<Button.Group>
<FiltreDescription
filtre={filtreAmenagement}
as="modal"
tooltip="Décrire le filtre en cours"
<Button.Group>
<FiltreDescription
filtre={filtreAmenagement}
as="modal"
tooltip="Décrire le filtre en cours"
/>
<Tooltip title="Retirer les filtres">
<Button
className="d-flex-inline-center mr-1"
icon={<Icon component={Unfilter} aria-label="Retirer les filtres" />}
onClick={() =>
setFiltreAmenagement(
getFiltreAmenagementDefault(auth.user as Utilisateur),
)
}
/>
<Tooltip title="Retirer les filtres">
<Button
className="d-flex-inline-center mr-1"
icon={<Icon component={Unfilter} aria-label="Retirer les filtres" />}
onClick={() =>
setFiltreAmenagement(
getFiltreAmenagementDefault(auth.user as Utilisateur),
)
}
/>
</Tooltip>
</Button.Group>
)}
</Tooltip>
</Button.Group>
)}
{auth.user?.isGestionnaire &&
props.modeAffichage === ModeAffichageAmenagement.ParAmenagement && (
<AmenagementTableExport filtreAmenagement={filtreAmenagement} />
Expand Down
52 changes: 34 additions & 18 deletions frontend/src/controls/Table/FiltreDescription.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,14 +52,14 @@ const filtreDescriptionItem: FiltreDescriptionType[] = [
{
key: "avisEse",
label: `Avis ${env.REACT_APP_ESPACE_SANTE_ABV || "santé"}`,
render: (value: string) => <Tag>{value}</Tag>,
render: (value: string) => <Tag className="mb-1">{value}</Tag>,
},
{
key: "campagne.typeDemande[]",
label: "Type de demande",
render: (value: string[]) =>
value.map((v) => (
<TypeDemandeItem typeDemandeId={v} showAvatar={false} className="mr-1" key={v} />
<TypeDemandeItem typeDemandeId={v} showAvatar={false} className="mr-1 mb-1" key={v} />
)),
},
{
Expand All @@ -71,67 +71,81 @@ const filtreDescriptionItem: FiltreDescriptionType[] = [
{
key: "composante[]",
label: "Composantes",
render: (value: string[]) => value.map((v) => <ComposanteItem key={v} composanteId={v} />),
render: (value: string[]) =>
value.map((v) => <ComposanteItem className="mb-1" key={v} composanteId={v} />),
},
{
key: "demandeur.nom",
label: "Nom",
render: (value: string) => <Tag className="mb-1">{value}</Tag>,
},
{ key: "demandeur.nom", label: "Nom", render: (value: string) => <Tag>{value}</Tag> },
{
key: "domaine",
label: "Domaine aménagement",
ignore: (value: string) => value === "Tous",
render: (value: string) =>
value === "Tous" ? (
<Tag>Tous les domaines</Tag>
<Tag className="mb-1">Tous les domaines</Tag>
) : (
<Tag>{DOMAINES_AMENAGEMENTS_INFOS[value]?.singulier}</Tag>
<Tag className="mb-1">{DOMAINES_AMENAGEMENTS_INFOS[value]?.singulier}</Tag>
),
},
{
key: "discipline[]",
label: "Disciplines",
render: (value: string[]) => value.map((v) => <DisciplineItem disciplineId={v} key={v} />),
render: (value: string[]) =>
value.map((v) => <DisciplineItem className="mb-1" disciplineId={v} key={v} />),
},
{
key: "etat[]",
label: "État demande",
render: (value: string[]) =>
value.map((v) => <EtatDemandeAvatar etatDemandeId={v} key={v} />),
value.map((v) => <EtatDemandeAvatar className="mb-1" etatDemandeId={v} key={v} />),
},
{
key: "etat",
label: "État demande",
render: (value: string) => <EtatDemandeAvatar etatDemandeId={value} key={value} />,
render: (value: string) => (
<EtatDemandeAvatar className="mb-1" etatDemandeId={value} key={value} />
),
},
{
key: "formation[]",
label: "Formations",
render: (value: string[]) => value.map((v) => <FormationItem formationId={v} />),
render: (value: string[]) =>
value.map((v) => <FormationItem className="mb-1" formationId={v} />),
},
{
key: "gestionnaire[]",
label: "Chargé•e d'accompagnement",
render: (value: string[]) =>
value.map((v) => <GestionnaireItem key={v} gestionnaireId={v} className="mr-1" />),
value.map((v) => <GestionnaireItem key={v} gestionnaireId={v} className="mr-1 mb-1" />),
},
{
key: "intervenant.campuses[]",
label: "Campus",
render: (value: string[]) =>
value.map((v) => <CampusItem key={v} campusId={v} className="mr-1" />),
value.map((v) => <CampusItem key={v} campusId={v} className="mr-1 mb-1" />),
},
{
key: "intervenant.competences[]",
label: "Compétences",
render: (value: string[]) =>
value.map((v) => (
<CompetenceItem key={v} competenceId={v} className="mr-1" showAvatar={false} />
<CompetenceItem key={v} competenceId={v} className="mr-1 mb-1" showAvatar={false} />
)),
},
{
key: "intervenant.typesEvenements[]",
label: "Types événements",
render: (value: string[]) =>
value.map((v) => (
<TypeEvenementItem key={v} typeEvenementId={v} showAvatar={false} className="mr-1" />
<TypeEvenementItem
key={v}
typeEvenementId={v}
showAvatar={false}
className="mr-1 mb-1"
/>
)),
},
{
Expand All @@ -140,10 +154,10 @@ const filtreDescriptionItem: FiltreDescriptionType[] = [
ignore: (value: boolean | "undefined") => value === "undefined",
render: (value: boolean) => {
if (value) {
return <Tag>Archivé</Tag>;
return <Tag className="mb-1">Archivé</Tag>;
}

return <Tag>Actif</Tag>;
return <Tag className="mb-1">Actif</Tag>;
},
},
{ key: "nom", label: "Nom", render: (value: string) => <Tag>{value}</Tag> },
Expand All @@ -161,12 +175,14 @@ const filtreDescriptionItem: FiltreDescriptionType[] = [
{
key: "suivis[]",
label: "Suivis aménagements",
render: (value: string[]) => value.map((v) => <SuiviAmenagementItem key={v} suiviId={v} />),
render: (value: string[]) =>
value.map((v) => <SuiviAmenagementItem key={v} suiviId={v} className="mb-1" />),
},
{
key: "tags[]",
label: "Tags",
render: (value: string[]) => value.map((v) => <UtilisateurTag key={v} tagId={v} />),
render: (value: string[]) =>
value.map((v) => <UtilisateurTag key={v} tagId={v} className="mb-1" />),
},
{
key: "type[]",
Expand Down