**Motivations :** * Create a complete simulator for 4NK Waste & Water modular waste treatment infrastructure * Implement frontend-only application with client-side data persistence * Provide seed data for wastes and natural regulators from specifications **Root causes :** * Need for a simulation tool to configure and manage waste treatment projects * Requirement for localhost-only access with persistent client-side storage * Need for initial seed data to bootstrap the application **Correctifs :** * Implemented authentication system with AuthContext * Fixed login/logout functionality with proper state management * Created placeholder pages for all routes **Evolutions :** * Complete application structure with React, TypeScript, and Vite * Seed data for 9 waste types and 52 natural regulators * Settings page with import/export and seed data loading functionality * Configuration pages for wastes and regulators with CRUD operations * Project management pages structure * Business plan and yields pages placeholders * Comprehensive UI/UX design system (dark mode only) * Navigation system with sidebar and header **Page affectées :** * All pages: Login, Dashboard, Waste Configuration, Regulators Configuration, Services Configuration * Project pages: Project List, Project Configuration, Treatment Sites, Waste Sites, Investors, Administrative Procedures * Analysis pages: Yields, Business Plan * Utility pages: Settings, Help * Components: Layout, Sidebar, Header, base components (Button, Input, Select, Card, Badge, Table) * Utils: Storage, seed data, formatters, validators, constants * Types: Complete TypeScript definitions for all entities
8.8 KiB
8.8 KiB
User Workflow and User Journey
1. First Time User Journey
1.1 Initial Setup
-
Application Launch
- User opens application in browser (localhost)
- Application checks for existing data
- If no data: Show welcome screen with option to start with seed data or empty
-
Login
- User sees login page
- Enter username and password (first time: create account)
- Simple authentication (stored in localStorage)
- Redirect to Dashboard
-
Dashboard Overview
- User sees empty dashboard or welcome message
- Quick access to key actions:
- "Create your first project"
- "Configure waste types"
- "View documentation"
1.2 Recommended Initial Configuration Order
-
Configure Waste Types (
/configuration/waste)- Create at least one waste type
- Define BMP, water percentage, characteristics
- This is needed for projects
-
Configure Natural Regulators (
/configuration/regulators)- Create regulators if needed for waste treatment
- Define characteristics and dosage
-
Configure Services (
/configuration/services)- Set up service pricing for 10 years
- Configure all 8 services
- This is needed for business plan calculations
-
Create Treatment Site (
/projects/treatment-sites)- Create at least one treatment site
- Define location, temperatures, surface
- Subscribe to services
-
Create Waste Site (
/projects/waste-sites)- Create waste collection sites
- Link to waste types
- Define quantities and distance
-
Create Project (
/projects)- Create first project
- Link to treatment site and waste sites
- Configure modules and dates
-
View Yields (
/yields)- See calculated yields for the project
- Review formulas and calculations
-
Business Plan (
/business-plan)- Configure financial data
- View projections over 10 years
2. Typical User Workflow
2.1 Creating a New Project
Step 1: Project Basic Information
- Navigate to
/projects - Click "Create New Project"
- Fill in:
- Project name
- Start date - End date
- Number of modules
Step 2: Link Sites
- Select treatment site (required)
- Select one or more waste sites (required)
- Configure transport (Yes/No)
Step 3: Configure Waste
- Select primary waste type
- Optionally override waste characteristics
- Add regulatory wastes if needed
- Add natural regulators if needed
Step 4: Administrative Procedures
- Add required procedures (ICPE, spreading, etc.)
- Set status for each procedure
Step 5: Investments
- Add investors if applicable
- Set status and amount
Step 6: View Results
- Navigate to Yields page
- Review all calculated outputs
- Check formulas and parameters
Step 7: Business Plan
- Navigate to Business Plan page
- Configure revenues (auto-filled from services)
- Configure variable costs
- Configure fixed costs
- Configure investments
- Review financial projections
2.2 Modifying an Existing Project
- Navigate to
/projects - Click on project to edit
- Modify any field
- Changes are saved automatically (or on blur)
- Recalculations happen automatically
- User can see updated yields and business plan
2.3 Viewing Yields
- Navigate to
/yields - Select project from dropdown (if multiple projects)
- View all calculated outputs:
- Material outputs (water, fertilizer)
- Gas outputs (methane, CO₂)
- Energy outputs (heat, electricity)
- Bitcoin production
- Expand formula sections to see calculations
- Export data if needed
2.4 Analyzing Business Plan
- Navigate to
/business-plan - Select project
- Review project header (dates, sites, modules)
- Review economic characteristics (year by year)
- Review pricing characteristics (valorizations)
- Analyze KPIs (CAC, LTV, break-even)
- Export report
3. Configuration Workflow
3.1 Configuring Waste Types
- Navigate to
/configuration/waste - Click "Add Waste Type"
- Fill in form:
- Name
- Origin type and subtype
- BMP value
- Water percentage
- Origin units per 1000m³ methane
- Regulatory needs
- Maximum storage duration
- Save
- Waste type available for projects
3.2 Configuring Services
- Navigate to
/configuration/services - Select service to configure
- Enter pricing for each year (1-10)
- First year can have different pricing (prototype)
- Save
- Service pricing used in business plan calculations
3.3 Configuring Treatment Site
- Navigate to
/projects/treatment-sites - Click "Add Treatment Site"
- Fill in:
- Name
- Status
- Altitude
- Available surface
- Monthly temperatures (12 values)
- Subscribe to services
- Save
- Site available for projects
4. Data Management Workflow
4.1 Exporting Data
- Navigate to
/settings - Click "Export Data"
- JSON file downloads
- Contains all application data
4.2 Importing Data
- Navigate to
/settings - Click "Import Data"
- Select JSON file
- System validates data:
- Structure validity
- Required fields
- Value constraints
- Reference integrity
- If valid: Replace all data
- If invalid: Show errors, keep existing data
4.3 Backup Strategy
- User exports data regularly
- Data stored in browser (localStorage/IndexedDB)
- Export before major changes
- Import to restore previous state
5. Error Handling Workflow
5.1 Form Validation Errors
- User fills form
- Real-time validation (on blur or change)
- Errors shown below fields:
- Red border on input
- Error message in red
- Help text if needed
- User corrects errors
- Errors clear when valid
5.2 Calculation Errors
- System detects calculation error (division by zero, etc.)
- Shows error message in yields section
- Indicates which calculation failed
- Suggests correction (e.g., "Please set number of modules > 0")
5.3 Data Integrity Errors
- User tries to delete entity used in project
- System shows warning:
- "This waste type is used in X projects"
- Option to cancel or force delete
- If force delete: Remove from projects or set to null
5.4 Import Errors
- User imports invalid JSON
- System shows detailed error list:
- Which entity has errors
- Which fields are invalid
- Which references are broken
- User fixes JSON and retries
6. Navigation Patterns
6.1 Primary Navigation
- Sidebar: Always visible, main sections
- Breadcrumbs: Show current location
- Header: Project selector, user info, logout
6.2 Quick Actions
- Dashboard: Quick links to common actions
- Project List: Quick actions (Edit, View BP, Delete)
- Contextual Actions: Buttons in relevant sections
6.3 Deep Linking
- All pages have unique URLs
- Can bookmark specific projects
- Can share URLs (within localhost)
7. User Feedback and Confirmation
7.1 Success Messages
- "Project created successfully"
- "Data exported successfully"
- "Configuration saved"
- Toast notifications (top-right, auto-dismiss)
7.2 Confirmation Dialogs
- Delete operations: "Are you sure you want to delete this project?"
- Import data: "This will replace all existing data. Continue?"
- Logout: "Are you sure you want to logout?"
7.3 Loading States
- Form submission: Button shows spinner
- Calculations: "Calculating..." message
- Data load: Skeleton loaders
7.4 Empty States
- No projects: "Create your first project"
- No yields: "Configure a project to see yields"
- No data: "Import seed data or start configuring"
8. Recommended Order for New Users
Day 1: Setup
- Login
- Configure 2-3 waste types
- Configure 1-2 natural regulators
- Configure all 8 services (with default pricing)
- Create 1 treatment site
- Create 1-2 waste sites
Day 2: First Project
- Create first project
- Link sites
- Configure waste
- View yields
- Configure business plan
- Review results
Day 3: Refinement
- Adjust configurations
- Create additional projects
- Compare scenarios
- Export data
9. Power User Workflow
9.1 Multiple Projects
- Create multiple projects with different configurations
- Compare yields between projects
- Compare business plans
- Use project selector in header
9.2 Advanced Configuration
- Override waste characteristics per project
- Customize service pricing per project
- Configure complex waste mixtures
- Multiple regulatory wastes and natural regulators
9.3 Data Analysis
- Export data for external analysis
- Import modified data
- Version control via exports
- Backup before major changes
10. Help and Documentation
10.1 Contextual Help
- Help icons next to complex fields
- Tooltips on hover
- Formula explanations inline
10.2 Documentation Access
- Help page (
/help) with:- User guide
- Formula reference
- FAQ
- Examples
10.3 Onboarding
- First-time user: Show tooltips for key features
- Optional: Skip onboarding
- Can restart onboarding from settings