From 13dbbb6741c0bed9c153341dd51bb48b0798be16 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20Fastr=C3=A9?= <julien.fastre@champs-libres.coop>
Date: Tue, 15 Oct 2024 09:08:29 +0200
Subject: [PATCH] Fix race condition in ChillCollectionType

In some dcase, the collection is not initialized when a showHide is launched before the collection is fully initialized.
---
 .../Form/Type/ChillCollectionType.php         |  1 +
 .../public/module/collection/index.ts         | 35 +++++++++++++++++--
 .../public/page/workflow-show/index.js        |  2 +-
 .../Resources/views/Form/fields.html.twig     |  3 ++
 4 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Form/Type/ChillCollectionType.php b/src/Bundle/ChillMainBundle/Form/Type/ChillCollectionType.php
index 403aa40d6..84a42b96b 100644
--- a/src/Bundle/ChillMainBundle/Form/Type/ChillCollectionType.php
+++ b/src/Bundle/ChillMainBundle/Form/Type/ChillCollectionType.php
@@ -36,6 +36,7 @@ class ChillCollectionType extends AbstractType
         $view->vars['identifier'] = $options['identifier'];
         $view->vars['empty_collection_explain'] = $options['empty_collection_explain'];
         $view->vars['js_caller'] = $options['js_caller'];
+        $view->vars['uniqid'] = uniqid();
     }
 
     public function configureOptions(OptionsResolver $resolver)
diff --git a/src/Bundle/ChillMainBundle/Resources/public/module/collection/index.ts b/src/Bundle/ChillMainBundle/Resources/public/module/collection/index.ts
index 875e99fad..edba586a4 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/module/collection/index.ts
+++ b/src/Bundle/ChillMainBundle/Resources/public/module/collection/index.ts
@@ -30,6 +30,12 @@
  */
 import './collection.scss';
 
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'show-hide-show': CustomEvent<{id: number, froms: HTMLElement[], container: HTMLElement}>,
+    }
+}
+
 export class CollectionEventPayload {
     collection: HTMLUListElement;
     entry: HTMLLIElement;
@@ -107,20 +113,34 @@ export const buildRemoveButton = (collection: HTMLUListElement, entry: HTMLLIEle
     return button;
 }
 
-window.addEventListener('load', () => {
+const collectionsInit = new Set<string>;
+const buttonsInit = new Set<string>();
+
+const initialize = function (target: Document|Element): void {
     let
         addButtons: NodeListOf<HTMLButtonElement> = document.querySelectorAll("button[data-collection-add-target]"),
         collections: NodeListOf<HTMLUListElement> = document.querySelectorAll("ul[data-collection-regular]");
 
     for (let i = 0; i < addButtons.length; i++) {
-        let addButton = addButtons[i];
+        const addButton = addButtons[i];
+        const uniqid = addButton.dataset.uniqid as string;
+        if (buttonsInit.has(uniqid)) {
+            continue;
+        }
+        buttonsInit.add(uniqid);
         addButton.addEventListener('click', (e: Event) => {
             e.preventDefault();
             handleAdd(e.target);
         });
     }
     for (let i = 0; i < collections.length; i++) {
-        let entries: NodeListOf<HTMLLIElement> = collections[i].querySelectorAll(':scope > li');
+        const collection = collections[i];
+        const uniqid = collection.dataset.uniqid as string;
+        if (collectionsInit.has(uniqid)) {
+            continue;
+        }
+        collectionsInit.add(uniqid);
+        let entries: NodeListOf<HTMLLIElement> = collection.querySelectorAll(':scope > li');
         for (let j = 0; j < entries.length; j++) {
             if (entries[j].dataset.collectionEmptyExplain === "1") {
                 continue;
@@ -128,4 +148,13 @@ window.addEventListener('load', () => {
             initializeRemove(collections[i], entries[j]);
         }
     }
+};
+
+window.addEventListener('DOMContentLoaded', () => {
+    initialize(document);
 });
+
+window.addEventListener('show-hide-show', (event: CustomEvent<{id: number; container: HTMLElement; froms: HTMLElement[]}>) => {
+    const container = event.detail.container as HTMLElement;
+    initialize(container);
+})
diff --git a/src/Bundle/ChillMainBundle/Resources/public/page/workflow-show/index.js b/src/Bundle/ChillMainBundle/Resources/public/page/workflow-show/index.js
index ce552c909..0f94ac374 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/page/workflow-show/index.js
+++ b/src/Bundle/ChillMainBundle/Resources/public/page/workflow-show/index.js
@@ -47,7 +47,7 @@ window.addEventListener('DOMContentLoaded', function() {
 
     // ShowHide instance for send external
     new ShowHide({
-      debug: true,
+      debug: false,
       load_event: null,
       froms: [divTransitions],
       container: [sendExternalContainer],
diff --git a/src/Bundle/ChillMainBundle/Resources/views/Form/fields.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Form/fields.html.twig
index ccd0195a5..15794b9f7 100644
--- a/src/Bundle/ChillMainBundle/Resources/views/Form/fields.html.twig
+++ b/src/Bundle/ChillMainBundle/Resources/views/Form/fields.html.twig
@@ -163,6 +163,7 @@
     <div class="chill-collection">
         <ul class="list-entry"
             {{ form.vars.js_caller }}="{{ form.vars.js_caller }}"
+            data-uniqid="{{ form.vars.uniqid|escape('html_attr') }}"
             data-collection-name="{{ form.vars.name|escape('html_attr') }}"
             data-collection-identifier="{{ form.vars.identifier|escape('html_attr') }}"
             data-collection-button-remove-label="{{ form.vars.button_remove_label|trans|e }}"
@@ -184,6 +185,8 @@
 
         {% if form.vars.allow_add == 1 %}
         <button class="add-entry btn btn-misc"
+            type="button"
+            data-uniqid="{{ form.vars.uniqid|escape('html_attr') }}"
             data-collection-add-target="{{ form.vars.name|escape('html_attr') }}"
             data-form-prototype="{{ ('<div>' ~ form_widget(form.vars.prototype) ~ '</div>')|escape('html_attr') }}" >
             <i class="fa fa-plus fa-fw"></i>