bad-example.com
demos for spacedust
log out
+28
-16
+2
-3
atproto-notifications/src/components/setup/Chrome.tsx
+2
-3
atproto-notifications/src/components/setup/Chrome.tsx
···
1
1
import { Handle } from '../User';
2
2
3
-
export function Chrome({ user, children }) {
3
+
export function Chrome({ user, onLogout, children }) {
4
4
const content = children;
5
5
const logout = () => null;
6
6
return (
···
13
13
<span className="handle">
14
14
<Handle did={user.did} />
15
15
</span>
16
-
{/* TODO: clear *all* info on logout */}
17
-
<button className="subtle bad" onClick={logout}>×</button>
16
+
<button className="subtle bad" onClick={onLogout}>×</button>
18
17
</p>
19
18
</div>
20
19
)}
+25
-13
atproto-notifications/src/components/setup/WithServerHello.tsx
+25
-13
atproto-notifications/src/components/setup/WithServerHello.tsx
···
5
5
import { GetJson, PostJson } from '../Fetch';
6
6
import { Chrome } from './Chrome';
7
7
8
-
9
-
// const logout = useCallback(async () => {
10
-
// setRole('anonymous');
11
-
// setUser(null);
12
-
// // TODO: clear indexeddb
13
-
// await fetch(`${host}/logout`, {
14
-
// method: 'POST',
15
-
// credentials: 'include',
16
-
// });
17
-
// });
18
-
19
8
export function WithServerHello({ children }) {
9
+
const [loggingOut, setLoggingOut] = useState(null);
10
+
const [helloKey, setHelloKey] = useState(0);
20
11
const [whoamiKey, setWhoamiKey] = useState(0);
21
12
const [whoamiInfo, setWhoamiInfo] = useState(null);
22
13
···
32
23
setWhoamiKey(n => n + 1);
33
24
});
34
25
26
+
const handleLogout = useCallback(async () => {
27
+
setLoggingOut(true);
28
+
try {
29
+
const host = import.meta.env.VITE_NOTIFICATIONS_HOST;
30
+
await fetch(`${host}/logout`, {
31
+
method: 'POST',
32
+
credentials: 'include',
33
+
});
34
+
// TODO: cancel subscription, clear storage, etc
35
+
} catch (e) {
36
+
console.error('logout fail', e);
37
+
}
38
+
setLoggingOut(null);
39
+
setHelloKey(n => n + 1);
40
+
});
41
+
42
+
if (loggingOut !== null) {
43
+
return <Chrome><p>Logging out…</p></Chrome>;
44
+
}
45
+
35
46
return (
36
47
<GetJson
37
48
/* todo: key on login state */
49
+
key={helloKey}
38
50
endpoint='/hello'
39
51
credentials
40
52
ok={({ whoamiHost, webPushPublicKey, role, did }) => {
···
57
69
data={{ token: whoamiInfo.token }}
58
70
credentials
59
71
ok={({ did, role, webPushPublicKey }) => (
60
-
<Chrome user={{ did, role }}>
72
+
<Chrome user={{ did, role }} onLogout={handleLogout}>
61
73
<PushServerContext.Provider value={webPushPublicKey}>
62
74
{childrenFor(did, role)}
63
75
</PushServerContext.Provider>
···
67
79
)
68
80
} else {
69
81
return (
70
-
<Chrome user={{ did, role }}>
82
+
<Chrome user={{ did, role }} onLogout={handleLogout}>
71
83
<PushServerContext.Provider value={webPushPublicKey}>
72
84
{childrenFor(did, role)}
73
85
</PushServerContext.Provider>
+1
server/index.js
+1
server/index.js