From fec698521c010416050388a46e702f0ddcbaef07 Mon Sep 17 00:00:00 2001 From: Martin Mitrevski Date: Wed, 31 Jul 2024 12:18:21 +0200 Subject: [PATCH] docs: React Native docs updates (#1453) Some typos and small improvements in the React Native docs. --- .../docs/reactnative/01-setup/03-quickstart.mdx | 6 +++--- .../docs/reactnative/03-core/01-client-auth.mdx | 8 ++------ .../docs/reactnative/03-core/07-keeping-call-alive.mdx | 2 +- .../03-core/10-reactions-and-custom-events.mdx | 2 +- .../docs/reactnative/05-ui-cookbook/09-reactions.mdx | 2 +- .../docs/reactnative/06-advanced/02-chat-with-video.mdx | 4 ++-- .../06-advanced/04-push-notifications/01-overview.mdx | 5 +++++ 7 files changed, 15 insertions(+), 14 deletions(-) diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/01-setup/03-quickstart.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/01-setup/03-quickstart.mdx index 67a1810a06..3e31c59c1a 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/01-setup/03-quickstart.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/01-setup/03-quickstart.mdx @@ -38,10 +38,10 @@ export default function App() { } ``` -When creating a call on the client, the string `default` is a call type. There are 4 built-in [call types](../../core/configuring-call-types/). and you can also create your own. +When creating a call on the client, the string `default` is a call type. There are 4 built-in [call types](../../core/configuring-call-types/) and you can also create your own. The call type controls the permissions and which features are enabled. -The second argument is the call id. Call ids can be reused, meaning it's possible to join a call with the same id multiple times (for example, for recurring meetings). +The second argument is the call id. Call ids can be reused, meaning it's possible to join a call with the same id multiple times (for example, for recurring meetings). However, for ringing calls, you should always provide a unique call id. ## Rendering video @@ -102,7 +102,7 @@ More information about this topic can be found in the [Camera & Microphone guide ## UI Components -The goal of this library is to make it easy to build any type of video/calling experience. You have a few options for the UI: +The goal of this library is to make it easy to build any type of video/calling experience. You have few options for the UI: - Build your own UI components using the state as shown above. - Use our library of built-in components. diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/01-client-auth.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/01-client-auth.mdx index 46fec730ae..debe90c4c0 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/01-client-auth.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/01-client-auth.mdx @@ -13,10 +13,6 @@ Before joining a call, it is necessary to set up the video client. Here's a basi ```ts import { StreamVideoClient, User } from '@stream-io/video-react-native-sdk'; -const user: User = { - id: 'sara'; -}; - const user: User = { id: 'sara', }; @@ -34,7 +30,7 @@ Typically, you'll want to initialize the client when your application loads and ## Generating a token Tokens need to be generated server side. You can use our [server side SDKs](https://getstream.io/video/docs/api/authentication/) to quickly add support for this. -Typically, you integrate this into the part of your codebase where you log in or register users. +Typically, you integrate this logic into the part of your codebase where you log in or register users. The tokens provide a way to authenticate a user or give access to a specific set of calls. @@ -47,7 +43,7 @@ For development purposes, you can use our [Token Generator](https://getstream.io - Authenticated users are users that have an account on your app. - Guest users are temporary user accounts. You can use it to temporarily give someone a name and image when joining a call. -- Anonymous users are users that are not authenticated. It's common to use this for watching a livestream or similar where you aren't authenticated. +- Anonymous users are users that are not authenticated. It's common to use this type for watching a livestream or similar where you aren't authenticated. This example shows the client setup for a guest user: diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/07-keeping-call-alive.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/07-keeping-call-alive.mdx index 680dbbda8c..a279809bbc 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/07-keeping-call-alive.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/07-keeping-call-alive.mdx @@ -17,7 +17,7 @@ Head over to the documentation [here](../../advanced/pip/) on how to picture-in- ### Android 7 -There is no support for Picture-in-picture (PiP) mode below Android 8. Hence in those platforms, we use a [foreground service](https://developer.android.com/guide/components/foreground-services) to keep the call alive. The SDK will manage the foreground service. In Expo, the config plugin adds it up. But if Expo is not used, be sure add the following: +There is no support for Picture-in-picture (PiP) mode below Android 8. Hence in those platforms, we use a [foreground service](https://developer.android.com/guide/components/foreground-services) to keep the call alive. The SDK will manage the foreground service. In Expo, the config plugin adds it up. But if Expo is not used, be sure to add the following: #### Add declarations in AndroidManifest diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/10-reactions-and-custom-events.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/10-reactions-and-custom-events.mdx index c401fc3665..deb0b09f1c 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/10-reactions-and-custom-events.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/03-core/10-reactions-and-custom-events.mdx @@ -10,7 +10,7 @@ Custom events let participants send and receive arbitrary WebSocket messages. Fo ## Reactions :::tip -[`CallControls `](../../ui-components/call/call-controls/) optionally utilizes [`ReactionsButton`](https://github.com/GetStream/stream-video-js/blob/main/packages/react-native-sdk/src/components/Call/CallControls/ReactionsButton.tsx) component that support reactions out-of-the-box, but for advanced use-cases you can also build your own reaction system. +[`CallControls`](../../ui-components/call/call-controls/) optionally utilizes [`ReactionsButton`](https://github.com/GetStream/stream-video-js/blob/main/packages/react-native-sdk/src/components/Call/CallControls/ReactionsButton.tsx) component that support reactions out-of-the-box, but for advanced use-cases you can also build your own reaction system. ::: ### Sending reactions diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/09-reactions.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/09-reactions.mdx index 019aa30b92..ab7d85d3be 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/09-reactions.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/09-reactions.mdx @@ -64,7 +64,7 @@ const VideoCallUI = () => { }; ``` -You can also use it in the [ReactionsControls](https://github.com/GetStream/stream-video-js/blob/main/packages/react-native-sdk/src/components/Call/CallControls/ReactionsButton.tsx) so as to list the supported reactions in the call controls and use them to send it. +You can also use it in the [ReactionsControls](https://github.com/GetStream/stream-video-js/blob/main/packages/react-native-sdk/src/components/Call/CallControls/ReactionsButton.tsx) in order to list the supported reactions in the call controls and use them to send it. ```tsx import { diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/02-chat-with-video.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/02-chat-with-video.mdx index 2fc9c06863..48c5c68b70 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/02-chat-with-video.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/02-chat-with-video.mdx @@ -878,7 +878,7 @@ const styles = StyleSheet.create({ ### Step 2: Wrapping the `ChatWrapper` -Now, We will wrap the [`ChatWrapper`](#wrapping-the-chat-client) that provides the chat client to the rest of the application created initially in this tutorial. +Now, we will wrap the [`ChatWrapper`](#wrapping-the-chat-client) that provides the chat client to the rest of the application created initially in this tutorial. ```tsx title="App.tsx" import React from 'react'; @@ -1012,7 +1012,7 @@ const styles = StyleSheet.create({ ### Step 4: Passing the call to `StreamCall` -To listen to the pending calls(both incoming and outgoing), we can use the `useCalls` hook that gives us the list of all the pending calls for a user. +To listen to the pending calls (both incoming and outgoing), we can use the `useCalls` hook that gives us the list of all the pending calls for a user. To pass the call and provide it to the components within the hierarchy we use the [`StreamCall`](../../ui-components/core/stream-call/) component that has a prop [`call`](../../ui-components/core/stream-call/#call). diff --git a/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/04-push-notifications/01-overview.mdx b/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/04-push-notifications/01-overview.mdx index d6b701932e..fc00b487d4 100644 --- a/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/04-push-notifications/01-overview.mdx +++ b/packages/react-native-sdk/docusaurus/docs/reactnative/06-advanced/04-push-notifications/01-overview.mdx @@ -4,6 +4,11 @@ title: Overview Push notifications can be configured to receive updates when the application is closed or on the background. Stream Video Server sends push notification for Ringing calls and Live calls that are about to start to users that have at least one registered device. +Push notifications are sent in the following scenarios: +- you create a call with the `ring` value set to true. In this case, a notification that shows a ringing screen is sent. +- you create a call with the `notify` value set to true. In this case, a regular push notification is sent. +- you haven't answered a call. In this case, a missed call notification is sent (regular push notification). + To receive push notifications from Stream Video Server, you'll need to: 1. Configure your push notification provider on the [Stream Dashboard](https://dashboard.getstream.io).