more layout refactor

Author: cynthiajoan

firebase_ai_logic_showcase/lib/demos/chat/chat_demo.dart

@@ -44,6 +44,7 @@ class _ChatDemoState extends ConsumerState<ChatDemo> {
   Uint8List? _attachment;
   final ScrollController _scrollController = ScrollController();
   bool _loading = false;
+  static bool _functionCallDialogShown = false;
 
   @override
   void initState() {
@@ -54,9 +55,12 @@ class _ChatDemoState extends ConsumerState<ChatDemo> {
     _userTextInputController.text =
         'Hey Gemini! Can you set the app color to purple?';
     WidgetsBinding.instance.addPostFrameCallback((_) async {
-      final trigger = await _showFunctionCallDialog();
-      if (mounted && trigger == true) {
-        sendMessage(_userTextInputController.text);
+      if (!_functionCallDialogShown) {
+        _functionCallDialogShown = true;
+        final trigger = await _showFunctionCallDialog();
+        if (mounted && trigger == true) {
+          sendMessage(_userTextInputController.text);
+        }
       }
     });
   }

firebase_ai_logic_showcase/lib/demos/chat_nano/chat_nano_demo.dart

@@ -28,7 +28,8 @@ import '../../shared/ui/chat_components/model_picker.dart';
 import '../../shared/models/models.dart';
 
 class ChatDemoNano extends ConsumerStatefulWidget {
-  const ChatDemoNano({super.key});
+  const ChatDemoNano({super.key, this.isSelected = false});
+  final bool isSelected;
 
   @override
   ConsumerState<ChatDemoNano> createState() => ChatDemoNanoState();
@@ -46,6 +47,7 @@ class ChatDemoNanoState extends ConsumerState<ChatDemoNano> {
   final ScrollController _scrollController = ScrollController();
   bool _loading = false;
   OverlayPortalController opController = OverlayPortalController();
+  static bool _pickerHasBeenShown = false;
 
   @override
   void initState() {
@@ -55,6 +57,26 @@ class ChatDemoNanoState extends ConsumerState<ChatDemoNano> {
     _chatService.init();
     _userTextInputController.text =
         'Hot air balloons rising over the San Francisco Bay at golden hour with a view of the Golden Gate Bridge. Make it anime style.';
+    _checkAndShowPicker();
+  }
+
+  @override
+  void didUpdateWidget(ChatDemoNano oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.isSelected != oldWidget.isSelected) {
+      _checkAndShowPicker();
+    }
+  }
+
+  void _checkAndShowPicker() {
+    if (widget.isSelected && !_pickerHasBeenShown) {
+      _pickerHasBeenShown = true;
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        if (mounted) {
+          showModelPicker();
+        }
+      });
+    }
   }
 
   @override

firebase_ai_logic_showcase/lib/flutter_firebase_ai_demo.dart

@@ -27,34 +27,22 @@ class DemoHomeScreen extends StatefulWidget {
 
 class _DemoHomeScreenState extends State<DemoHomeScreen> {
   int _selectedIndex = 0;
-  final GlobalKey<ChatDemoNanoState> _chatNanoKey = GlobalKey();
-  bool _nanoPickerHasBeenShown = false;
-
-  late final List<Widget> _demoPages;
-
-  @override
-  void initState() {
-    super.initState();
-    _demoPages = <Widget>[
-      const ChatDemo(),
-      const LiveAPIDemo(),
-      const MultimodalDemo(),
-      ChatDemoNano(key: _chatNanoKey),
-    ];
-  }
 
   void _onItemTapped(int index) {
-    if (index == 3 && !_nanoPickerHasBeenShown) {
-      _chatNanoKey.currentState?.showModelPicker();
-      _nanoPickerHasBeenShown = true;
-    }
     setState(() {
       _selectedIndex = index;
     });
   }
 
   @override
   Widget build(BuildContext context) {
+    final List<Widget> demoPages = <Widget>[
+      const ChatDemo(),
+      const LiveAPIDemo(),
+      const MultimodalDemo(),
+      ChatDemoNano(isSelected: _selectedIndex == 3),
+    ];
+
     final List<({Widget icon, String label, Widget? selectedIcon})> destinations = [
       (icon: const Icon(Icons.chat), label: 'Chat', selectedIcon: null),
       (icon: const Icon(Icons.video_chat), label: 'Live API', selectedIcon: null),
@@ -76,7 +64,7 @@ class _DemoHomeScreenState extends State<DemoHomeScreen> {
         if (constraints.maxWidth < 600) {
           // Use BottomNavigationBar for smaller screens
           return Scaffold(
-            body: IndexedStack(index: _selectedIndex, children: _demoPages),
+            body: IndexedStack(index: _selectedIndex, children: demoPages),
             bottomNavigationBar: BottomNavigationBar(
               type: BottomNavigationBarType.fixed,
               items: destinations
@@ -117,7 +105,7 @@ class _DemoHomeScreenState extends State<DemoHomeScreen> {
                 Expanded(
                   child: IndexedStack(
                     index: _selectedIndex,
-                    children: _demoPages,
+                    children: demoPages,
                   ),
                 ),
               ],