From fc8a0d46ffcc0978e555851cb9ac4430a5abd8ad Mon Sep 17 00:00:00 2001
From: Pierre de La Morinerie <kemenaran@gmail.com>
Date: Thu, 7 Nov 2019 15:19:11 +0100
Subject: [PATCH] editor: insert new champs after the last fully visible champ

Before, when the "Add new champ" button was clicked, the new champ
was inserted after the **first** fully visible champ.

That was most of the time unexpected. The correct behavior would be to
insert the new champ after the **last** fully visible champ.

That's what this commit does. Now the "Add new champ" behavior feels
much less confusing.
---
 .../components/TypesDeChampEditor/typeDeChampsReducer.js  | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/app/javascript/components/TypesDeChampEditor/typeDeChampsReducer.js b/app/javascript/components/TypesDeChampEditor/typeDeChampsReducer.js
index 5d27c8399..7810b2931 100644
--- a/app/javascript/components/TypesDeChampEditor/typeDeChampsReducer.js
+++ b/app/javascript/components/TypesDeChampEditor/typeDeChampsReducer.js
@@ -219,7 +219,7 @@ function getUpdateHandler(typeDeChamp, { queue, flash }) {
 }
 
 function findItemToInsertAfter() {
-  const target = getFirstTarget();
+  const target = getLastVisibleTypeDeChamp();
 
   return {
     target,
@@ -227,8 +227,10 @@ function findItemToInsertAfter() {
   };
 }
 
-function getFirstTarget() {
-  const [target] = document.querySelectorAll('[data-in-view]');
+function getLastVisibleTypeDeChamp() {
+  const typeDeChamps = document.querySelectorAll('[data-in-view]');
+  const target = typeDeChamps[typeDeChamps.length - 1];
+
   if (target) {
     const parentTarget = target.closest('[data-repetition]');
     if (parentTarget) {