VIDSOL-246: I was in call but other people can't see me and I was able to see everyone.

frontend/src/Context/PublisherProvider/usePublisher/usePublisher.tsx

@@ -268,8 +268,8 @@ const usePublisher = (): PublisherContextType => {
         return;
       }
 
-      sessionPublish(publisherRef.current);
-      setIsPublishingToSession(true);
+      setIsPublishingToSession(true); // Avoid multiple simultaneous publish attempts
+      await sessionPublish(publisherRef.current);
     } catch (err: unknown) {
       if (err instanceof Error) {
         console.warn(err.stack);

frontend/src/Context/SessionProvider/session.spec.tsx

@@ -48,6 +48,7 @@ describe('SessionProvider', () => {
   const TestComponent = () => {
     const {
       activeSpeakerId,
+      publish,
       unpublish,
       joinRoom,
       disconnect,
@@ -69,6 +70,17 @@ describe('SessionProvider', () => {
 
     return (
       <div>
+        <button
+          data-testid="publish"
+          onClick={() => {
+            if (publish) {
+              publish({} as unknown as Publisher);
+            }
+          }}
+          type="button"
+        >
+          Publish
+        </button>
         <button
           data-testid="unpublish"
           onClick={() => {
@@ -143,6 +155,7 @@ describe('SessionProvider', () => {
     };
     vonageVideoClient = Object.assign(new EventEmitter(), {
       unpublish: vi.fn(),
+      publish: vi.fn().mockResolvedValue(undefined),
       connect: vi.fn().mockReturnValue(Promise.resolve()),
       disconnect: vi.fn(),
       forceMuteStream: vi.fn(),
@@ -197,6 +210,30 @@ describe('SessionProvider', () => {
     await waitFor(() => expect(getByTestId('activeSpeaker')).toHaveTextContent('sub2'));
   });
 
+  describe('publish', () => {
+    it('should call publish on VonageVideoClient when connected', async () => {
+      await act(async () => {
+        getByTestId('publish').click();
+      });
+
+      expect(vonageVideoClient.publish).toHaveBeenCalledTimes(1);
+    });
+
+    it('should not call publish on VonageVideoClient if not connected', async () => {
+      act(() => {
+        getByTestId('disconnect').click();
+      });
+
+      await waitFor(() => expect(getByTestId('connected')).toHaveTextContent('false'));
+
+      await act(async () => {
+        getByTestId('publish').click();
+      });
+
+      expect(vonageVideoClient.publish).toHaveBeenCalledTimes(0);
+    });
+  });
+
   describe('unpublish', () => {
     it('should call unpublish on VonageVideoClient', () => {
       act(() => {

frontend/src/Context/SessionProvider/session.tsx

@@ -393,9 +393,10 @@ const SessionProvider = ({ children }: SessionProviderProps): ReactElement => {
    * @returns {Promise<void>} A promise that resolves when the stream is successfully published.
    */
   const publish = useCallback(async (publisher: Publisher): Promise<void> => {
-    if (vonageVideoClient.current) {
-      vonageVideoClient.current.publish(publisher);
+    if (!vonageVideoClient.current) {
+      return;
     }
+    await vonageVideoClient.current.publish(publisher);
   }, []);
 
   /**

frontend/src/hooks/useScreenShare.tsx

@@ -93,7 +93,7 @@ const useScreenShare = (): UseScreenShareType => {
         });
 
         // Publishing the screen sharing stream
-        publish(screenSharingPub.current);
+        await publish(screenSharingPub.current);
 
         vonageVideoClient?.on('screenshareStreamCreated', handleStreamCreated);
       } else if (screenSharingPub.current) {

frontend/src/utils/cleanAndDedupeDeviceLabels/cleanAndDedupeDeviceLabels.ts

@@ -48,7 +48,7 @@ const cleanAndDedupeDeviceLabels = (
   devices: (Device | AudioOutputDevice)[]
 ): Array<Device | AudioOutputDevice> => {
   const labelCounts = new Map<string, number>();
-  console.log({ devices });
+
   return devices.map((device) => {
     if (!device.label) {
       return device;