wip example on publishing data and receiving it

thus we can easily build the raise hand features, notifying everyone user X has raised hand.
However, this feature is not simple, and will take few days, let's write a brief first.

src/frontend/src/features/rooms/components/Conference.tsx

@@ -86,11 +86,28 @@ export const Conference = ({
     await track.videoTrack.stopProcessor();
   }
 
+
+  room.on('dataReceived', (payload, participant) => {
+    const message = new TextDecoder().decode(payload);
+    console.log(`Received message from ${participant?.identity}: ${message}`);
+  });
+
+  const sendMessage = async (message) =>  {
+    // Convert message to a Uint8Array
+
+    console.log('clicked')
+    const payload = new TextEncoder().encode(message);
+
+    // Send the message to all participants in the room
+    await room.localParticipant.publishData(payload, 'text/plain');
+  }
+
   return (
     <QueryAware status={status}>
       <Screen>
         <button onClick={() => blurTrack()}>blur</button>
         <button onClick={() => unBlurTrack()}>unblur</button>
+        <button onClick={() => sendMessage('raise hand')}>raise hand</button>
         <LiveKitRoom
           room={room}
           serverUrl={data?.livekit?.url}