refactor/ui(directions): directions component refactor

[LAMM26]

Please check if the PR fulfills these requirements

• The commit message follows our guidelines:https://github.com/infra-geo-ouverte/igo2/blob/master/.github/CONTRIBUTING.md#git-commit-guidelines
• Tests for the changes have been added (for bug fixes / features)
• Docs have been added / updated (for bug fixes / features)

What is the current behavior? (You can also link to an open issue here)
After having deployed the private routing option and having multiple feedback from different users on the component, many features were not clear or unknown to many of them and/or the UI was not user-friendly.

What is the new behavior?

• Code refactored for the main component and its sub-components, including cleaning the code, adding strong-typed code, deleting unused classes, methods, variables, etc.
• Changes to UI:
  • Placeholder in stop to indicate what action the user can do.
  • Formatting of coordinates of stop.
  • 'Add intermediate stop' button moved between starting point end destination stops.
  • Actions (zoom, copy, download) moved below inputs for added clarity.
  • Move stop, clear stop and delete stop always showing, not only on hover.
  • Icons changed in steps
  • Better formatting of duration and distance travelled.
  • Formatting and adjustments of copied directions and download directions
• New feature:
  • When tracking is active, the user can select his current location as a stop

Does this PR introduce a breaking change? (check one with "x")

• Yes
• No

If this PR contains a breaking change, please describe the impact and migration path for existing applications:

Other information:

[alecarn]

Premier tests

1. À l'ajout d'un premier point , on déclanche la requête et on obtient une erreur. Tout comme au deuxième
2. Modifier la coordonée directement dans l'input ne change pas la position sur la carte et ne trigger pas une nouvelle recherche d'itinéraire.

Proposition:

1. Est-ce qu'on pourrait afficher les boutons de drag et de supression seulement lorsqu'on hover la ligne avec le curseur?
2. Avoir au moins un point de départ et d'arrivée avant de proposer d'ajouter un point intermédiaire?
3. Google Map, au lieu d'ajouter un point intermédiaire, ils utilisent ajouter une destination et il positionne le bouton à la fin.

[LAMM26]

Premier tests

1. À l'ajout d'un premier point , on déclanche la requête et on obtient une erreur. Tout comme au deuxième
2. Modifier la coordonée directement dans l'input ne change pas la position sur la carte et ne trigger pas une nouvelle recherche d'itinéraire.

Proposition:

1. Est-ce qu'on pourrait afficher les boutons de drag et de supression seulement lorsqu'on hover la ligne avec le curseur?
2. Avoir au moins un point de départ et d'arrivée avant de proposer d'ajouter un point intermédiaire?
3. Google Map, au lieu d'ajouter un point intermédiaire, ils utilisent ajouter une destination et il positionne le bouton à la fin.

Je ne suis pas capable d'avoir l'erreur au premier et deuxième clic.

Changer le texte des coordonnées ne change pas la pin en effet mais il iCherche devrait faire une nouvelle proposition. J'ai enlever le comportement qu'on doit cliquer sur le x rouge avant de pouvoir sélectionner un nouveau point dans la carte aussi.

J'ai mis le drag et le delete au hover seulement. On ajoute aussi une destination maintenant.

[alecarn]

À l'ouverture du panneau de direction, j'obtiens ces erreurs:

Lorsque j'ajoute un premier point le panneau iCherche s'affiche est-ce que c'est normal?

[alecarn]

Ça me semble bien fonctionner!

Commentaire UI:

• Est-ce possible d'éliminer le layout shifting, lorsqu'on hover un input on affiche le bouton de drag mais l'input se tasse vers la droite. On pourrait p-t mettre le bouton a visibility hidden au lieu display none?
  
• Je proposerais aussi de diminuer au maximum la taille du bouton de drag soit à une densité de -5 (npm run postbuild -w @igo2/core pour compiler les thèmes. Ensuite un refresh du navigateur)
  

[alecarn]

@pelord si jamais tu veux jeter un oeil, des améliorations aux UI de direction