diff --git a/liveblocks.config.ts b/liveblocks.config.ts index ba41717..28db2e0 100644 --- a/liveblocks.config.ts +++ b/liveblocks.config.ts @@ -1,152 +1,49 @@ -import { createClient } from '@liveblocks/client'; -import { createRoomContext, createLiveblocksContext } from '@liveblocks/react'; +// Define Liveblocks types for your application +// https://liveblocks.io/docs/api-reference/liveblocks-react#Typing-your-data +declare global { + interface Liveblocks { + // Each user's Presence, for useMyPresence, useOthers, etc. + Presence: { + // Example, real-time cursor coordinates + // cursor: { x: number; y: number }; + }; -const client = createClient({ - publicApiKey: process.env.NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY!, - // authEndpoint: "/api/liveblocks-auth", - throttle: 16, - async resolveUsers({ userIds }) { - // Used only for Comments and Notifications. Return a list of user information - // retrieved from `userIds`. This info is used in comments, mentions etc. + // The Storage tree for the room, for useMutation, useStorage, etc. + Storage: { + // Example, a conflict-free list + // animals: LiveList; + }; - // const usersData = await __fetchUsersFromDB__(userIds); - // - // return usersData.map((userData) => ({ - // name: userData.name, - // avatar: userData.avatar.src, - // })); + // Custom user info set when authenticating with a secret key + UserMeta: { + id: string; + info: { + // Example properties, for useSelf, useUser, useOthers, etc. + // name: string; + // avatar: string; + }; + }; - return []; - }, - async resolveMentionSuggestions({ text }) { - // 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"] + // Custom events, for useBroadcastEvent, useEventListener + RoomEvent: {}; + // Example has two events, using a union + // | { type: "PLAY" } + // | { type: "REACTION"; emoji: "🔥" }; - // const users = await getUsers({ search: text }); - // return users.map((user) => user.id); + // Custom metadata set on threads, for useThreads, useCreateThread, etc. + ThreadMetadata: { + // Example, attaching coordinates to a thread + // x: number; + // y: number; + }; - return []; - }, - async resolveRoomsInfo({ roomIds }) { - // Used only for Comments and Notifications. Return a list of room information - // retrieved from `roomIds`. + // Custom room info set with resolveRoomsInfo, for useRoomInfo + RoomInfo: { + // Example, rooms with a title and url + // title: string; + // url: string; + }; + } +} - // const roomsData = await __fetchRoomsFromDB__(roomIds); - // - // return roomsData.map((roomData) => ({ - // name: roomData.name, - // url: roomData.url, - // })); - - return []; - }, -}); - -// 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; -}; - -// 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 = { - // author: LiveObject<{ firstName: string, lastName: 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, // Accessible through `user.id` - // info?: Json, // Accessible through `user.info` -}; - -// 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; -}; - -// Room-level hooks, use inside `RoomProvider` -export const { - suspense: { - RoomProvider, - useRoom, - useMyPresence, - useUpdateMyPresence, - useSelf, - useOthers, - useOthersMapped, - useOthersListener, - useOthersConnectionIds, - useOther, - useBroadcastEvent, - useEventListener, - useErrorListener, - useStorage, - useObject, - useMap, - useList, - useBatch, - useHistory, - useUndo, - useRedo, - useCanUndo, - useCanRedo, - useMutation, - useStatus, - useLostConnectionListener, - useThreads, - useCreateThread, - useEditThreadMetadata, - useCreateComment, - useEditComment, - useDeleteComment, - useAddReaction, - useRemoveReaction, - useThreadSubscription, - useMarkThreadAsRead, - useRoomNotificationSettings, - useUpdateRoomNotificationSettings, - - // These hooks can be exported from either context - // useUser, - // useRoomInfo - }, -} = createRoomContext( - client -); - -// Project-level hooks, use inside `LiveblocksProvider` -export const { - suspense: { - LiveblocksProvider, - useMarkInboxNotificationAsRead, - useMarkAllInboxNotificationsAsRead, - useInboxNotifications, - useUnreadInboxNotificationsCount, - - // These hooks can be exported from either context - useUser, - useRoomInfo, - }, -} = createLiveblocksContext(client); +export {}; diff --git a/package.json b/package.json index 8b54cbe..c2b1b72 100644 --- a/package.json +++ b/package.json @@ -14,9 +14,9 @@ "dependencies": { "@clerk/nextjs": "^5.1.4", "@hello-pangea/dnd": "^16.6.0", - "@liveblocks/client": "^1.11.0", + "@liveblocks/client": "^2.0.0", "@liveblocks/node": "^1.12.0", - "@liveblocks/react": "^1.12.0", + "@liveblocks/react": "^2.0.0", "@microsoft/eslint-formatter-sarif": "^3.1.0", "@prisma/client": "^5.15.0", "@prisma/extension-accelerate": "^1.1.0", diff --git a/yarn.lock b/yarn.lock index 0ae191f..50bfa44 100644 --- a/yarn.lock +++ b/yarn.lock @@ -516,12 +516,12 @@ __metadata: languageName: node linkType: hard -"@liveblocks/client@npm:1.12.0, @liveblocks/client@npm:^1.11.0": - version: 1.12.0 - resolution: "@liveblocks/client@npm:1.12.0" +"@liveblocks/client@npm:2.0.0, @liveblocks/client@npm:^2.0.0": + version: 2.0.0 + resolution: "@liveblocks/client@npm:2.0.0" dependencies: - "@liveblocks/core": "npm:1.12.0" - checksum: 10c0/f1d067458a3e5cae997396a3c8cb9dd0e86f6f52604701507796210ff2d0d0fe06584e34a375b1628424e157235d786a8619e3252e424203b4a52407affb8e9e + "@liveblocks/core": "npm:2.0.0" + checksum: 10c0/6e0c82961ee9a0871888e5632942a946e6df20a5cd866204cc75e3eb5d47f397d02e19817edfb3dc16d5a380ceb852511c3ba1d3f448249a5879bfa0fbf38591 languageName: node linkType: hard @@ -532,6 +532,13 @@ __metadata: languageName: node linkType: hard +"@liveblocks/core@npm:2.0.0": + version: 2.0.0 + resolution: "@liveblocks/core@npm:2.0.0" + checksum: 10c0/59b97161a672ba90f41160535682ad2476009fd24cb8914e307e666f5efe032f3af545252d1831fbfbc2bda3f75fdca64af6fd8ecce9b616bba837d79bc0eeee + languageName: node + linkType: hard + "@liveblocks/node@npm:^1.12.0": version: 1.12.0 resolution: "@liveblocks/node@npm:1.12.0" @@ -544,17 +551,17 @@ __metadata: languageName: node linkType: hard -"@liveblocks/react@npm:^1.12.0": - version: 1.12.0 - resolution: "@liveblocks/react@npm:1.12.0" +"@liveblocks/react@npm:^2.0.0": + version: 2.0.0 + resolution: "@liveblocks/react@npm:2.0.0" dependencies: - "@liveblocks/client": "npm:1.12.0" - "@liveblocks/core": "npm:1.12.0" + "@liveblocks/client": "npm:2.0.0" + "@liveblocks/core": "npm:2.0.0" nanoid: "npm:^3" - use-sync-external-store: "npm:^1.2.0" + use-sync-external-store: "npm:^1.2.2" peerDependencies: react: ^16.14.0 || ^17 || ^18 - checksum: 10c0/2663552c92b67554a3389e1d8a8e6a0ffca729d43f4e95d6434e69509f815d28e751a77ed7f8dc458bb3afb30bee3b948163ba1e56329415479915e2a79888df + checksum: 10c0/4928ffb932b033f81059348609152a2ec354c941f18da0b51f0deb66e4b0d27793a705b80b44021a7ebc1c90e204ec9d6fc6fa47927e7cbebcfc279e2364280b languageName: node linkType: hard @@ -5957,9 +5964,9 @@ __metadata: dependencies: "@clerk/nextjs": "npm:^5.1.4" "@hello-pangea/dnd": "npm:^16.6.0" - "@liveblocks/client": "npm:^1.11.0" + "@liveblocks/client": "npm:^2.0.0" "@liveblocks/node": "npm:^1.12.0" - "@liveblocks/react": "npm:^1.12.0" + "@liveblocks/react": "npm:^2.0.0" "@microsoft/eslint-formatter-sarif": "npm:^3.1.0" "@next/eslint-plugin-next": "npm:^14.2.3" "@prisma/client": "npm:^5.15.0" @@ -6328,6 +6335,15 @@ __metadata: languageName: node linkType: hard +"use-sync-external-store@npm:^1.2.2": + version: 1.2.2 + resolution: "use-sync-external-store@npm:1.2.2" + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + checksum: 10c0/23b1597c10adf15b26ade9e8c318d8cc0abc9ec0ab5fc7ca7338da92e89c2536abd150a5891bf076836c352fdfa104fc7231fb48f806fd9960e0cbe03601abaf + languageName: node + linkType: hard + "usehooks-ts@npm:^3.1.0": version: 3.1.0 resolution: "usehooks-ts@npm:3.1.0"