Liveblocks—Collaborative experiences in days, not months

import { LiveList, LiveObject } from "@liveblocks/client";import {  useStorage,  useMyPresence,  useOthers,} from "./liveblocks.config";
// Pass these to RoomProviderconst initialPresence = { selectedShape: null };const initialStorage = {  shapes: new LiveList([    new LiveObject({ x: -60, y: 0, bg: "var(--gradient-color-left)" }),    new LiveObject({ x: 60, y: 0, bg: "var(--gradient-color-right)" }),  ]),};
// Shape data updating in real-timeconst shapes = useStorage(root => root.shapes);// => [{ x: -60, y: 0, bg: "var(--gradient-color-left)" },//     { x: 60, y: 0, bg: "var(--gradient-color-right)" }]
// Share your presence as easily as using a useStateconst [myPresence, setMyPresence] = useMyPresence();setMyPresence({ selectedShape: "shapeId" });
// Get others people presence (cursors,// avatar, name, etc) with a single line of codeconst others = useOthers();