# 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