30b5fced8c
- Extract snake draft order calculation to shared getTeamForPick() helper in lib/draft-order.ts, removing the duplicated logic - Fix notification firing on user's own picks (guard with team id check) - Fix notification firing after draft is complete (early return) - Use a ref for sendNotification to prevent full socket handler re-registration every time the toggle is changed - Add permission drift listener via Permissions API so the UI reacts if the user revokes notification permission in browser settings - Add SSR guard for document.hidden in sendNotification - Remove redundant isSupported prop from NotificationSettings; derive unsupported state from permissionState === "unsupported" - Move NotificationSettings out of QueueSection prop-drilling path; render it via a new settingsSection slot on DraftSidebar instead https://claude.ai/code/session_0149MvVUYDY6pFUAV1fL4K69
41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
import { Switch } from "~/components/ui/switch";
|
|
import { Label } from "~/components/ui/label";
|
|
|
|
interface NotificationSettingsProps {
|
|
enabled: boolean;
|
|
onEnabledChange: (enabled: boolean) => void;
|
|
permissionState: NotificationPermission | "unsupported";
|
|
}
|
|
|
|
export function NotificationSettings({
|
|
enabled,
|
|
onEnabledChange,
|
|
permissionState,
|
|
}: NotificationSettingsProps) {
|
|
if (permissionState === "unsupported") {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="border-t pt-4 mt-4">
|
|
<div className="flex items-center justify-between">
|
|
<Label htmlFor="notifications-switch" className="text-sm font-semibold">
|
|
Notifications
|
|
</Label>
|
|
<Switch
|
|
id="notifications-switch"
|
|
checked={enabled}
|
|
onCheckedChange={onEnabledChange}
|
|
disabled={permissionState === "denied"}
|
|
/>
|
|
</div>
|
|
|
|
{permissionState === "denied" && (
|
|
<p className="text-xs text-muted-foreground mt-2">
|
|
Notifications blocked by browser. Update in browser settings to
|
|
enable.
|
|
</p>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|