From 36e6543abd0e6c740baf03946b3df96cef889995 Mon Sep 17 00:00:00 2001
From: Meik <meikdre@gmx.de>
Date: Sun, 9 Nov 2025 20:31:27 +0100
Subject: [PATCH] fix: join ntfy topic prefix with hyphen

---
 server.js                       |  1 -
 services/notificationService.js |  6 +++--
 src/App.js                      | 46 +++++++++++++++++++++++++--------
 3 files changed, 39 insertions(+), 14 deletions(-)

diff --git a/server.js b/server.js
index b7e16c5..0e46032 100644
--- a/server.js
+++ b/server.js
@@ -351,7 +351,6 @@ app.post('/api/auth/logout', requireAuth, (req, res) => {
     cachedStoreSnapshots.set(req.session.profile.id, req.session.storesCache);
   }
   sessionStore.delete(req.session.id);
-  credentialStore.remove(req.session.profile.id);
   storeRefreshJobs.delete(req.session.id);
   res.json({ success: true });
 });
diff --git a/services/notificationService.js b/services/notificationService.js
index 22ab7cf..bcbdb8c 100644
--- a/services/notificationService.js
+++ b/services/notificationService.js
@@ -26,8 +26,10 @@ async function sendNtfyNotification(adminNtfy, userNtfy, payload) {
     return;
   }
   const server = (userNtfy.serverUrl || adminNtfy.serverUrl || 'https://ntfy.sh').replace(/\/+$/, '');
-  const topicPrefix = adminNtfy.topicPrefix ? `${adminNtfy.topicPrefix.replace(/\/+$/, '')}/` : '';
-  const topic = `${topicPrefix}${userNtfy.topic.replace(/^\//, '')}`;
+  const sanitizedPrefix = (adminNtfy.topicPrefix || '').replace(/^-+|-+$/g, '');
+  const sanitizedTopic = (userNtfy.topic || '').replace(/^-+|-+$/g, '');
+  const separator = sanitizedPrefix && sanitizedTopic ? '-' : '';
+  const topic = `${sanitizedPrefix}${separator}${sanitizedTopic}` || sanitizedPrefix || sanitizedTopic;
   const url = `${server}/${topic}`;
   const headers = {
     Title: payload.title,
diff --git a/src/App.js b/src/App.js
index 9b88217..4005acd 100644
--- a/src/App.js
+++ b/src/App.js
@@ -100,6 +100,7 @@ function App() {
   const [notificationSaving, setNotificationSaving] = useState(false);
   const [notificationMessage, setNotificationMessage] = useState('');
   const [notificationError, setNotificationError] = useState('');
+  const [notificationPanelOpen, setNotificationPanelOpen] = useState(false);
   const minSelectableDate = useMemo(() => startOfDay(new Date()), []);
 
   const weekdays = ['Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag', 'Sonntag'];
@@ -1037,6 +1038,9 @@ function App() {
   };
 
   const handleNotificationFieldChange = (channel, field, value) => {
+    if (channel === 'ntfy' && field === 'serverUrl') {
+      return;
+    }
     setNotificationSettings((prev) => {
       const nextChannel = {
         ...prev[channel],
@@ -1433,14 +1437,27 @@ function App() {
 
       <div className="mb-6 border border-gray-200 rounded-lg p-4 bg-gray-50">
         <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
-          <div>
-            <h2 className="text-xl font-semibold text-gray-800">Benachrichtigungen</h2>
-            <p className="text-sm text-gray-600">
-              Erhalte Hinweise über ntfy oder Telegram, sobald Slots gefunden oder gebucht wurden.
-            </p>
-          </div>
-          {notificationLoading && <span className="text-sm text-gray-500">Lade Einstellungen…</span>}
-        </div>
+              <div className="flex items-center gap-3">
+                <div>
+                  <h2 className="text-xl font-semibold text-gray-800">Benachrichtigungen</h2>
+                  <p className="text-sm text-gray-600">
+                    Erhalte Hinweise über ntfy oder Telegram, sobald Slots gefunden oder gebucht wurden.
+                  </p>
+                </div>
+                <button
+                  type="button"
+                  onClick={() => setNotificationPanelOpen((prev) => !prev)}
+                  className="flex items-center justify-center w-8 h-8 rounded-full border border-gray-300 text-gray-600 hover:text-gray-900 hover:border-gray-500 focus:outline-none focus:ring-2 focus:ring-blue-400 transition"
+                  title="Einstellungen anzeigen"
+                >
+                  <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M11.25 4.5l.75-2.25.75 2.25a2.25 2.25 0 002.12 1.462l2.25.088-1.77 1.287a2.25 2.25 0 00-.81 2.38l.6 2.138-1.92-1.08a2.25 2.25 0 00-2.19 0l-1.92 1.08.6-2.138a2.25 2.25 0 00-.81-2.38L6.63 6.05l2.25-.088A2.25 2.25 0 0011.25 4.5z" />
+                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 15.75l.75-2.25.75 2.25a2.25 2.25 0 002.12 1.462l2.25.088-1.77 1.287a2.25 2.25 0 00-.81 2.38l.6 2.138-1.92-1.08a2.25 2.25 0 00-2.19 0l-1.92 1.08.6-2.138a2.25 2.25 0 00-.81-2.38l-1.77-1.287 2.25-.088A2.25 2.25 0 0012 15.75z" />
+                  </svg>
+                </button>
+              </div>
+              {notificationLoading && <span className="text-sm text-gray-500">Lade Einstellungen…</span>}
+            </div>
         {notificationError && (
           <div className="mt-4 bg-red-100 border border-red-300 text-red-700 px-4 py-2 rounded">
             {notificationError}
@@ -1570,6 +1587,13 @@ function App() {
           </div>
         </div>
 
+        {!notificationPanelOpen && (
+          <div className="mt-4 text-sm text-gray-500">
+            Benachrichtigungen sind aktuell {notificationSettings.ntfy.enabled || notificationSettings.telegram.enabled ? 'aktiviert' : 'deaktiviert'}. Klicke auf das Zahnrad, um Details anzuzeigen.
+          </div>
+        )}
+        }
+
         <div className="flex items-center justify-end mt-4 gap-3">
           <button
             type="button"
@@ -1978,9 +2002,9 @@ function App() {
                         className="border rounded p-2 w-full focus:outline-none focus:ring-2 focus:ring-purple-500 focus:border-purple-500"
                         placeholder="optional"
                       />
-                      <p className="text-xs text-gray-500 mt-1">
-                        Wird vor jedes User-Topic gesetzt (z. B. <code>pickup/</code>).
-                      </p>
+                    <p className="text-xs text-gray-500 mt-1">
+                      Wird vor jedes User-Topic gesetzt (z. B. <code>pickup-</code>); getrennt wird automatisch per Bindestrich.
+                    </p>
                     </div>
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
                       <div>