kasy-cli 1.21.9 → 1.23.0

package/templates/firebase/lib/features/settings/ui/components/admin/admin_page.dart

@@ -0,0 +1,1193 @@
+import 'package:firebase_messaging/firebase_messaging.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:go_router/go_router.dart';
+import 'package:kasy_kit/components/kasy_app_bar.dart';
+import 'package:kasy_kit/components/kasy_bottom_sheet.dart';
+import 'package:kasy_kit/components/kasy_button.dart';
+import 'package:kasy_kit/components/kasy_status_tag.dart';
+import 'package:kasy_kit/components/kasy_tabs.dart';
+import 'package:kasy_kit/components/kasy_text_field.dart';
+import 'package:kasy_kit/core/config/features.dart';
+import 'package:kasy_kit/core/data/models/user.dart';
+import 'package:kasy_kit/core/dev_inspector/dev_inspector.dart';
+import 'package:kasy_kit/core/rating/widgets/review_popup.dart';
+import 'package:kasy_kit/core/states/user_state_notifier.dart';
+import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/core/toast/toast_service.dart';
+import 'package:kasy_kit/core/web_device_preview/web_device_preview.dart';
+import 'package:kasy_kit/core/widgets/update_bottom_sheet.dart';
+import 'package:kasy_kit/features/feedbacks/api/entities/feature_request_entity.dart';
+import 'package:kasy_kit/features/feedbacks/api/feature_request_api.dart';
+import 'package:kasy_kit/features/notifications/api/local_notifier.dart';
+import 'package:kasy_kit/features/notifications/providers/models/notification.dart'
+    as kasy_kit;
+import 'package:kasy_kit/features/settings/ui/components/admin/admin_routes.dart';
+import 'package:kasy_kit/features/settings/ui/components/admin/admin_users_tab.dart';
+import 'package:kasy_kit/features/settings/ui/widgets/settings_tile.dart';
+import 'package:kasy_kit/i18n/translations.g.dart';
+import 'package:kasy_kit/router.dart';
+import 'package:package_info_plus/package_info_plus.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+
+/// Full-screen developer admin console (debug only).
+///
+/// Vercel-style layout: frosted "Admin" app bar + horizontally-scrollable
+/// underline tabs over a content column that is centred and width-capped so the
+/// console reads as a real dashboard on web/desktop instead of a stretched
+/// phone screen. Replaces the old admin bottom sheet — reached via the
+/// double-tap on the settings version label; popping returns to Settings.
+///
+/// TOP-LEVEL route (sibling of '/', outside the BottomMenu shell) so it never
+/// renders the web sidebar — the admin is a dev tool, not product chrome.
+class AdminPage extends ConsumerStatefulWidget {
+  const AdminPage({super.key});
+
+  @override
+  ConsumerState<AdminPage> createState() => _AdminPageState();
+}
+
+class _AdminPageState extends ConsumerState<AdminPage> {
+  int _tab = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    final bool isAdmin = ref.watch(userStateNotifierProvider).user.isAdmin;
+    final ac = t.admin_console;
+
+    // The console itself opens for admins (even in release) or anyone in debug.
+    if (!isAdmin && !kDebugMode) {
+      return Scaffold(
+        backgroundColor: context.colors.background,
+        body: Column(
+          crossAxisAlignment: CrossAxisAlignment.stretch,
+          children: [
+            const KasyAppBar(title: 'Admin'),
+            Expanded(
+              child: _EmptyState(
+                icon: Icons.lock_outline_rounded,
+                title: ac.tabs.overview,
+                message: ac.requires_admin,
+              ),
+            ),
+          ],
+        ),
+      );
+    }
+
+    // Server-data tabs always present (gated by role inside). Dev tabs (Kit,
+    // Tools) only in debug — they are developer conveniences, not admin data.
+    final List<({String label, Widget view})> entries = [
+      (label: ac.tabs.overview, view: const _OverviewTab()),
+      (label: ac.tabs.users, view: const _UsersTab()),
+      (label: ac.tabs.requests, view: const _RequestsTab()),
+      if (kDebugMode) (label: ac.tabs.kit, view: const _KitTab()),
+      if (kDebugMode) (label: ac.tabs.tools, view: const _ToolsTab()),
+    ];
+    final int tab = _tab.clamp(0, entries.length - 1);
+
+    return Scaffold(
+      backgroundColor: context.colors.background,
+      body: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          const KasyAppBar(title: 'Admin'),
+          const SizedBox(height: KasySpacing.sm),
+          _MaxWidth(
+            child: Padding(
+              padding: const EdgeInsets.symmetric(
+                horizontal: KasySpacing.pageHorizontalGutter,
+              ),
+              child: KasyTabs(
+                tabs: [for (final e in entries) e.label],
+                selectedIndex: tab,
+                onTabSelected: (i) => setState(() => _tab = i),
+                variant: KasyTabsVariant.secondary,
+              ),
+            ),
+          ),
+          Expanded(
+            child: IndexedStack(
+              index: tab,
+              children: [for (final e in entries) e.view],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+/// Live feature requests (active + hidden), highest-voted first — real data for
+/// the Requests tab and the Overview count. Invalidate to refresh after a change.
+final _adminRequestsProvider =
+    FutureProvider.autoDispose<List<FeatureRequestEntity>>((ref) {
+  return ref.read(featureRequestApiProvider).getAll();
+});
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Layout primitives
+// ─────────────────────────────────────────────────────────────────────────────
+
+const double _cardRadius = 18;
+const double _contentMaxWidth = 1080;
+
+/// Centres content and caps its width so the console looks deliberate on wide
+/// web/desktop viewports (mobile fills the screen normally).
+class _MaxWidth extends StatelessWidget {
+  final Widget child;
+  const _MaxWidth({required this.child});
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: ConstrainedBox(
+        constraints: const BoxConstraints(maxWidth: _contentMaxWidth),
+        child: child,
+      ),
+    );
+  }
+}
+
+/// Scrollable, gutter-padded, width-capped body shared by every tab.
+class _TabScroll extends StatelessWidget {
+  final List<Widget> children;
+  const _TabScroll({required this.children});
+
+  @override
+  Widget build(BuildContext context) {
+    return SingleChildScrollView(
+      child: _MaxWidth(
+        child: Padding(
+          padding: EdgeInsets.fromLTRB(
+            KasySpacing.pageHorizontalGutter,
+            KasySpacing.lg,
+            KasySpacing.pageHorizontalGutter,
+            MediaQuery.paddingOf(context).bottom + KasySpacing.xl,
+          ),
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.stretch,
+            children: children,
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+/// Small uppercase label that opens a group (Vercel-style section head).
+class _GroupLabel extends StatelessWidget {
+  final String label;
+  const _GroupLabel(this.label);
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(
+        left: KasySpacing.xs,
+        bottom: KasySpacing.smd,
+      ),
+      child: Text(
+        label.toUpperCase(),
+        style: context.textTheme.labelMedium?.copyWith(
+          fontSize: 12,
+          color: context.colors.muted,
+          letterSpacing: 1.2,
+          fontWeight: FontWeight.w700,
+        ),
+      ),
+    );
+  }
+}
+
+/// Rounded surface card with a hairline border and the design-system shadow.
+class _CardShell extends StatelessWidget {
+  final Widget child;
+  final EdgeInsetsGeometry padding;
+  const _CardShell({
+    required this.child,
+    this.padding = const EdgeInsets.all(KasySpacing.md),
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return DecoratedBox(
+      decoration: BoxDecoration(
+        color: context.colors.surface,
+        borderRadius: BorderRadius.circular(_cardRadius),
+        border: Border.all(
+          color: context.colors.outline.withValues(
+            alpha: context.isDark ? 0.45 : 0.6,
+          ),
+        ),
+        boxShadow: [KasyShadows.component(context)],
+      ),
+      child: Padding(padding: padding, child: child),
+    );
+  }
+}
+
+/// Soft-tinted rounded-square icon container.
+class _IconBubble extends StatelessWidget {
+  final IconData icon;
+  final Color tone;
+  final double size;
+  const _IconBubble({required this.icon, required this.tone, this.size = 40});
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: size,
+      height: size,
+      decoration: BoxDecoration(
+        color: tone.withValues(alpha: context.isDark ? 0.22 : 0.12),
+        borderRadius: BorderRadius.circular(size * 0.3),
+      ),
+      child: Icon(icon, size: size * 0.5, color: tone),
+    );
+  }
+}
+
+/// Metric card: an icon bubble, a big value, and a muted label.
+class _StatCard extends StatelessWidget {
+  final IconData icon;
+  final Color tone;
+  final String value;
+  final String label;
+  const _StatCard({
+    required this.icon,
+    required this.tone,
+    required this.value,
+    required this.label,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return _CardShell(
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          _IconBubble(icon: icon, tone: tone),
+          const SizedBox(height: KasySpacing.smd),
+          Text(
+            value,
+            maxLines: 1,
+            overflow: TextOverflow.ellipsis,
+            style: context.textTheme.headlineSmall?.copyWith(
+              color: context.colors.onSurface,
+              fontWeight: FontWeight.w800,
+              letterSpacing: -0.5,
+            ),
+          ),
+          const SizedBox(height: 2),
+          Text(
+            label,
+            style: context.textTheme.bodySmall?.copyWith(
+              color: context.colors.muted,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+/// Tappable action card: icon bubble + title/subtitle + chevron, with ripple.
+class _ActionCard extends StatelessWidget {
+  final IconData icon;
+  final String title;
+  final String? subtitle;
+  final VoidCallback onTap;
+  final Color? tone;
+  const _ActionCard({
+    required this.icon,
+    required this.title,
+    required this.onTap,
+    this.subtitle,
+    this.tone,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final BorderRadius radius = BorderRadius.circular(_cardRadius);
+    final Color accent = tone ?? context.colors.primary;
+    return DecoratedBox(
+      decoration: BoxDecoration(
+        borderRadius: radius,
+        boxShadow: [KasyShadows.component(context)],
+      ),
+      child: Material(
+        color: context.colors.surface,
+        borderRadius: radius,
+        clipBehavior: Clip.antiAlias,
+        child: InkWell(
+          onTap: onTap,
+          child: Container(
+            decoration: BoxDecoration(
+              borderRadius: radius,
+              border: Border.all(
+                color: context.colors.outline.withValues(
+                  alpha: context.isDark ? 0.45 : 0.6,
+                ),
+              ),
+            ),
+            padding: const EdgeInsets.all(KasySpacing.md),
+            child: Row(
+              children: [
+                _IconBubble(icon: icon, tone: accent),
+                const SizedBox(width: KasySpacing.smd),
+                Expanded(
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Text(
+                        title,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                        style: context.textTheme.titleSmall?.copyWith(
+                          color: context.colors.onSurface,
+                          fontWeight: FontWeight.w700,
+                        ),
+                      ),
+                      if (subtitle != null) ...[
+                        const SizedBox(height: 2),
+                        Text(
+                          subtitle!,
+                          maxLines: 2,
+                          overflow: TextOverflow.ellipsis,
+                          style: context.textTheme.bodySmall?.copyWith(
+                            color: context.colors.muted,
+                            height: 1.3,
+                          ),
+                        ),
+                      ],
+                    ],
+                  ),
+                ),
+                const SizedBox(width: KasySpacing.sm),
+                Icon(
+                  KasyIcons.chevronRight,
+                  size: 18,
+                  color: context.colors.muted,
+                ),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+/// Lays children out in as many equal columns as fit [minItemWidth], capped at
+/// [maxCols]. Collapses to a single full-width column on narrow screens.
+class _ResponsiveGrid extends StatelessWidget {
+  final List<Widget> children;
+  final double minItemWidth;
+  final int maxCols;
+  const _ResponsiveGrid({
+    required this.children,
+    this.minItemWidth = 240,
+    this.maxCols = 4,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    if (children.isEmpty) return const SizedBox.shrink();
+    const double gap = KasySpacing.md;
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final double maxW = constraints.maxWidth;
+        int cols = ((maxW + gap) / (minItemWidth + gap)).floor();
+        cols = cols.clamp(1, maxCols);
+        if (cols > children.length) cols = children.length;
+        final double itemW =
+            cols <= 1 ? maxW : (maxW - gap * (cols - 1)) / cols;
+        return Wrap(
+          spacing: gap,
+          runSpacing: gap,
+          children: [
+            for (final child in children) SizedBox(width: itemW, child: child),
+          ],
+        );
+      },
+    );
+  }
+}
+
+/// Pops the admin page back to Settings — used by actions that historically
+/// closed the bottom sheet so their result is visible over the app.
+void _backToApp(BuildContext context) {
+  if (context.canPop()) context.pop();
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Overview — real project + session data (no vanity metrics)
+// ─────────────────────────────────────────────────────────────────────────────
+
+class _OverviewTab extends ConsumerWidget {
+  const _OverviewTab();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final userState = ref.watch(userStateNotifierProvider);
+    final user = userState.user;
+    final bool isAuth = user is AuthenticatedUserData;
+    final bool isAdmin = user.isAdmin;
+    final ov = t.admin_console.overview;
+    final String account = isAuth ? user.email : ov.guest;
+    final String uid = userState.user.idOrNull ?? '—';
+
+    return _TabScroll(
+      children: [
+        _GroupLabel(ov.section),
+        _ResponsiveGrid(
+          minItemWidth: 200,
+          children: [
+            _StatCard(
+              icon: Icons.cloud_done_rounded,
+              tone: context.colors.primary,
+              value: 'Firebase',
+              label: ov.backend,
+            ),
+            // Feature-request count reads the server — admins only.
+            if (isAdmin)
+              _StatCard(
+                icon: Icons.how_to_vote_rounded,
+                tone: context.colors.primary,
+                value: ref.watch(_adminRequestsProvider).maybeWhen(
+                      data: (l) => '${l.length}',
+                      orElse: () => '…',
+                    ),
+                label: ov.requests_metric,
+              ),
+          ],
+        ),
+        const SizedBox(height: KasySpacing.lg),
+        _GroupLabel(ov.session_title),
+        _CardShell(
+          padding: const EdgeInsets.symmetric(
+            horizontal: KasySpacing.md,
+            vertical: KasySpacing.xs,
+          ),
+          child: Column(
+            children: [
+              _InfoRow(
+                label: ov.account,
+                value: account,
+                valueColor: isAuth ? null : context.colors.muted,
+              ),
+              const SettingsDivider(),
+              _InfoRow(
+                label: ov.user_id,
+                value: uid,
+                trailing: _CopyButton(
+                  onTap: () {
+                    Clipboard.setData(ClipboardData(text: uid));
+                    ref.read(toastProvider).alert(
+                          title: '',
+                          text: t.settings.admin.user_id_copied,
+                        );
+                  },
+                ),
+              ),
+              const SettingsDivider(),
+              FutureBuilder<PackageInfo>(
+                future: PackageInfo.fromPlatform(),
+                builder: (context, snap) => _InfoRow(
+                  label: ov.build,
+                  value: snap.hasData
+                      ? 'v${snap.data!.version} (${snap.data!.buildNumber})'
+                      : '…',
+                ),
+              ),
+            ],
+          ),
+        ),
+        const SizedBox(height: KasySpacing.md),
+        Text(
+          ov.users_hint,
+          style: context.textTheme.bodySmall?.copyWith(
+            color: context.colors.muted,
+          ),
+        ),
+        const SizedBox(height: KasySpacing.xs),
+        Text(
+          ov.debug_note,
+          style: context.textTheme.bodySmall?.copyWith(
+            color: context.colors.muted,
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+class _InfoRow extends StatelessWidget {
+  final String label;
+  final String value;
+  final Color? valueColor;
+  final Widget? trailing;
+  const _InfoRow({
+    required this.label,
+    required this.value,
+    this.valueColor,
+    this.trailing,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: KasySpacing.smd),
+      child: Row(
+        children: [
+          SizedBox(
+            width: 110,
+            child: Text(
+              label,
+              style: context.textTheme.bodyMedium?.copyWith(
+                color: context.colors.muted,
+              ),
+            ),
+          ),
+          const SizedBox(width: KasySpacing.sm),
+          Expanded(
+            child: Text(
+              value,
+              style: context.textTheme.bodyMedium?.copyWith(
+                color: valueColor ?? context.colors.onSurface,
+                fontWeight: FontWeight.w600,
+              ),
+            ),
+          ),
+          if (trailing != null) trailing!,
+        ],
+      ),
+    );
+  }
+}
+
+class _CopyButton extends StatelessWidget {
+  final VoidCallback onTap;
+  const _CopyButton({required this.onTap});
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      onTap: onTap,
+      borderRadius: BorderRadius.circular(KasyRadius.sm),
+      child: Padding(
+        padding: const EdgeInsets.all(6),
+        child: Icon(
+          Icons.content_copy_rounded,
+          size: 16,
+          color: context.colors.primary,
+        ),
+      ),
+    );
+  }
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Empty-state tabs (real content lands next: Users via a server function,
+// Requests reads the live feature_requests collection)
+// ─────────────────────────────────────────────────────────────────────────────
+
+class _EmptyState extends StatelessWidget {
+  final IconData icon;
+  final String title;
+  final String message;
+  const _EmptyState({
+    required this.icon,
+    required this.title,
+    required this.message,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return _TabScroll(
+      children: [
+        _CardShell(
+          padding: const EdgeInsets.symmetric(
+            horizontal: KasySpacing.lg,
+            vertical: KasySpacing.xxl,
+          ),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              _IconBubble(icon: icon, tone: context.colors.primary, size: 64),
+              const SizedBox(height: KasySpacing.md),
+              Text(
+                title,
+                textAlign: TextAlign.center,
+                style: context.textTheme.titleMedium?.copyWith(
+                  fontWeight: FontWeight.w700,
+                  color: context.colors.onSurface,
+                ),
+              ),
+              const SizedBox(height: KasySpacing.xs),
+              Text(
+                message,
+                textAlign: TextAlign.center,
+                style: context.textTheme.bodyMedium?.copyWith(
+                  color: context.colors.muted,
+                  height: 1.45,
+                ),
+              ),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+class _UsersTab extends ConsumerWidget {
+  const _UsersTab();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final bool isAdmin = ref.watch(userStateNotifierProvider).user.isAdmin;
+    final u = t.admin_console.users;
+    if (!isAdmin) {
+      return _EmptyState(
+        icon: Icons.lock_outline_rounded,
+        title: u.title,
+        message: t.admin_console.requires_admin,
+      );
+    }
+    return const AdminUsersTab();
+  }
+}
+
+class _RequestsTab extends ConsumerWidget {
+  const _RequestsTab();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final bool isAdmin = ref.watch(userStateNotifierProvider).user.isAdmin;
+    final r = t.admin_console.requests;
+    if (!isAdmin) {
+      return _EmptyState(
+        icon: Icons.lock_outline_rounded,
+        title: r.title,
+        message: t.admin_console.requires_admin,
+      );
+    }
+    final AsyncValue<List<FeatureRequestEntity>> async =
+        ref.watch(_adminRequestsProvider);
+    return async.when(
+      loading: () => const Center(child: CircularProgressIndicator.adaptive()),
+      error: (_, _) => _EmptyState(
+        icon: KasyIcons.message,
+        title: r.title,
+        message: r.error,
+      ),
+      data: (list) {
+        if (list.isEmpty) {
+          return _EmptyState(
+            icon: KasyIcons.message,
+            title: r.title,
+            message: r.empty,
+          );
+        }
+        return _TabScroll(
+          children: [
+            for (final req in list) ...[
+              _RequestCard(req),
+              const SizedBox(height: KasySpacing.md),
+            ],
+          ],
+        );
+      },
+    );
+  }
+}
+
+/// Picks the value for [lang], falling back to English then anything present.
+String _pickLocale(Map<String, String> m, String lang) =>
+    m[lang] ?? m['en'] ?? (m.isNotEmpty ? m.values.first : '');
+
+class _RequestCard extends ConsumerWidget {
+  final FeatureRequestEntity req;
+  const _RequestCard(this.req);
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final r = t.admin_console.requests;
+    final String lang = Localizations.localeOf(context).languageCode;
+    final String title = _pickLocale(req.title, lang);
+    final String desc = _pickLocale(req.description, lang);
+    final bool active = req.active;
+
+    return _CardShell(
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              _VotesChip(req.votes),
+              const SizedBox(width: KasySpacing.md),
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Text(
+                      title,
+                      maxLines: 2,
+                      overflow: TextOverflow.ellipsis,
+                      style: context.textTheme.titleSmall?.copyWith(
+                        color: context.colors.onSurface,
+                        fontWeight: FontWeight.w700,
+                      ),
+                    ),
+                    const SizedBox(height: 2),
+                    Text(
+                      desc,
+                      maxLines: 3,
+                      overflow: TextOverflow.ellipsis,
+                      style: context.textTheme.bodySmall?.copyWith(
+                        color: context.colors.muted,
+                        height: 1.35,
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+            ],
+          ),
+          const SizedBox(height: KasySpacing.smd),
+          Divider(
+            height: 1,
+            color: context.colors.outline.withValues(alpha: 0.35),
+          ),
+          const SizedBox(height: KasySpacing.sm),
+          Row(
+            children: [
+              KasyStatusTag(
+                label: active ? r.visible : r.hidden,
+                tone: active
+                    ? KasyStatusTagTone.success
+                    : KasyStatusTagTone.neutral,
+              ),
+              const SizedBox(width: KasySpacing.sm),
+              Transform.scale(
+                scale: 0.8,
+                child: Switch.adaptive(
+                  value: active,
+                  materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                  onChanged: (v) async {
+                    await ref
+                        .read(featureRequestApiProvider)
+                        .setActive(req.id!, v);
+                    ref.invalidate(_adminRequestsProvider);
+                    if (context.mounted) {
+                      ref.read(toastProvider).alert(title: '', text: r.saved);
+                    }
+                  },
+                ),
+              ),
+              const Spacer(),
+              KasyButton(
+                label: r.edit,
+                variant: KasyButtonVariant.soft,
+                onPressed: () => _openRequestEditor(context, req),
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+class _VotesChip extends StatelessWidget {
+  final int votes;
+  const _VotesChip(this.votes);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: 48,
+      padding: const EdgeInsets.symmetric(vertical: KasySpacing.sm),
+      decoration: BoxDecoration(
+        color: context.colors.primary.withValues(
+          alpha: context.isDark ? 0.16 : 0.08,
+        ),
+        borderRadius: BorderRadius.circular(KasyRadius.sm),
+        border: Border.all(
+          color: context.colors.primary.withValues(alpha: 0.25),
+        ),
+      ),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Icon(KasyIcons.voteUp, size: 18, color: context.colors.primary),
+          const SizedBox(height: 2),
+          Text(
+            '$votes',
+            style: context.textTheme.labelLarge?.copyWith(
+              color: context.colors.primary,
+              fontWeight: FontWeight.w800,
+              height: 1,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+Future<void> _openRequestEditor(BuildContext context, FeatureRequestEntity req) {
+  return showKasyBlurBottomSheet<void>(
+    context: context,
+    builder: (_) => _RequestEditorSheet(req: req),
+  );
+}
+
+class _RequestEditorSheet extends ConsumerStatefulWidget {
+  final FeatureRequestEntity req;
+  const _RequestEditorSheet({required this.req});
+
+  @override
+  ConsumerState<_RequestEditorSheet> createState() =>
+      _RequestEditorSheetState();
+}
+
+class _RequestEditorSheetState extends ConsumerState<_RequestEditorSheet> {
+  static const List<String> _langs = ['en', 'pt', 'es'];
+  late final Map<String, TextEditingController> _title;
+  late final Map<String, TextEditingController> _desc;
+  bool _saving = false;
+
+  @override
+  void initState() {
+    super.initState();
+    _title = {
+      for (final l in _langs)
+        l: TextEditingController(text: widget.req.title[l] ?? ''),
+    };
+    _desc = {
+      for (final l in _langs)
+        l: TextEditingController(text: widget.req.description[l] ?? ''),
+    };
+  }
+
+  @override
+  void dispose() {
+    for (final c in _title.values) {
+      c.dispose();
+    }
+    for (final c in _desc.values) {
+      c.dispose();
+    }
+    super.dispose();
+  }
+
+  String _langLabel(String l) {
+    final r = t.admin_console.requests;
+    return switch (l) {
+      'en' => r.lang_en,
+      'pt' => r.lang_pt,
+      _ => r.lang_es,
+    };
+  }
+
+  Future<void> _save() async {
+    final r = t.admin_console.requests;
+    setState(() => _saving = true);
+    try {
+      await ref.read(featureRequestApiProvider).updateTexts(
+            id: widget.req.id!,
+            title: {for (final l in _langs) l: _title[l]!.text.trim()},
+            description: {for (final l in _langs) l: _desc[l]!.text.trim()},
+          );
+      ref.invalidate(_adminRequestsProvider);
+      if (!mounted) return;
+      context.pop();
+      ref.read(toastProvider).alert(title: '', text: r.saved);
+    } catch (_) {
+      if (!mounted) return;
+      setState(() => _saving = false);
+      ref.read(toastProvider).alert(title: '', text: r.error);
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final r = t.admin_console.requests;
+    return KasyBottomSheet(
+      title: r.editor_title,
+      addKeyboardInset: true,
+      body: SizedBox(
+        height: MediaQuery.sizeOf(context).height * 0.5,
+        child: SingleChildScrollView(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.stretch,
+            children: [
+              for (final l in _langs) ...[
+                _GroupLabel(_langLabel(l)),
+                KasyTextField(
+                  controller: _title[l],
+                  label: r.field_title,
+                  maxLength: 60,
+                  textInputAction: TextInputAction.next,
+                ),
+                const SizedBox(height: KasySpacing.sm),
+                KasyTextField(
+                  controller: _desc[l],
+                  label: r.field_description,
+                  minLines: 2,
+                  maxLines: 4,
+                  maxLength: 1000,
+                ),
+                const SizedBox(height: KasySpacing.md),
+              ],
+            ],
+          ),
+        ),
+      ),
+      actions: [
+        KasyButton(
+          label: r.save,
+          expand: true,
+          isLoading: _saving,
+          onPressed: _saving ? null : _save,
+        ),
+      ],
+    );
+  }
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Kit — feature demos + the component gallery
+// ─────────────────────────────────────────────────────────────────────────────
+
+class _KitTab extends ConsumerWidget {
+  const _KitTab();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final page = t.home.features_page;
+    final dash = t.home.dashboard;
+    final groups = t.admin_console.groups;
+
+    final List<Widget> features = <Widget>[
+      if (withFeedback)
+        _ActionCard(
+          icon: KasyIcons.message,
+          title: page.feedback_title,
+          subtitle: page.feedback_description,
+          onTap: () => context.push('/feedback'),
+        ),
+      _ActionCard(
+        icon: KasyIcons.notification,
+        title: page.notification_title,
+        subtitle: page.notification_description,
+        onTap: () {
+          final settings = ref.read(notificationsSettingsProvider);
+          final localNotifier = ref.read(localNotifierProvider);
+          kasy_kit.Notification.withData(
+            id: 'fake-id',
+            title: page.notification_demo_title,
+            body: page.notification_demo_body,
+            createdAt: DateTime.now(),
+            notifier: localNotifier,
+            notifierSettings: settings,
+          ).show();
+        },
+      ),
+      _ActionCard(
+        icon: KasyIcons.notificationActive,
+        title: page.send_push_title,
+        subtitle: page.send_push_description,
+        onTap: () => context.push(adminRouteSendPush),
+      ),
+      if (withRevenuecat)
+        _ActionCard(
+          icon: KasyIcons.payment,
+          title: page.paywall_title,
+          subtitle: page.paywall_description,
+          onTap: () => context.push('/premium'),
+        ),
+    ];
+
+    return _TabScroll(
+      children: [
+        _GroupLabel(groups.features),
+        _ResponsiveGrid(minItemWidth: 280, maxCols: 2, children: features),
+        const SizedBox(height: KasySpacing.lg),
+        _GroupLabel(groups.showcase),
+        _ResponsiveGrid(
+          minItemWidth: 280,
+          maxCols: 2,
+          children: [
+            _ActionCard(
+              icon: KasyIcons.widgets,
+              title: dash.components_title,
+              subtitle: dash.components_subtitle,
+              tone: context.colors.success,
+              onTap: () => context.push('/components'),
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Tools — every developer toggle/action migrated from the old admin sheet
+// ─────────────────────────────────────────────────────────────────────────────
+
+class _ToolsTab extends ConsumerWidget {
+  const _ToolsTab();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final userState = ref.watch(userStateNotifierProvider);
+    final admin = t.settings.admin;
+    final groups = t.admin_console.groups;
+
+    final List<Widget> previews = <Widget>[
+      ValueListenableBuilder<bool>(
+        valueListenable: devInspectorEnabledNotifier,
+        builder: (context, enabled, _) {
+          return SettingsSwitchTile(
+            icon: KasyIcons.widgets,
+            title: admin.inspector_fab_title,
+            subtitle:
+                '${admin.inspector_fab_subtitle_prefix} ${devInspectorShortcutLabel()}',
+            value: enabled,
+            onChanged: (v) async {
+              final p = await SharedPreferences.getInstance();
+              await p.setBool(devInspectorEnabledPrefKey, v);
+              devInspectorEnabledNotifier.value = v;
+              if (v && context.mounted) _backToApp(context);
+            },
+          );
+        },
+      ),
+      if (kIsWeb)
+        ValueListenableBuilder<bool>(
+          valueListenable: webDevicePreviewEnabledNotifier,
+          builder: (context, enabled, _) {
+            return SettingsSwitchTile(
+              icon: KasyIcons.phoneAndroid,
+              title: admin.device_preview_title,
+              subtitle:
+                  '${admin.inspector_fab_subtitle_prefix} ${webDevicePreviewShortcutLabel()}',
+              value: enabled,
+              onChanged: (v) async {
+                final p = await SharedPreferences.getInstance();
+                await p.setBool(webDevicePreviewEnabledPrefKey, v);
+                webDevicePreviewEnabledNotifier.value = v;
+                if (v && context.mounted) _backToApp(context);
+              },
+            );
+          },
+        ),
+    ];
+
+    final List<Widget> tools = <Widget>[
+      _ActionCard(
+        icon: KasyIcons.note,
+        title: admin.update_bottom_sheet,
+        onTap: () {
+          _backToApp(context);
+          showUpdateBottomSheet(
+            context: navigatorKey.currentContext!,
+            version: '0.0.0',
+          );
+        },
+      ),
+      _ActionCard(
+        icon: KasyIcons.payment,
+        title: admin.paywalls,
+        onTap: () => context.push(adminRoutePaywalls),
+      ),
+      _ActionCard(
+        icon: KasyIcons.check,
+        title: admin.test_onboarding,
+        onTap: () => ref.read(goRouterProvider).go('/onboarding'),
+      ),
+      _ActionCard(
+        icon: KasyIcons.notificationActive,
+        title: admin.send_push_title,
+        onTap: () => context.push(adminRouteSendPush),
+      ),
+      _ActionCard(
+        icon: KasyIcons.star,
+        title: admin.ask_review,
+        onTap: () => showReviewDialog(context, ref, force: true),
+      ),
+      _ActionCard(
+        icon: KasyIcons.message,
+        title: admin.home_widgets_panel,
+        onTap: () => context.push(adminRouteHomeWidgets),
+      ),
+    ];
+
+    final List<Widget> identity = <Widget>[
+      _ActionCard(
+        icon: KasyIcons.person,
+        title: admin.copy_user_id,
+        onTap: () {
+          Clipboard.setData(
+            ClipboardData(text: userState.user.idOrNull ?? 'no-id (guest)'),
+          );
+          ref.read(toastProvider).alert(title: '', text: admin.user_id_copied);
+        },
+      ),
+      _ActionCard(
+        icon: KasyIcons.notification,
+        title: admin.copy_fcm_token,
+        onTap: () async {
+          final token = await FirebaseMessaging.instance.getToken();
+          if (token == null) {
+            ref.read(toastProvider).alert(
+                  title: '',
+                  text: admin.fcm_token_unavailable,
+                );
+            return;
+          }
+          await Clipboard.setData(ClipboardData(text: token));
+          ref.read(toastProvider).alert(title: '', text: admin.fcm_token_copied);
+        },
+      ),
+      _ActionCard(
+        icon: KasyIcons.notificationActive,
+        title: admin.ask_notification,
+        onTap: () => ref.read(notificationsSettingsProvider).askPermission(),
+      ),
+    ];
+
+    return _TabScroll(
+      children: [
+        _GroupLabel(groups.preview),
+        _CardShell(
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              for (int i = 0; i < previews.length; i++) ...[
+                if (i > 0) const SettingsDivider(),
+                previews[i],
+              ],
+            ],
+          ),
+        ),
+        const SizedBox(height: KasySpacing.lg),
+        _GroupLabel(groups.debug_actions),
+        _ResponsiveGrid(minItemWidth: 280, maxCols: 2, children: tools),
+        const SizedBox(height: KasySpacing.lg),
+        _GroupLabel(groups.identity),
+        _ResponsiveGrid(minItemWidth: 280, maxCols: 2, children: identity),
+      ],
+    );
+  }
+}