Skip to content

Commit 43f2adf

Browse files
fix: allow sub partners only (#81)
* fix: allow sub partners only * force sub items * small fixes
1 parent a1f8f6f commit 43f2adf

File tree

2 files changed

+101
-20
lines changed

2 files changed

+101
-20
lines changed

src/Footer.tsx

Lines changed: 34 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -87,12 +87,19 @@ export namespace FooterProps {
8787
};
8888
}
8989

90-
export type PartnersLogos = {
91-
main: PartnersLogos.Logo;
92-
sub?: PartnersLogos.Logo[];
93-
};
90+
export type PartnersLogos = PartnersLogos.MainOnly | PartnersLogos.SubOnly;
9491

9592
export namespace PartnersLogos {
93+
export type MainOnly = {
94+
main: Logo;
95+
sub?: Logo[];
96+
};
97+
98+
export type SubOnly = {
99+
main?: Logo;
100+
sub: [Logo, ...Logo[]];
101+
};
102+
96103
export type Logo = {
97104
alt: string;
98105
href: string;
@@ -130,6 +137,8 @@ export const Footer = memo(
130137

131138
const { t } = useTranslation();
132139

140+
const { main: mainPartnersLogo, sub: subPartnersLogos = [] } = partnersLogos ?? {};
141+
133142
return (
134143
<footer
135144
className={cx(fr.cx("fr-footer"), classes.root, className)}
@@ -248,30 +257,35 @@ export const Footer = memo(
248257
classes.partnersMain
249258
)}
250259
>
251-
<a
252-
href={partnersLogos.main.href}
253-
className={cx(
254-
fr.cx("fr-footer__partners-link"),
255-
classes.partnersLink
256-
)}
257-
>
258-
<img
259-
alt={partnersLogos.main.alt}
260-
style={{ height: "5.625rem" }}
261-
src={partnersLogos.main.imgUrl}
262-
className={cx(fr.cx("fr-footer__logo"), classes.logo)}
263-
/>
264-
</a>
260+
{mainPartnersLogo !== undefined && (
261+
<a
262+
href={mainPartnersLogo.href}
263+
className={cx(
264+
fr.cx("fr-footer__partners-link"),
265+
classes.partnersLink
266+
)}
267+
>
268+
<img
269+
alt={mainPartnersLogo.alt}
270+
style={{ height: "5.625rem" }}
271+
src={mainPartnersLogo.imgUrl}
272+
className={cx(
273+
fr.cx("fr-footer__logo"),
274+
classes.logo
275+
)}
276+
/>
277+
</a>
278+
)}
265279
</div>
266-
{partnersLogos.sub !== undefined && (
280+
{subPartnersLogos.length !== 0 && (
267281
<div
268282
className={cx(
269283
fr.cx("fr-footer__partners-sub"),
270284
classes.partnersSub
271285
)}
272286
>
273287
<ul>
274-
{partnersLogos.sub.map(logo => (
288+
{subPartnersLogos.map(logo => (
275289
<li>
276290
<a
277291
href={logo.href}

stories/Footer.stories.tsx

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -225,3 +225,70 @@ export const WithPartners = getStory({
225225
]
226226
}
227227
});
228+
229+
export const WithMainPartnerOnly = getStory({
230+
"brandTop": (
231+
<>
232+
INTITULE
233+
<br />
234+
OFFICIEL
235+
</>
236+
),
237+
"accessibility": "fully compliant",
238+
"contentDescription": `
239+
Ce message est à remplacer par les informations de votre site.
240+
241+
Comme exemple de contenu, vous pouvez indiquer les informations
242+
suivantes : Le site officiel d’information administrative pour les entreprises.
243+
Retrouvez toutes les informations et démarches administratives nécessaires à la création,
244+
à la gestion et au développement de votre entreprise.
245+
`,
246+
"homeLinkProps": {
247+
"href": "/",
248+
"title": "Accueil - Nom de l’entité (ministère, secrétariat d‘état, gouvernement)"
249+
},
250+
"partnersLogos": {
251+
"main": {
252+
"href": "#",
253+
"imgUrl": placeholder_16x9ImgUrl,
254+
"alt": "[À MODIFIER - texte alternatif de l’image]"
255+
}
256+
}
257+
});
258+
259+
export const WithSubPartnersOnly = getStory({
260+
"brandTop": (
261+
<>
262+
INTITULE
263+
<br />
264+
OFFICIEL
265+
</>
266+
),
267+
"accessibility": "fully compliant",
268+
"contentDescription": `
269+
Ce message est à remplacer par les informations de votre site.
270+
271+
Comme exemple de contenu, vous pouvez indiquer les informations
272+
suivantes : Le site officiel d’information administrative pour les entreprises.
273+
Retrouvez toutes les informations et démarches administratives nécessaires à la création,
274+
à la gestion et au développement de votre entreprise.
275+
`,
276+
"homeLinkProps": {
277+
"href": "/",
278+
"title": "Accueil - Nom de l’entité (ministère, secrétariat d‘état, gouvernement)"
279+
},
280+
"partnersLogos": {
281+
"sub": [
282+
{
283+
"href": "#",
284+
"imgUrl": placeholder_16x9ImgUrl,
285+
"alt": "[À MODIFIER - texte alternatif de l’image]"
286+
},
287+
{
288+
"href": "#",
289+
"imgUrl": placeholder_16x9ImgUrl,
290+
"alt": "[À MODIFIER - texte alternatif de l’image]"
291+
}
292+
]
293+
}
294+
});

0 commit comments

Comments
 (0)