kasy-cli 1.34.0 → 1.36.0

package/templates/firebase/test/core/states/user_state_notifier_test.dart

@@ -3,6 +3,7 @@ import 'package:flutter_test/flutter_test.dart';
 import 'package:kasy_kit/core/data/api/http_client.dart';
 import 'package:kasy_kit/core/data/models/user.dart';
 import 'package:kasy_kit/core/data/repositories/user_repository.dart';
+import 'package:kasy_kit/core/shared_preferences/shared_preferences.dart';
 import 'package:kasy_kit/core/states/user_state_notifier.dart';
 import 'package:kasy_kit/environments.dart';
 import 'package:kasy_kit/features/authentication/repositories/authentication_repository.dart';
@@ -66,6 +67,9 @@ void main() {
         ],
       );
 
+      // The notifier touches SharedPreferences (onboarding flag, biometric
+      // reset) during logout/onboarding, so the builder must be initialized.
+      await container.read(sharedPreferencesProvider).init();
       return container;
     }
 
@@ -175,11 +179,14 @@ void main() {
         ],
       );
 
+      // The notifier touches SharedPreferences (onboarding flag, biometric
+      // reset) during logout/onboarding, so the builder must be initialized.
+      await container.read(sharedPreferencesProvider).init();
       return container;
     }
 
     test(
-      'Should load user at startup, user is not connected => login user anonymously with id',
+      'Should load user at startup, no account yet => anonymous guest with no id',
       () async {
         final testContainer = await initTestContainer();
         final userStateNotifier = testContainer.read(
@@ -196,9 +203,40 @@ void main() {
           isA<AnonymousUserData>(),
           reason: 'user should be in unauthenticated state',
         );
+        expect(
+          userStateNotifier.state.user.idOrNull,
+          isNull,
+          reason:
+              'no anonymous account is created eagerly anymore — it is created '
+              'lazily in continueAsGuest (onboarding end / "continue as guest")',
+        );
+      },
+    );
+
+    test(
+      'continueAsGuest => creates anonymous account with id and remembers onboarding',
+      () async {
+        final testContainer = await initTestContainer();
+        final userStateNotifier = testContainer.read(
+          userStateNotifierProvider.notifier,
+        );
+        await userStateNotifier.init();
+        await userStateNotifier.continueAsGuest();
+
+        expect(
+          userStateNotifier.state.user,
+          isA<AnonymousUserData>(),
+          reason: 'guest is anonymous',
+        );
         expect(
           userStateNotifier.state.user.idOrThrow,
           'fake-user-id-anonymous',
+          reason: 'the anonymous account is created on demand here',
+        );
+        expect(
+          testContainer.read(sharedPreferencesProvider).getOnboardingCompleted(),
+          isTrue,
+          reason: 'onboarding is remembered so it is never shown again',
         );
       },
     );
@@ -222,7 +260,7 @@ void main() {
       },
     );
 
-    test('on logout -> user state is anonymous with id', () async {
+    test('on logout -> anonymous guest with no id (no re-signup)', () async {
       final testContainer = await initTestContainer();
       final userStateNotifier = testContainer.read(
         userStateNotifierProvider.notifier,
@@ -238,7 +276,13 @@ void main() {
         isA<AnonymousUserData>(),
         reason: 'user should be anonymous',
       );
-      expect(userStateNotifier.state.user.idOrThrow, 'fake-user-id-anonymous');
+      expect(
+        userStateNotifier.state.user.idOrNull,
+        isNull,
+        reason:
+            'logout must not recreate an anonymous account (would pile up '
+            'orphan users); the user is sent to the sign-in screen instead',
+      );
     });
   });
 }

package/templates/firebase/test/core/web_viewport_scale_test.dart

@@ -0,0 +1,68 @@
+import 'package:flutter_test/flutter_test.dart';
+import 'package:kasy_kit/core/web_viewport_scale.dart';
+
+/// Locks the desktop web scaling behaviour so a future change to the constants or
+/// the formula can't silently regress it. The headline rule, and the bug this
+/// guards against: the desktop compensation must key off the SCREEN width (OS
+/// scale), NOT the window width — merely resizing the browser window must not
+/// shrink the UI; the extra shrink happens only when the screen itself is small.
+void main() {
+  group('webViewportEffectiveScale', () {
+    test('no scaling below the desktop breakpoint (mobile/tablet web == native)',
+        () {
+      // The window width decides the breakpoint (the layout follows the window),
+      // so below it the scale is 1.0 regardless of the screen — same as native
+      // and the device preview.
+      expect(webViewportEffectiveScale(375), 1.0); // phone
+      expect(webViewportEffectiveScale(900), 1.0); // tablet
+      expect(webViewportEffectiveScale(900, screenWidth: 1470), 1.0);
+      expect(
+        webViewportEffectiveScale(kWebViewportScaleDesktopBreakpoint - 1),
+        1.0,
+      );
+    });
+
+    test('desktop on a normal/large screen stays at the flat cap (0.95)', () {
+      // Unknown screen (null) → flat cap.
+      expect(webViewportEffectiveScale(1280), kWebViewportScale);
+      expect(webViewportEffectiveScale(1500), kWebViewportScale);
+      // Known large screen → still the flat cap, no compensation.
+      expect(webViewportEffectiveScale(1100, screenWidth: 1470), kWebViewportScale);
+      expect(webViewportEffectiveScale(1024, screenWidth: 1920), kWebViewportScale);
+    });
+
+    test('resizing the window does NOT change the scale (this is the fix)', () {
+      // Same screen, different window widths → identical scale. The old formula
+      // keyed off the window and shrank here; that was the bug.
+      const screen = 1470.0;
+      expect(
+        webViewportEffectiveScale(1280, screenWidth: screen),
+        webViewportEffectiveScale(1050, screenWidth: screen),
+      );
+      expect(webViewportEffectiveScale(1050, screenWidth: screen), kWebViewportScale);
+    });
+
+    test('high OS scale (small SCREEN) compensates below the cap', () {
+      // Drop below 0.95 only because the screen is small — independent of window.
+      expect(webViewportEffectiveScale(1024, screenWidth: 1024), closeTo(0.80, 1e-4));
+      expect(webViewportEffectiveScale(1097, screenWidth: 1097), closeTo(0.857, 1e-3));
+      // Even a wide window on a small (high-scale) screen compensates.
+      expect(webViewportEffectiveScale(1280, screenWidth: 1024), closeTo(0.80, 1e-4));
+    });
+
+    test('compensation pins the design width to the target on a small screen', () {
+      // scale = screen / target, so screen / scale == target (1280).
+      const screen = 1024.0;
+      final scale = webViewportEffectiveScale(1100, screenWidth: screen);
+      expect(screen / scale, closeTo(kWebViewportScaleTargetWidth, 1e-4));
+    });
+
+    test('the maxScale override is respected as the cap', () {
+      expect(webViewportEffectiveScale(1920, screenWidth: 1920, maxScale: 0.9), 0.9);
+    });
+
+    test('an absurdly small screen is clamped to the 0.5 floor', () {
+      expect(webViewportEffectiveScale(1024, screenWidth: 300), 0.5);
+    });
+  });
+}

package/templates/firebase/test/features/authentication/data/api/auth_api_fake.dart

@@ -166,4 +166,19 @@ class FakeAuthenticationApi implements AuthenticationApi {
 
   @override
   Future<String?> getCurrentUserDisplayName() => Future.value(current != null ? 'Fake User' : null);
+
+  @override
+  Future<String?> getCurrentUserPhotoUrl() => Future.value();
+
+  @override
+  Future<List<String>> getLinkedProviders() => Future.value(const []);
+
+  @override
+  Future<void> setPassword(String password) => Future.value();
+
+  @override
+  Future<List<String>> linkableSocialProviders() => Future.value(const []);
+
+  @override
+  Future<void> linkSocialProvider(String provider) => Future.value();
 }

package/templates/firebase/web/index.html

@@ -24,6 +24,47 @@
   <meta name="apple-mobile-web-app-title" content="kasy">
   <link rel="apple-touch-icon" href="icons/Icon-192.png">
 
+  <!-- Browser chrome color (Safari address bar / status bar tint). Uses the
+       `surface` token — the SAME colour as the app bar that sits directly below
+       the status bar — so there is no seam between the Safari bar and the app bar.
+       Two media-query metas are the reliable baseline: iOS Safari honours these at
+       load and follows the SYSTEM light/dark automatically. At runtime the app
+       appends a higher-priority dynamic meta (web_background_sync_web.dart) so a
+       theme FORCED inside the app (different from the system) is reflected too. -->
+  <meta name="theme-color" content="#FFFFFF" media="(prefers-color-scheme: light)">
+  <meta name="theme-color" content="#18181B" media="(prefers-color-scheme: dark)">
+
+  <script id="theme-pref-fix">
+    // Resolve the theme to apply BEFORE Flutter boots, reading the preference the
+    // app saved (shared_preferences -> localStorage under "flutter.themeMode",
+    // JSON-encoded e.g. "dark"). This drives the splash background + splash logo
+    // via the data-theme attribute (CSS reacts to it reliably). "system" or a
+    // missing value falls back to the OS preference.
+    //
+    // NOTE: this does NOT touch <meta name="theme-color">. iOS Safari ignores
+    // theme-color created/changed via JS and only honours the STATIC media-query
+    // metas above — so removing them made Safari fall back to the page background
+    // (the wrong colour). We keep the static metas as the source of truth for the
+    // Safari status-bar tint; the Flutter sync still appends a dynamic meta for
+    // Chromium-based browsers, which DO honour it.
+    (function () {
+      var mode = 'system';
+      try {
+        var raw = window.localStorage.getItem('flutter.themeMode');
+        if (raw) { mode = JSON.parse(raw); }
+      } catch (e) {}
+      var dark = mode === 'dark'
+        ? true
+        : mode === 'light'
+          ? false
+          : !!(window.matchMedia &&
+               window.matchMedia('(prefers-color-scheme: dark)').matches);
+
+      // Drives the splash background + which splash logo shows (see CSS below).
+      document.documentElement.setAttribute('data-theme', dark ? 'dark' : 'light');
+    })();
+  </script>
+
   <!-- Favicon -->
   <link rel="icon" type="image/png" href="favicon.png">
 
@@ -31,7 +72,7 @@
   <link rel="manifest" href="manifest.json">
   
   
-  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
+  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" name="viewport">
   
   
   
@@ -51,15 +92,60 @@
   
   
   <style id="splash-screen-style">
+    :root { --vh: 1vh; }
+
+    /* iOS Safari sizes the Flutter canvas to documentElement.clientHeight (the
+       <html> box). `height: 100%` mis-resolves there and the canvas renders
+       into a smaller middle band (white bars top/bottom). Pin <html> to the
+       real visible height: 100dvh on Safari 15.4+, the JS-driven --vh on older. */
+    /* IMPORTANT: iOS Safari tints its status bar / address bar with the <body>
+       (and <html>) background-color — it ignores <meta name="theme-color"> once
+       the Flutter canvas covers the viewport. So we paint <html>/<body> with the
+       `surface` token (the app bar colour) to make the Safari bars match the app
+       bar. The splash and the area behind the canvas get the page `background`
+       via the #splash overlay and the Flutter host elements (set in JS), so only
+       the Safari chrome ends up surface-coloured. */
     html {
-      height: 100%
+      height: 100vh;
+      height: 100dvh;
+      height: calc(var(--vh, 1vh) * 100);
+      background-color: #FFFFFF;
     }
 
     body {
       margin: 0;
-      min-height: 100%;
-      background-color: #FAF9FC;
-          background-size: 100% 100%;
+      height: 100vh;
+      height: 100dvh;
+      height: calc(var(--vh, 1vh) * 100);
+      overflow: hidden;
+      overscroll-behavior: none;
+      background-color: #FFFFFF;
+    }
+
+    /* Surface follows the APP theme (data-theme set by the script above),
+       falling back to the system theme when the attribute is absent (JS off). */
+    html[data-theme="dark"], html[data-theme="dark"] body {
+      background-color: #18181B;
+    }
+
+    /* Splash overlay keeps the page `background` colour (NOT surface) so the
+       loading screen still looks right; it covers the viewport until Flutter
+       removes it. */
+    #splash {
+      position: fixed;
+      inset: 0;
+      z-index: 2147483647;
+      background-color: #F5F5F5;
+    }
+    html[data-theme="dark"] #splash {
+      background-color: #060607;
+    }
+
+    /* Flutter host chain (real tag names for the 3.41.x engine) must fill the
+       box so the glass-pane/scene match the now-correct <html> height. */
+    flutter-view, flt-glass-pane, flt-scene-host {
+      width: 100%;
+      height: 100%;
     }
 
     .center {
@@ -108,26 +194,88 @@
       right: 0;
     }
 
+    /* Splash logo: show the light or dark asset per the APP theme (data-theme). */
+    #splash .splash-dark { display: none; }
+    html[data-theme="dark"] #splash .splash-light { display: none; }
+    html[data-theme="dark"] #splash .splash-dark { display: block; }
+
+    /* Fallback when data-theme is absent (JS disabled): follow the system. */
     @media (prefers-color-scheme: dark) {
-      body {
-        background-color: #0C0A14;
-          }
+      html:not([data-theme]), html:not([data-theme]) body {
+        background-color: #18181B;
+      }
+      html:not([data-theme]) #splash { background-color: #060607; }
+      html:not([data-theme]) #splash .splash-light { display: none; }
+      html:not([data-theme]) #splash .splash-dark { display: block; }
     }
   </style>
+  <script id="app-height-fix">
+    // Flutter engine on iOS reads documentElement.clientHeight (not visualViewport)
+    // to size the canvas (full_page_dimensions_provider.dart). On iOS Safari,
+    // window.innerHeight is the "large viewport" (address bar hidden) which is
+    // LARGER than the visible area — causing white bands top/bottom. The correct
+    // value is window.visualViewport.height, which tracks the real visible height.
+    (function () {
+      function visH() {
+        return window.visualViewport ? window.visualViewport.height : window.innerHeight;
+      }
+      function visW() {
+        return window.visualViewport ? window.visualViewport.width : window.innerWidth;
+      }
+
+      // Override clientHeight/Width on the <html> element so the Flutter engine
+      // receives the real visible viewport size on every measurement.
+      try {
+        Object.defineProperty(document.documentElement, 'clientHeight', {
+          configurable: true,
+          get: visH,
+        });
+        Object.defineProperty(document.documentElement, 'clientWidth', {
+          configurable: true,
+          get: visW,
+        });
+      } catch (e) {
+        // If Safari refuses the override, the CSS --vh fallback below takes over.
+      }
+
+      // --vh drives html { height: calc(var(--vh,1vh)*100) } in the CSS above.
+      // This is the CSS-level fallback: even if Object.defineProperty is blocked,
+      // the html element's rendered height equals visualViewport.height, so
+      // clientHeight resolves correctly after layout.
+      function setVh() {
+        document.documentElement.style.setProperty('--vh', (visH() * 0.01) + 'px');
+      }
+      setVh();
+
+      // Keep --vh in sync as the address bar shows/hides.
+      if (window.visualViewport) {
+        window.visualViewport.addEventListener('resize', setVh);
+      }
+      window.addEventListener('resize', setVh);
+      window.addEventListener('orientationchange', function () {
+        // Give the browser 300 ms to settle after rotation before re-measuring.
+        setTimeout(setVh, 300);
+      });
+    })();
+  </script>
   <script id="splash-screen-script">
     function removeSplashFromWeb() {
       document.getElementById("splash")?.remove();
       document.getElementById("splash-branding")?.remove();
-      document.body.style.background = "transparent";
+      // Keep the <body> surface-coloured (do NOT make it transparent): iOS Safari
+      // reads the <body> background-color for its status/address bar tint.
     }
   </script>
 </head>
 <body>
-  <picture id="splash">
-      <source srcset="splash/img/light-1x.png 1x, splash/img/light-2x.png 2x, splash/img/light-3x.png 3x, splash/img/light-4x.png 4x" media="(prefers-color-scheme: light)">
-      <source srcset="splash/img/dark-1x.png 1x, splash/img/dark-2x.png 2x, splash/img/dark-3x.png 3x, splash/img/dark-4x.png 4x" media="(prefers-color-scheme: dark)">
-      <img class="center" aria-hidden="true" src="splash/img/light-1x.png" alt="">
-  </picture>
+  <div id="splash">
+      <img class="center splash-light" aria-hidden="true" alt=""
+           src="splash/img/light-1x.png"
+           srcset="splash/img/light-1x.png 1x, splash/img/light-2x.png 2x, splash/img/light-3x.png 3x, splash/img/light-4x.png 4x">
+      <img class="center splash-dark" aria-hidden="true" alt=""
+           src="splash/img/dark-1x.png"
+           srcset="splash/img/dark-1x.png 1x, splash/img/dark-2x.png 2x, splash/img/dark-3x.png 3x, splash/img/dark-4x.png 4x">
+  </div>
   
   
   

package/templates/firebase/lib/core/guards/user_info_guard.dart

@@ -1,61 +0,0 @@
-import 'package:flutter/foundation.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:kasy_kit/core/config/features.dart';
-import 'package:kasy_kit/core/data/models/user.dart';
-import 'package:kasy_kit/core/guards/guard.dart';
-import 'package:kasy_kit/core/states/user_state_notifier.dart';
-import 'package:kasy_kit/core/theme/theme.dart';
-
-class UserInfosGuard extends ConsumerWidget {
-  final Widget child;
-  final String fallbackRoute;
-
-  const UserInfosGuard({
-    super.key,
-    required this.child,
-    required this.fallbackRoute,
-  });
-
-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final authState = ref.watch(userStateNotifierProvider);
-    if (authState.user.isLoading) {
-      return Material(
-        color: context.colors.background,
-        child: const Center(
-          child: CircularProgressIndicator.adaptive(),
-        ),
-      );
-    }
-
-    // Web: skip onboarding but require sign-in (or explicit guest choice).
-    // The /signin page's "Continue without account" button calls onOnboarded()
-    // which marks isOnboarded=true locally, allowing the guard to pass.
-    if (kIsWeb && withWeb) {
-      return Guard(
-        canActivate: Future.value(
-          authState.user.idOrNull != null || authState.user.isOnboarded,
-        ),
-        fallbackRoute: '/signin',
-        child: child,
-      );
-    }
-
-    // Native: all users (including guests with no ID) go through onboarding.
-    // Guests are never forced to /signin here; individual features that
-    // require authentication redirect to /signin on their own.
-    // Authenticated users skip onboarding: they already committed to an account
-    // (e.g. returning user signing back in after the anonymous session was
-    // discarded by `credential-already-in-use`).
-    return Guard(
-      canActivate: Future.value(
-        !withOnboarding ||
-            authState.user.isOnboarded ||
-            authState.user is AuthenticatedUserData,
-      ),
-      fallbackRoute: fallbackRoute,
-      child: child,
-    );
-  }
-}