small changes and doc fixes (#665)

Author: d3xvn

docusaurus/docs/Flutter/03-core-concepts/01-authentication.mdx

@@ -26,14 +26,14 @@ factory StreamVideo(
     muteAudioWhenInBackground: false,
     autoConnect: true,
     includeUserDetailsForAutoConnect: true,
+    keepConnectionsAliveWhenInBackground: false,
   ),
   required User user,
   String? userToken,
   TokenLoader? tokenLoader,
   OnTokenUpdated? onTokenUpdated,
   bool failIfSingletonExists = true,
   PNManagerProvider? pushNotificationManagerProvider,
-  CallTypeFactory? customCallTypeFactory,
 });
 ```
 

docusaurus/docs/Flutter/03-core-concepts/03-call-state.mdx

@@ -67,10 +67,10 @@ Overall, `callParticipants` is a powerful tool that provides you with a lot of c
 - Viewport Visibility
 
 ```dart
-for(final user in call.state.value.callParticipants){
-	if(user.isdominantSpeaker){
-		setState(()=> dominantSpeaker = user);
-	}
+for (final user in call.state.value.callParticipants){
+  if (user.isDominantSpeaker){
+    setState(() => dominantSpeaker = user);
+  }
 }
 ```
 

docusaurus/docs/Flutter/03-core-concepts/04-camera-and-microphone.mdx

@@ -47,9 +47,9 @@ For this, the `RtcMediaDeviceNotifier` can be used. Encapsulated in this class a
 
 ```dart
 RtcMediaDeviceNotifier.instance.onDeviceChange.listen((devices) {
-    final audioInputDevice = devices.where((device) => device.kind == RtcMediaDeviceKind.audioInput);
-    call.setAudioInputDevice(audioInputDevice.first);
-  });
+  final audioInputDevice = devices.where((device) => device.kind == RtcMediaDeviceKind.audioInput);
+  call.setAudioInputDevice(audioInputDevice.first);
+});
 ```
 
 For the times where listening to hardware changes are not required, convince methods can be used to fetch the connected devices by their `RtcMediaDeviceKind`.

docusaurus/docs/Flutter/03-core-concepts/05-call-types.mdx

@@ -10,7 +10,7 @@ import CallTypesPage from "../../../shared/video/_call-types.md";
 When you create a call like this
 
 ```dart
-final call = client.makeCall(callType: StreamCallType(), "123")
+final call = client.makeCall(callType: StreamCallType(), id: "123");
 ```
 
 You create a call of the type `default` with id `123`.
@@ -20,7 +20,7 @@ There are 4 built-in call types, `default`, `audio_room`, `livestream` and `deve
 You can also create your own types by calling `StreamCallType.custom`.
 
 ```dart
-final call = client.makeCall(callType: StreamCallType.custom("custom"), "123")
+final call = client.makeCall(callType: StreamCallType.custom("custom"), id: "123");
 ```
 
 :::note

docusaurus/docs/Flutter/03-core-concepts/06-querying-calls.mdx

@@ -67,6 +67,7 @@ To add a sort, it is simple as specifying a list of sorts to the `queryCalls` fu
 
 ```dart
 final result = await video.queryCalls(
+  // ...
   sorts: [
     SortParamRequest(field: 'starts_at', direction: -1),
   ],

docusaurus/docs/Flutter/03-core-concepts/07-permission-and-moderation.mdx

@@ -27,8 +27,7 @@ call.requestPermissions([CallPermission.screenshare, CallPermission.sendVideo]);
 As a call admin, you can grant permission to other users by calling `call.grantPermissions` along with the user’s `id` and the list of permissions you would like to grant:
 
 ```dart
-call.grantPermissions(userId: 'nash', [CallPermission.screenshare, CallPermission.sendVideo])
-
+call.grantPermissions(userId: 'nash', permissions: [CallPermission.screenshare, CallPermission.sendVideo]);
 ```
 
 During a call, it is advised to set up a handler to listen and react to permission requests as they arrive. This can be done by passing a callback function to the `onPermissionRequest` property present on the `Call` object:
@@ -62,8 +61,7 @@ To facilitate these requests, the SDK provides several methods for limiting user
 Similar to its sister method `grantPermissions`, the `revokePermissions` method exists on the current `Call` object. It enables users to easily remove permissions assigned to a specific user by providing their user ID and the list of permissions to be revoked..
 
 ```dart
-call.revokePermissions(userId: 'nash', [CallPermission.screenshare, CallPermission.sendVideo]);
-
+call.revokePermissions(userId: 'nash', permissions: [CallPermission.screenshare, CallPermission.sendVideo]);
 ```
 
 **Mute Users**
@@ -75,7 +73,6 @@ call.muteAllUsers();
 ```
 
 ```dart
-
 call.muteUsers(userIds: ['thierry']);
 ```
 
@@ -90,7 +87,6 @@ In the above example, we are only muting a single user. However, `muteUsers` doe
 Blocking and unblocking users can be done by calling `blockUser` or `unblockUser` on the current `Call` object.
 
 ```dart
-
 call.blockUser('deven');
 
 call.unblockUser('deven');

docusaurus/docs/Flutter/04-ui/02-call-container.mdx

@@ -34,16 +34,17 @@ Developers can easily respond to user actions, such as accepting or declining a
 To replace default screens, such as the one displayed when an incoming call is detected, developers can use one of the many optional builders available.
 
 ```dart
-@override
+  @override
   Widget build(BuildContext context) {
-   return Scaffold(
-    body: StreamCallContainer(
-      call: widget.call,
-      incomingCallBuilder: (context, call, callState) {
-        return CustomIncomingCallScreen(call: call, state: callState);
-      },
-    ),
-);
+    return Scaffold(
+      body: StreamCallContainer(
+        call: widget.call,
+        incomingCallBuilder: (context, call, callState) {
+          return CustomIncomingCallScreen(call: call, state: callState);
+        },
+      ),
+    );
+  }
 ```
 
 All the `builders` exposed by `StreamCallContainer` provide users with an ongoing `Call` object and the associated `CallState`. These can be used to subscribe to changes and display different UI options depending on the events.

docusaurus/docs/Flutter/04-ui/03-video-render.mdx

@@ -18,10 +18,11 @@ When in doubt, we recommend starting with `StreamCallParticipant` unless there i
 ### Customizing `StreamCallParticipant`
 
 ```dart
-const StreamCallParticipant({
+  const StreamCallParticipant({
     super.key,
     required this.call,
     required this.participant,
+    this.videoFit,
     this.backgroundColor,
     this.borderRadius,
     this.userAvatarTheme,
@@ -49,7 +50,7 @@ Call Participant allows you to customize everything from the background color an
 To use the widget, you need to supply two arguments: the current `call` and `participant` to render. Both of these parameters can be fetched from either `activeCall` or `callState`.
 
 ```dart
-StreamCallContent(
+  StreamCallContent(
     call: call,
     callState: callState,
     callParticipantsBuilder: (context, call, callState) {
@@ -64,7 +65,7 @@ StreamCallContent(
 ### Using `StreamVideoRenderer` directly:
 
 ```dart
-StreamCallContent(
+  StreamCallContent(
     call: call,
     callState: callState,
     callParticipantsBuilder: (context, call, callState) {

docusaurus/docs/Flutter/04-ui/04-call-content.mdx

@@ -9,7 +9,7 @@ Similar to `StreamCallContainer`, `CallContent` allows for the display of partic
 However, unlike `StreamCallContainer`, the sole responsibility of `StreamCallContent` is to render the call participants and controls. `StreamCallContent` does not monitor or respond to call lifecycle events, such as incoming and outgoing calls.
 
 ```dart
-const StreamCallContent({
+  const StreamCallContent({
     super.key,
     required this.call,
     required this.callState,
@@ -19,6 +19,9 @@ const StreamCallContent({
     this.overlayAppBarBuilder,
     this.callParticipantsBuilder,
     this.callControlsBuilder,
+    this.layoutMode = ParticipantLayoutMode.grid,
+    this.enablePictureInPicture = false,
+    this.callPictureInPictureBuilder,
   });
 ```
 

docusaurus/docs/Flutter/04-ui/06-video-theme.mdx

@@ -31,18 +31,20 @@ Some high-level properties such as `textTheme` or `colorTheme` can be set applic
 In contrast, larger components such as `StreamCallParticipant`, `StreamLobbyView`, etc. have been addressed with smaller theme objects.
 
 ```dart
-factory StreamVideoTheme({
-  required Brightness brightness,
-  StreamTextTheme? textTheme,
-  StreamColorTheme? colorTheme,
-  StreamCallControlsThemeData? callControlsTheme,
-  StreamUserAvatarThemeData? userAvatarTheme,
-  StreamLobbyViewThemeData? lobbyViewTheme,
-  StreamCallParticipantThemeData? callParticipantTheme,
-  StreamLocalVideoThemeData? localVideoTheme,
-  StreamIncomingOutgoingCallThemeData? incomingCallTheme,
-  StreamIncomingOutgoingCallThemeData? outgoingCallTheme,
-}); 
+  factory StreamVideoTheme({
+    required Brightness brightness,
+    StreamTextTheme? textTheme,
+    StreamColorTheme? colorTheme,
+    StreamCallContentThemeData? callContentTheme,
+    StreamCallControlsThemeData? callControlsTheme,
+    StreamUserAvatarThemeData? userAvatarTheme,
+    StreamLobbyViewThemeData? lobbyViewTheme,
+    StreamCallParticipantThemeData? callParticipantTheme,
+    StreamLocalVideoThemeData? localVideoTheme,
+    StreamIncomingOutgoingCallThemeData? incomingCallTheme,
+    StreamIncomingOutgoingCallThemeData? outgoingCallTheme,
+    StreamLivestreamThemeData? livestreamTheme,
+  });
 ```
 
 ### Stream Video Theme in use