Outils
======
Ce commit retire le tooling de Flow, et ajoute le support de TypeScript
pour les fichiers .ts et .tsx. Il n'est pas nécessaire de tout migrer
d'un coup ce qui facilite la transition. On garde en effet le
compilateur Babel avec un preset TypeScript (ce qui permet donc de
retirer à la fois les types Flow et TypeScript) plutôt que d'utiliser le
compilateur standard pour la conversion du code. Cela permet aussi de
mieux s'intégrer avec d'autres outils, notamment les test-runners.
Ajout d'une nouvelle commande `yarn run type-check`, intégrée dans
CircleCI.
Par ailleurs ajout du support de l'opérateur ?? pour donner des valeurs
par défaut (nullish-coalescing-operator).
Typage des libraires tierces
============================
Les principales libraires que nous utilisons ont un typage TypeScript de
bon niveau, ce qui facilite l'intégration. J'ai mis à jour react-i18next
et i18next afin de corriger un problème de typage.
Typage du code
==============
Le typage est loin d'être complet dans ce commit, en particulier il
manque les types relatifs au state Redux, ainsi qu'au moteur (règle,
explication). Néanmoins le typage des contextes fonctionne, en
particulier sitePaths (avec un type récursif non trivial !) qui a déjà
permis de détecter un lien mort.
Le typage des "paths" (Components/, Règles/, etc.) fonctionne bien, y
compris avec l'auto-complétion automatique des import par Typescript.
TypeScript se révèle déjà bien agréable dans VSCode (auto-complétion,
refacto, etc.) ! Reste à migrer progressivement le reste du code !
Supprimée au niveau des cotisations patronales dans fb54d4c, ce commit
ré-intégre ce coût au niveau d'une nouvelle variable "coût du travail"
qui inclut également les aides différées.
Note: une variable "coût d'embauche" existait précédemment mais n'était
plus utilisée 4784bcd2
Auparavant nous mettions à jour la "situation" de la simulation, dès le
changement de focus des champs "objectifs", bien que le changement de
focus dans l'interface ne change rien aux calculs. Nous attendons
maintenant que l'utilisateur fasse une nouvelle saisie.
Les valeurs saisies et calculées des objectifs de la simulation étaient
préceddement sauvegardées dans Redux, puis traités dans le code sous forme
de string. Vu qu'il s'agit de valeurs numérique, il est plus logique de les
manipuler sous forme de nombre.
Fixes#553
Comme recommandé dans la documentation des hooks React, ajout des deux
linters suivants : react-hooks/rules-of-hooks et react-hooks/exhaustive-deps
Mise à jour des composants, en particulier les useEffect pour y spécifier
toutes les dépendances.
Supprime aussi redux-batched-action. Le code résultant est plus concis
(alors que l'on supprime une dépendance !), et plus clair car il y a moins
d'indirections pour se conformer aux API de redux-form.
En vue de la suppression de Redux-form, ce commit crée deux nouvelles
actions : UPDATE_SITUATION et UPDATE_PERIOD qui permettent de gérer le
state de la situation, en retrouvant le même résulat qu'avec l'ancienne
implémentation au niveau du `formattedSituationSelector`
Suppression de notre composant withLanguage qui rajoutait une abstraction
inutile.
Note: de nombreux appels à withTranslation et withLanguage était inutile
car le composant augmenté n'utilisait pas les paramètres fournis (language, t, i18n).
L'utilisation des hooks nous permet de mieux gérer le code mort, car il s'agit
de simples variables dont le non-usage est détecté par l'analyse statique.
Le but de la refacto est de généraliser l'utilisation des hook
Nombre de composants convertis: 52
Nombre de composants restants: 12
Il est possible de compter les composants class restants en utilisant
grep "render()"
L'occasion aussi de remplacer la dernière occurence de UNSAFE_componentWillMount
On affiche les prochaines questions. Super intéressant pour pouvoir
sauter directement à une question précise sans se taper toutes les
questions une par une.
Remplacement de Montant par Value
Rétablissement des explications simu salarié
Possibilité de définir des objegtifs secondaires qui sont calculés mais
pas affichés par targetSelectuon
Pour par exemple séparer l'entreprise du dirigeant
Attention, le composant TargetSelection est beaucoup trop complexe, il
mérite d'être séparé en plein de plus petits composants
Ajout d'un nouveau test pour le formatage des montants ;
Ré-implémentation de l'activation de `onChange` (seulement quand le
montant a changé — pas son formatage – et avec la valeur non formatée) ;
Désactivation de l'évenement `onBlur` de redux-form, qui recalculait
inutilement la saisie et était à l'origine d'un bug.
Implémentation du formatage des prix, en particulier le séparateur des
milliers dans les formulaires de saisie de prix `10 000 €` vs `10000 €`.
Note d'implémentation: Le mécanisme supprimé qui modifiait
l'`event.target.value` ne fonctionnait pas, et a été remplacé par une
`ref` react.
Sans l'autofocus, il faut alors cliquer deux fois sur la ligne CA pour pouvoir l'éditer : 1) pour passer le CA d'une div à un input 2) pour commencer à éditer et donc afficher le clavier
Et plein d'autres quickfixs dans la navigation :
- Enlève la progression incomprehensible dans le header
- Ajoute la question auto-entrepreneur lors de la recherche d'une entrepriser existante
- On cache la partie embauche pour les autos
- On précise quel type de société à coté de l'estimation du dirigeant
- et des petits quickfix de style
Maxime Quandalle
Mael
Johan Girod
Johan Girod