Most collaborative features rely on each user having their own temporary state,
which is then shared with others. For example, in an app using multiplayer
cursors, the location of each user’s cursor will be their state. This state
could also be used for a typing indicator, or to show a user’s current
selection. In Liveblocks, we call this presence.
We can use presence to hold any object that we wish to share with others. An
example would be the coordinates of a user’s cursor on screen:
You’ll notice that at the bottom of the file, we’ve already added Presence to
createRoomContext. Because we’re exporting our hooks from here, all our types
will automatically propagate through our entire app.
The last step in setting up presence is setting an initial value. Switch to
App.tsx and pass cursor: null to RoomProvider—no one starts with
their cursor on-screen.