More permissive white space handling when adding multiple adlists

Feature Requests
1

On the Adlists page, under the "Add a new adlist" section is the "address" field. This field can add one or more adlist URLs by separating them with a space. However, this separator is very fragile and will break if there are multiple spaces between URLs or other types of white space such as line feeds or tabs are used. This is problem because copying a group of recommended adlists often has them on separate lines and often copying from the web adds an extra space at the beginning or end of a single line.

image
image1513×452 28.5 KB

I propose that a normalization step be added in the frontend javascript to take the raw input from the "address" field and use regex to replace all whitespace delimiters with a single space and trim leading and trailing spaces. I feel that this should be done in the frontend since it's normalizing the user input. This way the backend can remain strict about its input format.

The normalization step would be a simple function.

function normalizeAddress(address) {
  return address.replace(/\s+/gm, ' ').trim()
}

This could then be called here web/scripts/pi-hole/js/groups-adlists.js at be05b0f61d3fcf796dae4cc3f89f8540b2359325 · pi-hole/web · GitHub

2

The current page already accept one item per line (Pi-hole v5).

Copying and pasting these lines in the Adlists page:

http://example.com/list1.txt
http://example.com/list2.txt
http://example.com/list3.txt

Will show them as:

image
image783×146 3 KB

And after clicking on the Add button, the result will be:
image

image
image768×314 6.42 KB

Pi-hole v6 (still in development) accepts Line Breaks, Spaces (including tabs), and Commas as separators:

3

Good to see. It looks like it will also support comma separated values.

The code looks like it could be optimized a little bit so const can be used

  const addresses = $("#new_address")
    .val()
    .split(/[\s,]+/);
    .filter(Boolean); // remove empty items

  const addressestr = JSON.stringify(addresses);