Upgrade liveblocks to the latest version

components/comments/CommentsOverlay.tsx

@@ -3,7 +3,12 @@
 import { useCallback, useRef } from "react";
 import { ThreadData } from "@liveblocks/client";
 
-import { ThreadMetadata, useEditThreadMetadata, useThreads, useUser } from "@/liveblocks.config";
+import {
+  ThreadMetadata,
+  useEditThreadMetadata,
+  useThreads,
+  useUser,
+} from "@/liveblocks.config";
 import { useMaxZIndex } from "@/lib/useMaxZIndex";
 
 import { PinnedThread } from "./PinnedThread";
@@ -30,7 +35,11 @@ export const CommentsOverlay = () => {
       {threads
         .filter((thread) => !thread.metadata.resolved)
         .map((thread) => (
-          <OverlayThread key={thread.id} thread={thread} maxZIndex={maxZIndex} />
+          <OverlayThread
+            key={thread.id}
+            thread={thread}
+            maxZIndex={maxZIndex}
+          />
         ))}
     </div>
   );
@@ -78,7 +87,7 @@ const OverlayThread = ({ thread, maxZIndex }: OverlayThreadProps) => {
     <div
       ref={threadRef}
       id={`thread-${thread.id}`}
-      className="absolute left-0 top-0 flex gap-5"
+      className='absolute left-0 top-0 flex gap-5'
       style={{
         transform: `translate(${thread.metadata.x}px, ${thread.metadata.y}px)`,
       }}

liveblocks.config.ts

@@ -15,7 +15,10 @@ const client = createClient({
     //   avatar: userData.avatar.src,
     // }));
 
-    return [];
+    return userIds.map((userId) => ({
+      name: userId,
+      avatar: `https://ui-avatars.com/api/?name=${userId}&background=random`,
+    }));
   },
   async resolveMentionSuggestions({ text, roomId }) {
     // Used only for Comments. Return a list of userIds that match `text`.
@@ -123,6 +126,5 @@ export const {
     useRemoveReaction,
   },
 } = createRoomContext<Presence, Storage, UserMeta, RoomEvent, ThreadMetadata>(
-  client,
-  {}
+  client
 );

package.json

@@ -9,9 +9,10 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@liveblocks/client": "^1.9.7",
-    "@liveblocks/react": "^1.9.7",
-    "@liveblocks/react-comments": "^1.9.7",
+    "@liveblocks/client": "^1.11.0",
+    "@liveblocks/node": "^1.11.0",
+    "@liveblocks/react": "^1.11.0",
+    "@liveblocks/react-comments": "^1.11.0",
     "@radix-ui/react-collapsible": "^1.0.3",
     "@radix-ui/react-context-menu": "^2.1.5",
     "@radix-ui/react-dropdown-menu": "^2.0.6",

yarn.lock

@@ -146,7 +146,7 @@
   resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.4.0.tgz#08d6c5e20cf7e4cc02fd181c4b0c225cd31dbb60"
   integrity sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==
 
-"@liveblocks/[email protected]", "@liveblocks/client@^1.9.7":
+"@liveblocks/[email protected]", "@liveblocks/client@^1.11.0":
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/@liveblocks/client/-/client-1.11.0.tgz#18e86963a5c15c81b707d8df9afecab45a83ffbc"
   integrity sha512-dZJM6rra/jBk7C++Cm7PX10TbwklkDv76LmMs8IZj8qkXrdG91ejT5PuLXXo3sDIMCdr2apbKyS6pdb8yw4DCA==
@@ -158,7 +158,17 @@
   resolved "https://registry.yarnpkg.com/@liveblocks/core/-/core-1.11.0.tgz#9b47ac6d61550a29c3f181eda4a350f03540f9e3"
   integrity sha512-fB5ZlT/HiXHynDiVwtGz7/9ZJy9RF7nziJ7LicVvMc9OCuibLj8xl4Mp/ZHvFSAcbpWA2kKQe0m0wPawSkamIw==
 
-"@liveblocks/react-comments@^1.9.7":
+"@liveblocks/node@^1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@liveblocks/node/-/node-1.11.0.tgz#735c08b2ec0948648c151866784a1e0a81e3d0d2"
+  integrity sha512-pAk3RviTSZAr/R6m410vZI+PAjYI/UrLFmMoR3eCYdpQQBCGbfvboDl4lcM3RXc0u2vE7O8V4wfux71A/VJOcg==
+  dependencies:
+    "@liveblocks/core" "1.11.0"
+    "@stablelib/base64" "^1.0.1"
+    fast-sha256 "^1.3.0"
+    node-fetch "^2.6.1"
+
+"@liveblocks/react-comments@^1.11.0":
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/@liveblocks/react-comments/-/react-comments-1.11.0.tgz#466bd53af12903b72c4cc089715e9ade2b21952c"
   integrity sha512-pNqQfQnfP1okScX+0nfy8Afnq/9qv4hd/hlYNoglAt9h+t0MupvgC90uLkEvfrbTgEUDLMX3Q88C2vZyitKodg==
@@ -178,7 +188,7 @@
     slate-react "^0.98.1"
     use-sync-external-store "^1.2.0"
 
-"@liveblocks/[email protected]", "@liveblocks/react@^1.9.7":
+"@liveblocks/[email protected]", "@liveblocks/react@^1.11.0":
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/@liveblocks/react/-/react-1.11.0.tgz#ab3ade20ed3a694b9a2dc89d6267a63fd080e741"
   integrity sha512-ADBTXLDR34I2Pj8kvRTpuVkQLAf12Oqk/6zQJ3Qi5L4s9/JBzwUmmH5SqwwtXoxSJtLnIBhQaz62CB5tGrFomQ==
@@ -675,6 +685,11 @@
   resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.10.1.tgz#7ca168b6937818e9a74b47ac4e2112b2e1a024cf"
   integrity sha512-S3Kq8e7LqxkA9s7HKLqXGTGck1uwis5vAXan3FnU5yw1Ec5hsSGnq4s/UCaSqABPOnOTg7zASLyst7+ohgWexg==
 
+"@stablelib/base64@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@stablelib/base64/-/base64-1.0.1.tgz#bdfc1c6d3a62d7a3b7bbc65b6cce1bb4561641be"
+  integrity sha512-1bnPQqSxSuc3Ii6MhBysoWCg58j97aUjuCSZrGSmDxNqtytIi0k8utUenAwTZN4V5mXXYGsVUI9zeBqy+jBOSQ==
+
 "@swc/[email protected]":
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.5.2.tgz#85ea0c76450b61ad7d10a37050289eded783c27d"
@@ -1915,6 +1930,11 @@ fast-levenshtein@^2.0.6:
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==
 
+fast-sha256@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/fast-sha256/-/fast-sha256-1.3.0.tgz#7916ba2054eeb255982608cccd0f6660c79b7ae6"
+  integrity sha512-n11RGP/lrWEFI/bWdygLxhI+pVeo1ZYIVwvvPkW7azl/rOy+F3HYRZ2K5zeE9mmkhQppyv9sQFx0JM9UabnpPQ==
+
 fastq@^1.6.0:
   version "1.17.1"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.17.1.tgz#2a523f07a4e7b1e81a42b91b8bf2254107753b47"
@@ -2861,7 +2881,7 @@ [email protected]:
     "@next/swc-win32-ia32-msvc" "14.1.0"
     "@next/swc-win32-x64-msvc" "14.1.0"
 
-node-fetch@^2.6.7:
+node-fetch@^2.6.1, node-fetch@^2.6.7:
   version "2.7.0"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.7.0.tgz#d0f0fa6e3e2dc1d27efcd8ad99d550bda94d187d"
   integrity sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==