docs(react-native): update tutorial links

packages/react-native-sdk/.gitignore

@@ -65,3 +65,4 @@ buck-out/
 /vendor/bundle/
 
 version.ts
+!docusaurus/.env

packages/react-native-sdk/docusaurus/.env

@@ -0,0 +1 @@
+PRODUCT=video

packages/react-native-sdk/docusaurus/docs/reactnative/01-setup/01-introduction.mdx

@@ -10,9 +10,9 @@ Our React Native SDK comes with user-friendly UI components, easy-to-use React h
 
 If you're new to Stream React Native Video SDK, we recommend starting with the following three tutorials, depending on your requirements:
 
-- [Video & Audio Calling Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/)
-- [Audio Room Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/audio-room/)
-- [Livestream Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/livestreaming/)
+- [Video & Audio Calling Tutorial](https://getstream.io/video/sdk/react-native/tutorial/video-calling/)
+- [Audio Room Tutorial](https://getstream.io/video/sdk/react-native/tutorial/audio-room/)
+- [Livestream Tutorial](https://getstream.io/video/sdk/react-native/tutorial/livestreaming/)
 
 After the tutorials, the documentation explains how to use:
 

packages/react-native-sdk/docusaurus/docs/reactnative/03-core/05-call-types.mdx

@@ -11,10 +11,10 @@ import WithExternalLinks from '../../../shared/video/_withExternalLinks';
 <WithExternalLinks
   mapping={{
     '/tutorials/video-calling/':
-      'https://getstream.io/video/sdk/reactnative/tutorial/video-calling/',
+      'https://getstream.io/video/sdk/react-native/tutorial/video-calling/',
     '/tutorials/audio-room/':
-      'https://getstream.io/video/sdk/reactnative/tutorial/audio-room/',
+      'https://getstream.io/video/sdk/react-native/tutorial/audio-room/',
     '/tutorials/livestream/':
-      'https://getstream.io/video/sdk/reactnative/tutorial/livestreaming/',
+      'https://getstream.io/video/sdk/react-native/tutorial/livestreaming/',
   }}
 />

packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/14-watching-a-livestream.mdx

@@ -9,7 +9,7 @@ import ViewerLivestreamScreenShare from '../assets/05-ui-cookbook/14-watching-a-
 
 The Video API allows you to assign specific roles for users in a livestream, such as hosts and viewers. Our SDK provides dedicated livestreaming components for both of these roles.
 
-The `ViewerLivestream` component leverages the WebRTC protocol for seamless livestream viewing within the SDK. To enable external publishing, you can access HLS credentials from the dashboard. For additional information, please refer to our [livestream tutorial](https://getstream.io/video/sdk/reactnative/tutorial/livestreaming/).
+The `ViewerLivestream` component leverages the WebRTC protocol for seamless livestream viewing within the SDK. To enable external publishing, you can access HLS credentials from the dashboard. For additional information, please refer to our [livestream tutorial](https://getstream.io/video/sdk/react-native/tutorial/livestreaming/).
 
 This guide describes how to customize watching a livestream through our SDK.
 

packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/02-chat-with-video.mdx

@@ -213,7 +213,7 @@ The `apiKey`, `userData` and the `tokenProvider` comes up from the `ChatWrapper`
 
 ### Step 1: Wrapping the `ChatWrapper`
 
-If we extend our [Video Calling Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/), our `ChatWrapper` component can we wrapped as a parent/child of the `StreamVideo` as:
+If we extend our [Video Calling Tutorial](https://getstream.io/video/sdk/react-native/tutorial/video-calling/), our `ChatWrapper` component can we wrapped as a parent/child of the `StreamVideo` as:
 
 ```tsx title="App.tsx" {16,24}
 import React, { useEffect, useState } from 'react';
@@ -320,7 +320,7 @@ The `ChatButton` component takes up an `onPressHandler`, which is responsible to
 
 ![Preview of the call controls with chat button](../assets/06-advanced/02-chat-integration/call-controls-chat.png).
 
-In the VideoCallUI component of our [Video Calling Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/), we will add the above:
+In the VideoCallUI component of our [Video Calling Tutorial](https://getstream.io/video/sdk/react-native/tutorial/video-calling/), we will add the above:
 
 ```tsx title="src/components/VideoCallUI.tsx" {13-16,25,35-38,40-42,46}
 import React from 'react';
@@ -916,7 +916,7 @@ const styles = StyleSheet.create({
 
 ### Step 3: Creating and passing the Video Wrapper
 
-Adhering to the [Getting and Setting the credentials](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/#step-3---getting-and-setting-the-credentials) step of the [Video Call Tutorial](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/), we will create a video wrapper that wraps and provides the Stream's Video client to the rest of the app.
+Adhering to the [Getting and Setting the credentials](https://getstream.io/video/sdk/react-native/tutorial/video-calling/#step-3---getting-and-setting-the-credentials) step of the [Video Call Tutorial](https://getstream.io/video/sdk/react-native/tutorial/video-calling/), we will create a video wrapper that wraps and provides the Stream's Video client to the rest of the app.
 
 ```tsx title="src/components/VideoWrapper.tsx"
 import React, { PropsWithChildren, useEffect, useState } from 'react';
@@ -927,7 +927,7 @@ import {
 
 export const VideoWrapper = ({ children }: PropsWithChildren<{}>) => {
   const [videoClient, setVideoClient] = useState<StreamVideoClient | undefined>(
-    undefined,
+    undefined
   );
 
   const user = {
@@ -1031,7 +1031,7 @@ export const Calls = () => {
     Alert.alert(
       `Incoming call from ${
         lastCallCreatedBy?.name ?? lastCallCreatedBy?.id
-      }, only 1 call at a time is supported`,
+      }, only 1 call at a time is supported`
     );
   }, [calls]);
 
@@ -1132,7 +1132,7 @@ const ChannelHeader = (props: ChannelHeaderProps) => {
   const { channel } = useAppContext();
   const videoClient = useStreamVideoClient();
   const members = Object.values(
-    channel?.state?.members ?? {},
+    channel?.state?.members ?? {}
   ).map<MemberRequest>((member) => ({
     user_id: member.user_id!,
   }));

packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/06-broadcasting.mdx

@@ -14,7 +14,7 @@ We can choose from two approaches to broadcasting the media:
 It is up to the integrators to decide, what approach will be used in their apps for the audience to consume the streams.
 
 :::tip
-We have built a [livestream app tutorial](https://getstream.io/video/sdk/reactnative/tutorial/livestreaming/) that relies on the broadcasting feature. The demo expands on how to implement both, the HLS and the WebRTC approach to streaming.
+We have built a [livestream app tutorial](https://getstream.io/video/sdk/react-native/tutorial/livestreaming/) that relies on the broadcasting feature. The demo expands on how to implement both, the HLS and the WebRTC approach to streaming.
 :::
 
 ## Call type for broadcasting

packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/07-deeplinking.mdx

@@ -6,7 +6,7 @@ description: Tutorial to integrate deep linking for the calls
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-This guide talks about deep linking into a [video call](https://getstream.io/video/sdk/reactnative/tutorial/video-calling/) or a generic application directly. It also focuses on getting the call id or similar entity through a Deep link URL and thereby use it to start a call.
+This guide talks about deep linking into a [video call](https://getstream.io/video/sdk/react-native/tutorial/video-calling/) or a generic application directly. It also focuses on getting the call id or similar entity through a Deep link URL and thereby use it to start a call.
 
 ### Step 1 - Native Setup