Krow-workspace/apps/mobile/ai_prompts/6-feature-development.md

FEATURE EXECUTION WORKFLOW — Modular Feature Development

APPLICATION TARGET

apps/mobile/apps/staff

EXECUTION PLAN (MANDATORY 3-STEP PROCESS)

Step 1: Prototype Implementation

• Goal: First move the entire UI(pages and widgets) and logic from the prototype into the new feature package without changes. The page in the new package should be an one-one of the POC page.
• Action: Create the package in the folder structure under apps/mobile/packages/features/[domain]/[feature_name].
• References: Use the specified prototypes as the primary source of truth for UI/UX, logic and business logic.
• MANDATORY: The Layout and Wireframing from the prototype should stay EXACTLY as they are. Do not re-design the UX or move elements around.
• Note: Pages should end with _page.dart instead of _screen.dart.

Step 2: Architecture & Clean Code Refactor

• Goal: Align the prototype code with the project's long-term standards.
• Rules:
  • Follow apps/mobile/docs/01-architecture-principles.md (BLoC, Domain-Driven, Repository pattern).
  • Move the logic into blocs, domain and data. Use only the apps/mobile/packages/data_connect/lib/src/mocks to retrive / add data. This should happen via the data layer (presentation (ui -> bloc) -> domain -> data).
  • Apply Clean Code: Meaningful names, one responsibility per class, small methods. Add doc comments to the files, functions for better readability.
  • No magic strings inside business logic.

Step 3: Localization & Navigation Finalization

• Goal: Centralize resources and decouple routing.
• Mandatory Requirements:
  1. Centralized Localization:
     • Extract ALL strings to apps/mobile/packages/core_localization/lib/src/l10n/en.i18n.json (and es).
     • Use a unique namespace for the feature (e.g., t.feature_name.sub_section.key).
     • Remove slang dependencies from the feature; re-export core_localization instead.
  2. Typed Navigation:
     • Create lib/src/presentation/navigation/[feature_name]_navigator.dart.
     • Implement an extension on IModularNavigator for all feature-specific routes.
     • Replace all Modular.to.pushNamed('/path') with typed methods like Modular.to.pushFeaturePage().

Step 4: Design Matching & Design System Alignment

• Goal: Ensure the visual identity matches the Design System perfectly while maintaining the prototype's layout.
• Action: Follow apps/mobile/docs/03-design-system-usage.md (Section 10: POC → Themed workflow).
• Mandatory Requirements:
  • Colors: Replace all hex codes or raw colors with UiColors.
  • Typography: Replace all manual TextStyle with UiTypography.
  • Spacing/Radius: Replace all magic numbers with UiConstants.
  • Icons: Use UiIcons exclusively.
  • Policy: Maintain the prototype's layout structure while upgrading the "atoms" and "molecules" to the Design System tokens.

---

FEATURE SCOPE — Staff shifts Screen

This feature implements the staff shifts screen for the Mobile Staff application.

---

PROTOTYPE REFERENCES (SOURCE OF TRUTH)

• apps/mobile/prototypes/staff_mobile_application/lib/screens/worker/payments_screen.dart

WHERE THE FEATURE SHOULD RESIDE

This feature should reside in the feature apps/mobile/packages/features/staff/payments.

ARCHITECTURE CONSTRAINTS (NON-NEGOTIABLE)

You MUST strictly follow:

1. apps/mobile/docs/01-architecture-principles.md
2. apps/mobile/docs/02-agent-development-rules.md
3. apps/mobile/docs/03-design-system-usage.md
4. MEMORY[user_global] (Clean Code & architectural decisions)

Violations must be explicitly reported, never silently ignored.

---

REFERENCE IMPLEMENTATION

Use:

apps/mobile/packages/features/staff/authentication

as the gold standard for:

• Feature structure
• Navigation pattern
• Localization strategy
• Design system integration