Spaces:
Runtime error
Runtime error
rooms and connection hook
Browse files
frontend/src/lib/liveblocks/index.ts
CHANGED
@@ -13,6 +13,8 @@ export * from "./useHistory";
|
|
13 |
export * from "./useErrorListener";
|
14 |
export * from "./useEventListener";
|
15 |
export * from "./useBroadcastEvent";
|
|
|
|
|
16 |
/**
|
17 |
* These components were built to (mostly) match the
|
18 |
* liveblocks-react library
|
|
|
13 |
export * from "./useErrorListener";
|
14 |
export * from "./useEventListener";
|
15 |
export * from "./useBroadcastEvent";
|
16 |
+
export * from "./useRooms";
|
17 |
+
export * from "./useConnectionStatus"
|
18 |
/**
|
19 |
* These components were built to (mostly) match the
|
20 |
* liveblocks-react library
|
frontend/src/lib/liveblocks/useConnectionStatus.ts
ADDED
@@ -0,0 +1,28 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import { onDestroy } from "svelte";
|
2 |
+
import { writable, type Writable } from "svelte/store";
|
3 |
+
import { useRoom } from "./useRoom";
|
4 |
+
|
5 |
+
|
6 |
+
enum ConnectionStatus {
|
7 |
+
"closed" = "closed",
|
8 |
+
"authenticating" = "authenticating",
|
9 |
+
"unavailable" = "unavailable",
|
10 |
+
"failed" = "failed",
|
11 |
+
"open" = "open",
|
12 |
+
"connecting" = "connecting",
|
13 |
+
}
|
14 |
+
type TConnectionStatus = keyof typeof ConnectionStatus
|
15 |
+
|
16 |
+
export function useConnectionStatus(): Writable<TConnectionStatus> {
|
17 |
+
const room = useRoom();
|
18 |
+
const statusStorage = writable<TConnectionStatus>(ConnectionStatus.closed);
|
19 |
+
|
20 |
+
const unsubscribeConnection = room.subscribe("connection", (status: TConnectionStatus) => {
|
21 |
+
statusStorage.set(status);
|
22 |
+
});
|
23 |
+
onDestroy(() => {
|
24 |
+
unsubscribeConnection();
|
25 |
+
});
|
26 |
+
|
27 |
+
return statusStorage;
|
28 |
+
}
|
frontend/src/lib/liveblocks/useRooms.ts
ADDED
@@ -0,0 +1,23 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import { onDestroy } from "svelte";
|
2 |
+
import { writable, type Writable } from "svelte/store";
|
3 |
+
import type { RoomResponse } from '$lib/types';
|
4 |
+
import { PUBLIC_API_BASE } from '$env/static/public';
|
5 |
+
|
6 |
+
const INTERVAL = 3000
|
7 |
+
|
8 |
+
export function useRooms(): Writable<RoomResponse[]> {
|
9 |
+
const roomsStorage = writable<RoomResponse[]>([]);
|
10 |
+
|
11 |
+
const interval = setInterval(
|
12 |
+
() => {
|
13 |
+
refreshRooms().then((rooms) => roomsStorage.set(rooms))
|
14 |
+
}, INTERVAL);
|
15 |
+
|
16 |
+
onDestroy(() => {
|
17 |
+
clearInterval(interval);
|
18 |
+
});
|
19 |
+
return roomsStorage
|
20 |
+
}
|
21 |
+
async function refreshRooms() {
|
22 |
+
return fetch(PUBLIC_API_BASE + '/rooms').then((res) => res.json());
|
23 |
+
}
|