comunes/tane
1
0
Fork 0
Code Issues Pull requests Projects Releases 7 Packages Wiki Activity Actions

feat(shell): home menu + navigation drawer (mockups 02/03)

Browse source 
The app now opens on a main menu instead of straight into the list:
- HomeScreen (mockup 02): sprout logo over a faint seed-glyph watermark, with
  big "Your inventory" (→ /inventory) and "Open market" (Block 2, "coming soon")
  destinations.
- AppDrawer (mockup 03): Inventory is live; the social items (market, profile,
  chat, wishlist, following, settings) are shown disabled with a "coming soon"
  tag so the roadmap is visible. Drawer is available on home and inventory.
- Routing: / → home, /inventory → list, /variety/:id → detail.

Tests: home shows the menu + navigates; drawer opens + navigates. quick-add flow
updated to go home → inventory. 50 green; Linux runs.
This commit is contained in:
vjrj 2026-07-08 12:22:42 +02:00
parent 17073dd560
commit 02a9d5bf39
11 changed files with 472 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

9
apps/app_seeds/lib/app.dart
View file

@ -8,13 +8,13 @@ import 'data/variety_repository.dart';
import 'i18n/strings.g.dart';
import 'state/inventory_cubit.dart';
import 'state/variety_detail_cubit.dart';
import 'ui/home_screen.dart';
import 'ui/inventory_list_screen.dart';
import 'ui/theme.dart';
import 'ui/variety_detail_screen.dart';
/// Root widget. Provides the repository + inventory cubit to the tree and wires
/// go_router. The list is `/`; `/variety/:id` is a placeholder detail route
/// (the full item screen is a follow-on story).
/// Root widget. Provides the repositories to the tree and wires go_router:
/// `/` is the home menu, `/inventory` the list, `/variety/:id` the item detail.
class TaneApp extends StatelessWidget {
TaneApp({required this.repository, required this.species, super.key})
: _router = _buildRouter(repository);
@ -26,8 +26,9 @@ class TaneApp extends StatelessWidget {
static GoRouter _buildRouter(VarietyRepository repository) {
return GoRouter(
routes: [
GoRoute(path: '/', builder: (context, state) => const HomeScreen()),
GoRoute(
path: '/',
path: '/inventory',
builder: (context, state) => BlocProvider(
create: (_) => InventoryCubit(repository),
child: const InventoryListScreen(),

16
apps/app_seeds/lib/i18n/en.i18n.json
View file

@ -7,7 +7,21 @@
"cancel": "Cancel",
"delete": "Delete",
"edit": "Edit",
"type": "Type"
"type": "Type",
"comingSoon": "Coming soon"
},
"home": {
"openMarket": "Open market",
"yourInventory": "Your inventory"
},
"menu": {
"inventory": "Inventory",
"market": "Market",
"profile": "Your profile",
"chat": "Chat",
"wishlist": "Wishlist",
"following": "Following",
"settings": "Settings"
},
"inventory": {
"title": "Inventory",

16
apps/app_seeds/lib/i18n/es.i18n.json
View file

@ -7,7 +7,21 @@
"cancel": "Cancelar",
"delete": "Eliminar",
"edit": "Editar",
"type": "Tipo"
"type": "Tipo",
"comingSoon": "Pronto"
},
"home": {
"openMarket": "Mercado abierto",
"yourInventory": "Tu inventario"
},
"menu": {
"inventory": "Inventario",
"market": "Mercado",
"profile": "Tu perfil",
"chat": "Chat",
"wishlist": "Lista de deseos",
"following": "Siguiendo",
"settings": "Ajustes"
},
"inventory": {
"title": "Inventario",

4
apps/app_seeds/lib/i18n/strings.g.dart
View file

@ -4,9 +4,9 @@
/// To regenerate, run: `dart run slang`
///
/// Locales: 2
/// Strings: 216 (108 per locale)
/// Strings: 236 (118 per locale)
///
/// Built on 2026-07-08 at 10:02 UTC
/// Built on 2026-07-08 at 10:18 UTC
// coverage:ignore-file
// ignore_for_file: type=lint, unused_import

60
apps/app_seeds/lib/i18n/strings_en.g.dart
View file

@ -42,6 +42,8 @@ class Translations with BaseTranslations<AppLocale, Translations> {
// Translations
late final Translations$app$en app = Translations$app$en.internal(_root);
late final Translations$common$en common = Translations$common$en.internal(_root);
late final Translations$home$en home = Translations$home$en.internal(_root);
late final Translations$menu$en menu = Translations$menu$en.internal(_root);
late final Translations$inventory$en inventory = Translations$inventory$en.internal(_root);
late final Translations$quickAdd$en quickAdd = Translations$quickAdd$en.internal(_root);
late final Translations$detail$en detail = Translations$detail$en.internal(_root);
@ -87,6 +89,54 @@ class Translations$common$en {
/// en: 'Type'
String get type => 'Type';
/// en: 'Coming soon'
String get comingSoon => 'Coming soon';
}
// Path: home
class Translations$home$en {
Translations$home$en.internal(this._root);
final Translations _root; // ignore: unused_field
// Translations
/// en: 'Open market'
String get openMarket => 'Open market';
/// en: 'Your inventory'
String get yourInventory => 'Your inventory';
}
// Path: menu
class Translations$menu$en {
Translations$menu$en.internal(this._root);
final Translations _root; // ignore: unused_field
// Translations
/// en: 'Inventory'
String get inventory => 'Inventory';
/// en: 'Market'
String get market => 'Market';
/// en: 'Your profile'
String get profile => 'Your profile';
/// en: 'Chat'
String get chat => 'Chat';
/// en: 'Wishlist'
String get wishlist => 'Wishlist';
/// en: 'Following'
String get following => 'Following';
/// en: 'Settings'
String get settings => 'Settings';
}
// Path: inventory
@ -680,6 +730,16 @@ extension on Translations {
'common.delete' => 'Delete',
'common.edit' => 'Edit',
'common.type' => 'Type',
'common.comingSoon' => 'Coming soon',
'home.openMarket' => 'Open market',
'home.yourInventory' => 'Your inventory',
'menu.inventory' => 'Inventory',
'menu.market' => 'Market',
'menu.profile' => 'Your profile',
'menu.chat' => 'Chat',
'menu.wishlist' => 'Wishlist',
'menu.following' => 'Following',
'menu.settings' => 'Settings',
'inventory.title' => 'Inventory',
'inventory.searchHint' => 'Search seeds',
'inventory.empty' => 'No seeds yet. Tap + to add your first.',

40
apps/app_seeds/lib/i18n/strings_es.g.dart
View file

@ -41,6 +41,8 @@ class TranslationsEs extends Translations with BaseTranslations<AppLocale, Trans
// Translations
@override late final _Translations$app$es app = _Translations$app$es._(_root);
@override late final _Translations$common$es common = _Translations$common$es._(_root);
@override late final _Translations$home$es home = _Translations$home$es._(_root);
@override late final _Translations$menu$es menu = _Translations$menu$es._(_root);
@override late final _Translations$inventory$es inventory = _Translations$inventory$es._(_root);
@override late final _Translations$quickAdd$es quickAdd = _Translations$quickAdd$es._(_root);
@override late final _Translations$detail$es detail = _Translations$detail$es._(_root);
@ -74,6 +76,34 @@ class _Translations$common$es extends Translations$common$en {
@override String get delete => 'Eliminar';
@override String get edit => 'Editar';
@override String get type => 'Tipo';
@override String get comingSoon => 'Pronto';
}
// Path: home
class _Translations$home$es extends Translations$home$en {
_Translations$home$es._(TranslationsEs root) : this._root = root, super.internal(root);
final TranslationsEs _root; // ignore: unused_field
// Translations
@override String get openMarket => 'Mercado abierto';
@override String get yourInventory => 'Tu inventario';
}
// Path: menu
class _Translations$menu$es extends Translations$menu$en {
_Translations$menu$es._(TranslationsEs root) : this._root = root, super.internal(root);
final TranslationsEs _root; // ignore: unused_field
// Translations
@override String get inventory => 'Inventario';
@override String get market => 'Mercado';
@override String get profile => 'Tu perfil';
@override String get chat => 'Chat';
@override String get wishlist => 'Lista de deseos';
@override String get following => 'Siguiendo';
@override String get settings => 'Ajustes';
}
// Path: inventory
@ -485,6 +515,16 @@ extension on TranslationsEs {
'common.delete' => 'Eliminar',
'common.edit' => 'Editar',
'common.type' => 'Tipo',
'common.comingSoon' => 'Pronto',
'home.openMarket' => 'Mercado abierto',
'home.yourInventory' => 'Tu inventario',
'menu.inventory' => 'Inventario',
'menu.market' => 'Mercado',
'menu.profile' => 'Tu perfil',
'menu.chat' => 'Chat',
'menu.wishlist' => 'Lista de deseos',
'menu.following' => 'Siguiendo',
'menu.settings' => 'Ajustes',
'inventory.title' => 'Inventario',
'inventory.searchHint' => 'Buscar semillas',
'inventory.empty' => 'Aún no hay semillas. Toca + para añadir la primera.',

115
apps/app_seeds/lib/ui/app_drawer.dart Normal file
View file

@ -0,0 +1,115 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:material_symbols_icons/symbols.dart';
import '../i18n/strings.g.dart';
import 'seed_glyph.dart';
import 'theme.dart';
/// The app's navigation drawer (mockup 03). Inventory is live; the social items
/// (market, profile, chat…) belong to Block 2 and are shown disabled with a
/// "coming soon" tag so the roadmap is visible.
class AppDrawer extends StatelessWidget {
const AppDrawer({super.key});
@override
Widget build(BuildContext context) {
final t = context.t;
return Drawer(
backgroundColor: Colors.white,
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const _DrawerHeader(),
_ActiveItem(
icon: const SeedGlyph(SeedGlyphs.jars, size: 22),
label: t.menu.inventory,
onTap: () {
Navigator.of(context).pop();
context.go('/inventory');
},
),
_SoonItem(icon: Symbols.storefront, label: t.menu.market),
const Divider(),
_SoonItem(icon: Icons.person_outline, label: t.menu.profile),
_SoonItem(icon: Icons.chat_bubble_outline, label: t.menu.chat),
_SoonItem(icon: Icons.favorite_border, label: t.menu.wishlist),
_SoonItem(icon: Icons.group_outlined, label: t.menu.following),
const Spacer(),
const Divider(),
_SoonItem(icon: Icons.settings_outlined, label: t.menu.settings),
],
),
),
);
}
}
class _DrawerHeader extends StatelessWidget {
const _DrawerHeader();
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.fromLTRB(16, 12, 16, 12),
child: Row(
children: [
const Icon(Symbols.eco, color: seedGreen, size: 32),
const SizedBox(width: 12),
Text(
context.t.app.title,
style: Theme.of(context).textTheme.titleLarge?.copyWith(
color: seedGreenDark,
fontWeight: FontWeight.bold,
),
),
],
),
);
}
}
class _ActiveItem extends StatelessWidget {
const _ActiveItem({
required this.icon,
required this.label,
required this.onTap,
});
final Widget icon;
final String label;
final VoidCallback onTap;
@override
Widget build(BuildContext context) {
return ListTile(
leading: SizedBox(width: 24, child: Center(child: icon)),
title: Text(label),
onTap: onTap,
);
}
}
/// A disabled Block-2 destination with a subtle "coming soon" tag.
class _SoonItem extends StatelessWidget {
const _SoonItem({required this.icon, required this.label});
final IconData icon;
final String label;
@override
Widget build(BuildContext context) {
return ListTile(
enabled: false,
leading: Icon(icon),
title: Text(label),
trailing: Text(
context.t.common.comingSoon,
style: Theme.of(
context,
).textTheme.labelSmall?.copyWith(color: Colors.black38),
),
);
}
}

159
apps/app_seeds/lib/ui/home_screen.dart Normal file
View file

@ -0,0 +1,159 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:material_symbols_icons/symbols.dart';
import '../i18n/strings.g.dart';
import 'app_drawer.dart';
import 'seed_glyph.dart';
import 'theme.dart';
/// The main menu (mockup 02): a sprout logo over a faint seed-glyph watermark,
/// with the big "open market" (Block 2, coming soon) and "your inventory"
/// destinations. The hamburger opens [AppDrawer].
class HomeScreen extends StatelessWidget {
const HomeScreen({super.key});
@override
Widget build(BuildContext context) {
final t = context.t;
return Scaffold(
appBar: AppBar(title: Text(t.app.title)),
drawer: const AppDrawer(),
body: Stack(
children: [
const Positioned.fill(child: _SeedWatermark()),
Center(
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 440),
child: Padding(
padding: const EdgeInsets.all(24),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const Icon(
Symbols.eco,
size: 120,
color: seedGreen,
fill: 1,
),
const SizedBox(height: 40),
_MenuButton(
icon: const SeedGlyph(
SeedGlyphs.share,
size: 26,
color: Colors.white,
),
label: t.home.openMarket,
tag: t.common.comingSoon,
onTap: null,
),
const SizedBox(height: 16),
_MenuButton(
key: const Key('home.inventory'),
icon: const Icon(Icons.list, color: Colors.white),
label: t.home.yourInventory,
onTap: () => context.go('/inventory'),
),
],
),
),
),
),
],
),
);
}
}
class _MenuButton extends StatelessWidget {
const _MenuButton({
required this.icon,
required this.label,
this.onTap,
this.tag,
super.key,
});
final Widget icon;
final String label;
final VoidCallback? onTap;
final String? tag;
@override
Widget build(BuildContext context) {
final enabled = onTap != null;
return Material(
color: enabled ? seedGreen : seedGreen.withValues(alpha: 0.45),
borderRadius: BorderRadius.circular(10),
child: InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(10),
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20),
child: Row(
children: [
icon,
const SizedBox(width: 16),
Expanded(
child: Text(
label,
style: const TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
if (tag != null)
Text(
tag!,
style: const TextStyle(color: Colors.white70, fontSize: 12),
),
],
),
),
),
);
}
}
/// A faint scatter of seed pictograms behind the menu (like mockup 02).
class _SeedWatermark extends StatelessWidget {
const _SeedWatermark();
static const _glyphs = [
SeedGlyphs.jars,
SeedGlyphs.envelope,
SeedGlyphs.bigSpoon,
SeedGlyphs.jar,
SeedGlyphs.sack,
SeedGlyphs.scattered,
SeedGlyphs.mug,
SeedGlyphs.smallSpoon,
];
@override
Widget build(BuildContext context) {
return IgnorePointer(
child: Opacity(
opacity: 0.06,
child: Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.only(bottom: 24),
child: Wrap(
spacing: 28,
runSpacing: 18,
alignment: WrapAlignment.center,
children: [
for (final g in _glyphs)
SeedGlyph(g, size: 64, color: seedGreenDark),
],
),
),
),
),
);
}
}

2
apps/app_seeds/lib/ui/inventory_list_screen.dart
View file

@ -5,6 +5,7 @@ import 'package:go_router/go_router.dart';
import '../data/variety_repository.dart';
import '../i18n/strings.g.dart';
import '../state/inventory_cubit.dart';
import 'app_drawer.dart';
import 'quick_add_sheet.dart';
import 'seed_glyph.dart';
import 'theme.dart';
@ -19,6 +20,7 @@ class InventoryListScreen extends StatelessWidget {
final t = context.t;
return Scaffold(
appBar: AppBar(title: Text(t.inventory.title)),
drawer: const AppDrawer(),
floatingActionButton: FloatingActionButton(
key: const Key('inventory.addFab'),
tooltip: t.quickAdd.title,