bad-example.com
demos for spacedust
put the global toggle on the main page thing
very easy not to enable it in onboarding
+37
-21
atproto-notifications/src/components/NotificationSettings.tsx
+37
-21
atproto-notifications/src/components/NotificationSettings.tsx
···
1
-
import { useState } from 'react';
2
-
1
+
import { useState, useCallback } from 'react';
2
+
import { Link } from 'react-router';
3
+
import { GetJson, postJson } from './Fetch';
4
+
import { ButtonGroup } from './Buttons';
3
5
4
6
export function NotificationSettings({ secondary, secondaryFilter }) {
7
+
const [notifyToggleCounter, setNotifyToggleCounter] = useState(0);
5
8
6
-
7
-
// const [notifyToggleCounter, setNotifyToggleCounter] = useState(0);
8
-
9
-
// // TODO move up (to chrome?) so it syncs
10
-
// const setGlobalNotifications = useCallback(async enabled => {
11
-
// const host = import.meta.env.VITE_NOTIFICATIONS_HOST;
12
-
// const url = new URL('/global-notify', host);
13
-
// try {
14
-
// await postJson(url, JSON.stringify({ notify_enabled: enabled }), true)
15
-
// } catch (err) {
16
-
// console.error('failed to set self-notify setting', err);
17
-
// }
18
-
// setNotifyToggleCounter(n => n + 1);
19
-
// });
20
-
21
-
9
+
// TODO move up (to chrome?) so it syncs
10
+
const setGlobalNotifications = useCallback(async enabled => {
11
+
const host = import.meta.env.VITE_NOTIFICATIONS_HOST;
12
+
const url = new URL('/global-notify', host);
13
+
try {
14
+
await postJson(url, JSON.stringify({ notify_enabled: enabled }), true)
15
+
} catch (err) {
16
+
console.error('failed to set self-notify setting', err);
17
+
}
18
+
setNotifyToggleCounter(n => n + 1);
19
+
});
22
20
21
+
if (secondary !== 'all') return;
23
22
24
-
if (secondary === 'all') {
25
-
return <p>Notifications default: [todo: toggle mute], unknown sources: [toggle mute]</p>;
26
-
}
23
+
return (
24
+
<div className="feed-filter-type">
25
+
<h4>All notifications:</h4>
26
+
<GetJson
27
+
key={notifyToggleCounter}
28
+
endpoint="/global-notify"
29
+
credentials
30
+
ok={({ notify_enabled }) => (
31
+
<ButtonGroup
32
+
options={[
33
+
{val: 'paused', label: <>⏸ pause{!notify_enabled && 'd'}</>},
34
+
{val: 'active', label: <>▶ {notify_enabled ? 'notifications active' : 'enable notifications'}</>},
35
+
]}
36
+
current={notify_enabled ? 'active' : 'paused'}
37
+
onChange={val => setGlobalNotifications(val === 'active')}
38
+
/>
39
+
)}
40
+
/>
41
+
</div>
42
+
);
27
43
}