flutter-go-router-navigation

$npx mdskill add HoangNguyen0403/agent-skills-standard/flutter-go-router-navigation

```text core/router/ ├── app_router.dart # Router configuration └── routes.dart # Typed route definitions (GoRouteData) ```

SKILL.md

.github/skills/flutter-go-router-navigationView on GitHub ↗
---
name: flutter-go-router-navigation
description: Implement typed routes, redirection, and guards using go_router in Flutter. Use when building declarative navigation with go_router.
metadata:
  triggers:
    files:
    - '**/router.dart'
    - '**/app_router.dart'
    keywords:
    - GoRouter
    - GoRoute
    - StatefulShellRoute
    - redirection
    - typed-routes
---
# GoRouter Navigation

## **Priority: P0 (CRITICAL)**


## Structure

```text
core/router/
├── app_router.dart # Router configuration
└── routes.dart # Typed route definitions (GoRouteData)
```

## Implementation Guidelines

- **Typed Routes**: Always use **GoRouteData** and **@TypedGoRoute** from `go_router_builder`. Never use raw path strings.
- **Parameters**: Define strongly-typed parameters in route class (e.g., `class OrderDetailRoute extends GoRouteData { final String id; }`) with paths like **'/orders/:id'**.
- **Root Router**: One global `GoRouter` instance registered in DI.
- **Sub-Routes**: Nest related routes using `TypedGoRoute` and children lists.
- **Redirection**: Handle Auth (Login check) in **redirect callback** of `GoRouter` config: `redirect: (context, state) => isLoggedIn ? null : '/login'`. ** NOT check auth inside page widget.**
- **Tabs**: Use **StatefulShellRoute** with branches for bottom tab bar (Home, Orders, Profile) so each tab maintains its own navigation stack.
- **Transitions**: Define standard transitions (Fade, Slide) in `buildPage`.
- **Navigation**: Use **MyRoute().go(context)** or `MyRoute().push(context)`. Using **OrderDetailRoute(id: id).go(context)** only allowed way to navigate.

## Code

See [references/typed-routes.md](references/typed-routes.md) for GoRouteData + redirect implementation.

## Anti-Patterns

- **No Raw String Paths**: Use typed `GoRouteData` classes (e.g., `OrderDetailRoute(id: 123).go(context)`) instead of `context.go('/orders/123')`
- **No Inline Auth Logic**: Redirect logic belongs in `GoRouter.redirect`, not UI's `build()` method
- **No Multiple Routers**: Register one global `GoRouter` instance in DI
- **No Unvalidated IDs**: Always verify parameters exist in `redirect` before building route

## Related Topics

layer-based-clean-architecture | auto-route-navigation | security

More from HoangNguyen0403/agent-skills-standard

SkillDescription
android-agp-upgradeUpgrade an Android project to Android Gradle Plugin (AGP) 9. Use when migrating to AGP 9, updating Gradle build files, migrating to built-in Kotlin, or adopting the new AGP DSL.
android-architectureApply Clean Architecture layering, modularization, and Unidirectional Data Flow in Android projects. Use when setting up project structure, placing code in layers, configuring feature/core modules, or implementing UDF patterns.
android-background-workImplement WorkManager and background processing correctly on Android. Use when creating Worker classes, scheduling tasks, choosing between WorkManager and Foreground Services, or setting up Hilt in workers.
android-composeBuild high-performance declarative UI with Jetpack Compose. Use when writing Composable functions, optimizing recomposition, hoisting state, or working with LazyColumn and side effects.
android-compose-migrationMigrate an Android XML View to Jetpack Compose following a structured 10-step workflow. Use when converting XML layouts to Compose, setting up Compose in an existing View-based project, or incrementally adopting Compose.
android-concurrencyWrite correct coroutine scopes, Flow collection, and dispatcher injection in Android. Use when writing suspend functions, choosing between StateFlow and SharedFlow, or injecting Dispatchers for testability.
android-deploymentConfigure release signing, R8 obfuscation, and App Bundle publishing for Android. Use when setting up signing configs, enabling minification, adding ProGuard keep rules, or preparing for Play Store submission.
android-design-systemEnforce Material Design 3 theming and design token usage in Jetpack Compose. Use when implementing M3 components, color schemes, typography, or design tokens.
android-diConfigure Hilt dependency injection with proper scoping, modules, and constructor injection in Android. Use when setting up Hilt DI, defining modules, or configuring component scoping.
android-edge-to-edgeMigrate a Jetpack Compose app to edge-to-edge display and fix system bar inset issues. Use when UI components are obscured by navigation/status bars, fixing IME insets, or enabling edge-to-edge for SDK 35+.