kasy-cli 1.31.9 → 1.31.10

package/templates/firebase/lib/core/web_device_preview/web_device_preview.dart

@@ -533,7 +533,9 @@ class _DeviceSwitchBridgeState extends State<_DeviceSwitchBridge> {
   void _onFrameVisibleChanged() {
     if (!mounted) return;
     final store = Provider.of<DevicePreviewStore>(context, listen: false);
-    if (store.data.isFrameVisible != widget.frameVisibleNotifier.value) {
+    final data = _readData(store);
+    if (data == null) return;
+    if (data.isFrameVisible != widget.frameVisibleNotifier.value) {
       store.toggleFrame();
     }
   }
@@ -543,11 +545,31 @@ class _DeviceSwitchBridgeState extends State<_DeviceSwitchBridge> {
   void _syncOrientation() {
     if (!mounted) return;
     final store = Provider.of<DevicePreviewStore>(context, listen: false);
+    final data = _readData(store);
+    if (data == null) {
+      // DevicePreview initializes asynchronously (it loads saved preferences), so
+      // on the first web frame the store can still be uninitialized and reading
+      // store.data throws "Not initialized". Retry next frame instead of surfacing
+      // a scary (and harmless) exception in the console.
+      WidgetsBinding.instance.addPostFrameCallback((_) => _syncOrientation());
+      return;
+    }
     final target = widget.landscapeNotifier.value
         ? Orientation.landscape
         : Orientation.portrait;
-    if (store.data.orientation != target) {
-      store.data = store.data.copyWith(orientation: target);
+    if (data.orientation != target) {
+      store.data = data.copyWith(orientation: target);
+    }
+  }
+
+  /// [DevicePreviewStore.data] throws while the store is still finishing its async
+  /// initialization. Returns null instead of throwing so callers can skip or retry
+  /// cleanly (see _syncOrientation).
+  DevicePreviewData? _readData(DevicePreviewStore store) {
+    try {
+      return store.data;
+    } catch (_) {
+      return null;
     }
   }
 

package/templates/firebase/lib/features/home/home_feed.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:kasy_kit/components/kasy_app_bar.dart';
 import 'package:kasy_kit/components/kasy_card.dart';
 import 'package:kasy_kit/core/haptics/kasy_haptics.dart';
 import 'package:kasy_kit/core/theme/theme.dart';
@@ -213,7 +214,12 @@ class _HomeFeedState extends State<HomeFeed> {
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: <Widget>[
-          const SizedBox(height: KasySpacing.belowChromeContentGap),
+          // App bar inset lives INSIDE the scroll so it scrolls away and the
+          // feed slides under the frosted bar (overlay pattern).
+          SizedBox(
+            height: kasyAppBarBodyTopOverlap(context) +
+                KasySpacing.belowChromeContentGap,
+          ),
           _FilterRow(selected: _selected, onSelect: _select),
           const SizedBox(height: KasySpacing.lg),
           Padding(

package/templates/firebase/lib/features/home/home_page.dart

@@ -31,14 +31,11 @@ class HomePage extends ConsumerWidget {
         color: context.colors.background,
         child: Stack(
           children: [
-            Positioned.fill(
-              child: Padding(
-                padding: EdgeInsets.only(
-                  top: kasyAppBarBodyTopOverlap(context),
-                ),
-                child: const HomeFeed(),
-              ),
-            ),
+            // True overlay: the feed fills the whole height and scrolls UNDER
+            // the frosted app bar (the bar's top inset lives inside the feed's
+            // scroll, so it scrolls away). This way, when the bar hides on
+            // scroll, content already fills the top — no empty app-bar band.
+            const Positioned.fill(child: HomeFeed()),
             Positioned(
               top: 0,
               left: 0,
@@ -46,6 +43,7 @@ class HomePage extends ConsumerWidget {
               child: KasyAppBar(
                 title: t.home.dashboard.brand,
                 style: KasyAppBarStyle.rootTab,
+                hideOnScroll: true,
                 onThemeToggle: () {
                   KasyHaptics.light(context);
                   ThemeProvider.of(context).toggle();

package/templates/firebase/lib/features/notifications/ui/notifications_page.dart

@@ -105,6 +105,7 @@ class _NotificationsPageState extends ConsumerState<NotificationsPage> {
     return KasyOverlayScaffold(
       title: t.notifications.title,
       appBarStyle: KasyAppBarStyle.rootTab,
+      hideAppBarOnScroll: true,
       scrollController: _scrollController,
       trailing: Builder(
         builder: (ctx) => Row(

package/templates/firebase/lib/features/settings/settings_page.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:go_router/go_router.dart';
 import 'package:kasy_kit/components/components.dart';
+import 'package:kasy_kit/core/chrome/chrome_visibility.dart';
 import 'package:kasy_kit/core/config/features.dart';
 import 'package:kasy_kit/core/data/models/user.dart';
 import 'package:kasy_kit/core/haptics/haptic_feedback_notifier.dart';
@@ -41,6 +42,7 @@ class SettingsPage extends ConsumerWidget {
     return KasyOverlayScaffold(
       title: tr.title,
       appBarStyle: KasyAppBarStyle.rootTab,
+      hideAppBarOnScroll: true,
       trailing: Builder(
         builder: (ctx) => KasyChromeOrbIconButton(
           icon: KasyIcons.logout,
@@ -118,6 +120,10 @@ class SettingsPage extends ConsumerWidget {
             const SettingsDivider(),
             const HapticFeedbackSwitcher(),
             const SettingsDivider(),
+            if (kShowHideChromeOnScrollSetting) ...[
+              const HideChromeOnScrollSwitcher(),
+              const SettingsDivider(),
+            ],
             const LanguageSwitcher(),
             if (withLocalReminders) ...[
               const SettingsDivider(),
@@ -641,6 +647,10 @@ class _DesktopDetail extends ConsumerWidget {
                 const SettingsDivider(),
                 const HapticFeedbackSwitcher(),
                 const SettingsDivider(),
+                if (kShowHideChromeOnScrollSetting) ...[
+                  const HideChromeOnScrollSwitcher(),
+                  const SettingsDivider(),
+                ],
                 const LanguageSwitcher(),
                 if (withLocalReminders) ...[
                   const SettingsDivider(),
@@ -953,6 +963,22 @@ class HapticFeedbackSwitcher extends ConsumerWidget {
   }
 }
 
+class HideChromeOnScrollSwitcher extends ConsumerWidget {
+  const HideChromeOnScrollSwitcher({super.key});
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final isEnabled = ref.watch(hideChromeOnScrollProvider);
+    return SettingsSwitchTile(
+      icon: KasyIcons.eyeOff,
+      title: context.t.settings.hide_chrome_on_scroll_title,
+      value: isEnabled,
+      onChanged: (_) =>
+          ref.read(hideChromeOnScrollProvider.notifier).toggle(),
+    );
+  }
+}
+
 class ThemeSwitcher extends StatelessWidget {
   const ThemeSwitcher({super.key});
 

package/templates/firebase/lib/features/subscriptions/ui/component/paywall_minimal.dart

@@ -4,6 +4,7 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:kasy_kit/components/components.dart';
 import 'package:kasy_kit/core/data/models/subscription.dart';
 import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/core/widgets/responsive_layout.dart';
 import 'package:kasy_kit/features/subscriptions/ui/component/premium_page_factory.dart';
 import 'package:kasy_kit/features/subscriptions/ui/widgets/paywall_empty_state.dart';
 import 'package:kasy_kit/features/subscriptions/ui/widgets/premium_background_gradient.dart';
@@ -15,6 +16,10 @@ import 'package:kasy_kit/i18n/translations.g.dart';
 
 /// Minimal paywall: benefits list + single CTA.
 /// Best for apps with one plan or when you want a clean, focused layout.
+///
+/// Responsive: on phones (small) it fills the screen with the CTA pinned to the
+/// bottom. On tablet/desktop (medium+) the content is centered in a max-width
+/// column so it never stretches edge-to-edge or leaves a big empty gap.
 class PaywallMinimal extends StatelessWidget {
   final List<SubscriptionProduct> offers;
   final SubscriptionProduct? selectedOffer;
@@ -23,6 +28,10 @@ class PaywallMinimal extends StatelessWidget {
   final OnTap? onTapRestore;
   final OnTap? onSkip;
 
+  /// Max content width on tablet/desktop. Keeps the paywall readable and
+  /// centered instead of stretched across a wide viewport.
+  static const double _maxContentWidth = 460;
+
   const PaywallMinimal({
     super.key,
     required this.offers,
@@ -42,105 +51,175 @@ class PaywallMinimal extends StatelessWidget {
       return PaywallEmptyState(onTapRestore: onTapRestore, onSkip: onSkip);
     }
 
+    return Scaffold(
+      backgroundColor: context.colors.primary,
+      body: PremiumBackgroundGradient(
+        child: SafeArea(
+          child: LayoutBuilder(
+            builder: (context, constraints) {
+              final bool compact =
+                  DeviceType.fromWidth(constraints.maxWidth) == DeviceType.small;
+              return compact ? _compactLayout(context) : _wideLayout(context);
+            },
+          ),
+        ),
+      ),
+    );
+  }
+
+  // --- Phone: full-height column, CTA pinned to the bottom. -----------------
+  Widget _compactLayout(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(
+        horizontal: KasySpacing.pageHorizontalGutter,
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          Align(alignment: Alignment.topRight, child: _closeButton()),
+          const SizedBox(height: KasySpacing.lg),
+          _title(context),
+          const SizedBox(height: KasySpacing.lg),
+          ..._features(context),
+          const Spacer(),
+          _price(context),
+          const SizedBox(height: KasySpacing.smd),
+          _cta(context),
+          const SizedBox(height: KasySpacing.md),
+          _bottomMenu(context),
+          const SizedBox(height: KasySpacing.lg),
+        ],
+      ),
+    );
+  }
+
+  // --- Tablet/Desktop: centered max-width column, close pinned to corner. ---
+  Widget _wideLayout(BuildContext context) {
+    return Stack(
+      children: [
+        Center(
+          child: ConstrainedBox(
+            constraints: const BoxConstraints(maxWidth: _maxContentWidth),
+            child: SingleChildScrollView(
+              padding: const EdgeInsets.symmetric(
+                horizontal: KasySpacing.lg,
+                vertical: KasySpacing.xxl,
+              ),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.stretch,
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  _title(context),
+                  const SizedBox(height: KasySpacing.xl),
+                  ..._features(context),
+                  const SizedBox(height: KasySpacing.xl),
+                  _price(context),
+                  const SizedBox(height: KasySpacing.smd),
+                  _cta(context),
+                  const SizedBox(height: KasySpacing.md),
+                  _bottomMenu(context),
+                ],
+              ),
+            ),
+          ),
+        ),
+        Positioned(
+          top: KasySpacing.sm,
+          right: KasySpacing.md,
+          child: _closeButton(),
+        ),
+      ],
+    );
+  }
+
+  // --- Shared content blocks (same widgets across breakpoints). -------------
+
+  Widget _closeButton() => AppCloseButton(onTap: () => onSkip?.call());
+
+  Widget _title(BuildContext context) {
+    return Animate(
+      effects: const [
+        FadeEffect(
+          delay: Duration(milliseconds: 100),
+          duration: Duration(milliseconds: 300),
+        ),
+      ],
+      child: Text(
+        Translations.of(context).premium.title_1,
+        textAlign: TextAlign.center,
+        style: GoogleFonts.albertSans(
+          fontSize: 28,
+          fontWeight: FontWeight.w700,
+          color: context.colors.onPrimary,
+          letterSpacing: -0.8,
+        ),
+      ),
+    );
+  }
+
+  List<Widget> _features(BuildContext context) {
     final translations = Translations.of(context).premium;
     final features = [
       translations.feature_1,
       translations.feature_2,
       translations.feature_3,
     ];
+    return [
+      ...AnimateList(
+        interval: 120.ms,
+        delay: 300.ms,
+        effects: [FadeEffect(duration: 300.ms)],
+        children: features.map((text) => PremiumFeature(text: text)).toList(),
+      ),
+    ];
+  }
 
-    return Scaffold(
-      backgroundColor: context.colors.primary,
-      body: PremiumBackgroundGradient(
-        child: SafeArea(
-          child: Padding(
-            padding: const EdgeInsets.symmetric(
-              horizontal: KasySpacing.pageHorizontalGutter,
-            ),
-            child: Column(
-              crossAxisAlignment: CrossAxisAlignment.stretch,
-              children: [
-                Align(
-                  alignment: Alignment.topRight,
-                  child: AppCloseButton(onTap: () => onSkip?.call()),
-                ),
-                const SizedBox(height: KasySpacing.lg),
-                Animate(
-                  effects: const [
-                    FadeEffect(
-                      delay: Duration(milliseconds: 100),
-                      duration: Duration(milliseconds: 300),
-                    ),
-                  ],
-                  child: Text(
-                    translations.title_1,
-                    textAlign: TextAlign.center,
-                    style: GoogleFonts.albertSans(
-                      fontSize: 28,
-                      fontWeight: FontWeight.w700,
-                      color: context.colors.onPrimary,
-                      letterSpacing: -0.8,
-                    ),
-                  ),
-                ),
-                const SizedBox(height: KasySpacing.lg),
-                ...AnimateList(
-                  interval: 120.ms,
-                  delay: 300.ms,
-                  effects: [FadeEffect(duration: 300.ms)],
-                  children: features
-                      .map((text) => PremiumFeature(text: text))
-                      .toList(),
-                ),
-                const Spacer(),
-                Animate(
-                  effects: const [
-                    FadeEffect(
-                      delay: Duration(milliseconds: 400),
-                      duration: Duration(milliseconds: 300),
-                    ),
-                    ScaleEffect(
-                      delay: Duration(milliseconds: 400),
-                      duration: Duration(milliseconds: 500),
-                      curve: Curves.easeOut,
-                    ),
-                  ],
-                  child: Text(
-                    _effectiveOffer.formattedPrice(context),
-                    textAlign: TextAlign.center,
-                    style: context.textTheme.titleLarge?.copyWith(
-                      fontWeight: FontWeight.w600,
-                      color: context.colors.onPrimary,
-                    ),
-                  ),
-                ),
-                const SizedBox(height: KasySpacing.smd),
-                Animate(
-                  effects: const [
-                    FadeEffect(
-                      delay: Duration(milliseconds: 500),
-                      duration: Duration(milliseconds: 300),
-                    ),
-                  ],
-                  child: KasyButton(
-                    label: translations.action_button,
-                    variant: KasyButtonVariant.inverse,
-                    isLoading: onTap == null,
-                    expand: true,
-                    onPressed: onTap,
-                  ),
-                ),
-                const SizedBox(height: KasySpacing.md),
-                BottomPremiumMenu(
-                  textColor: context.colors.onPrimary,
-                  onTapRestore: onTapRestore,
-                ),
-                const SizedBox(height: KasySpacing.lg),
-              ],
-            ),
-          ),
+  Widget _price(BuildContext context) {
+    return Animate(
+      effects: const [
+        FadeEffect(
+          delay: Duration(milliseconds: 400),
+          duration: Duration(milliseconds: 300),
+        ),
+        ScaleEffect(
+          delay: Duration(milliseconds: 400),
+          duration: Duration(milliseconds: 500),
+          curve: Curves.easeOut,
+        ),
+      ],
+      child: Text(
+        _effectiveOffer.formattedPrice(context),
+        textAlign: TextAlign.center,
+        style: context.textTheme.titleLarge?.copyWith(
+          fontWeight: FontWeight.w600,
+          color: context.colors.onPrimary,
+        ),
+      ),
+    );
+  }
+
+  Widget _cta(BuildContext context) {
+    return Animate(
+      effects: const [
+        FadeEffect(
+          delay: Duration(milliseconds: 500),
+          duration: Duration(milliseconds: 300),
         ),
+      ],
+      child: KasyButton(
+        label: Translations.of(context).premium.action_button,
+        variant: KasyButtonVariant.inverse,
+        isLoading: onTap == null,
+        expand: true,
+        onPressed: onTap,
       ),
     );
   }
+
+  Widget _bottomMenu(BuildContext context) {
+    return BottomPremiumMenu(
+      textColor: context.colors.onPrimary,
+      onTapRestore: onTapRestore,
+    );
+  }
 }