betagouv
/
mon-entreprise
mirror of https://github.com/betagouv/mon-entreprise
1
0
Fork 0
Code Releases Activity

Mise en conformité RGAA : Liens (#2320) 

* feat: Add aria-labels to Privacy links

* feat: Ajout d'aria-labels manquants

* feat: Add missing aria-labels

* feat: Ajoute plusieurs aria-labels manquants sur liens

* fix: Ajoute les traductions cassées + aria-labels manquants

* feat: Ajoute trad

* feat: Ajoute "nouvelle fenêtre" sur les aria-label des liens ext

* feat : Ajoute les trads

* fix: clean + ajoute un nouvelle fenêtre

* fix: Retire role alert inutile
pull/2351/head
Benjamin Arias 2022-10-20 17:05:07 +02:00 committed by GitHub
parent 178a13f561
commit 492f6f9026
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
50 changed files with 477 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
site/source/Provider.tsx
View File

@ -14,7 +14,7 @@ import { ErrorBoundary } from '@sentry/react'
import i18next from 'i18next'
import { createContext, ReactNode } from 'react'
import { HelmetProvider } from 'react-helmet-async'
import { I18nextProvider } from 'react-i18next'
import { I18nextProvider, useTranslation } from 'react-i18next'
import { Provider as ReduxProvider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
import { ServiceWorker } from './ServiceWorker'
@ -41,6 +41,8 @@ export default function Provider({
}: ProviderProps): JSX.Element {
useIframeResizer()
const { t } = useTranslation()
return (
<DesignSystemThemeProvider>
<GlobalStyle />
@ -48,7 +50,7 @@ export default function Provider({
showDialog
fallback={
<Container>
<Link href="/">
<Link href="/" aria-label={t("Retourner à la page d'accueil")}>
<img
src={logo}
alt="Logo mon-entreprise"

8
site/source/components/ChiffreAffairesActivitéMixte.tsx
View File

@ -121,6 +121,8 @@ function ActivitéMixte() {
[dispatch, situation]
)
const { t } = useTranslation()
return (
<div key={Boolean(defaultChecked).toString()}>
<StyledActivitéMixteContainer>
@ -134,7 +136,11 @@ function ActivitéMixte() {
Activité mixte
</Switch>
</Trans>
<ExplicableRule dottedName={rule.dottedName} light />
<ExplicableRule
dottedName={rule.dottedName}
light
aria-label={t('En savoir plus')}
/>
</StyledActivitéMixteContainer>
</div>
)

5
site/source/components/Feedback/index.tsx
View File

@ -86,7 +86,10 @@ export default function PageFeedback({ customMessage }: PageFeedbackProps) {
<Trans i18nKey="feedback.beta-testeur">
Pour continuer à donner votre avis et accéder aux nouveautés en
avant-première,{' '}
<Link href={INSCRIPTION_LINK}>
<Link
href={INSCRIPTION_LINK}
aria-label="inscrivez-vous sur la liste des beta-testeur, nouvelle fenêtre"
>
inscrivez-vous sur la liste des beta-testeur
</Link>
</Trans>

9
site/source/components/JeDonneMonAvis.tsx
View File

@ -1,11 +1,18 @@
import { Link } from '@/design-system/typography/link'
import { useTranslation } from 'react-i18next'
export const JeDonneMonAvis = () => {
const { t } = useTranslation()
const href =
'https://jedonnemonavis.numerique.gouv.fr/Demarches/3226?&view-mode=formulaire-avis&nd_mode=en-ligne-enti%C3%A8rement&nd_source=button&key=e62c98db43a483b98032a17ddcc8d279'
return (
<Link href={href}>
<Link
href={href}
aria-label={t(
'Je donne mon avis, donner mon avis sur jedonnemonavis.numerique.gouv.fr, nouvelle fenêtre'
)}
>
<img
src="https://jedonnemonavis.numerique.gouv.fr/static/bouton-blanc.svg"
alt="Je donne mon avis"

7
site/source/components/LegalNotice.tsx
View File

@ -48,7 +48,12 @@ export default function LegalNotice() {
<br />
San Francisco, CA 94107 <br />
Site web :&nbsp;
<a href="https://www.netlify.com" target="_blank" rel="noreferrer">
<a
href="https://www.netlify.com"
aria-label="https://www.netlify.com, nouvelle fenêtre"
target="_blank"
rel="noreferrer"
>
https://www.netlify.com
</a>
</Trans>

8
site/source/components/PaySlip.tsx
View File

@ -100,6 +100,8 @@ export default function PaySlip() {
const parsedRules = useEngine().getParsedRules()
const cotisationsBySection = getCotisationsBySection(parsedRules)
const { t } = useTranslation()
return (
<div
className="payslip__container"
@ -144,7 +146,11 @@ export default function PaySlip() {
<Fragment key={section.dottedName}>
<H5 className="payslip__cotisationTitle">
{section.title}
<ExplicableRule light dottedName={section.dottedName} />
<ExplicableRule
light
dottedName={section.dottedName}
aria-label={t('En savoir plus')}
/>
</H5>
{cotisations.map((cotisation) => (
<Cotisation key={cotisation} dottedName={cotisation} />

7
site/source/components/QuickLinks.tsx
View File

@ -2,7 +2,7 @@ import { goToQuestion } from '@/actions/actions'
import { Spacing } from '@/design-system/layout'
import { Link } from '@/design-system/typography/link'
import { SmallBody } from '@/design-system/typography/paragraphs'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { useDispatch, useSelector } from 'react-redux'
import { RootState } from '@/reducers/rootReducer'
import {
@ -21,6 +21,8 @@ export default function QuickLinks() {
const quickLinksToHide = useSelector(answeredQuestionsSelector)
const dispatch = useDispatch()
const { t } = useTranslation()
if (!quickLinks) {
return <Spacing sm />
}
@ -41,6 +43,9 @@ export default function QuickLinks() {
key={dottedName}
underline={dottedName === currentQuestion}
onPress={() => dispatch(goToQuestion(dottedName))}
aria-label={t('{{question}}, aller à la question : {{question}}', {
question: label,
})}
>
<Trans i18nKey={'quicklinks.' + label}>{label}</Trans>
</StyledLink>

7
site/source/components/SelectSimulationYear.tsx
View File

@ -1,5 +1,5 @@
import { useContext } from 'react'
import { Trans, useTranslation } from 'react-i18next'
import { Trans } from 'react-i18next'
import { useDispatch } from 'react-redux'
import { Link as DesignSystemLink } from '@/design-system/typography/link'
import { EngineContext } from '@/components/utils/EngineContext'
@ -14,7 +14,6 @@ const Bold = styled.span<{ bold: boolean }>`
export const SelectSimulationYear = () => {
const dispatch = useDispatch()
const { t } = useTranslation()
const year = useContext(EngineContext).evaluate('date')
const choices = [2021, 2022]
@ -38,10 +37,6 @@ export const SelectSimulationYear = () => {
onPress={() =>
dispatch(updateSituation('date', `01/01/${year}`))
}
title={t(
'pages.simulateurs.select-year.click-to-change-year',
"Cliquez pour changer d'année"
)}
>
{actualYear === 2022 ? (
<Trans i18nKey="pages.simulateurs.select-year.access">

5
site/source/components/SimulateurWarning.tsx
View File

@ -44,7 +44,10 @@ export default function SimulateurWarning({
entreprise (CFE) qui est dûe dès la deuxième année d'exercice.
Son montant varie fortement en fonction du chiffre d'affaires et
de la domiciliation de l'entreprise.{' '}
<Link href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F23547">
<Link
aria-label="Plus d'infos, en savoir plus sur service-public.fr, nouvelle fenêtre"
href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F23547"
>
Plus d'infos.
</Link>
</Trans>

4
site/source/components/Simulation/SimulationGoals.tsx
View File

@ -2,6 +2,7 @@ import { Grid } from '@/design-system/layout'
import { Link } from '@/design-system/typography/link'
import { firstStepCompletedSelector } from '@/selectors/simulationSelectors'
import React from 'react'
import { useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import styled, { css, ThemeProvider } from 'styled-components'
import { Logo } from '../Logo'
@ -89,6 +90,8 @@ const StyledSimulationGoals = styled.div<
function TopSection({ toggles }: { toggles?: React.ReactNode }) {
const inIframe = useIsEmbedded()
const { t } = useTranslation()
return (
<Section>
{inIframe && (
@ -103,6 +106,7 @@ function TopSection({ toggles }: { toggles?: React.ReactNode }) {
href={import.meta.env.VITE_FR_BASE_URL}
target="_blank"
rel="noreferrer"
aria-label={t("Accéder à la page d'accueil, nouvelle fenêtre")}
>
<Logo />
</LogoContainer>

3
site/source/components/Simulation/index.tsx
View File

@ -9,7 +9,7 @@ import {
firstStepCompletedSelector,
} from '@/selectors/simulationSelectors'
import React from 'react'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import styled from 'styled-components'
import { TrackPage } from '../../ATInternetTracking'
@ -54,6 +54,7 @@ export default function Simulation({
const existingCompany = !!useSelector(companySituationSelector)[
'entreprise . SIREN'
]
const { t } = useTranslation()
return (
<>

22
site/source/components/conversation/AnswerList.tsx
View File

@ -134,6 +134,10 @@ export default function AnswerList({ onClose, children }: AnswerListProps) {
'Retrouvez toutes les informations publiques concernant votre entreprise sur'
)}{' '}
<Link
aria-label={t(
'gérer.ressources.annuaire-entreprises.aria-label',
'Annuaire des Entreprises, nouvelle fenêtre'
)}
href={`https://annuaire-entreprises.data.gouv.fr/entreprise/${siret}`}
>
Annuaire des Entreprises.
@ -177,6 +181,8 @@ function StepsTable({
rules: Array<EvaluatedRule>
onClose: () => void
}) {
const { t } = useTranslation()
return (
<>
{rules
@ -185,7 +191,11 @@ function StepsTable({
<StyledAnswerList container key={rule.dottedName}>
<Grid item xs>
{rule.title}
<ExplicableRule light dottedName={rule.dottedName} />
<ExplicableRule
aria-label={t('En savoir plus')}
light
dottedName={rule.dottedName}
/>
</Grid>
<StyledAnswer item xs="auto">
<AnswerElement {...rule} />
@ -200,6 +210,8 @@ function AnswerElement(rule: EvaluatedRule) {
const dispatch = useDispatch()
const engine = useEngine()
const { t } = useTranslation()
const parentDottedName = utils.ruleParent(rule.dottedName) as DottedName
const questionDottedName = rule.rawNode.question
? rule.dottedName
@ -218,7 +230,7 @@ function AnswerElement(rule: EvaluatedRule) {
<PopoverWithTrigger
small
trigger={(buttonProps) => (
<Link {...buttonProps} role="button" title="Modifier">
<Link {...buttonProps} role="button" aria-label="Modifier">
<Value expression={rule.dottedName} linkToRule={false} />{' '}
<span className="print-hidden">
<Emoji emoji="✏" alt="Modifier" aria-hidden={false} />
@ -231,7 +243,11 @@ function AnswerElement(rule: EvaluatedRule) {
<form onSubmit={onClose}>
<H3>
{evaluateQuestion(engine, engine.getRule(questionDottedName))}
<ExplicableRule light dottedName={questionDottedName} />
<ExplicableRule
light
dottedName={questionDottedName}
aria-label={t('En savoir plus')}
/>
</H3>
<RuleInput
dottedName={questionDottedName}

5
site/source/components/conversation/Conversation.tsx
View File

@ -23,7 +23,7 @@ import {
import { evaluateQuestion } from '@/utils'
import { PublicodesExpression } from 'publicodes'
import React, { useContext, useEffect } from 'react'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { useDispatch, useSelector } from 'react-redux'
import { TrackPage } from '../../ATInternetTracking'
import { JeDonneMonAvis } from '../JeDonneMonAvis'
@ -48,6 +48,7 @@ export default function Conversation({
const situation = useSelector(situationSelector)
const currentQuestionIsAnswered = !(currentQuestion in useMissingVariables())
const previousAnswers = useSelector(answeredQuestionsSelector)
const { t } = useTranslation()
useEffect(() => {
if (currentQuestion) {
dispatch(goToQuestion(currentQuestion))
@ -100,7 +101,7 @@ export default function Conversation({
<H3 id="questionHeader">
{evaluateQuestion(engine, engine.getRule(currentQuestion))}
<ExplicableRule
aria-label="En savoir plus"
aria-label={t('En savoir plus')}
light
dottedName={currentQuestion}
/>

22
site/source/components/layout/Footer/Footer.tsx
View File

@ -19,7 +19,8 @@ const hrefLangLink = alternateLinks()
export default function Footer() {
const { absoluteSitePaths } = useSitePaths()
const showFeedback = useShowFeedback()
const language = useTranslation().i18n.language as 'fr' | 'en'
const { t, i18n } = useTranslation()
const language = i18n.language as 'fr' | 'en'
const currentEnv = import.meta.env.MODE
const encodedUri =
@ -55,8 +56,15 @@ export default function Footer() {
{language === 'en' && (
<Body>
This website is provided by the{' '}
<Link href="https://www.urssaf.fr">Urssaf</Link>, the French
social security contributions collector.
<Link
href="https://www.urssaf.fr"
aria-label={t(
'Urssaf, voir le site urssaf.fr, nouvelle fenêtre'
)}
>
Urssaf
</Link>
, the French social security contributions collector.
</Body>
)}
</Container>
@ -127,7 +135,13 @@ export default function Footer() {
</li>
{language === 'fr' && (
<li>
<Link to={absoluteSitePaths.accessibilité}>
<Link
to={absoluteSitePaths.accessibilité}
aria-label={t(
'footer.accessibilitéAriaLabel',
'Accessibilité : non conforme, en savoir plus'
)}
>
<Trans i18nKey="footer.accessibilité">
Accessibilité : non conforme
</Trans>

18
site/source/components/layout/Footer/Privacy.tsx
View File

@ -41,9 +41,15 @@ export default function Privacy({ label }: { label?: string }) {
Nous recueillons des statistiques anonymes sur l'utilisation du site,
que nous utilisons dans le seul but d'améliorer le service,
conformément aux{' '}
<a href="https://www.cnil.fr/fr/solutions-pour-les-cookies-de-mesure-daudience">
<Link
href="https://www.cnil.fr/fr/solutions-pour-les-cookies-de-mesure-daudience"
aria-label={t(
'privacyContent.recommandationsAriaLabel',
"recommandations de la CNIL, voir plus d'informations à ce sujet sur le site de la CNIL, nouvelle fenêtre"
)}
>
recommandations de la CNIL
</a>{' '}
</Link>{' '}
et au règlement RGPD. Ce sont les seules données qui quittent votre
navigateur.
</Body>
@ -76,7 +82,13 @@ export default function Privacy({ label }: { label?: string }) {
afin que vous puissiez facilement les retrouver lors d'une prochaine
visite sur le site. Si vous ne souhaitez pas que ce soit le cas, nous
vous conseillons d'utiliser la{' '}
<Link href="https://www.cnil.fr/fr/la-navigation-privee-pour-limiter-les-risques-de-piratage-de-vos-comptes-en-ligne">
<Link
href="https://www.cnil.fr/fr/la-navigation-privee-pour-limiter-les-risques-de-piratage-de-vos-comptes-en-ligne"
aria-label={t(
'privacyContent.privateNavAriaLabel',
"navigation privée, voir plus d'informations à ce sujet sur le site de la CNIL, nouvelle fenêtre"
)}
>
navigation privée
</Link>
.

6
site/source/components/layout/Header.tsx
View File

@ -12,12 +12,16 @@ export default function Header() {
const { absoluteSitePaths } = useSitePaths()
const {
i18n: { language },
t,
} = useTranslation()
return (
<Container>
<StyledHeader>
<Link to={absoluteSitePaths.index}>
<Link
to={absoluteSitePaths.index}
aria-label={t("Logo mon entreprise, accéder à la page d'accueil")}
>
<StyledLogo>
<Logo />
</StyledLogo>

8
site/source/components/layout/NewsBanner.tsx
View File

@ -53,7 +53,13 @@ function NewsBanner({ lastRelease }: { lastRelease: LastRelease }) {
<span>
<Emoji emoji="✨" /> Découvrez les nouveautés{' '}
{determinant(lastRelease.name)}
<Link to={absoluteSitePaths.nouveautés}>
<Link
to={absoluteSitePaths.nouveautés}
aria-label={t(
'Voir les nouveautés apportées par la version {{release}}',
{ release: lastRelease.name.toLowerCase() }
)}
>
{lastRelease.name.toLowerCase()}
</Link>
</span>

4
site/source/components/simulationExplanation/InstitutionsPartenaires.tsx
View File

@ -49,6 +49,7 @@ export default function InstitutionsPartenaires() {
href="https://www.ameli.fr/assure/droits-demarches/salaries-travailleurs-independants-et-personnes-sans-emploi/emploi-independant-non-salarie/praticien-auxiliaire-medical"
target="_blank"
rel="noreferrer"
aria-label="Logo CPAM, accéder à ameli.fr, nouvelle fenêtre"
>
<img src={assuranceMaladieSrc} alt="Logo CPAM" />
</InstitutionLogo>
@ -105,6 +106,7 @@ export function CotisationsUrssaf({
href="https://www.urssaf.fr/portail/home.html"
target="_blank"
rel="noreferrer"
aria-label="Logo URSSAF, accéder à urssaf.fr, nouvelle fenêtre"
>
<img src={urssafSrc} alt="Logo Urssaf" />
</InstitutionLogo>
@ -131,6 +133,7 @@ export function ImpôtsDGFIP() {
href="https://www.impots.gouv.fr"
target="_blank"
rel="noreferrer"
aria-label="Logo DGFiP, accéder à impots.gouv.fr, nouvelle fenêtre"
>
<img src={dgfipSrc} alt="Logo DGFiP" />
</InstitutionLogo>
@ -240,6 +243,7 @@ export function InstitutionsPartenairesArtisteAuteur() {
href="http://www.ircec.fr/"
target="_blank"
rel="noreferrer"
aria-label="Logo IRCEC, accéder à ircec.fr, nouvelle fenêtre"
>
<img src={logosSrc.IRCEC} alt="Logo IRCEC" />
</InstitutionLogo>

22
site/source/components/simulationExplanation/SalaryExplanation.tsx
View File

@ -16,6 +16,8 @@ import { ThemeContext } from 'styled-components'
export default function SalaryExplanation() {
const payslipRef = useRef<HTMLDivElement>(null)
const { t } = useTranslation()
if (useInversionFail()) {
return null
}
@ -59,7 +61,10 @@ export default function SalaryExplanation() {
Le simulateur vous aide à comprendre votre bulletin de paie,
sans lui être opposable. Pour plus d&apos;informations, rendez
vous sur&nbsp;
<Link href="https://www.service-public.fr/particuliers/vosdroits/F559">
<Link
href="https://www.service-public.fr/particuliers/vosdroits/F559"
aria-label="service-public.fr, nouvelle fenêtre"
>
service-public.fr
</Link>
.
@ -70,11 +75,17 @@ export default function SalaryExplanation() {
Il ne prend pour l'instant pas en compte les accords et
conventions collectives, ni la myriade d'aides aux entreprises.
Trouvez votre convention collective{' '}
<Link href="https://code.travail.gouv.fr/outils/convention-collective#entreprise">
<Link
href="https://code.travail.gouv.fr/outils/convention-collective#entreprise"
aria-label="ici, trouvez votre convention collective sur code.travail.gouv.fr, nouvelle fenêtre"
>
ici
</Link>
, et explorez les aides sur&nbsp;
<Link href="https://www.aides-entreprises.fr">
<Link
href="https://www.aides-entreprises.fr"
aria-label="aides-entreprises.fr, nouvelle fenêtre"
>
aides-entreprises.fr
</Link>
.
@ -147,7 +158,10 @@ export const DistributionSection = ({
<SmallBody>
<Trans>
Pour en savoir plus, rendez-vous sur le site{' '}
<Link href="https://www.aquoiserventlescotisations.urssaf.fr/">
<Link
href="https://www.aquoiserventlescotisations.urssaf.fr/"
aria-label="aquoiserventlescotisations.urssaf.fr, nouvelle fenêtre"
>
aquoiserventlescotisations.urssaf.fr
</Link>
</Trans>

1
site/source/design-system/message/index.tsx
View File

@ -36,7 +36,6 @@ export function Message({
type={type}
border={border}
light={light}
role="alert"
aria-atomic
>
{icon &&

5
site/source/design-system/typography/link.tsx
View File

@ -8,7 +8,6 @@ import React, {
useCallback,
useRef,
} from 'react'
import { useTranslation } from 'react-i18next'
import { NavLink } from 'react-router-dom'
import styled, { css } from 'styled-components'
@ -79,17 +78,14 @@ export const Link = React.forwardRef<
})
export function useExternalLinkProps({
title,
href,
children,
openInSameWindow,
}: {
title?: string | null
href?: string
children?: React.ReactNode
openInSameWindow?: true
}) {
const { t } = useTranslation()
if (
openInSameWindow ||
!href ||
@ -99,7 +95,6 @@ export function useExternalLinkProps({
}
return {
title: (title ? `${title} - ` : '') + t('Nouvelle fenêtre'),
target: '_blank',
rel: 'noreferrer',
external: true,

2
site/source/iframe-integration-script.js
View File

@ -73,7 +73,7 @@ const simulateurURL = url.toString()
links.innerHTML = `
<div style="text-align: center; margin-bottom: 2rem; font-size: 80%">
Retrouvez ce simulateur et bien d'autres sur
<a href="${simulateurURL}" target="_blank" rel="noopener">
<a href="${simulateurURL}" target="_blank" rel="noopener" aria-label="mon-entreprise.urssaf.fr, nouvelle fenêtre">
mon-entreprise.urssaf.fr
</a>
</div>

24
site/source/locales/ui-en.yaml
View File

@ -383,9 +383,9 @@ assistant-DRI:
below.</1>"
nombre-déclarations: This is your {{nthDeclaration}} tax return since the
creation of your company.
intro: <0><0>We propose you a help to fill in the income from your professional
intro: <0><0>We offer you a help to fill in the income from your professional
activity in your <2>income tax return of 2021</2> on
<5>impot.gouv.fr</5>.<7></7></0><1>Answer these few questions, at the end
<5>impots.gouv.fr</5>.<7></7></0><1>Answer these few questions, at the end
you will have :</1><2><0>The forms that concern you</0><1>The list of the
boxes that concern you with the amount to be filled</1><2>An estimate of the
social security contributions to be paid to the Urssaf in 2022</2></2></0>
@ -394,7 +394,7 @@ assistant-DRI:
know the <2>amount of social security contributions to be paid in
2022</2></0><1>This tool is <1>100% confidential</1>: all the information
you enter will remain in your browser.</1><2>To make your income tax return,
you will have to connect to <2>impot.gouv.fr</2>.</2></1>"
you will have to connect to <2>impots.gouv.fr</2>.</2></1>"
associés:
choix1: Alone
choix2: Several partners
@ -626,22 +626,28 @@ déplier: show more
dû par: owed by
d’aides: aids
embauche:
cesuAriaLabel: chèque emploi associatif (CEA), see more information on
cesu.urssaf.fr, new window
chaque mois: >
<0>Then each month</0> <1>
<0>Compute the individual social contributions (using the chosen payslip software)</0>
<1>Declare the contributions through the DSN, the new online declaration system</1>
<2>Deliver the standardised payslip to your employee</2>
</1> <2>Get an example payslip</2>
teseAriaLabel: titre emploi service entreprise (Tese), see more information on
letese.urssaf.fr, new window
tâches:
contrat:
titre: Sign an employment contract with your employee
description: All the necessary steps to hire your first employee.
dpae:
ariaLabel: be done online, access the URSSAF website, new window
description: >
This can be done through the form called DPAE, must be completed
within 8 days before any hiring, and can <2>be done online (Fr)</2>
titre: Declare your hiring t o the social administration
logiciel de paie:
ariaLabel: private payroll software, see examples on dsn-info.fr, new window
description: >
With fewer than 20 employees, payslips and declarations can be
handled online by the <2> Tese (Fr)</2>, a tool developped by the french
@ -655,6 +661,7 @@ embauche:
description: All the necessary steps to hire your first employee in France.
titre: The formalities for hiring
pension:
aria-label: Find my pension fund, new window
description: Find your pension institute (Fr)
titre: Contact the compulsory supplementary pension institution assigned to you
prévoyance . santé:
@ -761,6 +768,7 @@ entreprise:
deposit of capital.</1>
titre: Deposit capital funds
comptable:
ariaLabel: ""
description: Managing a company brings a number of <1>accounting
obligations</1>. It is advisable to call in a competent person or use a
website that can handle accounting for you.
@ -820,6 +828,7 @@ entreprise:
main activity run. A secondary activity can be registered.
titre: Write the corporate purpose of the company
statuts:
aria-label: Status examples for your {{status}}, new window
description: The company's articles of association ( "les statuts"), is an
official document written in French, describing the status choice,
naming the associate(s) and the contributed capital. <2>For more than
@ -862,6 +871,7 @@ feedback:
fieldRequired: Required field
footer:
accessibilité: "Accessibility: not compliant"
accessibilitéAriaLabel: "Accessibility : not compliant, learn more"
formeJuridique:
EI: Also called company in own name or company in a personal name. No capital
contribution is necessary. Private wealth and corporate wealth are one.
@ -973,6 +983,7 @@ gérer:
minoritaire: Minority director
ressources:
annuaire-entreprises:
aria-label: Company Directory, new window
body: Find all public information about your company on
cta: Visit the site
title: See your public data
@ -1231,9 +1242,9 @@ pages:
cta: Discover
title: Publicodes
code:
copy-code: Copy the code
description: "Here is the code to copy and paste on your site:"
titre: Integration Code
copy-code: Copy the code
components:
CasParticuliers: '<0>Learn more about...</0><1><0>How to make a simulation in
the past?</0><1>Since the end of 2021, the calculation rules of the
@ -1288,6 +1299,7 @@ pages:
"Net salary" in the simulator, or by searching for "Net salary" in the
search box at the top right.</2>
couleur: "What color? "
doc: ""
home:
choice:
api:
@ -1906,6 +1918,10 @@ privacyContent:
you can easily retrieve it the next time you visit the site. If you do not
wish this to be the case, we advise you to use <2>private browsing</2>.</0>
ok: Your preferences have been saved
privateNavAriaLabel: private navigation, see more information on this subject on
the CNIL website, new window
recommandationsAriaLabel: recommendations of the CNIL, see more information on
this subject on the CNIL website, new window
texte: <0></0><1>We collect anonymous statistics on the use of the site, which
we use for the sole purpose of improving the service, in accordance with the
<2>recommendations of the CNIL</2> and the RGPD regulation. This is the only

23
site/source/locales/ui-fr.yaml
View File

@ -275,7 +275,7 @@ assistant-DRI:
la création de votre entreprise.
intro: <0><0>Nous vous proposons une aide pour remplir les revenus issus de
votre activité professionnelle dans votre <2>déclaration des revenu de
2021</2> sur <5>impot.gouv.fr</5>.<7></7></0><1>Répondez à ces quelques
2021</2> sur <5>impots.gouv.fr</5>.<7></7></0><1>Répondez à ces quelques
questions, à la fin vous aurez :</1><2><0>Les formulaires qui vous
concernent</0><1>La liste des cases qui vous concernent avec le montant à
remplir</1><2>Une estimation des cotisations sociales à payer à l'Urssaf en
@ -286,7 +286,7 @@ assistant-DRI:
payer en 2022</2></0><1>Cet outil est <1>100 % confidentiel</1> : toutes les
informations que vous renseignez resteront dans votre navigateur.</1><2>Pour
faire votre déclaration de revenu, il faudra vous connecter sur
<2>impot.gouv.fr</2>.</2></1>"
<2>impots.gouv.fr</2>.</2></1>"
associés:
choix1: Seul
choix2: Plusieurs personnes
@ -437,22 +437,29 @@ domiciliation inconnue: domiciliation inconnue
domiciliée à: domiciliée à
d’aides: d’aides
embauche:
cesuAriaLabel: chèque emploi associatif (CEA), voir plus d'informations sur
cesu.urssaf.fr, nouvelle fenêtre
chaque mois: <0>Tous les mois</0><1><0>Utiliser un logiciel de paie pour
calculer les cotisations sociales et les transmettre via la déclaration
sociale nominative (DSN).<1></1>Certaines offres de service de l’Urssaf
comme le <4>titre emploi service entreprise (Tese)</4> ou le <8>chèque
emploi associatif (CEA)</8> gèrent automatiquement la transmission de la DSN
pour vous.</0><1>Remettre la fiche de paie à votre employé</1></1>
teseAriaLabel: titre emploi service entreprise (Tese), voir plus d'informations
sur letese.urssaf.fr, nouvelle fenêtre
tâches:
contrat:
titre: Signer un contrat de travail avec votre employé
description: Toutes les étapes nécessaires à l'embauche de votre premier employé.
dpae:
ariaLabel: être effectué en ligne, accéder au site de l'URSSAF, nouvelle fenêtre
description: Ceci peut être fait par le biais du formulaire appelé DPAE, doit
être complété dans les 8 jours avant toute embauche, et peut <2>être
effectué en ligne</2>.
titre: Déclarer l'embauche à l'administration sociale
logiciel de paie:
ariaLabel: logiciel de paie privé, voir des exemples sur dsn-info.fr, nouvelle
fenêtre
description: Les fiches de paie et les déclarations peuvent être traitées en
ligne gratuitement par le <2>Tese</2>. Vous pouvez aussi utiliser un
<5>logiciel de paie privé.</5>
@ -465,6 +472,7 @@ embauche:
description: Toutes les démarches nécessaires à l'embauche de votre premier salarié.
titre: Les formalités pour embaucher
pension:
aria-label: Trouver mon institution de prévoyance, nouvelle fenêtre
description: Trouver mon institution de prévoyance
titre: Prendre contact avec l'institution de prévoyance complémentaire
obligatoire qui vous est assignée
@ -557,6 +565,7 @@ entreprise:
capital.</1>
titre: Déposer le capital
comptable:
ariaLabel: obligations comptables, voir le détail sur economie.gouv.fr
description: La gestion d'une entreprise impose un certain nombre
d'<1>obligations comptables</1>. Il est conseillé de faire appel aux
services d'un expert-comptable ou d'un logiciel de comptabilité en
@ -596,6 +605,7 @@ entreprise:
Une activité secondaire peut être enregistrée.
titre: Déterminer l'objet social
statuts:
aria-label: Exemples de status pour votre {{statut}}, nouvelle fenêtre
description: Il s'agit d'un document officiel qui intègre la forme juridique,
nomme les associés et leurs contributions au capital. <2>Dans le cas
d'une création d'entreprise avec plusieurs associés, il est recommandé
@ -628,6 +638,7 @@ feedback:
fieldRequired: Champ requis
footer:
accessibilité: "Accessibilité : non conforme"
accessibilitéAriaLabel: "Accessibilité : non conforme, en savoir plus"
formeJuridique:
EI: Aucun apport en capital n'est nécessaire. Le capital privé et le capital de
l'entreprise ne font qu'un.
@ -747,6 +758,7 @@ gérer:
minoritaire: Dirigeant minoritaire
ressources:
annuaire-entreprises:
aria-label: Annuaire des Entreprises, nouvelle fenêtre
body: Retrouvez toutes les informations publiques concernant votre entreprise
sur
cta: Visiter le site
@ -994,9 +1006,9 @@ pages:
cta: Découvrir
title: Publicodes
code:
copy-code: Copier le code
description: "Voici le code à copier-coller sur votre site&nbsp;:"
titre: Code d'intégration
copy-code: Copier le code
components:
CasParticuliers: "<0>En savoir plus sur...</0><1><0>Comment faire une simulation
dans le passé ?</0><1>Depuis fin 2021, les règles de calculs des
@ -1054,6 +1066,7 @@ pages:
en cliquant sur « Salaire net » dans le simulateur, ou en recherchant «
Salaire net » dans la recherche en haut à droite.</2>
couleur: "Quelle couleur ? "
doc: documentation en ligne, voir la documentation en ligne
home:
choice:
api:
@ -1576,6 +1589,10 @@ privacyContent:
prochaine visite sur le site. Si vous ne souhaitez pas que ce soit le cas,
nous vous conseillons d'utiliser la <2>navigation privée</2>.</0>
ok: Vos préférences ont bien été enregistrées
privateNavAriaLabel: navigation privée, voir plus d'informations à ce sujet sur
le site de la CNIL, nouvelle fenêtre
recommandationsAriaLabel: recommandations de la CNIL, voir plus d'informations à
ce sujet sur le site de la CNIL, nouvelle fenêtre
texte: <0></0><1>Nous recueillons des statistiques anonymes sur l'utilisation du
site, que nous utilisons dans le seul but d'améliorer le service,
conformément aux <2>recommandations de la CNIL</2> et au règlement RGPD. Ce

18
site/source/pages/Accessibilité.tsx
View File

@ -60,7 +60,7 @@ export default function Accessibilité() {
href="https://www.acoss.fr/files/RGAA/accessibilite_numerique-schema_pluriannuel_2020_2022-Acoss.pdf"
target="_blank"
rel="noreferrer"
title="La stratégie et le plan d’action à mettre en œuvre - Nouvelle fenêtre"
aria-label="la stratégie et le plan d’action à mettre en œuvre, en savoir plus, nouvelle fenêtre"
>
la stratégie et le plan d’action à mettre en œuvre
</Link>
@ -68,14 +68,20 @@ export default function Accessibilité() {
</Body>
<Body>
Cette déclaration d’accessibilité s’applique à{' '}
<Link href="https://mon-entreprise.urssaf.fr">
<Link
href="https://mon-entreprise.urssaf.fr"
aria-label="https://mon-entreprise.urssaf.fr, nouvelle fenêtre"
>
https://mon-entreprise.urssaf.fr
</Link>
.
</Body>
<H3>État de conformité</H3>
<Body>
<Link href="https://mon-entreprise.urssaf.fr">
<Link
href="https://mon-entreprise.urssaf.fr"
aria-label="https://mon-entreprise.urssaf.fr, nouvelle fenêtre"
>
https://mon-entreprise.urssaf.fr
</Link>{' '}
n’est actuellement pas en conformité avec le{' '}
@ -83,7 +89,7 @@ export default function Accessibilité() {
href="https://numerique.gouv.fr/publications/rgaa-accessibilite/"
target="_blank"
rel="noreferrer"
title="Référentiel général d’amélioration de l’accessibilité (RGAA) - Nouvelle fenêtre"
aria-label="Référentiel général d’amélioration de l’accessibilité (RGAA), en savoir plus, nouvelle fenêtre"
>
référentiel général d’amélioration de l’accessibilité (RGAA)
</Link>
@ -126,7 +132,7 @@ export default function Accessibilité() {
href="https://formulaire.defenseurdesdroits.fr/"
target="_blank"
rel="noreferrer"
title="https://formulaire.defenseurdesdroits.fr/ - Nouvelle fenêtre"
aria-label="https://formulaire.defenseurdesdroits.fr/, nouvelle fenêtre"
>
https://formulaire.defenseurdesdroits.fr/
</Link>
@ -138,7 +144,7 @@ export default function Accessibilité() {
href="https://www.defenseurdesdroits.fr/saisir/delegues"
target="_blank"
rel="noreferrer"
title="https://www.defenseurdesdroits.fr/saisir/delegues - Nouvelle fenêtre"
aria-label="https://www.defenseurdesdroits.fr/saisir/delegues, nouvelle fenêtre"
>
https://www.defenseurdesdroits.fr/saisir/delegues
</Link>

15
site/source/pages/Creer/AfterRegistration.tsx
View File

@ -61,7 +61,10 @@ export default function AfterRegistration() {
Le code APE correspond au <strong>secteur d'activité</strong> de votre
entreprise. Il classifie la branche principale de votre entreprise
dans la nomenclature nationale d'activités françaises « NAF » (
<Link href="https://www.insee.fr/fr/metadonnees/nafr2/section/A?champRecherche=false">
<Link
href="https://www.insee.fr/fr/metadonnees/nafr2/section/A?champRecherche=false"
aria-label="voir la liste, nouvelle fenêtre"
>
voir la liste
</Link>
).{' '}
@ -78,7 +81,10 @@ export default function AfterRegistration() {
</span>
<p>
En cas de code APE erroné, vous pouvez{' '}
<Link href="https://www.insee.fr/fr/information/2015441">
<Link
href="https://www.insee.fr/fr/information/2015441"
aria-label="demander une modification, nouvelle fenêtre"
>
demander une modification
</Link>{' '}
à l'INSEE.
@ -94,7 +100,10 @@ export default function AfterRegistration() {
<strong>l'existence légale d'une entreprise commerciale</strong>. Le
plus souvent, pour être valable par les procédures administratives, il
doit dater de moins de 3 mois.{' '}
<Link href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F21000">
<Link
href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F21000"
aria-label="Plus d'infos, voir plus d'informations sur service-public.fr, nouvelle fenêtre"
>
Plus d'infos.
</Link>
</Trans>

48
site/source/pages/Creer/CreationChecklist.tsx
View File

@ -148,7 +148,13 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
par une marque, une raison sociale, un nom commercial, un nom
de domaine Internet, etc. Vous pouvez vérifier dans la base de
données{' '}
<Link href="https://bases-marques.inpi.fr/">INPI</Link>.
<Link
href="https://bases-marques.inpi.fr/"
aria-label="INPI, accéder à la base données de marques de l'INPI, nouvelle fenêtre"
>
INPI
</Link>
.
</SmallBody>
</Trans>
}
@ -185,7 +191,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
entreprise sera incorporée. Dans certains lieux et certaines
situations, vous pouvez bénéficier d'un financement public
important (exonération de charges, de taxes, etc.).{' '}
<Link href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F2160">
<Link
href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F2160"
aria-label="Plus d'infos, voir plus d'informations sur service-public.fr, nouvelle fenêtre"
>
Plus d'infos
</Link>
</SmallBody>
@ -270,7 +279,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
<SmallBody>
Le dépôt consiste en un transfert d'une somme d'argent sur un
compte bloqué auprès d'une banque ou de la{' '}
<Link href="https://consignations.caissedesdepots.fr/entreprise/creer-votre-entreprise/creation-dentreprise-deposez-votre-capital-social">
<Link
href="https://consignations.caissedesdepots.fr/entreprise/creer-votre-entreprise/creation-dentreprise-deposez-votre-capital-social"
aria-label="Caisse des dépôts et consignations, en savoir plus sur consignations.caissedesdepots.fr, nouvelle fenêtre"
>
Caisse des dépôts et consignations
</Link>{' '}
ou d'un notaire, qui doit alors fournir un certificat de dépôt
@ -306,7 +318,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
les 30 000 €.
</SmallBody>
<SmallBody>
<Link href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F31538">
<Link
href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F31538"
aria-label="Plus d'infos, voir plus d'informations sur service-public.fr, nouvelle fenêtre"
>
Plus d'informations
</Link>
</SmallBody>
@ -330,7 +345,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
pratiqués par le journal choisi{' '}
</SmallBody>
<SmallBody>
<Link href="https://actulegales.fr/journaux-annonces-legales">
<Link
href="https://actulegales.fr/journaux-annonces-legales"
aria-label="Trouver un journal d'annonces légales (JAL), nouvelle fenêtre"
>
Trouver un journal d'annonces légales (JAL)
</Link>
</SmallBody>
@ -404,7 +422,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
<SmallBody>
<Trans i18nKey="entreprise.tâches.comptable.description">
La gestion d'une entreprise impose un certain nombre d'
<Link href="https://www.economie.gouv.fr/entreprises/obligations-comptables">
<Link
href="https://www.economie.gouv.fr/entreprises/obligations-comptables"
aria-label="obligations comptables, voir le détail sur economie.gouv.fr, nouvelle fenêtre"
>
obligations comptables
</Link>
. Il est conseillé de faire appel aux services d'un
@ -431,7 +452,10 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
ainsi qu'en matière de responsabilité civile de l'entreprise et
de ses dirigeants ou en matière de perte d'exploitation.
</SmallBody>
<Link href="https://www.economie.gouv.fr/entreprises/assurances-obligatoires">
<Link
href="https://www.economie.gouv.fr/entreprises/assurances-obligatoires"
aria-label="Plus d'infos, voir plus d'informations sur economie.gouv.fr, nouvelle fenêtre"
>
Plus d'infos
</Link>
</Trans>
@ -581,6 +605,7 @@ type StatutsExampleProps = {
}
const StatutsExample = ({ statut }: StatutsExampleProps) => {
const { t } = useTranslation()
const links = {
SARL: 'https://bpifrance-creation.fr/file/109068/download?token=rmc93Ve3',
EURL: 'https://bpifrance-creation.fr/file/109070/download?token=Ul-rT6Z0',
@ -591,7 +616,14 @@ const StatutsExample = ({ statut }: StatutsExampleProps) => {
}
return (
<Link href={links[statut as keyof typeof links]}>
<Link
href={links[statut as keyof typeof links]}
aria-label={t(
'entreprise.tâches.statuts.aria-label',
'Exemples de status pour votre {{statut}}, nouvelle fenêtre',
{ statut }
)}
>
<Trans i18nKey="entreprise.tâches.statuts.exemple">
Exemple de statuts pour votre
</Trans>{' '}

10
site/source/pages/Creer/GuideStatut/AutoEntrepreneur.tsx
View File

@ -37,13 +37,19 @@ export default function Autoentrepreneur() {
<Body>
<strong>Note</strong> : Certaines activités sont exclues de ce statut
(
<Link href="https://www.afecreation.fr/pid10375/pour-quelles-activites.html#principales-exclusions">
<Link
href="https://www.afecreation.fr/pid10375/pour-quelles-activites.html#principales-exclusions"
aria-label={t('voir la liste sur afecreation.fr, nouvelle fenêtre')}
>
{' '}
voir la liste
</Link>
). Certaines activités sont réglementées avec une qualification ou une
expérience professionnelle (
<Link href="https://www.afecreation.fr/pid316/activites-reglementees.html">
<Link
href="https://www.afecreation.fr/pid316/activites-reglementees.html"
aria-label={t('voir la liste sur afecreation.fr, nouvelle fenêtre')}
>
voir la liste
</Link>
).

28
site/source/pages/Creer/GuideStatut/PreviousAnswers.tsx
View File

@ -2,10 +2,16 @@ import { Link } from '@/design-system/typography/link'
import { RootState } from '@/reducers/rootReducer'
import { useSitePaths } from '@/sitePaths'
import { LegalStatusRequirements } from '@/types/companyTypes'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import styled from 'styled-components'
interface RequirementToTextType {
props: {
children: string
}
}
const requirementToText = (
key: keyof LegalStatusRequirements,
value: string
@ -67,14 +73,22 @@ export default function PreviousAnswers() {
const legalStatus = useSelector(
(state: RootState) => state.choixStatutJuridique.companyLegalStatus
)
const { t } = useTranslation()
if (Object.values(legalStatus).length < 1) {
return null
}
return (
<PreviousAnswersList>
{Object.entries(legalStatus).map(
([key, value]) =>
{Object.entries(legalStatus).map(([key, value]) => {
const textObject = requirementToText(
key as any,
value as any
) as RequirementToTextType
return (
value !== undefined && (
<PreviousAnswersItem key={key}>
<Link
@ -83,12 +97,16 @@ export default function PreviousAnswers() {
key as keyof typeof legalStatus
]
}
aria-label={t("Revenir à l'étape {{step}}", {
step: textObject?.props?.children || '',
})}
>
{requirementToText(key as any, value as any)}
{textObject}
</Link>
</PreviousAnswersItem>
)
)}
)
})}
</PreviousAnswersList>
)
}

6
site/source/pages/Landing/Landing.tsx
View File

@ -126,7 +126,7 @@ export default function Landing() {
<Body>
Nous sommes une petite{' '}
<Link
aria-label="équipe, accéder à notre page de présentation d'équipe"
aria-label="équipe, accéder à notre page de présentation d'équipe, nouvelle fenêtre"
href="https://beta.gouv.fr/startups/mon-entreprise.html#equipe"
>
équipe
@ -134,7 +134,7 @@ export default function Landing() {
autonome et pluridisciplinaire au sein de{' '}
<Link
href="https://www.urssaf.fr"
aria-label="l'URSSAF, accéder au site urssaf.fr"
aria-label="l'URSSAF, accéder au site urssaf.fr, nouvelle fenêtre"
>
l’Urssaf
</Link>
@ -142,7 +142,7 @@ export default function Landing() {
d’améliorer en permanence ce site conformément à l'approche{' '}
<Link
href="https://beta.gouv.fr/approche/manifeste"
aria-label="beta.gouv.fr, accéder au site beta.gouv.fr "
aria-label="beta.gouv.fr, accéder au site beta.gouv.fr, nouvelle fenêtre"
>
beta.gouv.fr
</Link>

7
site/source/pages/Nouveautes/Nouveautes.tsx
View File

@ -15,6 +15,7 @@ import { Body } from '@/design-system/typography/paragraphs'
import { useFetchData } from '@/hooks/useFetchData'
import { useSitePaths } from '@/sitePaths'
import { useMemo } from 'react'
import { useTranslation } from 'react-i18next'
import { Navigate, useMatch, useNavigate } from 'react-router-dom'
import styled from 'styled-components'
import { TrackPage } from '../../ATInternetTracking'
@ -30,6 +31,8 @@ export default function Nouveautés() {
const slug = useMatch(`${absoluteSitePaths.nouveautés}/:slug`)?.params?.slug
useHideNewsBanner()
const { t } = useTranslation()
const releasesWithId = useMemo(
() => (data && data.map((v, id) => ({ ...v, id }))) ?? [],
[data]
@ -67,7 +70,9 @@ export default function Nouveautés() {
<Body>
Nous améliorons le site en continu à partir de{' '}
<Link
aria-label="vos retours, accéder aux statistiques d'utilisation"
aria-label={t(
"vos retours, accéder aux statistiques d'utilisation"
)}
to={absoluteSitePaths.stats + '#demandes-utilisateurs'}
>
vos retours

5
site/source/pages/Simulateurs/EconomieCollaborative/VotreSituation.tsx
View File

@ -114,7 +114,10 @@ export default function VotreSituation() {
Pour ces activités, vous avez uniquement besoin de déclarer vos
revenus sur votre feuille d'imposition. Pour en savoir plus,
vous pouvez consulter la{' '}
<Link href="https://www.impots.gouv.fr/portail/particulier/questions/comment-declarer-mes-revenus-dactivites-annexes-telles-que-le-co-voiturage-la">
<Link
aria-label="page dédiée sur impots.gouv.fr, nouvelle fenêtre"
href="https://www.impots.gouv.fr/portail/particulier/questions/comment-declarer-mes-revenus-dactivites-annexes-telles-que-le-co-voiturage-la"
>
page dédiée sur impots.gouv.fr
</Link>
.

10
site/source/pages/Simulateurs/ExonerationCovid/ExonérationCovid.tsx
View File

@ -11,7 +11,7 @@ import { H3 } from '@/design-system/typography/heading'
import { DottedName as ExoCovidDottedNames } from 'exoneration-covid'
import { PublicodesExpression } from 'publicodes'
import { useCallback, useEffect } from 'react'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import {
createSearchParams,
useLocation,
@ -34,6 +34,8 @@ export const ExonérationCovid = () => {
[key in typeof rootDottedNames[number]]?: string
}
const { t } = useTranslation()
useEffect(() => {
window.scrollTo(0, 0)
}, [location])
@ -81,7 +83,11 @@ export const ExonérationCovid = () => {
<Grid item xs={12}>
<H3>
{engine.getRule('secteur').rawNode.question}
<ExplicableRule dottedName="secteur" light />
<ExplicableRule
dottedName="secteur"
aria-label={t('En savoir plus')}
light
/>
</H3>
</Grid>

7
site/source/pages/Simulateurs/ExonerationCovid/FormulaireS1S1Bis.tsx
View File

@ -90,7 +90,12 @@ export const FormulaireS1S1Bis = ({ onChange }: Props) => {
<>
<H3>
{engine.getRule('secteur . S1 ou S1bis').rawNode.question}
<ExplicableRule dottedName="secteur . S1 ou S1bis" light bigPopover />
<ExplicableRule
aria-label={t('En savoir plus')}
dottedName="secteur . S1 ou S1bis"
light
bigPopover
/>
</H3>
<Table>
<caption className="visually-hidden">

7
site/source/pages/Simulateurs/metadata.tsx
View File

@ -130,7 +130,10 @@ function getSimulatorsData({ t, sitePaths, language }: SimulatorsDataParams) {
</RuleLink>{' '}
à l'embauche qui ne sont pas toutes prises en compte par notre
simulateur, vous pouvez les retrouver sur{' '}
<Link href="http://www.aides-entreprises.fr">
<Link
href="http://www.aides-entreprises.fr"
aria-label="le portail officiel, accéder à aides-entreprises.fr, nouvelle fenêtre"
>
le portail officiel
</Link>
.
@ -669,7 +672,7 @@ function getSimulatorsData({ t, sitePaths, language }: SimulatorsDataParams) {
<a
target="_blank"
rel="noreferrer"
title="Aller sur le site Service Public sur les dividendes"
aria-label="certains critères, en savoir plus sur service-public.fr, nouvelle fenêtre"
href="https://www.service-public.fr/professionnels-entreprises/vosdroits/F32963"
>
certains critères

10
site/source/pages/Stats/DemandesUtilisateurs.tsx
View File

@ -4,11 +4,13 @@ import { Li, Ul } from '@/design-system/typography/list'
import { Body } from '@/design-system/typography/paragraphs'
import { useFetchData } from '@/hooks/useFetchData'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import styled from 'styled-components'
import { StatsStruct } from './types'
export default function DemandeUtilisateurs() {
const { data: stats } = useFetchData<StatsStruct>('/data/stats.json')
const { t } = useTranslation()
return (
<section>
@ -19,6 +21,9 @@ export default function DemandeUtilisateurs() {
<Link
href="https://github.com/betagouv/mon-entreprise/blob/master/CONTRIBUTING.md#retours-utilisateurs"
target="_blank"
aria-label={t(
'Comment ça marche ? Voir la page explicative sur la page du dépôt github, nouvelle fenêtre'
)}
>
Comment ça marche ?
</Link>
@ -70,11 +75,16 @@ function Pagination({ items }: PaginationProps) {
}
function Issue({ title, number, count, closedAt }: IssueProps) {
const { t } = useTranslation()
return (
<Li>
{count > 1 && <span>{count} demandes</span>}{' '}
<Link
href={`https://github.com/betagouv/mon-entreprise/issues/${number}`}
aria-label={t(
'{{title}}, voir la demande sur github.com, nouvelle fenêtre'
)}
>
{title}
</Link>{' '}

8
site/source/pages/gerer/_components/Fields.tsx
View File

@ -17,6 +17,7 @@ import { useSSRSafeId } from '@react-aria/ssr'
import { DottedName } from 'modele-social'
import { RuleNode } from 'publicodes'
import { useCallback, useContext } from 'react'
import { useTranslation } from 'react-i18next'
import { useDispatch, useSelector } from 'react-redux'
import styled from 'styled-components'
@ -92,6 +93,8 @@ export function SimpleField({
[dispatch]
)
const { t } = useTranslation()
let displayedQuestion =
question ?? evaluateQuestion(engine, engine.getRule(dottedName))
@ -120,7 +123,10 @@ export function SimpleField({
{displayedQuestion ? (
<StyledQuestion id={labelId}>
<Markdown components={{ p: Intro }}>{displayedQuestion}</Markdown>
<ExplicableRule dottedName={dottedName} />
<ExplicableRule
dottedName={dottedName}
aria-label={t('En savoir plus')}
/>
</StyledQuestion>
) : (
<Spacing sm />

6
site/source/pages/gerer/declaration-charges-sociales-independant/_components/RésultatSimple.tsx
View File

@ -10,10 +10,11 @@ import { H2, H3 } from '@/design-system/typography/heading'
import { Link } from '@/design-system/typography/link'
import { Body, Intro } from '@/design-system/typography/paragraphs'
import { utils } from 'publicodes'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
export default function ResultatsSimples() {
const engine = useEngine()
const { t } = useTranslation()
return (
<>
@ -39,6 +40,9 @@ export default function ResultatsSimples() {
href="https://www.impots.gouv.fr/portail/www2/minisite/declaration/independants.html?11"
target="_blank"
rel="noreferrer"
aria-label={t(
'En savoir plus sur impots.gouv.fr, nouvelle fenêtre'
)}
>
En savoir plus
</Link>

8
site/source/pages/gerer/declaration-revenu-independants/_components/DéclarationRevenu.tsx
View File

@ -17,6 +17,7 @@ import { getMeta } from '@/utils'
import { DottedName } from 'modele-social'
import { Rule, RuleNode } from 'publicodes'
import { Fragment, useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import { useDispatch } from 'react-redux'
import styled, { css } from 'styled-components'
import { SimpleField } from '../../_components/Fields'
@ -33,6 +34,8 @@ const RuleInputWithTitle = ({
}) => {
const dispatch = useDispatch()
const { t } = useTranslation()
const dispatchValue = useCallback(
(value, dottedName: DottedName) => {
dispatch(updateSituation(dottedName, value))
@ -49,7 +52,10 @@ const RuleInputWithTitle = ({
`}
>
{title}
<ExplicableRule dottedName={dottedName} />
<ExplicableRule
dottedName={dottedName}
aria-label={t('En savoir plus')}
/>
</H3>
)}
<RuleInput

4
site/source/pages/gerer/declaration-revenu-independants/declaration.tsx
View File

@ -103,9 +103,9 @@ export default function Déclaration() {
Connectez-vous à votre espace professionnel sur{' '}
<Link
href="https://cfspro.impots.gouv.fr/mire/accueil.do"
title="Accéder à mon espace professionnel"
aria-label="impots.gouv.fr, nouvelle fenêtre"
>
impot.gouv.fr
impots.gouv.fr
</Link>
</Li>
<Li>

14
site/source/pages/gerer/declaration-revenu-independants/entreprise.tsx
View File

@ -55,7 +55,12 @@ export default function Accueil() {
Nous vous proposons une aide pour remplir les revenus issus de votre
activité professionnelle dans votre{' '}
<Strong>déclaration des revenu de 2021</Strong> sur{' '}
<Link href="https://www.impots.gouv.fr/accueil">impot.gouv.fr</Link>
<Link
href="https://www.impots.gouv.fr/accueil"
aria-label="impots.gouv.fr, nouvelle fenêtre"
>
impots.gouv.fr
</Link>
.<br />
</Intro>
<Body>Répondez à ces quelques questions, à la fin vous aurez :</Body>
@ -156,8 +161,11 @@ export default function Accueil() {
<Li>
Pour faire votre déclaration de revenu, il faudra vous
connecter sur{' '}
<Link href="https://www.impots.gouv.fr/accueil">
impot.gouv.fr
<Link
href="https://www.impots.gouv.fr/accueil"
aria-label="impots.gouv.fr, nouvelle fenêtre"
>
impots.gouv.fr
</Link>
.
</Li>

12
site/source/pages/gerer/declaration-revenu-independants/imposition.tsx
View File

@ -191,7 +191,10 @@ export default function Imposition() {
vous transmette à nouveau ces informations.
</Body>
<Body>
<Link href="https://www.impots.gouv.fr/contacts">
<Link
href="https://www.impots.gouv.fr/contacts"
aria-label="Contacter le service des impôts sur impots.gouv.fr, nouvelle fenêtre"
>
Contacter le service des impôts
</Link>
</Body>
@ -314,8 +317,11 @@ function ResultSection() {
<Body>
C'est la déclaration de revenu qui est effectuée chaque année
sur{' '}
<Link href="https://www.impots.gouv.fr/accueil">
impot.gouv.fr
<Link
href="https://www.impots.gouv.fr/accueil"
aria-label="impot.gouv.fr, nouvelle fenêtre"
>
impots.gouv.fr
</Link>
. Elle est utilisée pour calculer{' '}
<Strong>

9
site/source/pages/gerer/declaration-revenu-independants/index.tsx
View File

@ -32,6 +32,7 @@ export default function AideDéclarationIndépendant() {
.filter((step) => !step.isDisabled)
.find((step) => step.progress !== 1) ??
steps.find((step) => !step.isDisabled)
const { t } = useTranslation()
return (
<>
@ -57,7 +58,13 @@ export default function AideDéclarationIndépendant() {
<div className="print-hidden">
<Stepper aria-label="Étapes de l'assistant">
{steps.map((step) => (
<Step key={step.to} {...omit(step, 'page')} />
<Step
key={step.to}
aria-label={t("Accéder à l'étape {{step}}", {
step: step.children,
})}
{...omit(step, 'page')}
/>
))}
</Stepper>
</div>

24
site/source/pages/gerer/embaucher.tsx
View File

@ -71,6 +71,7 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
href="https://www.service-public.fr/particuliers/vosdroits/N19871"
target="_blank"
rel="noreferrer"
aria-label="Plus d'informations sur service-public.fr, nouvelle fenêtre"
>
{' '}
<Trans>Plus d'informations</Trans>
@ -93,6 +94,10 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
href="https://www.due.urssaf.fr"
target="_blank"
rel="noreferrer"
aria-label={t(
'embauche.tâches.dpae.ariaLabel',
"être effectué en ligne, accéder au site de l'URSSAF, nouvelle fenêtre"
)}
>
être effectué en ligne
</a>
@ -124,6 +129,10 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
href="http://www.dsn-info.fr/convention-charte.htm"
target="_blank"
rel="noreferrer"
aria-label={t(
'embauche.tâches.logiciel de paie.ariaLabel',
'logiciel de paie privé, voir des exemples sur dsn-info.fr, nouvelle fenêtre'
)}
>
logiciel de paie privé.
</a>
@ -144,6 +153,9 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
className="ui__ button"
target="_blank"
rel="noreferrer"
aria-label={t(
"Plus d'informations sur service-public.fr, nouvelle fenêtre"
)}
>
<Trans>Plus d'informations</Trans>
</a>
@ -163,6 +175,10 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
className="ui__ button"
target="_blank"
rel="noreferrer"
aria-label={t(
'embauche.tâches.pension.aria-label',
'Trouver mon institution de prévoyance, nouvelle fenêtre'
)}
>
<Trans i18nKey="embauche.tâches.pension.description">
Trouver mon institution de prévoyance
@ -220,6 +236,10 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
href="https://www.letese.urssaf.fr"
target="_blank"
rel="noreferrer"
aria-label={t(
'embauche.teseAriaLabel',
"titre emploi service entreprise (Tese), voir plus d'informations sur letese.urssaf.fr, nouvelle fenêtre"
)}
>
titre emploi service entreprise (Tese)
</Link>{' '}
@ -228,6 +248,10 @@ function Embaucher({ onChecklistInitialization, onItemCheck }: EmbaucherProps) {
href="https://www.cesu.urssaf.fr"
target="_blank"
rel="noreferrer"
aria-label={t(
'embauche.cesuAriaLabel',
"chèque emploi associatif (CEA), voir plus d'informations sur cesu.urssaf.fr, nouvelle fenêtre"
)}
>
chèque emploi associatif (CEA)
</Link>{' '}

31
site/source/pages/integration/Library.tsx
View File

@ -7,12 +7,14 @@ import { H2, H3, H4 } from '@/design-system/typography/heading'
import { Link } from '@/design-system/typography/link'
import { Li, Ol } from '@/design-system/typography/list'
import { Body, Intro } from '@/design-system/typography/paragraphs'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { CasParticuliers } from './_components/CasParticuliers'
import StepByStep from './_components/StepByStep'
import illustration from './_images/illustration_library.svg'
export default function Library() {
const { t } = useTranslation()
return (
<div css="iframe{margin-top: 1em; margin-bottom: 1em}">
<ScrollToTop />
@ -36,11 +38,17 @@ export default function Library() {
</pre>
<Body>
Pour lancer vos propres calculs, vous devez installer le paquet{' '}
<Link href="https://www.npmjs.com/package/publicodes">
<Link
href="https://www.npmjs.com/package/publicodes"
aria-label="publicodes, voir la page npm de la librairie publicodes, nouvelle fenêtre"
>
<Code>publicodes</Code>
</Link>{' '}
contenant l'interpréteur publicodes, ainsi que le paquet{' '}
<Link href="https://www.npmjs.com/package/modele-social">
<Link
href="https://www.npmjs.com/package/modele-social"
aria-label="modèle-social, voir la page npm de la librairie modèle-social, nouvelle fenêtre"
>
<Code>modele-social</Code>
</Link>
, qui contient les règles des simulateurs mon-entreprise.
@ -54,7 +62,10 @@ export default function Library() {
mon-entreprise.
</Body>
<Body>
<Link href="https://publi.codes">
<Link
href="https://publi.codes"
aria-label="En savoir plus sur publicodes, nouvelle fenêtre"
>
En savoir plus sur publicodes
</Link>
</Body>
@ -90,7 +101,12 @@ export default function Library() {
</Body>
<Body>
Toutes les règles disponibles sont listées et expliquées sur la{' '}
<Link target="_blank" rel="noreferrer" href="/documentation">
<Link
target="_blank"
rel="noreferrer"
href="/documentation"
aria-label="documentation en ligne, voir la documentation en ligne, nouvelle fenêtre"
>
documentation en ligne
</Link>
. Cette documentation est auto-générée depuis les fichiers de règles
@ -121,7 +137,10 @@ export default function Library() {
</Strong>
<br /> Vous pouvez modifier sans hésiter les valeurs de la
situation. Ces dernières acceptent n'importe quelle{' '}
<Link href="https://publi.codes/docs/principes-de-base">
<Link
href="https://publi.codes/docs/principes-de-base"
aria-label="expression ou objet publicodes, en savoir plus sur publi.codes, nouvelle fenêtre"
>
expression ou objet publicodes.
</Link>
</Li>

17
site/source/pages/integration/Spreadsheet.tsx
View File

@ -3,11 +3,13 @@ import { H1, H2 } from '@/design-system/typography/heading'
import { Link } from '@/design-system/typography/link'
import { Body } from '@/design-system/typography/paragraphs'
import { useSitePaths } from '@/sitePaths'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
export default function Spreadsheet() {
const { absoluteSitePaths } = useSitePaths()
const { t } = useTranslation()
return (
<div css="iframe{margin-top: 1em; margin-bottom: 1em}">
<ScrollToTop />
@ -16,7 +18,13 @@ export default function Spreadsheet() {
<Body>
Vous souhaitez utiliser un simulateur dans une feuille Google Sheets
ou Excel ? C'est possible grâce à notre{' '}
<Link to={absoluteSitePaths.développeur.api}>API REST</Link> !
<Link
to={absoluteSitePaths.développeur.api}
aria-label={t("API REST, en savoir plus sur l'API REST")}
>
API REST
</Link>{' '}
!
</Body>
<H2>Intégrer un simulateur dans Excel/Sheets</H2>
@ -31,7 +39,10 @@ export default function Spreadsheet() {
<H2>Exemple</H2>
<Body>
Vous pouvez trouver un exemple complet avec{' '}
<Link href="https://docs.google.com/spreadsheets/d/1wbfxRdmEbUBgsXbGVc0Q6uqAV4IfLvux6oUJXJLhlaU/copy">
<Link
href="https://docs.google.com/spreadsheets/d/1wbfxRdmEbUBgsXbGVc0Q6uqAV4IfLvux6oUJXJLhlaU/copy"
aria-label="Google Sheets, accéder au document d'exemple, nouvelle fenêtre"
>
Google Sheets
</Link>
, cliquez sur "Créer une copie" (vous pouvez vérifier les scripts avec

31
site/source/pages/integration/_components/CasParticuliers.tsx
View File

@ -6,9 +6,11 @@ import { Link } from '@/design-system/typography/link'
import { Li, Ul } from '@/design-system/typography/list'
import { Body } from '@/design-system/typography/paragraphs'
import { useSitePaths } from '@/sitePaths'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
export function CasParticuliers() {
const { t } = useTranslation()
return (
<Trans i18nKey="pages.développeur.components.CasParticuliers">
<H2>En savoir plus sur...</H2>
@ -55,7 +57,12 @@ export function CasParticuliers() {
</H3>
<Body>
Nos API suivent une{' '}
<Link href="https://semver.org/lang/fr/">
<Link
href="https://semver.org/lang/fr/"
aria-label={t(
'gestion sémantique de version, en savoir plus, nouvelle fenêtre'
)}
>
gestion sémantique de version
</Link>
. Cela veut dire que toutes les modifications apportées sont
@ -106,7 +113,10 @@ export function CasParticuliers() {
</Body>
<Body>
Dans le simulateur{' '}
<Link to={useSitePaths().absoluteSitePaths.simulateurs.salarié}>
<Link
to={useSitePaths().absoluteSitePaths.simulateurs.salarié}
aria-label={t('salarié, accéder au simulateur salarié')}
>
salarié
</Link>
, il suffit de renseigner la commune et le taux versement mobilité
@ -123,7 +133,10 @@ export function CasParticuliers() {
</Li>
<Li>
Grâce au{' '}
<Link href="https://www.urssaf.fr/portail/home/taux-et-baremes/versement-mobilite.html">
<Link
href="https://www.urssaf.fr/portail/home/taux-et-baremes/versement-mobilite.html"
aria-label="service dédié sur urssaf.fr, nouvelle fenêtre"
>
service dédié sur urssaf.fr
</Link>
</Li>
@ -142,14 +155,20 @@ export function CasParticuliers() {
utiliser :
<Ul>
<Li>
<Link href="https://github.com/betagouv/taux-collectifs-cotisation-atmp">
<Link
href="https://github.com/betagouv/taux-collectifs-cotisation-atmp"
aria-label="un export CSV, accéder à l'export, nouvelle fenêtre"
>
Un export csv
</Link>{' '}
du tableau des taux nets collectifs paru au Journal Officiel
</Li>
<Li>
Le service{' '}
<Link href="https://www.net-entreprises.fr/declaration/compte-atmp/">
<Link
href="https://www.net-entreprises.fr/declaration/compte-atmp/"
aria-label="Compte AT/MP, voir le service en ligne de déclaration pour ATMP, nouvelle fenêtre"
>
Compte AT/MP
</Link>{' '}
de net-entreprise

6
site/source/pages/integration/_components/StepByStep.tsx
View File

@ -13,7 +13,10 @@ export default function StepByStep() {
</Strong>
<br />
Par exemple le{' '}
<Link to={useSitePaths().absoluteSitePaths.simulateurs.salarié}>
<Link
to={useSitePaths().absoluteSitePaths.simulateurs.salarié}
aria-label="simulateur salarié, accéder au simulateur salarié"
>
simulateur salarié
</Link>{' '}
pour calculer un net à partir du brut.
@ -30,6 +33,7 @@ export default function StepByStep() {
search:
'salaire-brut=3400%E2%82%AC%2Fmois&salari%C3%A9+.+contrat=%27CDI%27&salari%C3%A9+.+contrat+.+statut+cadre=oui&salari%C3%A9+.+r%C3%A9mun%C3%A9ration+.+frais+professionnels+.+titres-restaurant=oui',
}}
aria-label="un cadre à 3400 € brut avec des titres-restaurants, accéder au simulateur salarié avec les données pré-remplies pour un cadre à 3400 € brut avec des titres-restaurants"
>
un cadre à 3400 € brut avec des titres-restaurants
</Link>

13
site/source/pages/integration/index.tsx
View File

@ -4,7 +4,7 @@ import { Banner, InnerBanner } from '@/design-system/banner'
import { Link } from '@/design-system/typography/link'
import { useFetchData } from '@/hooks/useFetchData'
import { useSitePaths } from '@/sitePaths'
import { Trans } from 'react-i18next'
import { Trans, useTranslation } from 'react-i18next'
import { Route, Routes, useLocation } from 'react-router-dom'
import { TrackChapter } from '../../ATInternetTracking'
import API from './API'
@ -25,6 +25,8 @@ export default function Integration() {
const { data: jobOffers } = useFetchData<JobOffer[]>('/data/job-offers.json')
const openJobOffer = jobOffers?.[0]
const { t } = useTranslation()
return (
<TrackChapter chapter1="integration">
<ScrollToTop />
@ -44,7 +46,14 @@ export default function Integration() {
<span>
<Emoji emoji="📯" />{' '}
<strong>
<a href={openJobOffer.link}>Mon-entreprise recrute !</a>
<a
href={openJobOffer.link}
aria-label={t(
"Mon entreprise recrute ! Voir les offres d'emplois de mon-entreprise.urssaf.fr"
)}
>
Mon-entreprise recrute !
</a>
</strong>{' '}
<small>{openJobOffer.title}</small>
</span>

5
site/source/template.html
View File

@ -264,7 +264,10 @@
<br />
<h3>
Si besoin, vous pouvez en installer un nouveau depuis
<a style="color: #2975d1" href="https://outdatedbrowser.com/fr"
<a
style="color: #2975d1"
href="https://outdatedbrowser.com/fr"
aria-label="cette page, visiter outdatedbrowser.com, nouvelle fenêtre"
>cette page</a
>
</h3>