Simulator #9

Author: SaadArdati

lib/src/transformers/node_transformers/passive_app_bar_transformer.dart

@@ -5,6 +5,11 @@ import 'package:flutter/material.dart';
 import '../../../codelessly_sdk.dart';
 import '../../functions/functions_repository.dart';
 
+typedef TriggerAction = void Function(
+  BuildContext context,
+  List<Reaction> reactions,
+);
+
 class PassiveAppBarTransformer extends NodeWidgetTransformer<AppBarNode> {
   PassiveAppBarTransformer(super.getNode, super.manager);
 
@@ -21,8 +26,7 @@ class PassiveAppBarTransformer extends NodeWidgetTransformer<AppBarNode> {
     return PassiveAppBarWidget(
       node: node,
       settings: settings,
-      onLeadingPressed: onTriggerAction,
-      onActionPressed: onTriggerAction,
+      onTriggerAction: onTriggerAction,
     );
   }
 
@@ -37,60 +41,91 @@ class PassiveAppBarTransformer extends NodeWidgetTransformer<AppBarNode> {
   }) {
     final Widget? leading = node.properties.leading.icon.show &&
             !node.properties.automaticallyImplyLeading
-        ? retrieveIconWidget(node.properties.leading.icon, null)
+        ? retrieveIconWidget(
+            node.properties.leading.icon,
+            node.properties.leading.icon.size,
+          )
         : null;
 
     final Widget? title = node.properties.title.trim().isEmpty
         ? null
         : TextUtils.buildText(
             context,
             node.properties.title,
-            textAlignHorizontal: null,
-            maxLines: null,
-            overflow: null,
+            fontSize: node.properties.titleStyle.fontSize,
             node: node,
             variablesOverrides: variablesOverrides,
             nullSubstitutionMode: settings.nullSubstitutionMode,
             replaceVariablesWithSymbol: settings.replaceVariablesWithSymbols,
           );
     return AppBar(
       centerTitle: node.properties.centerTitle,
+      automaticallyImplyLeading: node.properties.leading.icon.show
+          ? node.properties.automaticallyImplyLeading
+          : false,
       leading: leading != null
-          ? IconButton(
-              onPressed: () => onTriggerAction.call(
-                  context, node.properties.leading.reactions),
-              icon: leading,
+          ? Center(
+              child: buildIconOrButton(
+                context,
+                icon: leading,
+                size: node.properties.leading.icon.size,
+                tooltip: node.properties.leading.tooltip,
+                reactions: node.properties.leading.reactions,
+              ),
             )
           : null,
+      title: title,
       titleTextStyle: TextUtils.retrieveTextStyleFromProp(
         node.properties.titleStyle,
         effects: const [],
       ),
+      titleSpacing: node.properties.titleSpacing,
+      // TODO(Saad,Birju): Make surfaceTintColor a property of the AppBarNode.
+      surfaceTintColor: node.properties.backgroundColor.toFlutterColor(),
       backgroundColor: node.properties.backgroundColor.toFlutterColor(),
       elevation: node.properties.elevation,
-      automaticallyImplyLeading: node.properties.leading.icon.show
-          ? node.properties.automaticallyImplyLeading
-          : false,
-      title: title,
       foregroundColor:
           node.properties.titleStyle.fills.firstOrNull?.toFlutterColor(),
-      titleSpacing: node.properties.titleSpacing,
       shadowColor: node.properties.shadowColor.toFlutterColor(),
       actions: [
         for (final item
             in node.properties.actions.whereType<IconAppBarActionItem>())
-          IconButton(
-            onPressed: () => onTriggerAction.call(context, item.reactions),
-            // splashRadius: 20,
-            iconSize: item.icon.size,
-            tooltip: item.tooltip,
+          buildIconOrButton(
+            context,
             icon: retrieveIconWidget(item.icon, item.icon.size) ??
                 const SizedBox.shrink(),
+            size: item.icon.size,
+            tooltip: item.tooltip,
+            reactions: item.reactions,
           ),
       ],
     );
   }
 
+  Widget buildIconOrButton(
+    BuildContext context, {
+    required Widget icon,
+    required double? size,
+    required String? tooltip,
+    required List<Reaction> reactions,
+  }) {
+    final bool hasReactions = reactions
+        .where(
+          (reaction) => reaction.trigger.type == TriggerType.click,
+        )
+        .isNotEmpty;
+    if (hasReactions) {
+      return IconButton(
+        onPressed: () => onTriggerAction.call(context, reactions),
+        icon: icon,
+        iconSize: size,
+        tooltip: tooltip,
+      );
+    } else {
+      return icon;
+    }
+  }
+
   void onTriggerAction(BuildContext context, List<Reaction> reactions) async {
     final bool executed = await FunctionsRepository.triggerAction(
         context, reactions: reactions, TriggerType.click);
@@ -159,25 +194,45 @@ class PassiveAppBarWidget extends StatelessWidget
   final AppBarNode node;
   final double? elevation;
   final WidgetBuildSettings settings;
-  final Function(BuildContext context, List<Reaction> reactions)?
-      onLeadingPressed;
-  final Function(BuildContext context, List<Reaction> reactions)?
-      onActionPressed;
+  final TriggerAction? onTriggerAction;
   final List<VariableData> variablesOverrides;
 
   const PassiveAppBarWidget({
     super.key,
     required this.node,
     required this.settings,
     this.elevation,
-    this.onLeadingPressed,
-    this.onActionPressed,
+    this.onTriggerAction,
     this.variablesOverrides = const [],
   });
 
   @override
   Size get preferredSize => node.outerBoxLocal.size.flutterSize;
 
+  Widget buildIconOrButton(
+    BuildContext context, {
+    required Widget icon,
+    required double? size,
+    required String? tooltip,
+    required List<Reaction> reactions,
+  }) {
+    final bool hasReactions = reactions
+        .where(
+          (reaction) => reaction.trigger.type == TriggerType.click,
+        )
+        .isNotEmpty;
+    if (hasReactions && onTriggerAction != null) {
+      return IconButton(
+        onPressed: () => onTriggerAction!.call(context, reactions),
+        icon: icon,
+        iconSize: size,
+        tooltip: tooltip,
+      );
+    } else {
+      return icon;
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
     final Widget? leading = node.properties.leading.icon.show &&
@@ -190,9 +245,7 @@ class PassiveAppBarWidget extends StatelessWidget
         : TextUtils.buildText(
             context,
             node.properties.title,
-            textAlignHorizontal: null,
-            maxLines: null,
-            overflow: null,
+            fontSize: node.properties.titleStyle.fontSize,
             node: node,
             variablesOverrides: variablesOverrides,
             nullSubstitutionMode: settings.nullSubstitutionMode,
@@ -201,18 +254,26 @@ class PassiveAppBarWidget extends StatelessWidget
     return AdaptiveNodeBox(
       node: node,
       child: AppBar(
+        toolbarHeight: node.middleBoxLocal.height,
         centerTitle: node.properties.centerTitle,
+        leadingWidth: node.properties.leading.icon.size,
         leading: leading != null
-            ? IconButton(
-                onPressed: () => onLeadingPressed?.call(
-                    context, node.properties.leading.reactions),
-                icon: leading,
+            ? Center(
+                child: buildIconOrButton(
+                  context,
+                  icon: leading,
+                  size: node.properties.leading.icon.size,
+                  tooltip: node.properties.leading.tooltip,
+                  reactions: node.properties.leading.reactions,
+                ),
               )
             : null,
         titleTextStyle: TextUtils.retrieveTextStyleFromProp(
           node.properties.titleStyle,
           effects: const [],
         ),
+        // TODO(Saad,Birju): Make surfaceTintColor a property of the AppBarNode.
+        surfaceTintColor: node.properties.backgroundColor.toFlutterColor(),
         backgroundColor: node.properties.backgroundColor.toFlutterColor(),
         elevation: elevation ?? node.properties.elevation,
         automaticallyImplyLeading: node.properties.leading.icon.show
@@ -226,13 +287,13 @@ class PassiveAppBarWidget extends StatelessWidget
         actions: [
           for (final item
               in node.properties.actions.whereType<IconAppBarActionItem>())
-            IconButton(
-              onPressed: () => onActionPressed?.call(context, item.reactions),
-              // splashRadius: 20,
-              iconSize: item.icon.size,
-              tooltip: item.tooltip,
+            buildIconOrButton(
+              context,
               icon: retrieveIconWidget(item.icon, item.icon.size) ??
                   const SizedBox.shrink(),
+              size: item.icon.size,
+              tooltip: item.tooltip,
+              reactions: item.reactions,
             ),
         ],
       ),