zv/wtr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add test push notification flow

Browse Source
This commit is contained in:
zv
2026-06-11 19:36:23 +02:00
parent 054d75b1f4
commit b945fd4893
8 changed files with 88 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
components/settings/settings-page.tsx
View File

@@ -8,7 +8,7 @@ import { LanguageToggle } from "@/components/ui/language-toggle";
import { ThemeToggle } from "@/components/ui/theme-toggle";
import { DEFAULT_STATION_ID } from "@/lib/constants";
import { useI18n } from "@/lib/i18n";
import { decodeBase64UrlKey, deletePushSubscription, fetchVapidPublicKey, savePushSubscription } from "@/lib/notification-api";
import { decodeBase64UrlKey, deletePushSubscription, fetchVapidPublicKey, savePushSubscription, sendTestPushNotification } from "@/lib/notification-api";
import { formatProvinceName, getProvinceForSelection, PROVINCES } from "@/lib/provinces";
import { useWeatherStore } from "@/lib/store";
import type { Province } from "@/types/province";
@@ -50,6 +50,7 @@ export function SettingsPage() {
const [notificationStatus, setNotificationStatus] = useState<NotificationSupportStatus>("checking");
const [vapidPublicKey, setVapidPublicKey] = useState<string | null>(null);
const [isSavingSubscription, setIsSavingSubscription] = useState(false);
const [isSendingTestNotification, setIsSendingTestNotification] = useState(false);
const [notificationMessage, setNotificationMessage] = useState<string | null>(null);
const selectedStationId = useWeatherStore((state) => state.selectedStationId);
const selectedLocation = useWeatherStore((state) => state.selectedLocation);
@@ -179,6 +180,22 @@ export function SettingsPage() {
}
}
async function sendTestNotification() {
setIsSendingTestNotification(true);
setNotificationMessage(null);
try {
const registration = await navigator.serviceWorker?.getRegistration();
const subscription = await registration?.pushManager.getSubscription();
if (!subscription) throw new Error("Push subscription is not available.");
await sendTestPushNotification(subscription.endpoint);
setNotificationMessage(t("settings.notifications.testSuccess"));
} catch {
setNotificationMessage(t("settings.notifications.testError"));
} finally {
setIsSendingTestNotification(false);
}
}
return (
<div className="space-y-6">
<section>
@@ -285,6 +302,10 @@ export function SettingsPage() {
? t("settings.notifications.disable")
: t("settings.notifications.enableDevice")}
</Button>
<Button type="button" variant="glass" disabled={!notificationsEnabled || isSavingSubscription || isSendingTestNotification} onClick={sendTestNotification}>
<BellRing className="size-4" />
{isSendingTestNotification ? t("settings.notifications.sendingTest") : t("settings.notifications.sendTest")}
</Button>
</div>
<p className="mt-4 text-xs leading-5 text-muted">{t("settings.notifications.implementationNote")}</p>