Configure the client and place 1:1 video calls with camera, torch, and switches.

Video Calls

1:1 video calls use mediaType: 'video'.

Prerequisites: install + peers + camera/mic permissions — Quick Start · Permissions.
Tokens: Authentication.

Client config

Same provider wiring as voice — required before dialing:

tsx

import {
  CallingProvider,
  CallingScreen,
  DEFAULT_HOSTED_SIGNALING_URL,
} from '@alaznah/calling';

const APP_USER_ID = 'alice';

async function fetchCallingToken(): Promise<string> {
  const res = await fetch('https://api.yourapp.com/calling/token', {
    headers: { Authorization: `Bearer ${sessionToken}` },
  });
  if (!res.ok) throw new Error('Failed to mint calling token');
  const { token } = await res.json();
  return token;
}

export default function App() {
  return (
    <CallingProvider
      config={{
        userId: APP_USER_ID,
        getAuthToken: fetchCallingToken,
        signalingUrl: DEFAULT_HOSTED_SIGNALING_URL, // or omit for hosted default
      }}
    >
      <CallingScreen userId={APP_USER_ID} defaultPeerId="bob" />
    </CallingProvider>
  );
}

Field	Required	Notes
`userId`	Yes	Must match calling JWT
`displayName`	No	Shown in default UI; sent as caller name on invite
`getAuthToken`	Yes	Short-lived Alaznah JWT
`signalingUrl`	No	Hosted default if omitted

For chat + overlay UI (CallingUI): Call UI. Tokens: Authentication.

Optional media defaults (when supported by your config):

{
  facingMode: 'user', // or 'environment'
}

Permissions

Mic and camera — use 'video':

import { requestCallPermissions } from '@alaznah/calling';

await requestCallPermissions('video');

Not { video: true }. Platform setup: Permissions.

Start a call

const client = useCallingClient();
const ready = useCallingReady();

if (!ready) return;

await requestCallPermissions('video');
const call = await client.startCall({
  calleeId: 'bob',
  calleeDisplayName: 'Bob', // optional — default UI label
  mediaType: 'video',
});

Or use CallingScreen and choose video from the dialer.

Incoming video

On the incoming screen:

Local camera preview can show while ringing (when joining with video)
Caller may toggle join with video off to answer as audio
Accept is still swipe up on the green control (video camera icon when joining with video)
Decline remains a single tap on red

Details: Incoming Calls.

In-call controls

await client.setVideoEnabled(false); // camera off
await client.switchCamera();         // front ↔ back
await client.setTorch(true);         // when torchAvailable
await client.setMuted(true);
await client.setSpeaker(true);
await client.end();

Method	Purpose
`setVideoEnabled(enabled)`	Enable / disable local camera track
`switchCamera()`	Flip facing mode
`setTorch(enabled)`	Flash when supported (`torchAvailable` on the call)
`setMuted` / `setSpeaker` / `end`	Same as voice

Rendering video

tsx

import { LocalVideoView, RemoteVideoView } from '@alaznah/calling';

<LocalVideoView stream={call.localStream} mirror objectFit="cover" />
<RemoteVideoView stream={call.remoteStream} objectFit="cover" />

CallingUI / ActiveCallScreen wire these automatically for the default experience.