forked from iscorporacion/next14-miro-clone
-
Notifications
You must be signed in to change notification settings - Fork 0
/
liveblocks.config.ts
135 lines (123 loc) · 3.66 KB
/
liveblocks.config.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
import {
createClient,
LiveList,
LiveMap,
LiveObject,
} from "@liveblocks/client";
import { createRoomContext } from "@liveblocks/react";
import { Layer, Color } from "@/types/canvas";
const client = createClient({
throttle: 16,
authEndpoint: "/api/liveblocks-auth",
});
// Presence represents the properties that exist on every user in the Room
// and that will automatically be kept in sync. Accessible through the
// `user.presence` property. Must be JSON-serializable.
type Presence = {
cursor: { x: number, y: number } | null,
selection: string[];
pencilDraft: [x: number, y: number, pressure: number][] | null;
penColor: Color | null;
};
// Optionally, Storage represents the shared document that persists in the
// Room, even after all users leave. Fields under Storage typically are
// LiveList, LiveMap, LiveObject instances, for which updates are
// automatically persisted and synced to all connected clients.
type Storage = {
layers: LiveMap<string, LiveObject<Layer>>;
layerIds: LiveList<string>;
};
// Optionally, UserMeta represents static/readonly metadata on each user, as
// provided by your own custom auth back end (if used). Useful for data that
// will not change during a session, like a user's name or avatar.
type UserMeta = {
id?: string;
info?: {
name?: string;
picture?: string;
};
};
// Optionally, the type of custom events broadcast and listened to in this
// room. Use a union for multiple events. Must be JSON-serializable.
type RoomEvent = {
// type: "NOTIFICATION",
// ...
};
// Optionally, when using Comments, ThreadMetadata represents metadata on
// each thread. Can only contain booleans, strings, and numbers.
export type ThreadMetadata = {
// resolved: boolean;
// quote: string;
// time: number;
};
export const {
suspense: {
RoomProvider,
useRoom,
useMyPresence,
useUpdateMyPresence,
useSelf,
useOthers,
useOthersMapped,
useOthersConnectionIds,
useOther,
useBroadcastEvent,
useEventListener,
useErrorListener,
useStorage,
useObject,
useMap,
useList,
useBatch,
useHistory,
useUndo,
useRedo,
useCanUndo,
useCanRedo,
useMutation,
useStatus,
useLostConnectionListener,
useThreads,
useUser,
useCreateThread,
useEditThreadMetadata,
useCreateComment,
useEditComment,
useDeleteComment,
useAddReaction,
useRemoveReaction,
}
} = createRoomContext<Presence, Storage, UserMeta, RoomEvent, ThreadMetadata>(client, {
async resolveUsers({ userIds }) {
// Used only for Comments. Return a list of user information retrieved
// from `userIds`. This info is used in comments, mentions etc.
// const usersData = await __fetchUsersFromDB__(userIds);
//
// return usersData.map((userData) => ({
// name: userData.name,
// avatar: userData.avatar.src,
// }));
return [];
},
async resolveMentionSuggestions({ text, roomId }) {
// Used only for Comments. Return a list of userIds that match `text`.
// These userIds are used to create a mention list when typing in the
// composer.
//
// For example when you type "@jo", `text` will be `"jo"`, and
// you should to return an array with John and Joanna's userIds:
// ["john@example.com", "joanna@example.com"]
// const userIds = await __fetchAllUserIdsFromDB__(roomId);
//
// Return all userIds if no `text`
// if (!text) {
// return userIds;
// }
//
// Otherwise, filter userIds for the search `text` and return
// return userIds.filter((userId) =>
// userId.toLowerCase().includes(text.toLowerCase())
// );
return [];
},
});