Added option to toggle preview change name from application

100mslive · Dec 11, 2023 · 549217f · 549217f
1 parent 2a6b9f1
commit 549217f
Show file tree

Hide file tree

Showing 9 changed files with 158 additions and 110 deletions.
diff --git a/packages/hms_room_kit/lib/src/service/app_debug_config.dart b/packages/hms_room_kit/lib/src/service/app_debug_config.dart
@@ -14,6 +14,7 @@ class AppDebugConfig {
   static bool isSoftwareDecoderDisabled = true;
   static bool isAudioMixerDisabled = true;
   static bool isAutoSimulcast = true;
+  static bool nameChangeOnPreview = true;
 
   static bool isDebugMode = false;
   static bool isProdRoom = true;
@@ -32,5 +33,6 @@ class AppDebugConfig {
     isAudioMixerDisabled = true;
     isAutoSimulcast = true;
     isProdRoom = true;
+    nameChangeOnPreview = true;
   }
 }
diff --git a/packages/hms_room_kit/lib/src/widgets/bottom_sheets/local_peer_bottom_sheet.dart b/packages/hms_room_kit/lib/src/widgets/bottom_sheets/local_peer_bottom_sheet.dart
@@ -148,44 +148,45 @@ class _LocalPeerBottomSheetState extends State<LocalPeerBottomSheet> {
                     //     title: HMSSubheadingText(
                     //         text: "Spotlight Tile for Everyone",
                     //         textColor: HMSThemeColors.onSurfaceHighEmphasis)),
-                    ListTile(
-                        horizontalTitleGap: 2,
-                        onTap: () async {
-                          Navigator.pop(context);
-                          showModalBottomSheet(
-                            isScrollControlled: true,
-                            backgroundColor: HMSThemeColors.surfaceDim,
-                            shape: const RoundedRectangleBorder(
-                              borderRadius: BorderRadius.only(
-                                  topLeft: Radius.circular(16),
-                                  topRight: Radius.circular(16)),
-                            ),
-                            context: context,
-                            builder: (ctx) => ChangeNotifierProvider.value(
-                                value: widget.meetingStore,
-                                child: Padding(
-                                    padding: EdgeInsets.only(
-                                        bottom: MediaQuery.of(ctx)
-                                            .viewInsets
-                                            .bottom),
-                                    child: const ChangeNameBottomSheet(
-                                      showPrivacyInfo: false,
-                                    ))),
-                          );
-                        },
-                        contentPadding: EdgeInsets.zero,
-                        leading: SvgPicture.asset(
-                          "packages/hms_room_kit/lib/src/assets/icons/pencil.svg",
-                          semanticsLabel: "fl_local_pin_tile",
-                          height: 20,
-                          width: 20,
-                          colorFilter: ColorFilter.mode(
-                              HMSThemeColors.onSurfaceHighEmphasis,
-                              BlendMode.srcIn),
-                        ),
-                        title: HMSSubheadingText(
-                            text: "Change Name",
-                            textColor: HMSThemeColors.onSurfaceHighEmphasis)),
+                    if (Constant.prebuiltOptions?.userName == null)
+                      ListTile(
+                          horizontalTitleGap: 2,
+                          onTap: () async {
+                            Navigator.pop(context);
+                            showModalBottomSheet(
+                              isScrollControlled: true,
+                              backgroundColor: HMSThemeColors.surfaceDim,
+                              shape: const RoundedRectangleBorder(
+                                borderRadius: BorderRadius.only(
+                                    topLeft: Radius.circular(16),
+                                    topRight: Radius.circular(16)),
+                              ),
+                              context: context,
+                              builder: (ctx) => ChangeNotifierProvider.value(
+                                  value: widget.meetingStore,
+                                  child: Padding(
+                                      padding: EdgeInsets.only(
+                                          bottom: MediaQuery.of(ctx)
+                                              .viewInsets
+                                              .bottom),
+                                      child: const ChangeNameBottomSheet(
+                                        showPrivacyInfo: false,
+                                      ))),
+                            );
+                          },
+                          contentPadding: EdgeInsets.zero,
+                          leading: SvgPicture.asset(
+                            "packages/hms_room_kit/lib/src/assets/icons/pencil.svg",
+                            semanticsLabel: "fl_local_pin_tile",
+                            height: 20,
+                            width: 20,
+                            colorFilter: ColorFilter.mode(
+                                HMSThemeColors.onSurfaceHighEmphasis,
+                                BlendMode.srcIn),
+                          ),
+                          title: HMSSubheadingText(
+                              text: "Change Name",
+                              textColor: HMSThemeColors.onSurfaceHighEmphasis)),
                     if (widget.isInsetTile)
                       ListTile(
                           horizontalTitleGap: 2,

diff --git a/packages/hms_room_kit/lib/src/widgets/common_widgets/inset_tile.dart b/packages/hms_room_kit/lib/src/widgets/common_widgets/inset_tile.dart
@@ -9,7 +9,7 @@ import 'package:provider/provider.dart';
 
 ///Project imports
 import 'package:hms_room_kit/src/layout_api/hms_theme_colors.dart';
-import 'package:hms_room_kit/src/widgets/peer_widgets/inset_tile_more_option.dart';
+import 'package:hms_room_kit/src/widgets/peer_widgets/local_peer_more_option.dart';
 import 'package:hms_room_kit/src/model/peer_track_node.dart';
 import 'package:hms_room_kit/src/widgets/common_widgets/video_view.dart';
 import 'package:hms_room_kit/src/widgets/peer_widgets/audio_mute_status.dart';

diff --git a/packages/hms_room_kit/lib/src/widgets/common_widgets/peer_tile.dart b/packages/hms_room_kit/lib/src/widgets/common_widgets/peer_tile.dart
@@ -10,7 +10,7 @@ import 'package:provider/provider.dart';
 // Project imports
 import 'package:hms_room_kit/src/layout_api/hms_theme_colors.dart';
 import 'package:hms_room_kit/src/meeting/meeting_store.dart';
-import 'package:hms_room_kit/src/widgets/peer_widgets/inset_tile_more_option.dart';
+import 'package:hms_room_kit/src/widgets/peer_widgets/local_peer_more_option.dart';
 import 'package:hms_room_kit/src/widgets/peer_widgets/name_and_network.dart';
 import 'package:hms_room_kit/src/widgets/peer_widgets/screen_share_tile_name.dart';
 import 'package:hms_room_kit/src/model/peer_track_node.dart';

diff --git a/packages/hms_room_kit/lib/src/widgets/peer_widgets/inset_tile_more_option.dart b/packages/hms_room_kit/lib/src/widgets/peer_widgets/inset_tile_more_option.dart
diff --git a/packages/hms_room_kit/lib/src/widgets/peer_widgets/local_peer_more_option.dart b/packages/hms_room_kit/lib/src/widgets/peer_widgets/local_peer_more_option.dart
@@ -0,0 +1,74 @@
+///Package imports
+import 'package:flutter/material.dart';
+import 'package:hms_room_kit/hms_room_kit.dart';
+import 'package:provider/provider.dart';
+
+///Project imports
+import 'package:hms_room_kit/src/meeting/meeting_store.dart';
+import 'package:hms_room_kit/src/model/peer_track_node.dart';
+import 'package:hms_room_kit/src/widgets/bottom_sheets/local_peer_bottom_sheet.dart';
+
+///[LocalPeerMoreOption] is a widget that is used to render the more option button on a local peer(inset) tile
+///This is used in the [LocalPeerTile]
+///It has following parameters:
+///[callbackFunction] is a function that is called when the more option button is clicked
+class LocalPeerMoreOption extends StatelessWidget {
+  final Function()? callbackFunction;
+  final bool isInsetTile;
+  const LocalPeerMoreOption(
+      {super.key, this.callbackFunction, this.isInsetTile = true});
+
+  @override
+  Widget build(BuildContext context) {
+    return (Constant.prebuiltOptions?.userName != null && !isInsetTile)
+        ? const SizedBox()
+        : Positioned(
+            bottom: 5,
+            right: 5,
+            child: GestureDetector(
+              onTap: () {
+                ///[peerTrackNode] is the peerTrackNode of the peer whose more option is clicked
+                ///We only show the modal bottom sheet if the peer is the local peer
+                var peerTrackNode = context.read<PeerTrackNode>();
+                showModalBottomSheet(
+                  isScrollControlled: true,
+                  backgroundColor: HMSThemeColors.surfaceDim,
+                  shape: const RoundedRectangleBorder(
+                    borderRadius: BorderRadius.only(
+                        topLeft: Radius.circular(16),
+                        topRight: Radius.circular(16)),
+                  ),
+                  context: context,
+                  builder: (ctx) => ChangeNotifierProvider.value(
+                      value: context.read<MeetingStore>(),
+                      child: LocalPeerBottomSheet(
+                        isInsetTile: isInsetTile,
+                        meetingStore: context.read<MeetingStore>(),
+                        peerTrackNode: peerTrackNode,
+                        callbackFunction: callbackFunction,
+                      )),
+                );
+              },
+              child: Semantics(
+                label:
+                    "fl_${context.read<PeerTrackNode>().peer.name}more_option",
+                child: Container(
+                  height: 28,
+                  width: 28,
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(8),
+                    color: HMSThemeColors.backgroundDim.withOpacity(0.64),
+                  ),
+                  child: Center(
+                    child: Icon(
+                      Icons.more_vert,
+                      color: HMSThemeColors.onSurfaceHighEmphasis,
+                      size: 20,
+                    ),
+                  ),
+                ),
+              ),
+            ),
+          );
+  }
+}
diff --git a/packages/hmssdk_flutter/example/lib/app_settings_bottom_sheet.dart b/packages/hmssdk_flutter/example/lib/app_settings_bottom_sheet.dart
@@ -28,6 +28,7 @@ class _AppSettingsBottomSheetState extends State<AppSettingsBottomSheet> {
   bool isDebugMode = false;
   HMSAudioMode currentAudioMode = HMSAudioMode.VOICE;
   bool isStreamingFlow = true;
+  bool nameChangeOnPreview = true;
 
   var versions = {};
 
@@ -72,6 +73,9 @@ class _AppSettingsBottomSheetState extends State<AppSettingsBottomSheet> {
     isStreamingFlow =
         await Utilities.getBoolData(key: 'is_streaming_flow') ?? true;
 
+    nameChangeOnPreview =
+        await Utilities.getBoolData(key: 'name-change-on-preview') ?? true;
+
     WidgetsBinding.instance.addPostFrameCallback((_) {
       setState(() {});
     });
@@ -89,6 +93,7 @@ class _AppSettingsBottomSheetState extends State<AppSettingsBottomSheet> {
     AppDebugConfig.showStats = showStats;
     AppDebugConfig.skipPreview = skipPreview;
     AppDebugConfig.isDebugMode = isDebugMode;
+    AppDebugConfig.nameChangeOnPreview = true;
   }
 
   Future<void> _launchUrl() async {
@@ -336,6 +341,36 @@ class _AppSettingsBottomSheetState extends State<AppSettingsBottomSheet> {
                               setState(() {})
                             }),
                   ),
+                  ListTile(
+                    horizontalTitleGap: 2,
+                    enabled: false,
+                    contentPadding: EdgeInsets.zero,
+                    leading: SvgPicture.asset(
+                      "packages/hms_room_kit/lib/src/assets/icons/pencil.svg",
+                      fit: BoxFit.scaleDown,
+                      colorFilter:
+                          ColorFilter.mode(themeDefaultColor, BlendMode.srcIn),
+                    ),
+                    title: Text(
+                      "Name Change On Preview",
+                      semanticsLabel: "fl_disable_name_change_on_preview",
+                      style: HMSTextStyle.setTextStyle(
+                          fontSize: 14,
+                          color: themeDefaultColor,
+                          letterSpacing: 0.25,
+                          fontWeight: FontWeight.w600),
+                    ),
+                    trailing: CupertinoSwitch(
+                        activeColor: hmsdefaultColor,
+                        value: nameChangeOnPreview,
+                        onChanged: (value) => {
+                              nameChangeOnPreview = value,
+                              Utilities.saveBoolData(
+                                  key: 'name-change-on-preview', value: value),
+                              AppDebugConfig.nameChangeOnPreview = value,
+                              setState(() {})
+                            }),
+                  ),
                   ListTile(
                     horizontalTitleGap: 2,
                     enabled: false,

diff --git a/packages/hmssdk_flutter/example/lib/main.dart b/packages/hmssdk_flutter/example/lib/main.dart
@@ -290,6 +290,9 @@ class _HomePageState extends State<HomePage> {
             builder: (_) => HMSPrebuilt(
                 roomCode: Constant.roomCode,
                 options: HMSPrebuiltOptions(
+                    userName: AppDebugConfig.nameChangeOnPreview
+                        ? null
+                        : "Flutter User",
                     endPoints: endPoints,
                     userId:
                         "user_flutter", // pass your custom unique user identifier here

diff --git a/packages/hmssdk_flutter/example/lib/qr_code_screen.dart b/packages/hmssdk_flutter/example/lib/qr_code_screen.dart
@@ -78,6 +78,9 @@ class _QRCodeScreenState extends State<QRCodeScreen> {
             builder: (_) => HMSPrebuilt(
                 roomCode: Constant.roomCode,
                 options: HMSPrebuiltOptions(
+                    userName: AppDebugConfig.nameChangeOnPreview
+                        ? null
+                        : "Flutter User",
                     endPoints: endPoints,
                     iOSScreenshareConfig: HMSIOSScreenshareConfig(
                         appGroup: "group.flutterhms",