fix: join ntfy topic prefix with hyphen

This commit is contained in:
2025-11-09 20:31:27 +01:00
parent 539759ed60
commit 36e6543abd
3 changed files with 39 additions and 14 deletions

View File

@@ -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>