fix(react-client): await pending addTrack to fix track ops race (#527)

## Description
`getCurrentTrackId` now awaits the in-flight `addTrack` promise before
returning, so callers always see the resolved remote track id once the
track is registered.
- Add `connectionPromiseRef` storing the active `addTrack` job
- Make `getCurrentTrackId` async and await pending job
- Update callers (`replaceTrack`, `refreshStreamedTrack`,
`toggleMute`, `toggleDevice`) to await the new async signature
- Await `pauseStreaming` in `toggleDevice`
## Motivation and Context
`startStreaming` set `currentTrackIdRef.current` only after `addTrack`
  resolved. If the user invoked `toggleMute`, `replaceTrack`, or
`toggleDevice` during that window, `getCurrentTrackId` returned `null`
and the operation silently no-op'd (mute toggles ignored, replace
skipped). Awaiting the pending promise removes the race.
## Documentation impact
- [ ] Documentation update required
  - [ ] Documentation updated [in another PR](_)
- [x] No documentation update required
   
## Types of changes
  - [x] Bug fix (non-breaking change which fixes an issue)
  - [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to
        not work as expected)

Author: Critteros

packages/react-client/src/hooks/internal/useTrackManager.ts

@@ -27,6 +27,7 @@ export const useTrackManager = ({
   logger,
 }: TrackManagerConfig): TrackManager => {
   const currentTrackIdRef = useRef<string | null>(null);
+  const connectionPromiseRef = useRef<Promise<string> | null>(null);
 
   const {
     startDevice,
@@ -43,7 +44,10 @@ export const useTrackManager = ({
   // every time it changes.
   const getDeviceTrack = useCurrentCallback(() => deviceTrack);
 
-  const getCurrentTrackId = (): string | null => {
+  const getCurrentTrackId = async (): Promise<string | null> => {
+    if (connectionPromiseRef.current) {
+      await connectionPromiseRef.current;
+    }
     const refTrackId = currentTrackIdRef.current;
     if (!refTrackId) return null;
     const currentTrack = getRemoteOrLocalTrack(tsClient, refTrackId);
@@ -57,7 +61,7 @@ export const useTrackManager = ({
     const [newTrack, error] = result;
     if (error) return error;
 
-    const currentTrackId = getCurrentTrackId();
+    const currentTrackId = await getCurrentTrackId();
     if (!currentTrackId) return;
 
     await tsClient.replaceTrack(currentTrackId, newTrack);
@@ -66,7 +70,7 @@ export const useTrackManager = ({
   const setTrackMiddleware = useCurrentCallback(async (middleware: TrackMiddleware) => {
     const processedTrack = await applyMiddleware(middleware);
 
-    const currentTrackId = getCurrentTrackId();
+    const currentTrackId = await getCurrentTrackId();
     if (!currentTrackId) return;
 
     await tsClient.replaceTrack(currentTrackId, processedTrack);
@@ -90,8 +94,9 @@ export const useTrackManager = ({
       const [maxBandwidth, simulcastConfig] = getConfigAndBandwidthFromProps(props.sentQualities, bandwidthLimits);
 
       try {
-        const remoteTrackId = await tsClient.addTrack(track, trackMetadata, simulcastConfig, maxBandwidth);
-
+        const addTrackJob = tsClient.addTrack(track, trackMetadata, simulcastConfig, maxBandwidth);
+        connectionPromiseRef.current = addTrackJob;
+        const remoteTrackId = await addTrackJob;
         currentTrackIdRef.current = remoteTrackId;
       } catch (err) {
         if (err instanceof TrackTypeError) {
@@ -119,7 +124,7 @@ export const useTrackManager = ({
    * @see {@link TrackManager#toggleMute} for more details.
    */
   const toggleMute = useCurrentCallback(async () => {
-    const currentTrackId = getCurrentTrackId();
+    const currentTrackId = await getCurrentTrackId();
     const isTrackCurrentlyEnabled = Boolean(deviceTrack?.enabled);
     if (!currentTrackId) {
       logger.warn("Toggling mute is only possible while connected to a room.");
@@ -139,7 +144,7 @@ export const useTrackManager = ({
    * @see {@link TrackManager#toggleDevice} for more details.
    */
   const toggleDevice = useCurrentCallback(async () => {
-    const currentTrackId = getCurrentTrackId();
+    const currentTrackId = await getCurrentTrackId();
     if (deviceTrack) {
       stopDevice();
       if (currentTrackId) {