Skip to content

Commit

Permalink
docs: React Native docs updates (#1453)
Browse files Browse the repository at this point in the history
Some typos and small improvements in the React Native docs.
  • Loading branch information
martinmitrevski authored Jul 31, 2024
1 parent d2db3ac commit fec6985
Show file tree
Hide file tree
Showing 7 changed files with 15 additions and 14 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down Expand Up @@ -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.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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',
};
Expand All @@ -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.

<TokenSnippet sampleApp="meeting" displayStyle="credentials" />
Expand All @@ -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:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Expand Down Expand Up @@ -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).

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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).
Expand Down

0 comments on commit fec6985

Please sign in to comment.