Refactor DM settings into a dedicated modal

- Created `DMSettingsModalController` to manage the new settings modal UI.
- Added `components/dm-settings-modal.html` with sections for Privacy and DM Relay Hints.
- Updated `AppShell.js` to delegate the settings action to `onOpenSettings` callback, bypassing the legacy popover.
- Updated `ProfileModalController.js` to wire up the new modal controller, handling state persistence for relays and privacy settings.
- This improves the UX for managing NIP-17 DM relay hints and privacy options.

Co-authored-by: PR0M3TH3AN <[email protected]>

js/ui/dm/AppShell.js

@@ -179,6 +179,12 @@ export class AppShell {
     settingsBtn.ariaLabel = "Direct message settings";
     settingsBtn.addEventListener("click", (e) => {
       e.stopPropagation();
+
+      if (typeof onOpenSettings === "function") {
+        onOpenSettings();
+        return;
+      }
+
       let popover = sidebar.querySelector(".dm-settings-popover");
       if (popover) {
         popover.remove();
@@ -198,9 +204,6 @@ export class AppShell {
       const relaySettings = DMRelaySettings({ document: doc });
       popover.appendChild(relaySettings);
       sidebarHeader.appendChild(popover);
-      if (typeof onOpenSettings === "function") {
-        onOpenSettings(popover);
-      }
 
       const closeHandler = (event) => {
         if (!popover.contains(event.target) && event.target !== settingsBtn && !settingsBtn.contains(event.target)) {