[BUG] Cannot add more than 3 reverse_proxy in services

[andreaci]

What happened?

Opening a "service" details, adding "reverse proxies" to a service, won't allow to add more than 3

How to reproduce?

• Create a new service
• select the "reverse proxy" plugin
• in the "multiple settings" area, click on ADD a few times
• with every click, a new "data block" will appear, but the index of each data block will stop at 2:

so, you will have the "Reverse proxy host", "Reverse proxy host 1", "Reverse proxy host 2", "Reverse proxy host 2", "Reverse proxy host 2", "Reverse proxy host 2", "Reverse proxy host 2"

Configuration file(s) (yaml or .env)

No response

Relevant log output

No response

BunkerWeb version

1.5.9

What integration are you using?

Docker

Linux distribution (if applicable)

No response

Removed private data

• [X] I have removed all private data from the configuration file and the logs

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[syrk4web]

Hello @andreaci ,

Thanks for raising this issue in the UI services page.

This came from a small mistake in the suffix management in the javascript script that handle multiples.

This has just been corrected and will be effective in the next release.

In the meantime, unfortunately you have to modify the suffix yourself, I made a script that will allow you to choose a group of multiples and replace the current suffixe by a new one in order to add multiples in a more easy way (take care to not update to an exsisting multiple group) :

/**
 * @description Search on the DOM starting from an element container all suffixed elements and replace the suffixe value by a new one.
 * @param {string} multGroupAttName - The value of the attribut data-services-settings-multiple to search.
 * @param {string|number} currSuffixeNum - The current suffixe to search.
 * @param {string|number} newSuffixeNum - The new suffixe to replace.
 * @returns {void}
 */
function updateMultSuffValue(multGroupAttName, currSuffixeNum, newSuffixeNum) {
  const container = document.querySelector(
    `[data-services-settings-multiple="${multGroupAttName}"]`
  );

  // Get all elements inside container
  const allElements = container.querySelectorAll("*");
  // Loop through all elements
  allElements.forEach((el) => {
    // Loop on all el attributs
    for (let i = 0; i < el.attributes.length; i++) {
      let att = el.attributes[i];
      // Check if the attribute name contains the current suffixe
      if (att.value.includes(`_${currSuffixeNum}`)) {
        // Replace the current suffixe by the new one
        el.setAttribute(
          att.name,
          att.value.replace(`_${currSuffixeNum}`, `_${newSuffixeNum}`)
        );
      }
    }
  });

  // Update title
  const inpTitles = container.querySelectorAll("h5[class='input-title']");
  inpTitles.forEach((inp) => {
    console.log(inp.textContent);
    inp.textContent = inp.textContent.replace(
      `#${currSuffixeNum}`,
      `#${newSuffixeNum}`
    );
  });

  // Update container att name
  container.setAttribute(
    "data-services-settings-multiple",
    multGroupAttName.replace(`_${currSuffixeNum}`, `_${newSuffixeNum}`)
  );

  // Case all find, show on UI that it's done
  const textConfirm = document.createElement("p");
  textConfirm.textContent = `Multiple group ${currSuffixeNum} have been updated to ${newSuffixeNum}`;
  textConfirm.className = "text-green-500 col-span-12 m-2";
  // Add as first element
  container.prepend(textConfirm);
}

// updateMultSuffValue("reverse-proxy_2", 2, 3);

Sorry for the inconvenience, stay safe in the bunker !

[fl0ppy-d1sk]

Hello @andreaci,

It should be fixed in the last 1.5.10 release. Enjoy !