Refactor des Rows avec frame-tag, morphdom et templates
Chaque row de table est déjà un RowComponent. Améliorations:
-
frame-tags
- Chaque row est un frame-tag avec son propre id, et est chargé de façon lazy.
- Les broadcast par action cable n’envoient que le frame-tag vide, avec son url.
-
On veut généraliser ça à tous les objets du backend; en allant au bout de la réflexion, on peut aussi se brancher sur les transactions ActiveRecord et broadcast automatiquement tous les objets touchés à la fin de la transaction.
-
- Le frontend charge le contenu réel du frame tag (c’est à dire le RowComponent).
- Ça résout (une partie des) problèmes de performances, ça simplifie le backend, et ça simplifie la gestion des multilingues/permissions multiples.
- C’est l’idée décrite ici
-
morphdom
- Le changement du contenu du broadcast implique que
row#update
doit retourner le RowComponent au frontend (ce qui parait logique). Ça met en exergue ce comportement déjà problématique: - Actuellement, tout changement d’un row (que ce soit par la carte ou par quelqu’un sur un autre écran) fait que l’élément du dom est retiré est remis. Parmi les désagréments, on perd le focus dans le tableau. C’est très agaçant. Turbo ne permet pas pour l’instant de morph, mais uniquement de tout remplacer le tout. Une piste pourrait être https://github.com/patrick-steele-idem/morphdom, mais il faut voir comment le pluger avec turbo.
- C’est ce qui est utilisé par cable-ready, qui ajoute notamment le verbe turbo “morph”. Il y a aussi turbo-morph qui semble plus simple et officieusement sanctionné.
-
Row Editable
- C’est un souci qu’on avait identifié au début: il serait probablement plus simple que les rows ne soient pas en permanence des
input
. Notamment pour la navigation au clavier, mais aussi pour des histoires de performance (notamment Safari qui est presque inutilisable quand il y a des milliers d’inputs sur la page.) - On veut donc transformer le row en version éditable quand il est sélectionné, et revenir à la version brute quand il est sélectionné. Ça peut se faire avec deux templates qui mettent à jour le même frame-tag.
- L’autre solution serait de faire un web component custom (disons,
<cocarto_row>
) avec du shadow dom, des templates et des slots. A priori j’ai rien contre? C’est peut-être pertinent aussi. - Voir aussi #285 (closed); l’action
rows/edit
pourrait retourner un contenu différent pour l’édition en ligne et l’édition en modale. Ça permettra aussi un peu de nettoyage dansrows/_form.html.erb
- Au passage, ça simplifierait le design; les inputs sont plus difficiles à styler, notamment pour la gestion du text-overflow. (cf !716 (comment 1749065345))
Edited by Nicolas Bouilleaud