* Utilisation de la version stable de TypeScript 3.7
* Début de migration du State Redux. Plutôt que de redéfinir les types
en doublon par rapport aux actions et reducers, on utilise les valeurs
retournées par ces fonctions comme source pour les types globaux.
* Modification de tsconfig pour meilleur typage dans VS Code
* Meilleur typage de l'environnement : suppression de @types/node qui
était trop large (contient tout l'environnement serveur), et
remplacement par @types/webpack-env. Par ailleurs typage des variables
d'environnement utilisées.
* Début de migration de l'économie collaborative
* Migration de nombreux composants UI
* Mise à jour de dépendances pour récupérer un meilleur typage
* Ajout d'un hook pour configurer les simulateurs
* Suppression du higher-order component "withSitePaths", on utilise
systématiquement le hook useContext.
L'essentiel de l'application est maintenant migré, reste le moteur !
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 !
Vu qu'on utilise un serviceworker, lorsque la requête ne passe pas jusqu'au serveur, la redirection n'est pas effective
On parse les règles de redirection netlify coté front et on les ajoute à l'app
Ajout de tests de non-regressions des calculs afin d'éviter de déployer
silencieusement des effets de bord non-désirés dans les règles de calculs.
J'ai ajouté Jest pour sa fonction de snapshot testing qui est
particulièrement adaptée pour ce type de cas (voir #717). J'ai essayé
avec mocha-snapshot sans succès.
J'ai eu un petit peu de mal à configurer Jest, car il n'est pas possible
de ré-utiliser la configuration Webpack, qu'il faut alors dupliquer. C'est
pourquoi j'ai limité l'utilisation de Jest aux seuls tests de snapshot.
À voir s'il y a un intérêt à migrer les tests Mocha vers Jest ultérieurement.
Fixes#717
⬆ MAJ de react-spring vers version 8
Quelques changements d'API. Par ailleurs la version 8 exporte deux modules
l'un avec les "render-props" et l'autres avec les "hooks"
🔥 Suppression de @researchgate/react-intersection-observer
Remplacement par un custom hook
- On utilise un nouveau composant qui se base sur la dernière version de l'api SIRENE
- On sépare les données entre la simulation des cotisations et la création d'entreprise
- On gagne des lignes !
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.
Les liens dans le markdown ne prenaient pas en compte le `basename`
configuré via react-router/history.
Utilisation de `react-markdown` au lieu de `marked` qui s'inter-opère
mieux avec notre UI.
Pour éviter un avertissement intempestif que je n'arrivais pas à
débugguer (utilisation d'un tag JSX au lieu d'un composant ()=><jsx/>
comme prop d'une Route)
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.
On compile maintenant pour les navigateurs récents (qui supportent les modules es6.
On ajoute une config de build pour les browser legacy (ie11).
Cela permet :
- De ne plus être dépendant de polyfill.io (qui nous a claqué dans les doigts et a peté la prod)
- D'avoir un JS transpilé plus léger et plus proche du code écrit pour les navigateurs récents
- De pouvoir ajuster le build en fonction du navigateur (on ajoute pas le serviceWorker dans IE par exemple. A l'inverse, on
pourrait multiplier le nombre de bundle pour tirer profit de HTTP2)
Dans le futur, on voudra surement créer une version pour les nav moderne et une version IE,
On pourra alors se débarasser de polyfill.io et uniquement utiliser polyfill.io de babel
Maxime Quandalle
Mael
Johan Girod
Maxime Quandalle
Johan Girod