From 1d0e71c5db2315c4e8107b7a263075c7f5154b18 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Sun, 20 Sep 2026 10:35:16 +0200
Subject: [PATCH] Keep market drawer actions in card header

---
 modules/shared/auth/ui/home.php | 44 ++++++++++++++++++++++++++++++++-
 1 file changed, 43 insertions(+), 1 deletion(-)

diff --git a/modules/shared/auth/ui/home.php b/modules/shared/auth/ui/home.php
index d7eeec2..d2d0c5b 100644
--- a/modules/shared/auth/ui/home.php
+++ b/modules/shared/auth/ui/home.php
@@ -1205,7 +1205,49 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $otcM
     echo "  if (!contentRoot || !definitionContent || !drawer || !readCard || !card || !form || !editButton || definitionContent.dataset.marketDefinitionsBound === 'true') { return; }";
     echo "  definitionContent.dataset.marketDefinitionsBound = 'true';";
     echo "  let activeMarket = null;";
-    echo "  const prepareMarketDefinitionDeleteCard = () => { const existingCard = drawer.querySelector('[data-market-definition-card]'); if (!existingCard || drawer.querySelector('[data-market-definition-delete-id]')) { return; } const stage = document.createElement('div'); stage.className = 'sg-delete-confirmation-pattern__stage sg-delete-confirmation-pattern__host'; stage.dataset.pattern = 'overlay-card'; stage.dataset.dialogOpen = 'false'; const target = document.createElement('div'); target.className = 'sg-delete-confirmation-pattern__target'; target.dataset.sharedEditableActionCard = ''; target.dataset.sharedEditableDeleteToken = 'DELETE'; target.dataset.marketDefinitionDeleteId = ''; target.dataset.marketDefinitionCard = ''; const titleCard = document.createElement('article'); titleCard.className = 'sg-card sg-card--content-card market-delete-confirmation-card'; const header = document.createElement('header'); header.className = 'sg-card-segment sg-card-segment--header sg-card-segment--gray sg-object-card__header'; const heading = document.createElement('h2'); heading.className = 'sg-heading-h2 market-delete-confirmation-card__title'; heading.dataset.marketDefinitionReadTitle = ''; heading.dataset.marketDefinitionDrawerTitle = ''; heading.textContent = 'Markt'; const actions = document.createElement('div'); actions.className = 'sg-component-row'; const deleteButton = document.createElement('button'); deleteButton.className = 'sg-interaction-element sg-button sg-button--warning'; deleteButton.type = 'button'; deleteButton.dataset.sharedEditableCardDelete = ''; deleteButton.dataset.marketDefinitionDelete = ''; deleteButton.textContent = 'Löschen'; actions.append(deleteButton); header.append(heading, actions); titleCard.append(header); existingCard.querySelector('[data-market-definition-read-title]')?.remove(); existingCard.removeAttribute('data-shared-editable-action-card'); const confirmation = document.createElement('article'); confirmation.className = 'sg-card sg-card--overlay-host sg-delete-confirmation-pattern__floating-card'; confirmation.setAttribute('aria-label', 'Löschbestätigung'); confirmation.setAttribute('role', 'dialog'); confirmation.setAttribute('aria-modal', 'true'); confirmation.dataset.overlayDialog = 'delete'; confirmation.dataset.sharedEditableCardDeleteConfirmation = ''; confirmation.hidden = true; confirmation.innerHTML = '<div class=\"sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body\"><p class=\"sg-body sg-delete-confirmation-pattern__text\"><strong>Möchtest du diesen Markt wirklich löschen?</strong></p><p class=\"sg-body sg-delete-confirmation-pattern__text\">Du kannst das nicht rückgängig machen. Bestätige durch Eingabe von <span class=\"sg-delete-confirmation-pattern__code\">DELETE</span>.</p><label class=\"sg-labeled-input-row sg-delete-confirmation-pattern__input-row\"><span class=\"sg-label\">Bestätigung</span><input class=\"sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable\" type=\"text\" placeholder=\"DELETE\" aria-label=\"Löschbestätigung durch DELETE\" data-shared-editable-card-delete-input></label><p class=\"sg-body\" data-market-definition-delete-status aria-live=\"polite\"></p><div class=\"sg-delete-confirmation-pattern__actions\"><button class=\"sg-interaction-element sg-button sg-button--active\" type=\"button\" data-shared-editable-card-delete-cancel>Abbrechen</button><button class=\"sg-interaction-element sg-button sg-button--process sg-button--process-inactive\" type=\"button\" disabled aria-disabled=\"true\" data-shared-editable-card-delete-submit data-market-definition-delete-submit>Löschen</button></div></div>'; target.append(titleCard, existingCard, confirmation); stage.append(target); drawer.querySelector('[data-market-definition-drawer-content]')?.append(stage); };";
+    echo <<<'JS';
+  const prepareMarketDefinitionDeleteCard = () => {
+    const existingCard = drawer.querySelector('[data-market-definition-card]');
+    if (!existingCard || drawer.querySelector('[data-market-definition-delete-id]')) {
+      return;
+    }
+
+    const header = existingCard.querySelector(':scope > .sg-object-card__header');
+    const actions = header?.querySelector(':scope > .sg-component-row');
+    if (!header || !actions) {
+      return;
+    }
+
+    const stage = document.createElement('div');
+    stage.className = 'sg-delete-confirmation-pattern__stage sg-delete-confirmation-pattern__host';
+    stage.dataset.pattern = 'overlay-card';
+    stage.dataset.dialogOpen = 'false';
+    existingCard.classList.add('sg-delete-confirmation-pattern__target');
+    existingCard.dataset.sharedEditableDeleteToken = 'DELETE';
+    existingCard.dataset.marketDefinitionDeleteId = '';
+
+    const deleteButton = document.createElement('button');
+    deleteButton.className = 'sg-interaction-element sg-button sg-button--warning';
+    deleteButton.type = 'button';
+    deleteButton.dataset.sharedEditableCardDelete = '';
+    deleteButton.dataset.marketDefinitionDelete = '';
+    deleteButton.textContent = 'Löschen';
+    actions.append(deleteButton);
+
+    const confirmation = document.createElement('article');
+    confirmation.className = 'sg-card sg-card--overlay-host sg-delete-confirmation-pattern__floating-card';
+    confirmation.setAttribute('aria-label', 'Löschbestätigung');
+    confirmation.setAttribute('role', 'dialog');
+    confirmation.setAttribute('aria-modal', 'true');
+    confirmation.dataset.overlayDialog = 'delete';
+    confirmation.dataset.sharedEditableCardDeleteConfirmation = '';
+    confirmation.hidden = true;
+    confirmation.innerHTML = '<div class="sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body"><p class="sg-body sg-delete-confirmation-pattern__text"><strong>Möchtest du diesen Markt wirklich löschen?</strong></p><p class="sg-body sg-delete-confirmation-pattern__text">Du kannst das nicht rückgängig machen. Bestätige durch Eingabe von <span class="sg-delete-confirmation-pattern__code">DELETE</span>.</p><label class="sg-labeled-input-row sg-delete-confirmation-pattern__input-row"><span class="sg-label">Bestätigung</span><input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="text" placeholder="DELETE" aria-label="Löschbestätigung durch DELETE" data-shared-editable-card-delete-input></label><p class="sg-body" data-market-definition-delete-status aria-live="polite"></p><div class="sg-delete-confirmation-pattern__actions"><button class="sg-interaction-element sg-button sg-button--active" type="button" data-shared-editable-card-delete-cancel>Abbrechen</button><button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" disabled aria-disabled="true" data-shared-editable-card-delete-submit data-market-definition-delete-submit>Löschen</button></div></div>';
+    existingCard.append(confirmation);
+    stage.append(existingCard);
+    drawer.querySelector('[data-market-definition-drawer-content]')?.append(stage);
+  };
+JS;
     echo "  prepareMarketDefinitionDeleteCard();";
     echo "  const sharedCard = drawer.querySelector('[data-market-definition-card]');";
     echo "  if (window.SharedEditableActionCard) { window.SharedEditableActionCard.init(definitionContent); }";