Implémente la logique de navigation
Johan Girod
parent
b22f9d621f
commit
02b1db3a06
|
|
@ -11,11 +11,6 @@ import { Grid, Spacing } from '@/design-system/layout'
|
|||
import { H2, H3 } from '@/design-system/typography/heading'
|
||||
import { Intro } from '@/design-system/typography/paragraphs'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import {
|
||||
defineDirectorStatus,
|
||||
isAutoentrepreneur,
|
||||
useDispatchAndGoToNextQuestion,
|
||||
} from '@/store/actions/companyStatusActions'
|
||||
|
||||
type SchemeComparaisonProps = {
|
||||
hideAutoEntrepreneur?: boolean
|
||||
|
|
@ -28,7 +23,6 @@ export default function SchemeComparaison({
|
|||
}: SchemeComparaisonProps) {
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
|
||||
const dispatch = useDispatchAndGoToNextQuestion()
|
||||
const { t } = useTranslation()
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
|
||||
|
|
@ -40,8 +34,7 @@ export default function SchemeComparaison({
|
|||
<Button
|
||||
key="assimiléSalarié"
|
||||
onPress={() => {
|
||||
dispatch(defineDirectorStatus('SALARIED'))
|
||||
!hideAutoEntrepreneur && dispatch(isAutoentrepreneur(false))
|
||||
/* TODO */
|
||||
}}
|
||||
aria-label={t(
|
||||
'comparaisonRégimes.choix.AS.aria-label',
|
||||
|
|
@ -57,9 +50,8 @@ export default function SchemeComparaison({
|
|||
<Button
|
||||
key="EI"
|
||||
onPress={() => {
|
||||
!hideAssimiléSalarié &&
|
||||
dispatch(defineDirectorStatus('SELF_EMPLOYED'))
|
||||
!hideAutoEntrepreneur && dispatch(isAutoentrepreneur(false))
|
||||
/* TODO */
|
||||
|
||||
}}
|
||||
aria-label={
|
||||
hideAssimiléSalarié
|
||||
|
|
@ -88,9 +80,8 @@ export default function SchemeComparaison({
|
|||
<Button
|
||||
key="auto-entrepreneur"
|
||||
onPress={() => {
|
||||
!hideAssimiléSalarié &&
|
||||
dispatch(defineDirectorStatus('SELF_EMPLOYED'))
|
||||
dispatch(isAutoentrepreneur(true))
|
||||
/* TODO */
|
||||
|
||||
}}
|
||||
aria-label={t(
|
||||
'comparaisonRégimes.choix.auto.aria-label',
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ export {
|
|||
CarretDownIcon,
|
||||
ChevronIcon,
|
||||
CircleIcon,
|
||||
ClockIcon,
|
||||
EditIcon,
|
||||
ErrorIcon,
|
||||
HexagonIcon,
|
||||
|
|
|
|||
|
|
@ -12,13 +12,6 @@ export const baseParagraphStyle = css`
|
|||
css`
|
||||
color: ${theme.colors.extended.grey[100]};
|
||||
`}
|
||||
/* Hack for text color in Message component in documentation */
|
||||
&& {
|
||||
color: ${({ theme }) =>
|
||||
theme.darkMode
|
||||
? theme.colors.extended.grey[100]
|
||||
: theme.colors.extended.grey[800]};
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
|
|
@ -34,10 +27,26 @@ export const Body = styled.p`
|
|||
line-height: 1.5rem;
|
||||
`
|
||||
|
||||
export const SmallBody = styled.p`
|
||||
export const SmallBody = styled.p<{ grey: boolean }>`
|
||||
${baseParagraphStyle}
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
|
||||
${({ grey }) =>
|
||||
grey &&
|
||||
css`
|
||||
color: ${({ theme }) =>
|
||||
theme.darkMode
|
||||
? theme.colors.extended.grey[500]
|
||||
: theme.colors.extended.grey[600]};
|
||||
|
||||
svg {
|
||||
fill: ${({ theme }) =>
|
||||
theme.darkMode
|
||||
? theme.colors.extended.grey[500]
|
||||
: theme.colors.extended.grey[600]};
|
||||
}
|
||||
`}
|
||||
`
|
||||
|
||||
export const ExtraSmallBody = styled.p`
|
||||
|
|
|
|||
|
|
@ -1,674 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useDispatch, useSelector } from 'react-redux'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import { FromBottom } from '@/components/ui/animate'
|
||||
import { CheckItem, Checklist } from '@/components/ui/Checklist'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import Scroll from '@/components/utils/Scroll'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { Article } from '@/design-system/card'
|
||||
import { Emoji } from '@/design-system/emoji'
|
||||
import { Grid, Spacing } from '@/design-system/layout'
|
||||
import { H1, H2 } from '@/design-system/typography/heading'
|
||||
import { Link } from '@/design-system/typography/link'
|
||||
import { Li, Ul } from '@/design-system/typography/list'
|
||||
import { Body, SmallBody } from '@/design-system/typography/paragraphs'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import {
|
||||
checkCompanyCreationItem,
|
||||
initializeCompanyCreationChecklist,
|
||||
} from '@/store/actions/companyCreationChecklistActions'
|
||||
import { resetCompanyStatusChoice } from '@/store/actions/companyStatusActions'
|
||||
import { RootState } from '@/store/reducers/rootReducer'
|
||||
import { LegalStatus } from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
import StatutDescription from './StatutDescription'
|
||||
|
||||
type CreateCompanyProps = {
|
||||
statut: LegalStatus
|
||||
}
|
||||
|
||||
export default function CreateCompany({ statut }: CreateCompanyProps) {
|
||||
const { t, i18n } = useTranslation()
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
const companyCreationChecklist = useSelector(
|
||||
(state: RootState) => state.choixStatutJuridique.companyCreationChecklist
|
||||
)
|
||||
const dispatch = useDispatch()
|
||||
|
||||
// TODO : add this logic inside selector
|
||||
const isAutoentrepreneur = statut.startsWith('auto-entrepreneur')
|
||||
const multipleAssociates = ['SARL', 'SAS', 'SA'].includes(statut)
|
||||
const isEI = isAutoentrepreneur || statut.startsWith('EI')
|
||||
|
||||
const titre = isAutoentrepreneur
|
||||
? t(
|
||||
'entreprise.page.autoEntrepreneur.titre',
|
||||
'Devenir {{autoEntrepreneur}}',
|
||||
{ autoEntrepreneur: statut }
|
||||
)
|
||||
: t('entreprise.page.entreprise.titre', 'Créer une {{status}}', {
|
||||
status: statut,
|
||||
})
|
||||
|
||||
return (
|
||||
<FromBottom>
|
||||
<TrackPage chapter2="statut" name={statut} />
|
||||
<DefaultHelmet>
|
||||
<title>{titre}</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={
|
||||
isAutoentrepreneur
|
||||
? t(
|
||||
'entreprise.page.autoEntrepreneur.description',
|
||||
'La liste complète des démarches à faire pour devenir {{autoEntrepreneur}}.',
|
||||
{ autoEntrepreneur: statut }
|
||||
)
|
||||
: t(
|
||||
'entreprise.page.description',
|
||||
"La liste complète des démarches à faire pour créer une {{statut}} auprès de l'administration française.",
|
||||
{ statut }
|
||||
)
|
||||
}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<Scroll.toTop />
|
||||
<Link
|
||||
to={absoluteSitePaths.assistants['choix-du-statut'].index}
|
||||
onPress={() => {
|
||||
dispatch(resetCompanyStatusChoice())
|
||||
}}
|
||||
>
|
||||
<span aria-hidden>←</span>
|
||||
<Trans i18nKey="entreprise.retour">Choisir un autre statut</Trans>
|
||||
</Link>
|
||||
|
||||
<H1>{titre}</H1>
|
||||
<Body>
|
||||
<StatutDescription statut={statut} />
|
||||
</Body>
|
||||
|
||||
<H2>
|
||||
<Trans i18nKey="entreprise.tâches.titre">
|
||||
À faire pour créer votre entreprise
|
||||
</Trans>{' '}
|
||||
<Emoji emoji="📋" />
|
||||
</H2>
|
||||
<Body>
|
||||
<Trans i18nKey="entreprise.tâches.avancement">
|
||||
Utilisez cette liste pour suivre votre avancement dans les démarches.
|
||||
Votre progression est automatiquement sauvegardée dans votre
|
||||
navigateur.
|
||||
</Trans>
|
||||
</Body>
|
||||
<Checklist
|
||||
key={statut}
|
||||
onInitialization={(items) =>
|
||||
dispatch(initializeCompanyCreationChecklist(statut, items))
|
||||
}
|
||||
onItemCheck={(name, isChecked) =>
|
||||
dispatch(checkCompanyCreationItem(name, isChecked))
|
||||
}
|
||||
defaultChecked={companyCreationChecklist}
|
||||
>
|
||||
<CheckItem
|
||||
name="legalStatus"
|
||||
defaultChecked={true}
|
||||
title={t(
|
||||
'entreprise.tâches.formeJuridique.titre',
|
||||
'Choisir la forme juridique'
|
||||
)}
|
||||
/>
|
||||
{!isEI && (
|
||||
<CheckItem
|
||||
name="corporateName"
|
||||
title={t(
|
||||
'entreprise.tâches.nom.titre',
|
||||
"Trouver un nom d'entreprise"
|
||||
)}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.nom.description">
|
||||
<SmallBody>
|
||||
<strong>La dénomination sociale</strong> est le nom de votre
|
||||
entreprise aux yeux de la loi, écrit sur tous vos documents
|
||||
administratifs. Il peut être différent de votre nom
|
||||
commercial.
|
||||
</SmallBody>
|
||||
<SmallBody>
|
||||
Il est conseillé de vérifier que le nom est disponible,
|
||||
c'est-à-dire qu'il ne porte pas atteinte à un nom déjà protégé
|
||||
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/"
|
||||
aria-label="INPI, accéder à la base données de marques de l'INPI, nouvelle fenêtre"
|
||||
>
|
||||
INPI
|
||||
</Link>
|
||||
.
|
||||
</SmallBody>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
|
||||
<CheckItem
|
||||
name="corporatePurpose"
|
||||
title={t(
|
||||
'entreprise.tâches.objetSocial.titre',
|
||||
"Déterminer l'objet social"
|
||||
)}
|
||||
explanations={
|
||||
<SmallBody>
|
||||
<Trans i18nKey="entreprise.tâches.objetSocial.description">
|
||||
L'
|
||||
<strong>objet social</strong> est l'activité principale de
|
||||
l'entreprise. Une activité secondaire peut être enregistrée.
|
||||
</Trans>
|
||||
</SmallBody>
|
||||
}
|
||||
/>
|
||||
{!isAutoentrepreneur && (
|
||||
<CheckItem
|
||||
name="companyAddress"
|
||||
title={t(
|
||||
'entreprise.tâches.adresse.titre',
|
||||
'Choisir une adresse pour le siège'
|
||||
)}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.adresse.description">
|
||||
<SmallBody>
|
||||
<strong>L'adresse</strong> est l'espace physique où votre
|
||||
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"
|
||||
aria-label="Plus d'infos, voir plus d'informations sur service-public.fr, nouvelle fenêtre"
|
||||
>
|
||||
Plus d'infos
|
||||
</Link>
|
||||
</SmallBody>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
{!isEI && (
|
||||
<CheckItem
|
||||
name="statut"
|
||||
title={t('entreprise.tâches.statuts.titre', 'Écrire les statuts')}
|
||||
explanations={
|
||||
<SmallBody>
|
||||
<Trans i18nKey="entreprise.tâches.statuts.description">
|
||||
Il s'agit d'un document officiel qui intègre la forme
|
||||
juridique, nomme les associés et leurs contributions au
|
||||
capital.{' '}
|
||||
<span
|
||||
style={{
|
||||
display: multipleAssociates ? 'visible' : 'none',
|
||||
}}
|
||||
>
|
||||
Dans le cas d'une création d'entreprise avec plusieurs
|
||||
associés, il est recommandé de faire appel à un juriste pour
|
||||
les rédiger.{' '}
|
||||
</span>
|
||||
</Trans>
|
||||
{['SARL', 'EURL'].includes(statut) && (
|
||||
<StatutsExample statut={statut} />
|
||||
)}
|
||||
</SmallBody>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
<CheckItem
|
||||
name="openBankAccount"
|
||||
title={t(
|
||||
'entreprise.tâches.banque.titre',
|
||||
'Ouvrir un compte bancaire'
|
||||
)}
|
||||
explanations={
|
||||
<>
|
||||
<SmallBody>
|
||||
<Trans i18nKey="entreprise.tâches.banque.description.1">
|
||||
Le but d'un <strong>compte bancaire d'entreprise</strong> est
|
||||
de séparer les actifs de l'entreprise des vôtres.
|
||||
</Trans>{' '}
|
||||
{statut === 'EI' && (
|
||||
<Trans i18nKey="entreprise.tâches.banque.description.EI">
|
||||
Si son ouverture n'est pas obligatoire pour une entreprise
|
||||
individuelle, elle reste fortement recommandée.{' '}
|
||||
</Trans>
|
||||
)}
|
||||
<Trans i18nKey="entreprise.tâches.banque.description.2">
|
||||
Le compte d'entreprise vous permet de :
|
||||
</Trans>
|
||||
</SmallBody>
|
||||
<Ul size="XS">
|
||||
<Trans i18nKey="entreprise.tâches.banque.description.liste">
|
||||
<Li>
|
||||
Différencier vos opérations privées et professionnelles
|
||||
</Li>
|
||||
<Li>Faciliter les déclarations fiscales</Li>
|
||||
</Trans>
|
||||
</Ul>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
{!isEI && (
|
||||
<CheckItem
|
||||
name="fundsDeposit"
|
||||
title={t('entreprise.tâches.capital.titre', 'Déposer le capital')}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.capital.description">
|
||||
<SmallBody>
|
||||
Le <strong>dépôt du capital social</strong> doit être fait au
|
||||
moment de la constitution d'une société par une personne
|
||||
agissant au nom de la société et ayant reçu des apports en
|
||||
numéraire (somme d'argent) de la part des créanciers de la
|
||||
société (actionnaire ou associé).
|
||||
</SmallBody>
|
||||
<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"
|
||||
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
|
||||
du capital.
|
||||
</SmallBody>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
{statut.includes('EIRL') && (
|
||||
<CheckItem
|
||||
name="declarationOfAssignement"
|
||||
title={t(
|
||||
'entreprise.tâches.affectation.titre',
|
||||
"Effectuer une déclaration d'affectation de patrimoine"
|
||||
)}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.affectation.description">
|
||||
<SmallBody>
|
||||
La <strong>déclaration d'affectation du patrimoine</strong>{' '}
|
||||
permet de séparer le patrimoine professionnel de votre
|
||||
patrimoine personnel, qui devient alors insaisissable. Cette
|
||||
démarche est gratuite si elle est effectué au moment de la
|
||||
création d'entreprise.
|
||||
</SmallBody>
|
||||
<SmallBody>
|
||||
Pour cela, il suffit simplement de déclarer quelles biens sont
|
||||
affectés au patrimoine de votre entreprise. Tous les apports
|
||||
nécessaires à votre activité professionnelle doivent y figurer
|
||||
(par exemple : fond de commerce, marque, brevet, ou encore
|
||||
matériel professionnel). Vous pouvez vous charger vous-même de
|
||||
l'évaluation de la valeur du bien si celle ci ne dépasse pas
|
||||
les 30 000 €.
|
||||
</SmallBody>
|
||||
<SmallBody>
|
||||
<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>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
{!isEI && (
|
||||
<CheckItem
|
||||
title={t(
|
||||
'entreprise.tâches.journal.titre',
|
||||
'Publier une annonce de création dans un journal'
|
||||
)}
|
||||
name="publishCreationNotice"
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.journal.description">
|
||||
<SmallBody>
|
||||
Vous devez publier la création de votre entreprise dans un
|
||||
journal d'annonces légales (« JAL »), pour un coût de
|
||||
publication qui dépend du volume de l'annonce et des tarifs
|
||||
pratiqués par le journal choisi{' '}
|
||||
</SmallBody>
|
||||
<SmallBody>
|
||||
<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>
|
||||
<SmallBody>
|
||||
Cette annonce doit contenir les informations suivantes :{' '}
|
||||
</SmallBody>
|
||||
<Ul size="XS">
|
||||
<Li>Le nom de l'entreprise et éventuellement son acronyme</Li>
|
||||
<Li>La forme juridique</Li>
|
||||
<Li>Le capital de l'entreprise</Li>
|
||||
<Li>L'adresse du siège</Li>
|
||||
<Li>L'objet social</Li>
|
||||
<Li>La durée de l'entreprise</Li>
|
||||
<Li>
|
||||
Les noms, prénoms et adresses des dirigeants et des
|
||||
personnes ayant le pouvoir d'engager la société envers les
|
||||
tiers
|
||||
</Li>
|
||||
<Li>
|
||||
Le lieu et le numéro du RCS auprès duquel la société est
|
||||
immatriculée
|
||||
</Li>
|
||||
</Ul>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
|
||||
<CheckItem
|
||||
name="registerCompanyOnline"
|
||||
title={t(
|
||||
'entreprise.tâches.formulaire.titre',
|
||||
'Créer mon entreprise en ligne'
|
||||
)}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.formulaire.description">
|
||||
<SmallBody>
|
||||
Vous pouvez faire votre inscription en ligne à tout moment,
|
||||
l'enregistrer et y revenir comme vous le souhaitez.
|
||||
</SmallBody>
|
||||
<Spacing lg />
|
||||
<Button
|
||||
href={
|
||||
isAutoentrepreneur
|
||||
? 'https://www.autoentrepreneur.urssaf.fr/portail/accueil/creer-mon-auto-entreprise.html'
|
||||
: 'https://formalites.entreprises.gouv.fr/'
|
||||
}
|
||||
>
|
||||
Faire la démarche en ligne
|
||||
</Button>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
</Checklist>
|
||||
<H2>
|
||||
<Trans i18nKey="entreprise.tâches.titre2">
|
||||
Recommandé avant le début de l'activité
|
||||
</Trans>{' '}
|
||||
<Emoji emoji="💭" />
|
||||
</H2>
|
||||
|
||||
<Checklist>
|
||||
{!isAutoentrepreneur && (
|
||||
<CheckItem
|
||||
name="chooseCertifiedAccountant"
|
||||
title={t(
|
||||
'entreprise.tâches.comptable.titre',
|
||||
'Choisir un expert-comptable'
|
||||
)}
|
||||
explanations={
|
||||
<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"
|
||||
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
|
||||
expert-comptable ou d'un logiciel de comptabilité en ligne.
|
||||
</Trans>
|
||||
</SmallBody>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
<CheckItem
|
||||
name="checkoutProfessionalAssuranceNeeds"
|
||||
title={t(
|
||||
'entreprise.tâches.assurance.titre',
|
||||
'Juger de la nécessité de prendre une assurance'
|
||||
)}
|
||||
explanations={
|
||||
<Trans i18nKey="entreprise.tâches.assurance.description">
|
||||
<SmallBody>
|
||||
Une PME ou un travailleur indépendant doit se protéger contre
|
||||
les principaux risques auxquels il est exposé et souscrire des
|
||||
contrats de garantie. Qu'elle soit locataire ou propriétaire de
|
||||
ses murs, l'entreprise doit assurer ses immeubles, son matériel
|
||||
professionnel, ses biens, ses matières premières, ses véhicules,
|
||||
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"
|
||||
aria-label="Plus d'infos, voir plus d'informations sur economie.gouv.fr, nouvelle fenêtre"
|
||||
>
|
||||
Plus d'infos
|
||||
</Link>
|
||||
</Trans>
|
||||
}
|
||||
/>
|
||||
</Checklist>
|
||||
<H2>
|
||||
<Trans i18nKey="common.useful-resources">Ressources utiles</Trans>{' '}
|
||||
<Emoji emoji="🧰" />
|
||||
</H2>
|
||||
|
||||
<Grid container role="list">
|
||||
{isAutoentrepreneur && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={
|
||||
<h3>
|
||||
{t(
|
||||
'entreprise.ressources.simu.autoEntrepreneur.title',
|
||||
'Simulateur de revenus auto-entrepreneur'
|
||||
)}
|
||||
</h3>
|
||||
}
|
||||
to={{
|
||||
pathname: absoluteSitePaths.simulateurs['auto-entrepreneur'],
|
||||
}}
|
||||
state={{ fromCréer: true }}
|
||||
ctaLabel={t(
|
||||
'entreprise.ressources.simu.autoEntrepreneur.cta',
|
||||
'Simuler les revenus'
|
||||
)}
|
||||
aria-label={t(
|
||||
'entreprise.ressources.simu.autoEntrepreneur.aria-label',
|
||||
'Auto-entrepreneur, simuler mes revenus'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="entreprise.ressources.simu.autoEntrepreneur.body">
|
||||
Simuler le montant de vos cotisations sociales et de votre impôt
|
||||
et estimez votre futur revenu net.
|
||||
</Trans>
|
||||
</Article>
|
||||
</Grid>
|
||||
)}
|
||||
{['EI', 'EIRL', 'EURL'].includes(statut) && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={
|
||||
<h3>
|
||||
{t(
|
||||
'entreprise.ressources.simu.indépendant.title',
|
||||
'Simulateur de cotisations indépendant'
|
||||
)}
|
||||
</h3>
|
||||
}
|
||||
to={{ pathname: absoluteSitePaths.simulateurs.indépendant }}
|
||||
state={{ fromCréer: true }}
|
||||
ctaLabel={t(
|
||||
'entreprise.ressources.simu.indépendant.cta',
|
||||
'Simuler les cotisations'
|
||||
)}
|
||||
aria-label={t(
|
||||
'entreprise.ressources.simu.indépendant.aria-label',
|
||||
'Indépendant, simuler mes revenus'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="entreprise.ressources.simu.indépendant.body">
|
||||
Simuler le montant de vos cotisations sociales pour bien
|
||||
préparer votre business plan.
|
||||
</Trans>
|
||||
</Article>
|
||||
</Grid>
|
||||
)}
|
||||
{['SAS', 'SASU'].includes(statut) && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={
|
||||
<h3>
|
||||
{t(
|
||||
'entreprise.ressources.simu.assimilé.title',
|
||||
'Simulateur de rémunération pour dirigeant de SASU'
|
||||
)}
|
||||
</h3>
|
||||
}
|
||||
to={{ pathname: absoluteSitePaths.simulateurs.sasu }}
|
||||
state={{ fromCréer: true }}
|
||||
ctaLabel={t(
|
||||
'entreprise.ressources.simu.assimilé.cta',
|
||||
'Simuler la rémunération'
|
||||
)}
|
||||
aria-label={t(
|
||||
'entreprise.ressources.simu.assimilé.aria-label',
|
||||
'SASU, simuler la rémunération'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="entreprise.ressources.simu.assimilé.body">
|
||||
Simuler le montant de vos cotisations sociales pour bien
|
||||
préparer votre business plan.
|
||||
</Trans>
|
||||
</Article>
|
||||
</Grid>
|
||||
)}
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={
|
||||
<h3>
|
||||
<Trans i18nKey="entreprise.ressources.après.title">
|
||||
Après la création
|
||||
</Trans>
|
||||
</h3>
|
||||
}
|
||||
to={absoluteSitePaths.assistants['choix-du-statut'].après}
|
||||
ctaLabel={t('entreprise.ressources.après.cta', 'Voir le glossaire')}
|
||||
aria-label={t(
|
||||
'entreprise.ressources.après.aria-label',
|
||||
'Après la création, voir le glossaire'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="entreprise.ressources.après.body">
|
||||
SIREN, SIRET, code APE, KBis. Un petit glossaire des termes que
|
||||
vous pourrez (éventuellement) rencontrer après la création.
|
||||
</Trans>
|
||||
</Article>
|
||||
</Grid>
|
||||
|
||||
{i18n.language === 'fr' && isAutoentrepreneur && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={<h3>Guide pratique Urssaf</h3>}
|
||||
href="https://www.autoentrepreneur.urssaf.fr/portail/files/Guides/Metropole/UrssafAutoEntrepreneurMetro.pdf"
|
||||
ctaLabel="Consulter le guide Urssaf"
|
||||
>
|
||||
Des conseils pour les auto-entrepreneurs : comment préparer son
|
||||
projet pour se lancer dans la création et une présentation
|
||||
détaillée de votre protection sociale.
|
||||
</Article>
|
||||
</Grid>
|
||||
)}
|
||||
|
||||
{isAutoentrepreneur && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<FAQAutoEntrepreneurArticle />
|
||||
</Grid>
|
||||
)}
|
||||
{i18n.language === 'fr' && ['EI', 'EIRL', 'EURL'].includes(statut) && (
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Article
|
||||
title={<h3>Guide Urssaf pour les travailleur indépendant</h3>}
|
||||
href="https://www.urssaf.fr/portail/files/live/sites/urssaf/files/documents/Diaporama_TI_statuts_hors_AE.pdf"
|
||||
ctaLabel="Consulter le guide Urssaf"
|
||||
aria-label="Travailleurs indépendants, consulter le guide Urssaf"
|
||||
>
|
||||
Des conseils sur comment préparer son projet pour se lancer dans
|
||||
la création et une présentation détaillée de votre protection
|
||||
sociale.
|
||||
</Article>
|
||||
</Grid>
|
||||
)}
|
||||
</Grid>
|
||||
</FromBottom>
|
||||
)
|
||||
}
|
||||
|
||||
type StatutsExampleProps = {
|
||||
statut: string
|
||||
}
|
||||
|
||||
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',
|
||||
}
|
||||
|
||||
if (!(statut in links)) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<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>{' '}
|
||||
{statut}
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
export const FAQAutoEntrepreneurArticle = () => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<Article
|
||||
title={
|
||||
<h3>
|
||||
{t(
|
||||
'pages.common.ressources-auto-entrepreneur.FAQ.title',
|
||||
'Questions fréquentes'
|
||||
)}{' '}
|
||||
<Emoji emoji="❓" />
|
||||
</h3>
|
||||
}
|
||||
href="https://www.autoentrepreneur.urssaf.fr/portail/accueil/une-question/questions-frequentes.html"
|
||||
ctaLabel={t(
|
||||
'pages.common.ressources-auto-entrepreneur.FAQ.cta',
|
||||
'Voir les réponses'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="pages.common.ressources-auto-entrepreneur.FAQ.body">
|
||||
Une liste exhaustive et maintenue à jour de toutes les questions
|
||||
fréquentes (et moins fréquentes) que l'on est amené à poser en tant
|
||||
qu'auto-entrepreneur
|
||||
</Trans>
|
||||
</Article>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,69 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import SchemeComparaison from '@/components/SchemeComparaison'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Link } from '@/design-system/typography/link'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
|
||||
export default function Autoentrepreneur() {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage name="auto-entrepreneur_ou_independant" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t(
|
||||
'autoentrepreneur.page.titre',
|
||||
'Choisir entre auto-entrepreneur et entreprise individuelle - Mon entreprise'
|
||||
)}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={t(
|
||||
'autoentrepreneur.page.description',
|
||||
"Un auto-entrepreneur bénéficie d'un système simplifié de déclaration et de paiement, pour lesquelles les impôts et cotisations sociales sont basés sur le chiffre d'affaires réalisé chaque mois. C'est un choix intéressant si vous n'avez pas besoin de beaucoup de capital et que vous souhaitez démarrer rapidement."
|
||||
)}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
<Trans i18nKey="autoentrepreneur.titre">
|
||||
Entreprise individuelle ou auto-entrepreneur
|
||||
</Trans>
|
||||
</H2>
|
||||
<Trans i18nKey="autoentrepreneur.description">
|
||||
<Body>
|
||||
À la différence de l'entreprise individuelle, l'auto-entrepreneur
|
||||
bénéficie d'un régime simplifié de déclaration et de paiement : les
|
||||
cotisations sociales et l'impôt sur le revenu sont calculés sur le
|
||||
chiffre d'affaires encaissé.
|
||||
</Body>
|
||||
<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"
|
||||
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"
|
||||
aria-label={t('voir la liste sur afecreation.fr, nouvelle fenêtre')}
|
||||
>
|
||||
voir la liste
|
||||
</Link>
|
||||
).
|
||||
</Body>
|
||||
</Trans>
|
||||
<div>
|
||||
<SchemeComparaison hideAssimiléSalarié />
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import SchemeComparaison from '@/components/SchemeComparaison'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
|
||||
export default function DefineDirectorStatus() {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage name="independant_ou_assimile-salarie" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t('statut du dirigeant.titre', 'Définir le statut du dirigeant')}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={t(
|
||||
'statut du dirigeant.page.description',
|
||||
"Ce choix est important parce qu'il détermine le régime de sécurité sociale et la couverture sociale de l'administrateur. Chaque option a des implications juridiques et conduit à un statut différent lors de la création de votre entreprise."
|
||||
)}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
<Trans i18nKey="statut du dirigeant.titre">
|
||||
Définir le statut du dirigeant
|
||||
</Trans>
|
||||
</H2>
|
||||
<Trans i18nKey="statut du dirigeant.description">
|
||||
<Body>
|
||||
Ce choix est important car il détermine le régime de sécurité sociale
|
||||
et la couverture sociale du dirigeant. Le montant et les modalités de
|
||||
paiement des cotisations sociales sont également impactés.
|
||||
</Body>
|
||||
<div>
|
||||
<SchemeComparaison hideAutoEntrepreneur />
|
||||
</div>
|
||||
</Trans>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,86 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import AnswerGroup from '@/design-system/answer-group'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Li, Ul } from '@/design-system/typography/list'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
import {
|
||||
directorIsInAMinority,
|
||||
useDispatchAndGoToNextQuestion,
|
||||
} from '@/store/actions/companyStatusActions'
|
||||
|
||||
export default function MinorityDirector() {
|
||||
const { t } = useTranslation()
|
||||
const dispatch = useDispatchAndGoToNextQuestion()
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage name="majoritaire_ou_minoritaire" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t(
|
||||
'gérant minoritaire.page.titre',
|
||||
'Gérant majoritaire ou minoritaire'
|
||||
)}{' '}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={t(
|
||||
'gérant minoritaire.page.description',
|
||||
"Certaines règles particulières s'appliquent en fonction du nombre d'actions détenues par l'administrateur, ce qui peut conduire à un statut différent lors de la création de votre société"
|
||||
)}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
<Trans i18nKey="gérant minoritaire.titre">
|
||||
Gérant majoritaire ou minoritaire
|
||||
</Trans>{' '}
|
||||
</H2>
|
||||
<Trans i18nKey="gérant minoritaire.description">
|
||||
<Body>
|
||||
Certaines règles spéciales s'appliquent selon le nombre d'actions
|
||||
détenues.
|
||||
</Body>
|
||||
<Ul>
|
||||
<Li>
|
||||
<strong>Gérant majoritaire</strong> : Vous êtes l'administrateur
|
||||
majoritaire (ou faite partie d'un conseil d'administration
|
||||
majoritaire).
|
||||
</Li>
|
||||
<Li>
|
||||
<strong>Gérant minoritaire</strong> : Vous êtes administrateur
|
||||
minoritaire ou égalitaire (ou faites partie d'un conseil
|
||||
d'administration minoritaire ou égalitaire).
|
||||
</Li>
|
||||
</Ul>
|
||||
</Trans>
|
||||
|
||||
<AnswerGroup role="list">
|
||||
<Button
|
||||
onPress={() => {
|
||||
dispatch(directorIsInAMinority(false))
|
||||
}}
|
||||
aria-label={t(
|
||||
"Gérant majoritaire, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans>Gérant majoritaire</Trans>
|
||||
</Button>
|
||||
<Button
|
||||
key="director-minority-true"
|
||||
onPress={() => {
|
||||
dispatch(directorIsInAMinority(true))
|
||||
}}
|
||||
aria-label={t(
|
||||
"Gérant minoritaire ou égalitaire, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans>Gérant minoritaire ou égalitaire</Trans>
|
||||
</Button>
|
||||
</AnswerGroup>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import AnswerGroup from '@/design-system/answer-group'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Body, SmallBody } from '@/design-system/typography/paragraphs'
|
||||
import {
|
||||
companyHasMultipleAssociates,
|
||||
useDispatchAndGoToNextQuestion,
|
||||
} from '@/store/actions/companyStatusActions'
|
||||
|
||||
export default function NumberOfAssociates() {
|
||||
const dispatch = useDispatchAndGoToNextQuestion()
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage name="seul_ou_plusieurs" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t(
|
||||
'associés.page.titre',
|
||||
"Nombre d'associés pour créer une entreprise"
|
||||
)}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={t(
|
||||
'associés.page.description',
|
||||
"Découvrez quels status choisir en fonction du nombre d'associés participant à la création de l'entreprise."
|
||||
)}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
<Trans i18nKey="associés.titre">Seul ou à plusieurs</Trans>
|
||||
</H2>
|
||||
<Trans i18nKey="associés.description">
|
||||
<Body>
|
||||
Une entreprise avec un seul associé est plus simple à créer et gérer.
|
||||
Un associé peut-être une personne physique (un individu) ou une
|
||||
personne morale (par exemple une société).
|
||||
</Body>
|
||||
<SmallBody>
|
||||
Note : ce choix n'est pas définitif. Vous pouvez tout à fait commencer
|
||||
votre société seul, et accueillir de nouveaux associés au cours de
|
||||
votre développement.
|
||||
</SmallBody>
|
||||
</Trans>
|
||||
|
||||
<AnswerGroup role="list">
|
||||
<Button
|
||||
onPress={() => {
|
||||
dispatch(companyHasMultipleAssociates(false))
|
||||
}}
|
||||
aria-label={t(
|
||||
'associés.choix1-aria-label',
|
||||
"Seul, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="associés.choix1">Seul</Trans>
|
||||
</Button>
|
||||
<Button
|
||||
onPress={() => {
|
||||
dispatch(companyHasMultipleAssociates(true))
|
||||
}}
|
||||
aria-label={t(
|
||||
'associés.choix2-aria-label',
|
||||
"Plusieurs personnes, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="associés.choix2">Plusieurs personnes</Trans>
|
||||
</Button>
|
||||
</AnswerGroup>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,133 +0,0 @@
|
|||
import { Fragment } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useSelector } from 'react-redux'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { H2, H3 } from '@/design-system/typography/heading'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import {
|
||||
LegalStatus,
|
||||
possibleStatusSelector,
|
||||
} from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
import StatutDescription from '../StatutDescription'
|
||||
|
||||
type StatutButtonProps = {
|
||||
statut: LegalStatus
|
||||
}
|
||||
|
||||
const StatutButton = ({ statut }: StatutButtonProps) => {
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
|
||||
return (
|
||||
<Button
|
||||
to={absoluteSitePaths.assistants['choix-du-statut'][statut]}
|
||||
light
|
||||
size="XS"
|
||||
>
|
||||
<>
|
||||
{statut.includes('auto-entrepreneur') ? (
|
||||
<Trans>Devenir</Trans>
|
||||
) : (
|
||||
<Trans>Créer une</Trans>
|
||||
)}{' '}
|
||||
{statut}
|
||||
</>
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
|
||||
type StatutTitleProps = {
|
||||
statut: LegalStatus
|
||||
language: string
|
||||
}
|
||||
|
||||
const StatutTitle = ({ statut, language }: StatutTitleProps) =>
|
||||
statut === 'EI' ? (
|
||||
<>
|
||||
Entreprise individuelle {language !== 'fr' && '(Individual business)'}:{' '}
|
||||
</>
|
||||
) : statut === 'EIRL' ? (
|
||||
<>
|
||||
Entrepreneur individuel à responsabilité limitée{' '}
|
||||
{language !== 'fr' && '(Individual entrepreneur with limited liability)'}:{' '}
|
||||
</>
|
||||
) : statut === 'EURL' ? (
|
||||
<>
|
||||
EURL - Entreprise unipersonnelle à responsabilité limitée{' '}
|
||||
{language !== 'fr' && '(Limited personal company)'}:{' '}
|
||||
</>
|
||||
) : statut === 'SARL' ? (
|
||||
<>
|
||||
SARL - Société à responsabilité limitée{' '}
|
||||
{language !== 'fr' && '(Limited corporation)'}:{' '}
|
||||
</>
|
||||
) : statut === 'SAS' ? (
|
||||
<>
|
||||
SAS - Société par actions simplifiées{' '}
|
||||
{language !== 'fr' && '(Simplified joint stock company)'}:{' '}
|
||||
</>
|
||||
) : statut === 'SASU' ? (
|
||||
<>
|
||||
SASU - Société par action simplifiée unipersonnelle{' '}
|
||||
{language !== 'fr' && '(Simplified personal joint stock company)'}:{' '}
|
||||
</>
|
||||
) : statut === 'SA' ? (
|
||||
<>SA - Société anonyme {language !== 'fr' && '(Anonymous company)'}: </>
|
||||
) : (statut as string) === 'SNC' ? (
|
||||
<>SNC - Société en nom collectif {language !== 'fr' && '(Partnership)'}: </>
|
||||
) : statut === 'auto-entrepreneur' ? (
|
||||
<>
|
||||
<Trans>Auto-entrepreneur</Trans>
|
||||
{language === 'fr' && ' '}:{' '}
|
||||
</>
|
||||
) : statut === 'auto-entrepreneur-EIRL' ? (
|
||||
<>
|
||||
<Trans>Auto-entrepreneur en EIRL</Trans>
|
||||
{language === 'fr' && ' '}
|
||||
{':'}
|
||||
</>
|
||||
) : null
|
||||
|
||||
export default function SetMainStatus() {
|
||||
const { t, i18n } = useTranslation()
|
||||
const possibleStatus = useSelector(possibleStatusSelector)
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage chapter2="statut" name="liste" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t(
|
||||
'listeformejuridique.page.titre',
|
||||
'Liste des statuts juridiques pour la création de votre entreprise'
|
||||
)}
|
||||
</title>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
{Object.keys(possibleStatus).every(Boolean) ? (
|
||||
<Trans>Liste des statuts juridiques</Trans>
|
||||
) : (
|
||||
<Trans>Votre forme juridique</Trans>
|
||||
)}
|
||||
</H2>
|
||||
|
||||
{(Object.entries(possibleStatus) as [LegalStatus, boolean][])
|
||||
.filter(([, v]) => Boolean(v))
|
||||
.map(([statut]) => (
|
||||
<Fragment key={statut}>
|
||||
<H3>
|
||||
<StatutTitle statut={statut} language={i18n.language} />
|
||||
</H3>
|
||||
<Body>
|
||||
<StatutDescription statut={statut} />
|
||||
</Body>
|
||||
<StatutButton statut={statut} />
|
||||
</Fragment>
|
||||
))}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,132 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useSelector } from 'react-redux'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import styled from 'styled-components'
|
||||
|
||||
import { Link } from '@/design-system/typography/link'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import { RootState } from '@/store/reducers/rootReducer'
|
||||
import { LegalStatusRequirements } from '@/types/companyTypes'
|
||||
|
||||
interface RequirementToTextType {
|
||||
props: {
|
||||
children: string
|
||||
}
|
||||
}
|
||||
|
||||
const requirementToText = (
|
||||
key: keyof LegalStatusRequirements,
|
||||
value: string
|
||||
) => {
|
||||
switch (key) {
|
||||
case 'multipleAssociates':
|
||||
return value ? (
|
||||
<Trans>Plusieurs associés</Trans>
|
||||
) : (
|
||||
<Trans>Un seul associé</Trans>
|
||||
)
|
||||
case 'soleProprietorship':
|
||||
return value ? (
|
||||
<Trans i18nKey="responsabilité.bouton2">Entreprise individuelle</Trans>
|
||||
) : (
|
||||
<Trans i18nKey="responsabilité.bouton1">Société</Trans>
|
||||
)
|
||||
case 'directorStatus':
|
||||
return value === 'SELF_EMPLOYED' ? (
|
||||
<Trans>Indépendant</Trans>
|
||||
) : (
|
||||
<Trans>Assimilé salarié</Trans>
|
||||
)
|
||||
case 'autoEntrepreneur':
|
||||
return value ? (
|
||||
<Trans>Auto-entrepreneur</Trans>
|
||||
) : (
|
||||
<Trans>Pas en auto-entrepreneur</Trans>
|
||||
)
|
||||
case 'minorityDirector':
|
||||
return value ? (
|
||||
<Trans>Gérant minoritaire</Trans>
|
||||
) : (
|
||||
<Trans>Gérant majoritaire</Trans>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const PreviousAnswersList = styled.nav`
|
||||
font-family: ${({ theme }) => theme.fonts.main};
|
||||
display: flex;
|
||||
list-style-type: none;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
margin-bottom: -1rem;
|
||||
`
|
||||
|
||||
const PreviousAnswersItem = styled.li`
|
||||
padding-right: 0.5rem;
|
||||
&:after {
|
||||
content: '>';
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
`
|
||||
|
||||
export default function PreviousAnswers() {
|
||||
const location = useLocation()
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
const legalStatus = useSelector(
|
||||
(state: RootState) => state.choixStatutJuridique.companyLegalStatus
|
||||
)
|
||||
|
||||
const { t } = useTranslation()
|
||||
|
||||
if (Object.values(legalStatus).length < 1) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<PreviousAnswersList aria-label={t('Étapes du choix du statut juridique')}>
|
||||
{Object.entries(legalStatus).map(([key, value]) => {
|
||||
const textObject = requirementToText(
|
||||
key as keyof LegalStatusRequirements,
|
||||
value as string
|
||||
)
|
||||
const isCurrent =
|
||||
decodeURI(location.pathname) ===
|
||||
absoluteSitePaths.assistants['choix-du-statut'].guideStatut[
|
||||
key as keyof typeof legalStatus
|
||||
]
|
||||
|
||||
return (
|
||||
value !== undefined && (
|
||||
<PreviousAnswersItem
|
||||
key={key}
|
||||
aria-current={isCurrent ? 'step' : undefined}
|
||||
>
|
||||
<Link
|
||||
to={
|
||||
absoluteSitePaths.assistants['choix-du-statut'].guideStatut[
|
||||
key as keyof typeof legalStatus
|
||||
]
|
||||
}
|
||||
aria-label={
|
||||
(isCurrent
|
||||
? t("Aller à l'étape actuelle :")
|
||||
: t("Revenir à l'étape")) +
|
||||
' ' +
|
||||
(textObject as RequirementToTextType)?.props?.children || ''
|
||||
}
|
||||
style={
|
||||
isCurrent
|
||||
? { textDecoration: 'underline' }
|
||||
: { textDecoration: 'none' }
|
||||
}
|
||||
>
|
||||
{textObject}
|
||||
</Link>
|
||||
</PreviousAnswersItem>
|
||||
)
|
||||
)
|
||||
})}
|
||||
</PreviousAnswersList>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,104 +0,0 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
import DefaultHelmet from '@/components/utils/DefaultHelmet'
|
||||
import AnswerGroup from '@/design-system/answer-group'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Li, Ul } from '@/design-system/typography/list'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
import {
|
||||
isSoleProprietorship,
|
||||
useDispatchAndGoToNextQuestion,
|
||||
} from '@/store/actions/companyStatusActions'
|
||||
|
||||
export default function SoleProprietorship() {
|
||||
const dispatch = useDispatchAndGoToNextQuestion()
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<>
|
||||
<TrackPage name="societe_ou_entreprise_individuelle" />
|
||||
<DefaultHelmet>
|
||||
<title>
|
||||
{t(
|
||||
'responsabilité.page.titre',
|
||||
'Choisir entre société ou entreprise individuelle'
|
||||
)}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={t(
|
||||
'responsabilité.description',
|
||||
'Responsabilité limitée ? entreprise individuelle ? Chaque option a des implications juridiques et conduit à un statut différent pour la création de votre entreprise en France. Ce guide vous aide à choisir entre les différentes forme de responsabilité.'
|
||||
)}
|
||||
/>
|
||||
</DefaultHelmet>
|
||||
<H2>
|
||||
<Trans i18nKey="responsabilité.titre">
|
||||
Entreprise individuelle ou société ?
|
||||
</Trans>
|
||||
</H2>
|
||||
<Body>
|
||||
<Trans i18nKey="responsabilité.intro">
|
||||
Ce choix determine votre degré de responsabilité et votre capacité à
|
||||
accueillir de nouveaux associés dans le futur{' '}
|
||||
</Trans>
|
||||
:
|
||||
</Body>
|
||||
<Ul>
|
||||
<Li>
|
||||
<Trans i18nKey="responsabilité.entreprise-individuelle">
|
||||
<strong>Entreprise individuelle : </strong>
|
||||
Une activité économique exercée par une seule personne physique, en
|
||||
son nom propre. Moins de formalités, mais plus de risques en cas de
|
||||
faillite, car votre patrimoine personnel peut être mis à
|
||||
contribution.{' '}
|
||||
<strong>
|
||||
Vous ne pouvez pas accueillir de nouveaux associés en entreprise
|
||||
individuelle.
|
||||
</strong>
|
||||
</Trans>
|
||||
</Li>
|
||||
|
||||
<Li>
|
||||
<Trans i18nKey="responsabilité.société">
|
||||
<strong>Société : </strong>
|
||||
Vous ne pouvez pas être tenu personnellement responsable des dettes
|
||||
ou obligations de la société. En revanche, les démarches de création
|
||||
sont un peu plus lourdes, puisqu'elles incluent notamment la
|
||||
rédaction de statuts et le dépôt d'un capital.
|
||||
</Trans>
|
||||
</Li>
|
||||
</Ul>
|
||||
<AnswerGroup role="list">
|
||||
<Button
|
||||
onPress={() => {
|
||||
dispatch(isSoleProprietorship(true))
|
||||
}}
|
||||
aria-label={t(
|
||||
'responsabilité.bouton2-aria-label',
|
||||
"Entreprise individuelle, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="responsabilité.bouton2">
|
||||
Entreprise individuelle
|
||||
</Trans>
|
||||
</Button>
|
||||
<Button
|
||||
onPress={() => {
|
||||
dispatch(isSoleProprietorship(false))
|
||||
}}
|
||||
aria-label={t(
|
||||
'responsabilité.bouton1-aria-label',
|
||||
"Société, sélectionner l'option et passer à l'étape suivante"
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="responsabilité.bouton1">Société</Trans>
|
||||
</Button>
|
||||
</AnswerGroup>
|
||||
{/* this is an economic activity conducted by a single natural person, in his own name ; */}
|
||||
{/* Company : This is an economic activity conducted by a single partner - single member company with limited liability (EURL) - or several partners (limited liability company (SARL), public limited company (SA), simplified joint-stock company (SAS)...). */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,132 +0,0 @@
|
|||
import { useEffect } from 'react'
|
||||
import { Trans } from 'react-i18next'
|
||||
import { useDispatch, useSelector } from 'react-redux'
|
||||
import { Navigate, Route, Routes, useLocation } from 'react-router-dom'
|
||||
|
||||
import { TrackChapter } from '@/components/ATInternetTracking'
|
||||
import { FromBottom } from '@/components/ui/animate'
|
||||
import { H1 } from '@/design-system/typography/heading'
|
||||
import { Link } from '@/design-system/typography/link'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import { resetCompanyStatusChoice } from '@/store/actions/companyStatusActions'
|
||||
import { RootState } from '@/store/reducers/rootReducer'
|
||||
|
||||
import AutoEntrepreneur from './AutoEntrepreneur'
|
||||
import DirectorStatus from './DirectorStatus'
|
||||
import MinorityDirector from './MinorityDirector'
|
||||
import NumberOfAssociate from './NumberOfAssociate'
|
||||
import PickLegalStatus from './PickLegalStatus'
|
||||
import PreviousAnswers from './PreviousAnswers'
|
||||
import SoleProprietorship from './SoleProprietorship'
|
||||
|
||||
const useResetFollowingAnswers = () => {
|
||||
const dispatch = useDispatch()
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
const location = useLocation()
|
||||
const answeredQuestion = useSelector(
|
||||
(state: RootState) =>
|
||||
Object.keys(
|
||||
state.choixStatutJuridique.companyLegalStatus
|
||||
) as (keyof typeof state.choixStatutJuridique.companyLegalStatus)[]
|
||||
)
|
||||
useEffect(() => {
|
||||
const companyStatusCurrentQuestionName = (Object.entries(
|
||||
absoluteSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
).find(([, pathname]) => location.pathname === pathname) || [])[0]
|
||||
if (!companyStatusCurrentQuestionName) {
|
||||
return
|
||||
}
|
||||
|
||||
const firstAnswerToResetIndex = answeredQuestion.findIndex(
|
||||
(a) => a === companyStatusCurrentQuestionName
|
||||
)
|
||||
|
||||
if (firstAnswerToResetIndex !== -1) {
|
||||
dispatch(
|
||||
resetCompanyStatusChoice(
|
||||
answeredQuestion.slice(firstAnswerToResetIndex)
|
||||
)
|
||||
)
|
||||
}
|
||||
}, [location.pathname, dispatch, absoluteSitePaths.assistants])
|
||||
}
|
||||
|
||||
export default function Créer() {
|
||||
const { relativeSitePaths, absoluteSitePaths } = useSitePaths()
|
||||
const location = useLocation()
|
||||
useResetFollowingAnswers()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Link to={absoluteSitePaths.assistants['choix-du-statut'].index}>
|
||||
<span aria-hidden>←</span> <Trans>Retour</Trans>
|
||||
</Link>
|
||||
<TrackChapter chapter2="guide">
|
||||
<H1>
|
||||
<Trans i18nKey="formeJuridique.titre">
|
||||
Choix du statut juridique
|
||||
</Trans>
|
||||
</H1>
|
||||
<PreviousAnswers />
|
||||
<FromBottom key={location.pathname}>
|
||||
<Routes>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.soleProprietorship
|
||||
}
|
||||
element={<SoleProprietorship />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.directorStatus
|
||||
}
|
||||
element={<DirectorStatus />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.autoEntrepreneur
|
||||
}
|
||||
element={<AutoEntrepreneur />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.multipleAssociates
|
||||
}
|
||||
element={<NumberOfAssociate />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.minorityDirector
|
||||
}
|
||||
element={<MinorityDirector />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.liste
|
||||
}
|
||||
element={<PickLegalStatus />}
|
||||
/>
|
||||
<Route
|
||||
index
|
||||
element={
|
||||
<Navigate
|
||||
to={
|
||||
absoluteSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
.liste
|
||||
}
|
||||
replace
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</Routes>
|
||||
</FromBottom>
|
||||
</TrackChapter>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
import { Trans } from 'react-i18next'
|
||||
|
||||
import { LegalStatus } from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
type Props = {
|
||||
statut: LegalStatus
|
||||
}
|
||||
|
||||
const StatutDescription = ({ statut }: Props) =>
|
||||
statut === 'EI' ? (
|
||||
<Trans i18nKey="formeJuridique.EI">
|
||||
Aucun apport en capital n'est nécessaire. Le capital privé et le capital
|
||||
de l'entreprise ne font qu'un.
|
||||
</Trans>
|
||||
) : statut === 'EIRL' ? (
|
||||
<Trans i18nKey="formeJuridique.EIRL">
|
||||
Permet d'attribuer un capital spécifique à son activité professionnelle,
|
||||
et de choisir le régime d'imposition sur les société (IS) plutôt que
|
||||
revenu (IR) La société et l'individu constituent la même personne. Ne
|
||||
convient pas si l'associé unique est une personne morale (entreprise) ou
|
||||
si vous pensez accueillir d'autres associés au cours de votre
|
||||
développement (choisissez EURL dans ce cas).
|
||||
</Trans>
|
||||
) : statut === 'EURL' ? (
|
||||
<Trans i18nKey="formeJuridique.EURL">
|
||||
L'entreprise n'a qu'un associé. La responsabilité est limitée au montant
|
||||
de l'apport de capital. Evolue en SARL lors de l'arrivée de nouveaux
|
||||
associés dans la société.
|
||||
</Trans>
|
||||
) : statut.includes('SARL') ? (
|
||||
<Trans i18nKey="formeJuridique.SARL">
|
||||
Société ayant au moins deux associés dont la responsabilité financière est
|
||||
limitée au montant de leur apport au capital. Le capital minimum est fixé
|
||||
librement dans les statuts. Les associés se répartissent des parts
|
||||
sociales toutes identiques, et la société est dirigée par un ou plusieurs
|
||||
gérants qui sont forcément des personnes physiques. Le fonctionnement
|
||||
d'une SARL est encadré par le code du commerce.
|
||||
</Trans>
|
||||
) : statut === 'SAS' ? (
|
||||
<Trans i18nKey="formeJuridique.SAS">
|
||||
Société ayant au moins deux associés. La responsabilité financière des
|
||||
associés est limitée au montant de leur apport au capital de la société.
|
||||
Le capital minimum est fixé librement dans les statuts. Les associés se
|
||||
répartissent des actions qui peuvent être de plusieurs catégories, et la
|
||||
société est dirigée par un président qui peut être une personne morale
|
||||
(une autre société). La SAS se caractérise par une grande souplesse de
|
||||
fonctionnement (statuts sur mesure).
|
||||
</Trans>
|
||||
) : statut === 'SASU' ? (
|
||||
<Trans i18nKey="formeJuridique.SASU">
|
||||
L'entreprise n'a qu'un associé. La responsabilité est limitée au montant
|
||||
de l'apport de capital de l'unique associé (qui peut être une personne
|
||||
morale).
|
||||
</Trans>
|
||||
) : statut === 'SA' ? (
|
||||
<Trans i18nKey="formeJuridique.SA">
|
||||
Société ayant au moins deux actionnaires. C'est le seul statut qui permet
|
||||
d'être coté en bourse (à partir de 7 actionnaires). Le capital social
|
||||
minimum est de 37.000 €.
|
||||
</Trans>
|
||||
) : (statut as string) === 'SNC' ? (
|
||||
<Trans i18nKey="formeJuridique.SNC">
|
||||
La responsabilité des associés pour les dettes de la société est solidaire
|
||||
(un seul associé peut être poursuivi pour la totalité de la dette) et
|
||||
indéfinie (responsable sur la totalité de son patrimoine personnel).
|
||||
</Trans>
|
||||
) : statut === 'auto-entrepreneur' ? (
|
||||
<Trans i18nKey="formeJuridique.micro">
|
||||
Un auto-entrepreneur exerce son activité en entreprise individuelle, avec
|
||||
un régime forfaitaire pour ses cotisations sociales et un calcul
|
||||
spécifique de l'impôt.
|
||||
</Trans>
|
||||
) : statut === 'auto-entrepreneur-EIRL' ? (
|
||||
<Trans i18nKey="formeJuridique.micro-EIRL">
|
||||
Un auto-entrepreneur option EIRL exerce son activité en entreprise
|
||||
individuelle en choisissant l'option "Entrepreneur individuel à
|
||||
responsabilité limitée", avec à un régime forfaitaire pour le calcul des
|
||||
impôts et le paiement des cotisations de sécurité sociale.
|
||||
</Trans>
|
||||
) : /* Otherwise */ null
|
||||
|
||||
export default StatutDescription
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useMatch } from 'react-router-dom'
|
||||
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
|
||||
export const stepOrder = [
|
||||
'activité',
|
||||
'département',
|
||||
'lucratif',
|
||||
'associé',
|
||||
'rémunération',
|
||||
'statuts',
|
||||
'résultat',
|
||||
] as const
|
||||
|
||||
type Step = (typeof stepOrder)[number]
|
||||
|
||||
function useCurrentStep() {
|
||||
const { relativeSitePaths, absoluteSitePaths } = useSitePaths()
|
||||
const localizedStep = useMatch(
|
||||
`${absoluteSitePaths.assistants['choix-du-statut'].index}/:step`
|
||||
)?.params.step
|
||||
if (!localizedStep) {
|
||||
return null
|
||||
}
|
||||
|
||||
const currentStep = Object.entries(
|
||||
relativeSitePaths.assistants['choix-du-statut']
|
||||
).find(
|
||||
([, value]) => value === localizedStep
|
||||
)?.[0] as keyof (typeof relativeSitePaths.assistants)['choix-du-statut']
|
||||
|
||||
if (!stepOrder.includes(currentStep as Step)) {
|
||||
return null
|
||||
}
|
||||
|
||||
return currentStep as Step
|
||||
}
|
||||
|
||||
export default function Navigation({
|
||||
currentStepIsComplete,
|
||||
}: {
|
||||
currentStepIsComplete: boolean
|
||||
}) {
|
||||
const { t } = useTranslation()
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
|
||||
const currentStep = useCurrentStep()
|
||||
if (!currentStep) {
|
||||
return null
|
||||
}
|
||||
const nextStep = stepOrder[stepOrder.indexOf(currentStep) + 1]
|
||||
const previousStep = stepOrder[stepOrder.indexOf(currentStep) - 1]
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
size="XS"
|
||||
to={
|
||||
absoluteSitePaths.assistants['choix-du-statut'][
|
||||
previousStep || 'index'
|
||||
]
|
||||
}
|
||||
>
|
||||
<span aria-hidden>←</span> <Trans>Précédent</Trans>
|
||||
</Button>
|
||||
|
||||
{nextStep && (
|
||||
<Button
|
||||
size="XS"
|
||||
to={absoluteSitePaths.assistants['choix-du-statut'][nextStep]}
|
||||
isDisabled={!currentStepIsComplete}
|
||||
light
|
||||
color={'secondary'}
|
||||
aria-label={t("Suivant, passer à l'étape suivante")}
|
||||
>
|
||||
<Trans>Suivant</Trans>
|
||||
|
||||
<span aria-hidden>→</span>
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,12 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Activité() {
|
||||
return (
|
||||
<>
|
||||
<H1>Activité</H1>
|
||||
<Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Associé() {
|
||||
return (
|
||||
<>
|
||||
<H1>Associé</H1>
|
||||
<Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import ChoixDuStatut from '..'
|
||||
import { config } from '../../../simulateurs/_configs/config'
|
||||
import { SimulatorsDataParams } from '../../../simulateurs/_configs/types'
|
||||
import ChoixDuStatut from '.'
|
||||
import { config } from '../../simulateurs/_configs/config'
|
||||
import { SimulatorsDataParams } from '../../simulateurs/_configs/types'
|
||||
|
||||
export function choixStatutJuridiqueConfig({
|
||||
t,
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Département() {
|
||||
return (
|
||||
<>
|
||||
<H1>Département</H1> <Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useSelector } from 'react-redux'
|
||||
import styled from 'styled-components'
|
||||
|
||||
import { TrackPage } from '@/components/ATInternetTracking'
|
||||
|
|
@ -8,27 +7,20 @@ import { FromBottom } from '@/components/ui/animate'
|
|||
import Meta from '@/components/utils/Meta'
|
||||
import { Message } from '@/design-system'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { Card } from '@/design-system/card'
|
||||
import { ClockIcon } from '@/design-system/icons'
|
||||
import { Container, Grid, Spacing } from '@/design-system/layout'
|
||||
import { H2, H3, H4 } from '@/design-system/typography/heading'
|
||||
import { H3 } from '@/design-system/typography/heading'
|
||||
import { Body, Intro, SmallBody } from '@/design-system/typography/paragraphs'
|
||||
import useSimulatorsData from '@/hooks/useSimulatorsData'
|
||||
import { SimulateurCard } from '@/pages/simulateurs-et-assistants'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import { RootState } from '@/store/reducers/rootReducer'
|
||||
import { useNextQuestionUrl } from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
import créerSvg from './créer.svg'
|
||||
import { stepOrder } from './_components/Navigation'
|
||||
import créerSvg from './_illustrations/créer.svg'
|
||||
|
||||
export default function AccueilChoixStatut() {
|
||||
const { t } = useTranslation()
|
||||
const { absoluteSitePaths, relativeSitePaths } = useSitePaths()
|
||||
const nextQuestionUrl = useNextQuestionUrl()
|
||||
const guideAlreadyStarted = useSelector(
|
||||
(state: RootState) =>
|
||||
!!Object.keys(state.choixStatutJuridique.companyLegalStatus).length
|
||||
)
|
||||
const simulateurData = useSimulatorsData()
|
||||
|
||||
return (
|
||||
|
|
@ -69,13 +61,7 @@ export default function AccueilChoixStatut() {
|
|||
<Grid item xs={12} sm={'auto'}>
|
||||
<Button
|
||||
size="XL"
|
||||
to={
|
||||
relativeSitePaths.assistants['choix-du-statut'].assistant
|
||||
// guideAlreadyStarted && nextQuestionUrl
|
||||
// ? nextQuestionUrl
|
||||
// : absoluteSitePaths.assistants['choix-du-statut'].guideStatut
|
||||
// .multipleAssociates
|
||||
}
|
||||
to={relativeSitePaths.assistants['choix-du-statut'][stepOrder[0]]}
|
||||
>
|
||||
<Trans i18nKey="choix-statut.home.find-statut">
|
||||
Trouver le bon statut
|
||||
|
|
@ -84,12 +70,18 @@ export default function AccueilChoixStatut() {
|
|||
</Grid>
|
||||
|
||||
<Grid item>
|
||||
<StyledSmallBody>
|
||||
<SmallBody
|
||||
grey
|
||||
css={`
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
`}
|
||||
>
|
||||
<ClockIcon />
|
||||
<Trans i18nKey="choix-statut.home.estimated-duration">
|
||||
Durée estimée : 5 minutes.
|
||||
</Trans>
|
||||
</StyledSmallBody>
|
||||
</SmallBody>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</PageHeader>
|
||||
|
|
@ -112,29 +104,6 @@ export default function AccueilChoixStatut() {
|
|||
role="listitem"
|
||||
{...simulateurData['comparaison-statuts']}
|
||||
/>
|
||||
<Grid item xs={12} sm={6} lg={4} role="listitem">
|
||||
<Card
|
||||
icon="🚶"
|
||||
title={t(
|
||||
'créer.ressources.autoEntrepreneur.title',
|
||||
'Démarche auto-entrepreneur'
|
||||
)}
|
||||
to={
|
||||
absoluteSitePaths.assistants['choix-du-statut'][
|
||||
'auto-entrepreneur'
|
||||
]
|
||||
}
|
||||
ctaLabel={t(
|
||||
'créer.ressources.autoEntrepreneur.cta',
|
||||
'Consulter les démarches'
|
||||
)}
|
||||
>
|
||||
<Trans i18nKey="créer.ressources.autoEntrepreneur.body">
|
||||
Vous souhaitez devenir auto-entrepreneur ? Découvrez les étapes
|
||||
pour bien démarrer votre activité
|
||||
</Trans>
|
||||
</Card>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</StyledContainer>
|
||||
</FromBottom>
|
||||
|
|
@ -158,24 +127,3 @@ const StyledContainer = styled(Container)`
|
|||
margin-bottom: 1.5rem;
|
||||
}
|
||||
`
|
||||
|
||||
const StyledSmallBody = styled(SmallBody)`
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
/* margin: 16rem 1rem; */
|
||||
|
||||
&& {
|
||||
color: ${({ theme }) =>
|
||||
theme.darkMode
|
||||
? theme.colors.extended.grey[600]
|
||||
: theme.colors.extended.grey[500]};
|
||||
}
|
||||
svg {
|
||||
margin-right: 0.5rem;
|
||||
|
||||
fill: ${({ theme }) =>
|
||||
theme.darkMode
|
||||
? theme.colors.extended.grey[600]
|
||||
: theme.colors.extended.grey[500]};
|
||||
}
|
||||
`
|
||||
|
|
@ -1,112 +1,36 @@
|
|||
import { useCallback, useState } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { Route, Routes, useLocation } from 'react-router-dom'
|
||||
|
||||
import { ScrollToTop } from '@/components/utils/Scroll'
|
||||
import { Button } from '@/design-system/buttons'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
|
||||
import AfterRegistration from './AfterRegistration'
|
||||
import AccueilChoixStatut from './choix-statut-juridique'
|
||||
import GuideStatut from './GuideStatut'
|
||||
|
||||
type Step =
|
||||
| 'activité'
|
||||
| 'département'
|
||||
| 'lucratif'
|
||||
| 'associé'
|
||||
| 'rémunération'
|
||||
| 'statuts'
|
||||
| 'résultat'
|
||||
|
||||
const stepOrder: Step[] = [
|
||||
'activité',
|
||||
'département',
|
||||
'lucratif',
|
||||
'associé',
|
||||
'rémunération',
|
||||
'statuts',
|
||||
'résultat',
|
||||
]
|
||||
|
||||
// map stepo
|
||||
|
||||
export const AssistantChoixStatut = () => {
|
||||
const { t } = useTranslation()
|
||||
const [currentStep, setCurrentStep] = useState<Step>('activité')
|
||||
|
||||
const nextStep = useCallback(() => {
|
||||
setCurrentStep((step) => {
|
||||
const index = stepOrder.findIndex((s) => s === step)
|
||||
|
||||
return stepOrder[index + 1] || stepOrder[index]
|
||||
})
|
||||
}, [])
|
||||
|
||||
const prevStep = useCallback(() => {
|
||||
setCurrentStep((step) => {
|
||||
const index = stepOrder.findIndex((s) => s === step)
|
||||
|
||||
return stepOrder[index - 1] || stepOrder[index]
|
||||
})
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
{currentStep}
|
||||
|
||||
<Button light onPress={prevStep} size="XS">
|
||||
<span aria-hidden>←</span> <Trans>Précédent</Trans>
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
size="XS"
|
||||
onPress={nextStep}
|
||||
light
|
||||
color={'secondary'}
|
||||
aria-label={
|
||||
t('Suivant, passer à la question suivante')
|
||||
// : t('Passer, passer la question sans répondre')
|
||||
}
|
||||
>
|
||||
{/* {currentQuestionIsAnswered ? ( */}
|
||||
<Trans>Suivant</Trans>
|
||||
{/* ) : (
|
||||
<Trans>Passer</Trans>
|
||||
)}{' '} */}
|
||||
<span aria-hidden>→</span>
|
||||
</Button>
|
||||
</>
|
||||
)
|
||||
}
|
||||
import Activité from './activité'
|
||||
import AfterRegistration from './après'
|
||||
import Associé from './associé'
|
||||
import Département from './département'
|
||||
import AccueilChoixStatut from './home'
|
||||
import Lucratif from './lucratif'
|
||||
import Rémunération from './rémunération'
|
||||
import Résultat from './résultat'
|
||||
import Statuts from './statuts'
|
||||
|
||||
export default function ChoixDuStatut() {
|
||||
const { relativeSitePaths } = useSitePaths()
|
||||
const location = useLocation()
|
||||
const childrenPaths = relativeSitePaths.assistants['choix-du-statut']
|
||||
|
||||
return (
|
||||
<>
|
||||
<ScrollToTop key={location.pathname} />
|
||||
<Routes>
|
||||
<Route index element={<AccueilChoixStatut />} />
|
||||
{/* {LANDING_LEGAL_STATUS_LIST.map((statut) => ( */}
|
||||
<Route
|
||||
// key={statut}
|
||||
path={relativeSitePaths.assistants['choix-du-statut'].assistant}
|
||||
element={<AssistantChoixStatut />}
|
||||
/>
|
||||
{/* ))} */}
|
||||
<Route
|
||||
path={relativeSitePaths.assistants['choix-du-statut'].après}
|
||||
element={<AfterRegistration />}
|
||||
/>
|
||||
<Route
|
||||
path={
|
||||
relativeSitePaths.assistants['choix-du-statut'].guideStatut.index +
|
||||
'/*'
|
||||
}
|
||||
element={<GuideStatut />}
|
||||
/>
|
||||
<Route path={childrenPaths.après} element={<AfterRegistration />} />
|
||||
<Route path={childrenPaths.activité} element={<Activité />} />
|
||||
<Route path={childrenPaths.département} element={<Département />} />
|
||||
<Route path={childrenPaths.associé} element={<Associé />} />
|
||||
<Route path={childrenPaths.lucratif} element={<Lucratif />} />
|
||||
<Route path={childrenPaths.rémunération} element={<Rémunération />} />
|
||||
<Route path={childrenPaths.résultat} element={<Résultat />} />
|
||||
<Route path={childrenPaths.statuts} element={<Statuts />} />
|
||||
</Routes>
|
||||
</>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,11 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Lucratif() {
|
||||
return (
|
||||
<>
|
||||
<H1>Lucratif</H1> <Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Rémunération() {
|
||||
return (
|
||||
<>
|
||||
<H1>Rémunération</H1> <Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Résultat() {
|
||||
return (
|
||||
<>
|
||||
<H1>Résultat</H1> <Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { H1 } from '@/design-system/typography/heading'
|
||||
|
||||
import Navigation from './_components/Navigation'
|
||||
|
||||
export default function Statuts() {
|
||||
return (
|
||||
<>
|
||||
<H1>Statuts</H1>
|
||||
<Navigation currentStepIsComplete />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -6,6 +6,8 @@ import {
|
|||
WhenNotApplicable,
|
||||
} from '@/components/EngineValue'
|
||||
import { useEngine } from '@/components/utils/EngineContext'
|
||||
// import { Article } from '@/design-system/card'
|
||||
// import { Emoji } from '@/design-system/emoji'
|
||||
import { Grid } from '@/design-system/layout'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { MergedSimulatorDataValues } from '@/hooks/useCurrentSimulatorData'
|
||||
|
|
@ -125,3 +127,32 @@ const guidesUrssaf = [
|
|||
ctaLabel: 'En savoir plus',
|
||||
},
|
||||
]
|
||||
|
||||
// const FAQAutoEntrepreneurArticle = () => {
|
||||
// const { t } = useTranslation()
|
||||
|
||||
// return (
|
||||
// <Article
|
||||
// title={
|
||||
// <h3>
|
||||
// {t(
|
||||
// 'pages.common.ressources-auto-entrepreneur.FAQ.title',
|
||||
// 'Questions fréquentes'
|
||||
// )}{' '}
|
||||
// <Emoji emoji="❓" />
|
||||
// </h3>
|
||||
// }
|
||||
// href="https://www.autoentrepreneur.urssaf.fr/portail/accueil/une-question/questions-frequentes.html"
|
||||
// ctaLabel={t(
|
||||
// 'pages.common.ressources-auto-entrepreneur.FAQ.cta',
|
||||
// 'Voir les réponses'
|
||||
// )}
|
||||
// >
|
||||
// <Trans i18nKey="pages.common.ressources-auto-entrepreneur.FAQ.body">
|
||||
// Une liste exhaustive et maintenue à jour de toutes les questions
|
||||
// fréquentes (et moins fréquentes) que l'on est amené à poser en tant
|
||||
// qu'auto-entrepreneur
|
||||
// </Trans>
|
||||
// </Article>
|
||||
// )
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { ImmutableType } from '@/types/utils'
|
||||
|
||||
import { choixStatutJuridiqueConfig } from '../assistants/choix-du-statut/choix-statut-juridique/config'
|
||||
import { choixStatutJuridiqueConfig } from '../assistants/choix-du-statut/config'
|
||||
import { déclarationChargesSocialesIndépendantConfig } from '../assistants/declaration-charges-sociales-independant/config'
|
||||
import { déclarationRevenuIndépendantBetaConfig } from '../assistants/declaration-revenu-independants/config'
|
||||
import { demandeMobilitéConfig } from '../assistants/demande-mobilité/config'
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
import { MetadataSrc } from '@/pages/simulateurs/metadata-src'
|
||||
import { LegalStatus } from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
// export const LANDING_LEGAL_STATUS_LIST: Array<LegalStatus> = [
|
||||
// 'EI',
|
||||
|
|
@ -46,18 +45,15 @@ const rawSitePathsFr = {
|
|||
},
|
||||
'choix-du-statut': {
|
||||
index: 'choix-du-statut',
|
||||
assistant: 'assistant',
|
||||
activité: 'activité',
|
||||
département: 'département',
|
||||
lucratif: 'lucratif',
|
||||
associé: 'associé',
|
||||
rémunération: 'rémunération',
|
||||
statuts: 'statuts',
|
||||
résultat: 'résultat',
|
||||
// ...status,
|
||||
après: 'après-la-création',
|
||||
guideStatut: {
|
||||
index: 'statut-juridique',
|
||||
liste: 'liste',
|
||||
soleProprietorship: 'responsabilité',
|
||||
directorStatus: 'dirigeant',
|
||||
autoEntrepreneur: 'auto-entrepreneur-ou-entreprise-individuelle',
|
||||
multipleAssociates: 'nombre-associés',
|
||||
minorityDirector: 'gérant-majoritaire-ou-minoritaire',
|
||||
},
|
||||
},
|
||||
},
|
||||
simulateurs: {
|
||||
|
|
@ -139,15 +135,14 @@ const rawSitePathsEn = {
|
|||
index: 'choice-of-status',
|
||||
assistant: 'assistant',
|
||||
après: 'after-registration',
|
||||
guideStatut: {
|
||||
index: 'legal-status',
|
||||
liste: 'list',
|
||||
soleProprietorship: 'liability',
|
||||
directorStatus: 'director',
|
||||
autoEntrepreneur: 'auto-entrepreneur',
|
||||
multipleAssociates: 'multiple-associates',
|
||||
minorityDirector: 'chairman-or-managing-director',
|
||||
},
|
||||
|
||||
activité: 'activity',
|
||||
département: 'state',
|
||||
lucratif: 'lucrative',
|
||||
associé: 'partnership',
|
||||
rémunération: 'remuneration',
|
||||
statuts: 'statuts',
|
||||
résultat: 'result',
|
||||
},
|
||||
},
|
||||
simulateurs: {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import { buildSituationFromObject } from '@/utils'
|
|||
|
||||
import { CompanyActions } from './companyActions'
|
||||
import { CompanyCreationAction } from './companyCreationChecklistActions'
|
||||
import { CompanyStatusAction } from './companyStatusActions'
|
||||
import { HiringChecklistAction } from './hiringChecklistAction'
|
||||
|
||||
export type Action =
|
||||
|
|
@ -27,7 +26,6 @@ export type Action =
|
|||
| typeof updateShouldFocusField
|
||||
>
|
||||
| CompanyCreationAction
|
||||
| CompanyStatusAction
|
||||
| CompanyActions
|
||||
| HiringChecklistAction
|
||||
|
||||
|
|
|
|||
|
|
@ -1,75 +0,0 @@
|
|||
import { useEffect, useState } from 'react'
|
||||
import { useDispatch } from 'react-redux'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
|
||||
import { useNextQuestionUrl } from '@/store/selectors/companyStatusSelectors'
|
||||
import { LegalStatusRequirements } from '@/types/companyTypes'
|
||||
|
||||
import { Action } from './actions'
|
||||
|
||||
export type CompanyStatusAction = ReturnType<
|
||||
| typeof isSoleProprietorship
|
||||
| typeof defineDirectorStatus
|
||||
| typeof companyHasMultipleAssociates
|
||||
| typeof isAutoentrepreneur
|
||||
| typeof directorIsInAMinority
|
||||
| typeof resetCompanyStatusChoice
|
||||
>
|
||||
|
||||
// This feels hacky, we should express this "dispatch and navigate" in another way
|
||||
export const useDispatchAndGoToNextQuestion = () => {
|
||||
const dispatch = useDispatch()
|
||||
const navigate = useNavigate()
|
||||
const nextQuestion = useNextQuestionUrl()
|
||||
const [dispatched, setDispatched] = useState(false)
|
||||
useEffect(() => {
|
||||
if (dispatched) {
|
||||
navigate(nextQuestion)
|
||||
}
|
||||
}, [dispatched])
|
||||
|
||||
return (action: Action) => {
|
||||
dispatch(action)
|
||||
setDispatched(true)
|
||||
}
|
||||
}
|
||||
|
||||
export const isSoleProprietorship = (isSoleProprietorship?: boolean) =>
|
||||
({
|
||||
type: 'COMPANY_IS_SOLE_PROPRIETORSHIP',
|
||||
isSoleProprietorship,
|
||||
} as const)
|
||||
|
||||
type DirectorStatus = 'SALARIED' | 'SELF_EMPLOYED'
|
||||
|
||||
export const defineDirectorStatus = (status: DirectorStatus) =>
|
||||
({
|
||||
type: 'DEFINE_DIRECTOR_STATUS',
|
||||
status,
|
||||
} as const)
|
||||
|
||||
export const companyHasMultipleAssociates = (multipleAssociates?: boolean) =>
|
||||
({
|
||||
type: 'COMPANY_HAS_MULTIPLE_ASSOCIATES',
|
||||
multipleAssociates,
|
||||
} as const)
|
||||
|
||||
export const isAutoentrepreneur = (autoEntrepreneur?: boolean) =>
|
||||
({
|
||||
type: 'COMPANY_IS_MICROENTERPRISE',
|
||||
autoEntrepreneur,
|
||||
} as const)
|
||||
|
||||
export const directorIsInAMinority = (minorityDirector?: boolean) =>
|
||||
({
|
||||
type: 'SPECIFY_DIRECTORS_SHARE',
|
||||
minorityDirector,
|
||||
} as const)
|
||||
|
||||
export const resetCompanyStatusChoice = (
|
||||
answersToReset?: (keyof LegalStatusRequirements)[]
|
||||
) =>
|
||||
({
|
||||
type: 'RESET_COMPANY_STATUS_CHOICE',
|
||||
answersToReset,
|
||||
} as const)
|
||||
|
|
@ -1,193 +0,0 @@
|
|||
import { useSelector } from 'react-redux'
|
||||
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
import { RootState } from '@/store/reducers/rootReducer'
|
||||
import { LegalStatusRequirements, State } from '@/types/companyTypes'
|
||||
|
||||
const LEGAL_STATUS_DETAILS = {
|
||||
'auto-entrepreneur': {
|
||||
soleProprietorship: true,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
minorityDirector: false,
|
||||
multipleAssociates: false,
|
||||
autoEntrepreneur: true,
|
||||
},
|
||||
EIRL: {
|
||||
soleProprietorship: true,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
multipleAssociates: false,
|
||||
autoEntrepreneur: false,
|
||||
minorityDirector: false,
|
||||
},
|
||||
'auto-entrepreneur-EIRL': {
|
||||
soleProprietorship: true,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
multipleAssociates: false,
|
||||
minorityDirector: false,
|
||||
autoEntrepreneur: true,
|
||||
},
|
||||
EI: {
|
||||
soleProprietorship: true,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
minorityDirector: false,
|
||||
multipleAssociates: false,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
SASU: {
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SALARIED',
|
||||
minorityDirector: false,
|
||||
multipleAssociates: false,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
SAS: {
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SALARIED',
|
||||
multipleAssociates: true,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
SARL: [
|
||||
{
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
multipleAssociates: true,
|
||||
minorityDirector: false,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
{
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SALARIED',
|
||||
multipleAssociates: true,
|
||||
minorityDirector: true,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
] as Array<LegalStatusRequirements>,
|
||||
EURL: {
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SELF_EMPLOYED',
|
||||
minorityDirector: false,
|
||||
multipleAssociates: false,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
SA: {
|
||||
soleProprietorship: false,
|
||||
directorStatus: 'SALARIED',
|
||||
multipleAssociates: true,
|
||||
autoEntrepreneur: false,
|
||||
},
|
||||
}
|
||||
|
||||
export type LegalStatus = keyof typeof LEGAL_STATUS_DETAILS
|
||||
type Question = keyof LegalStatusRequirements
|
||||
type Answers = LegalStatusRequirements
|
||||
|
||||
const QUESTION_LIST: Array<Question> = [
|
||||
'soleProprietorship',
|
||||
'directorStatus',
|
||||
'minorityDirector',
|
||||
'multipleAssociates',
|
||||
'autoEntrepreneur',
|
||||
]
|
||||
|
||||
function isCompatibleStatusWith(
|
||||
answers: Answers,
|
||||
statusRequirements: LegalStatusRequirements
|
||||
): boolean {
|
||||
return Object.entries(statusRequirements).reduce<boolean>(
|
||||
(isCompatible, [question, statusValue]) => {
|
||||
const answer = answers[question as Question]
|
||||
|
||||
return (
|
||||
isCompatible &&
|
||||
(answer == null ||
|
||||
statusValue == null ||
|
||||
JSON.stringify(answer) === JSON.stringify(statusValue))
|
||||
)
|
||||
},
|
||||
true
|
||||
)
|
||||
}
|
||||
|
||||
const possibleStatus = (answers: Answers): Record<LegalStatus, boolean> =>
|
||||
Object.fromEntries(
|
||||
Object.entries(LEGAL_STATUS_DETAILS).map(([key, statusRequirements]) => [
|
||||
key,
|
||||
Array.isArray(statusRequirements)
|
||||
? !!statusRequirements.some((requirement) =>
|
||||
isCompatibleStatusWith(answers, requirement)
|
||||
)
|
||||
: isCompatibleStatusWith(
|
||||
answers,
|
||||
statusRequirements as LegalStatusRequirements
|
||||
),
|
||||
])
|
||||
) as Record<LegalStatus, boolean>
|
||||
|
||||
export const possibleStatusSelector = (state: {
|
||||
choixStatutJuridique: State
|
||||
}): Record<LegalStatus, boolean> =>
|
||||
possibleStatus(state.choixStatutJuridique.companyLegalStatus)
|
||||
|
||||
export const nextQuestionSelector = (state: RootState): Question | null => {
|
||||
const legalStatusRequirements = state.choixStatutJuridique.companyLegalStatus
|
||||
const questionAnswered = Object.keys(
|
||||
legalStatusRequirements
|
||||
) as Array<Question>
|
||||
const possibleStatusList = Object.values(LEGAL_STATUS_DETAILS)
|
||||
.flat()
|
||||
.filter((requirement) =>
|
||||
isCompatibleStatusWith(legalStatusRequirements, requirement as any)
|
||||
)
|
||||
|
||||
const difference = <T>(l1: Array<T>, l2: Array<T>): Array<T> =>
|
||||
l1.filter((x) => !l2.includes(x))
|
||||
|
||||
const unansweredQuestions = difference(QUESTION_LIST, questionAnswered)
|
||||
const shannonEntropyByQuestion = unansweredQuestions.map(
|
||||
(question): [typeof question, number] => {
|
||||
const answerPopulation = Object.values(possibleStatusList).map(
|
||||
(status: any) => status[question]
|
||||
)
|
||||
|
||||
const frequencyOfAnswers = Object.values<number>(
|
||||
answerPopulation
|
||||
.filter((x) => x !== undefined)
|
||||
.reduce(
|
||||
(counters: Record<string, number>, i) => ({
|
||||
...counters,
|
||||
[i]: (counters?.[i] ?? 0) + 1,
|
||||
}),
|
||||
{}
|
||||
)
|
||||
).map((numOccurrence) => numOccurrence / answerPopulation.length)
|
||||
const shannonEntropy = -frequencyOfAnswers
|
||||
.map((p) => p * Math.log2(p))
|
||||
.reduce((a, b) => a + b, 0)
|
||||
|
||||
return [question, shannonEntropy]
|
||||
}
|
||||
)
|
||||
|
||||
const sortedPossibleNextQuestions = shannonEntropyByQuestion
|
||||
.filter(([, entropy]) => entropy !== 0)
|
||||
.sort(([, entropy1], [, entropy2]) => entropy2 - entropy1)
|
||||
.map(([question]) => question)
|
||||
|
||||
if (sortedPossibleNextQuestions.length === 0) {
|
||||
return null
|
||||
}
|
||||
|
||||
return sortedPossibleNextQuestions[0]
|
||||
}
|
||||
|
||||
export const useNextQuestionUrl = () => {
|
||||
const nextQuestion = useSelector(nextQuestionSelector)
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
if (!nextQuestion) {
|
||||
return absoluteSitePaths.assistants['choix-du-statut'].guideStatut.liste
|
||||
}
|
||||
|
||||
return absoluteSitePaths.assistants['choix-du-statut'].guideStatut[
|
||||
nextQuestion
|
||||
]
|
||||
}
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
import { LegalStatus } from '@/store/selectors/companyStatusSelectors'
|
||||
|
||||
export type IsSoleProprietorshipAction = {
|
||||
type: 'COMPANY_IS_SOLE_PROPRIETORSHIP'
|
||||
isSoleProprietorship?: boolean
|
||||
}
|
||||
|
||||
export type DirectorStatus = 'SALARIED' | 'SELF_EMPLOYED'
|
||||
|
||||
export type DefineDirectorStatusAction = {
|
||||
type: 'DEFINE_DIRECTOR_STATUS'
|
||||
status?: DirectorStatus
|
||||
}
|
||||
|
||||
export type CompanyHasMultipleAssociatesAction = {
|
||||
type: 'COMPANY_HAS_MULTIPLE_ASSOCIATES'
|
||||
multipleAssociates?: boolean
|
||||
}
|
||||
|
||||
export type IsAutoentrepreneurAction = {
|
||||
type: 'COMPANY_IS_MICROENTERPRISE'
|
||||
autoEntrepreneur?: boolean
|
||||
}
|
||||
|
||||
export type ChangeChecklistItemAction = {
|
||||
type: 'CHANGE_CHECKLIST_ITEM'
|
||||
checklist: string
|
||||
value: boolean
|
||||
name: string
|
||||
}
|
||||
|
||||
export type DirectorIsInAMinorityAction = {
|
||||
type: 'SPECIFY_DIRECTORS_SHARE'
|
||||
minorityDirector?: boolean
|
||||
}
|
||||
export type ResetCompanyStatusAction = {
|
||||
type: 'RESET_COMPANY_STATUS_CHOICE'
|
||||
answersToReset?: Array<string>
|
||||
}
|
||||
|
||||
export type State = {
|
||||
companyLegalStatus: {
|
||||
/*
|
||||
Note on the meanings of null / undefined value:
|
||||
If the key exists and the value is null, the question have been asked, but skipped by the user.
|
||||
If the key does not exists, the question still hasn't been asked.
|
||||
*/
|
||||
soleProprietorship?: boolean
|
||||
directorStatus?: DirectorStatus
|
||||
multipleAssociates?: boolean
|
||||
autoEntrepreneur?: boolean
|
||||
minorityDirector?: boolean
|
||||
}
|
||||
companyStatusChoice?: LegalStatus
|
||||
}
|
||||
export type LegalStatusRequirements = State['companyLegalStatus']
|
||||
export type Action =
|
||||
| IsSoleProprietorshipAction
|
||||
| DefineDirectorStatusAction
|
||||
| IsAutoentrepreneurAction
|
||||
| CompanyHasMultipleAssociatesAction
|
||||
| ChangeChecklistItemAction
|
||||
| DirectorIsInAMinorityAction
|
||||
| ResetCompanyStatusAction
|
||||
Loading…
Reference in New Issue