Skip to content

Commit 555edb5

Browse files
sokl-octosokl-octo
committed
feat(apprentissage): termine la campagne et pérennise le contenu des pages (#3567)
1 parent a02d7b8 commit 555edb5

File tree

11 files changed

+198
-829
lines changed

11 files changed

+198
-829
lines changed

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/CampagneApprentissageEntreprises.test.tsx

+134-475
Large diffs are not rendered by default.

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/CampagneApprentissageEntreprises.tsx

+12-63
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,21 @@
11
import React from 'react';
22

33
import styles from '~/client/components/features/CampagneApprentissage/CampagneApprentissage.module.scss';
4-
import EnSavoirPlusApprentissageEntreprises
5-
from '~/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/EnSavoirPlusApprentissageEntreprises/EnSavoirPlusApprentissageEntreprises';
64
import {
75
InformationSurEmbaucheApprenti,
86
} from '~/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/InformationSurEmbaucheApprenti/InformationSurEmbaucheApprenti';
9-
import {
10-
NewInformationSurEmbaucheApprenti,
11-
} from '~/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/NewInformationSurEmbaucheApprenti/NewInformationSurEmbaucheApprenti';
127
import {
138
VerbatimsEmployeursApprentis,
149
} from '~/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/VerbatimsEmployeursApprentis/VerbatimsEmployeursApprentis';
1510
import {
1611
Raisons,
1712
RaisonsDeChoisirApprentissage,
1813
} from '~/client/components/features/CampagneApprentissage/RaisonsDeChoisirApprentissage/RaisonsDeChoisirApprentissage';
19-
import VideosCampagneApprentissage
20-
from '~/client/components/features/CampagneApprentissage/VideosCampagneApprentissage/VideosCampagneApprentissage';
2114
import { HeroWithIllustration } from '~/client/components/ui/Hero/Hero';
2215
import { Link } from '~/client/components/ui/Link/Link';
23-
import { TYPE_SIMULATEUR } from '~/pages/apprentissage/simulation/index.page';
24-
import { VideoCampagneApprentissage } from '~/server/campagne-apprentissage/domain/videoCampagneApprentissage';
2516

26-
interface CampagneApprentissageEntreprisesProps {
27-
videos: Array<VideoCampagneApprentissage> | null
28-
}
2917

30-
export function CampagneApprentissageEntreprises({ videos }: CampagneApprentissageEntreprisesProps) {
18+
export function CampagneApprentissageEntreprises() {
3119
const raisons: Raisons[] = [
3220
{
3321
iconName: 'award',
@@ -51,38 +39,6 @@ export function CampagneApprentissageEntreprises({ videos }: CampagneApprentissa
5139
},
5240
];
5341

54-
const campagneApprentissageEstEnCours = process.env.NEXT_PUBLIC_CAMPAGNE_APPRENTISSAGE_FEATURE === '1';
55-
56-
function nouveauBandeauDeCampagne() {
57-
return (
58-
<HeroWithIllustration image={'/images/campagne-apprentissage-employeur.webp'} className={styles.hero}>
59-
<h1>Avec l’apprentissage, recrutez la future pépite de votre entreprise&nbsp;!</h1>
60-
<p>Des milliers de jeunes motivés, avec des compétences à revendre, n’attendent que
61-
vous pour démarrer leur contrat d’apprentissage.</p>
62-
<Link href={'/apprentissage/deposer-offre'} appearance={'asPrimaryButton'} className={styles.cta}>
63-
Déposer mon offre d’apprentissage
64-
<Link.Icon />
65-
</Link>
66-
</HeroWithIllustration>
67-
);
68-
}
69-
70-
function ancienBandeauDeCampagne() {
71-
return (
72-
<HeroWithIllustration image={'/images/campagne-apprentissage-entreprise-avec-texte.webp'} className={styles.hero}>
73-
<h1>L’apprentissage, pour mon entreprise <span
74-
className={styles.avoidLineBreakInside}>c’est le bon choix&nbsp;!</span></h1>
75-
<Link href={`/apprentissage/simulation?simulateur=${TYPE_SIMULATEUR.EMPLOYEUR}`}
76-
appearance={'asPrimaryButton'}
77-
className={styles.cta}>
78-
<span className={styles.mobileOnly}>Simuler le coût d’embauche</span>
79-
<span className={styles.desktopOnly}>Simuler le coût de l’embauche d’un apprenti</span>
80-
<Link.Icon />
81-
</Link>
82-
</HeroWithIllustration>
83-
);
84-
}
85-
8642
const verbatimsApprentisListe = [
8743
{
8844
imageUrl: '/images/campagne-verbatim-fabrice.webp',
@@ -119,26 +75,19 @@ export function CampagneApprentissageEntreprises({ videos }: CampagneApprentissa
11975
return (
12076
<>
12177
<header className={styles.titrePage}>
122-
{campagneApprentissageEstEnCours ? nouveauBandeauDeCampagne()
123-
: ancienBandeauDeCampagne()}
78+
<HeroWithIllustration image={'/images/campagne-apprentissage-employeur.webp'} className={styles.hero}>
79+
<h1>Avec l’apprentissage, recrutez la future pépite de votre entreprise&nbsp;!</h1>
80+
<p>Des milliers de jeunes motivés, avec des compétences à revendre, n’attendent que
81+
vous pour démarrer leur contrat d’apprentissage.</p>
82+
<Link href={'/apprentissage/deposer-offre'} appearance={'asPrimaryButton'} className={styles.cta}>
83+
Déposer mon offre d’apprentissage
84+
<Link.Icon />
85+
</Link>
86+
</HeroWithIllustration>
12487
</header>
12588
<RaisonsDeChoisirApprentissage titre="5 bonnes raisons de choisir l’apprentissage :" raisons={raisons} />
126-
{(!campagneApprentissageEstEnCours &&
127-
<EnSavoirPlusApprentissageEntreprises />
128-
)}
129-
{ videos && videos.length > 0 && (
130-
<VideosCampagneApprentissage
131-
titre={'Ils ont choisi d’embaucher un apprenti ! Pourquoi pas vous ?'}
132-
description={'Découvrez les témoignages des maîtres d’apprentissage et des apprentis qu’ils accompagnent au quotidien.'}
133-
videos={videos} />
134-
)}
135-
{(campagneApprentissageEstEnCours ? (
136-
<>
137-
<VerbatimsEmployeursApprentis verbatimsListe={verbatimsApprentisListe} />
138-
<NewInformationSurEmbaucheApprenti />
139-
</>
140-
) :
141-
<InformationSurEmbaucheApprenti />)}
89+
<VerbatimsEmployeursApprentis verbatimsListe={verbatimsApprentisListe} />
90+
<InformationSurEmbaucheApprenti />
14291
</>
14392
);
14493
}

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/InformationSurEmbaucheApprenti/InformationSurEmbaucheApprenti.module.scss

+17-23
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,15 @@
1-
@use '@styles/utilities-deprecated';
1+
@use '@styles/utilities';
22

33
.informationSurEmbauche {
4+
max-width: 100%;
45

5-
@include utilities-deprecated.media(large) {
6-
display: grid;
7-
grid-template-columns: 1fr 1fr;
8-
grid-gap: 2.5rem;
9-
10-
max-width: 100%;
11-
margin: 0;
12-
padding: 0 2rem;
13-
}
14-
15-
& .renseignement {
16-
& span {
17-
display: inline-block;
18-
}
19-
}
20-
21-
& .renseignement, & .aideFinanciere {
6+
& .aideFinanciere {
227
display: flex;
238
flex-direction: column;
249
gap: 1.5rem;
2510
padding: 1.75rem 1rem;
2611

27-
@include utilities-deprecated.media(large) {
12+
@include utilities.media(large) {
2813
gap: 2.5rem;
2914
padding: 5rem 1rem
3015
}
@@ -36,16 +21,25 @@
3621

3722
& h2 {
3823
@extend %subheading;
39-
color: utilities-deprecated.$color-primary;
24+
color: utilities.$color-primary;
4025
flex-grow: 1;
4126

42-
@include utilities-deprecated.media(large) {
27+
@include utilities.media(large) {
28+
text-align: center;
29+
}
30+
}
31+
32+
& h2 + p {
33+
@extend %subheading;
34+
color: utilities.$color-title-primary-contrast;
35+
36+
@include utilities.media(large) {
4337
text-align: center;
4438
}
4539
}
4640

4741
& .description {
48-
@include utilities-deprecated.media(large) {
42+
@include utilities.media(large) {
4943
text-align: center;
5044
}
5145
}
@@ -56,7 +50,7 @@
5650
justify-content: center;
5751
align-self: center;
5852

59-
@include utilities-deprecated.media(large) {
53+
@include utilities.media(large) {
6054
max-width: fit-content;
6155
}
6256
}

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/InformationSurEmbaucheApprenti/InformationSurEmbaucheApprenti.tsx

+8-19
Original file line numberDiff line numberDiff line change
@@ -6,29 +6,18 @@ import { Container } from '~/client/components/layouts/Container/Container';
66
import { Link } from '~/client/components/ui/Link/Link';
77

88
export function InformationSurEmbaucheApprenti() {
9-
const embaucherUnApprentiLink = 'https://travail-emploi.gouv.fr/formation-professionnelle/formation-en-alternance-10751/apprentissage/embaucher-un-apprenti/';
10-
const enSavoirPlusSurAideLink = 'https://travail-emploi.gouv.fr/formation-professionnelle/entreprise-et-alternance/aides-au-recrutement-d-un-alternant/article/aide-2023-aux-employeurs-qui-recrutent-en-alternance';
119

1210
return (
1311
<Container className={styles.informationSurEmbauche}>
14-
<section aria-labelledby={'titre-section-renseignement'} className={styles.renseignement}>
15-
<h2 id={'titre-section-renseignement'}>
16-
Comme eux, vous souhaitez faire <span>le choix de l’apprentissage&nbsp;?</span>
17-
</h2>
18-
<Link href={embaucherUnApprentiLink} appearance={'asSecondaryButton'} className={styles.link}>
19-
Se renseigner sur l’embauche
20-
<Link.Icon />
21-
</Link>
22-
</section>
2312
<section aria-labelledby={'titre-section-aide'} className={styles.aideFinanciere}>
24-
<h2 id={'titre-section-aide'}>
25-
Vous envisagez de recruter un apprenti&nbsp;? <span>Vous pouvez bénéficier d’une aide financière</span>
26-
</h2>
27-
<p className={styles.description}>
28-
Cette aide de 6000 euros maximum est versée pour la première année de contrat, jusqu’au niveau master
29-
</p>
30-
<Link href={enSavoirPlusSurAideLink} appearance={'asSecondaryButton'} className={styles.link}>
31-
En savoir plus
13+
<hgroup>
14+
<h2 id={'titre-section-aide'}>
15+
Vous voulez en savoir plus sur l’apprentissage ?
16+
</h2>
17+
<p>Nous avons toutes les réponses à vos questions !</p>
18+
</hgroup>
19+
<Link href={'/faq/apprentissage-employeurs-apprentis'} appearance={'asPrimaryButton'} className={styles.link}>
20+
Consultez notre FAQ
3221
<Link.Icon />
3322
</Link>
3423
</section>

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/NewInformationSurEmbaucheApprenti/NewInformationSurEmbaucheApprenti.module.scss

-57
This file was deleted.

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageEntreprises/NewInformationSurEmbaucheApprenti/NewInformationSurEmbaucheApprenti.tsx

-26
This file was deleted.

‎src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/CampagneApprentissageJeunes.tsx

+15-40
Original file line numberDiff line numberDiff line change
@@ -48,49 +48,24 @@ export function CampagneApprentissageJeunes({ videos }: CampagneApprentissageJeu
4848
},
4949
];
5050

51-
const campagneApprentissageEstEnCours = process.env.NEXT_PUBLIC_CAMPAGNE_APPRENTISSAGE_FEATURE === '1';
52-
53-
function nouveauBandeauDeCampagne() {
54-
return (
55-
<HeroWithIllustration image={'/images/campagne-apprentissage-jeune-oct-2024.webp'}
56-
className={classNames(styles.hero, stylesApprenti.hero)}>
57-
<h1>Avec l’apprentissage, vous apprenez directement <span
58-
className={styles.avoidLineBreakInside}>sur le terrain</span> <span className={styles.avoidLineBreakInside}>et vous êtes payés !</span>
59-
</h1>
60-
<Link href={`/apprentissage/simulation?simulateur=${TYPE_SIMULATEUR.ALTERNANT}`}
61-
appearance={'asPrimaryButton'}
62-
className={styles.cta}>
63-
<span>
64-
Simuler votre rémunération <span className={styles.desktopOnly}>en tant qu’apprenti</span>
65-
</span>
66-
<Link.Icon />
67-
</Link>
68-
</HeroWithIllustration>
69-
);
70-
}
71-
72-
function ancienBandeauDeCampagne() {
73-
return (
74-
<HeroWithIllustration image={'/images/campagne-apprentissage-jeune-avec-texte.webp'} className={styles.hero}>
75-
<h1>Avec l’apprentissage, vous apprenez directement <span
76-
className={styles.avoidLineBreakInside}>sur le terrain</span> <span className={styles.avoidLineBreakInside}>et vous êtes payés !</span>
77-
</h1>
78-
<Link href={`/apprentissage/simulation?simulateur=${TYPE_SIMULATEUR.ALTERNANT}`}
79-
appearance={'asPrimaryButton'}
80-
className={styles.cta}>
81-
<span>
82-
Simuler votre rémunération <span className={styles.desktopOnly}>en tant qu’apprenti</span>
83-
</span>
84-
<Link.Icon />
85-
</Link>
86-
</HeroWithIllustration>
87-
);
88-
}
89-
9051
return (
9152
<>
9253
<header className={styles.titrePage}>
93-
{campagneApprentissageEstEnCours ? nouveauBandeauDeCampagne() : ancienBandeauDeCampagne()}
54+
<HeroWithIllustration image={'/images/campagne-apprentissage-jeune-oct-2024.webp'}
55+
className={classNames(styles.hero, stylesApprenti.hero)}>
56+
<h1>Avec l’apprentissage, vous apprenez directement <span
57+
className={styles.avoidLineBreakInside}>sur le terrain</span> <span
58+
className={styles.avoidLineBreakInside}>et vous êtes payés !</span>
59+
</h1>
60+
<Link href={`/apprentissage/simulation?simulateur=${TYPE_SIMULATEUR.ALTERNANT}`}
61+
appearance={'asPrimaryButton'}
62+
className={styles.cta}>
63+
<span>
64+
Simuler votre rémunération <span className={styles.desktopOnly}>en tant qu’apprenti</span>
65+
</span>
66+
<Link.Icon />
67+
</Link>
68+
</HeroWithIllustration>
9469
</header>
9570
<RaisonsDeChoisirApprentissage titre="5 bonnes raisons de choisir l’apprentissage" raisons={raisons} />
9671
{ videos.length > 0 && (

‎src/client/components/layouts/Header/Navigation/NavigationStructure.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ const employeurNav = (): NavigationItemWithChildren => ({
100100
{ label: 'Je deviens mentor', link: '/je-deviens-mentor' },
101101
{ label: 'Je propose des immersions', link: '/immersions' },
102102
{ label: 'Je forme les jeunes grâce à l‘emploi', link: '/je-recrute-afpr-poei' },
103-
...(process.env.NEXT_PUBLIC_CAMPAGNE_APPRENTISSAGE_FEATURE === '1' ? [{ label: 'Je recrute un apprenti', link: '/apprentissage-entreprises' }] : []),
103+
{ label: 'Je recrute un apprenti', link: '/apprentissage-entreprises' },
104104
],
105105
label: 'Recruter et agir pour les jeunes',
106106
},

0 commit comments

Comments
 (0)