Improve DHCP static leases interface (alternative)

[rdwebdesign]

What does this PR aim to accomplish?

This is an alternative attempt to create a better user interface to edit Static DHCP leases.

This version is based on #3565 and all previous commits were kept, to avoid losing authorship credits.

Main differences found on this version:

• the "hint" is shown below the table, instead of on a table row;
• the textarea can't be changed before all changes made on the table are finished, to avoid losing changes;
• save button is shown only when needed;
• button tooltips are shown;
• only invalid cells are highlighted (no more green cells);
• validation is now enforced for hostnames when saving (like other values);
• IPv6 must be enclosed in brackets;
• a few style adjustements.

---

By submitting this pull request, I confirm the following:

1. I have read and understood the contributors guide, as well as this entire template. I understand which branch to base my commits and Pull Requests against.
2. I have commented my proposed changes within the code and I have tested my changes.
3. I am willing to help maintain this change if there are issues with it later.
4. It is compatible with the EUPL 1.2 license
5. I have squashed any insignificant commits. (git rebase)
6. I have checked that another pull request for this purpose does not exist.
7. I have considered, and confirmed that this submission will be valuable to others.
8. I accept that this submission may not be used, and the pull request closed at the will of the maintainer.
9. I give this submission freely, and claim no ownership to its content.

---

• I have read the above and my PR is ready for review. Check this box to confirm

[yubiuser]

This looks really nice now.
I noticed, that we do a IP validation when entering via the table field, but not when entered via the text area. Invalid IPs won't be shown in the table (with a red background) but are completely empty. I wonder if we should show it but give it the red background instead?

[rdwebdesign]

Hmmmm... What did you type in your test?

I'm not sure if we can validate that in every case.

The issue here is: we don't have a fixed number of items to make sure the second one is always an IP.

On the table, we can always say the second column should be an IP, but when the text is typed on the textarea, the second item can be a hostname... or an invalid IP, or many other options.
How to tell them apart?

[yubiuser]

You are correct - we can't know that the second item in from the textarea is an invalid IP when it could also be something different (id, tag). Scratch my idea.

[Copilot]

Pull request overview

This PR provides an alternative UX for managing static DHCP leases by introducing an editable table view that stays in sync with the underlying dhcp.hosts textarea, while improving validation, tooltips, and styling across themes.

Changes:

• Added a dedicated “Static DHCP” table UI with per-row confirm/cancel behavior and synchronized textarea + line numbers.
• Expanded client-side validators (IPv4/IPv6 helpers, bracketed IPv6, stricter hostname checks) and applied them to table editing.
• Updated core/theme CSS to support the new layout, hint messaging, and validation highlighting.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
style/themes/lcars.css	Theme-specific tweaks for button sizing and the new static DHCP hint/disabled-textarea tooltip styles.
style/themes/high-contrast.css	Adds StaticDHCPTable-specific styling hooks for danger/success highlighting.
style/themes/high-contrast-dark.css	Adds StaticDHCPTable-specific styling hooks for danger/success highlighting.
style/pi-hole.css	Adds layout/UX CSS for the StaticDHCPTable, hint message, textarea wrapper, and line numbers.
settings-dhcp.lp	Reworks the static DHCP section layout: introduces the table UI, advanced notes, examples cards, and textarea wrapper with line numbers.
scripts/js/utils.js	Adds IPv4/IPv6 convenience validators, bracketed IPv6 validation, stricter hostname validation, and updates MAC/hostname trimming behavior.
scripts/js/settings-dhcp.js	Implements the static DHCP table rendering/editing workflow, per-row save/cancel, validation highlighting, tooltips, and textarea line numbering.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[rdwebdesign]

@yubiuser

I think the new parse function will solve some issues, like when "infinite" was considered as hostname (Example: aa:bb:cc:dd:ee:ff, 192.168.0.2, infinite). Now "infinite" is always considered as a lease time string (like on dnsmasq code).

Also, now the position of the items are not really important. The function will parse them and, if valid, will show them on the table, in the correct columns.