State App
State App
State App
The State App is a product lifecycle state management application for FlowState. It provides a comprehensive wizard-driven interface for capturing and tracking key product information across all phases of the product lifecycle, from business planning through marketing. Each section features a setup wizard for data collection and a dashboard for visualization and monitoring.
Key Features
- Wizard-Driven Data Collection: Multi-step setup wizards for each lifecycle phase using JSON Schema forms
- Product Lifecycle Coverage: Eight comprehensive sections covering the full product journey
- Progress Tracking: Visual progress indicators showing section completion status
- Section Dashboards: Dedicated dashboards for each lifecycle phase with metrics and visualizations
- Global Overview: Central dashboard aggregating status across all lifecycle sections
- Local Storage Persistence: Data persists across sessions using localStorage
- Recharts Visualization: Line, bar, and pie charts for data visualization
Target Users
| User Type | Primary Use Cases |
|---|---|
| Product Managers | Define product info, goals, and roadmap |
| Business Analysts | Capture business planning and strategy |
| Development Leads | Configure codebases, team, and time tracking |
| DevOps Engineers | Set up deployment environments and pipelines |
| Marketing Teams | Define channels and conversion goals |
| Support Teams | Configure support channels and SLAs |
Quick Links
- Features & Capabilities - Detailed feature documentation
- Getting Started - Set up and configure the app
Getting Started
Navigation
The app uses a section-based navigation structure:
- Dashboard (
/dashboard) - Global overview of all sections - Business Planning (
/business-planning/*) - Company foundation and strategy - Product Info (
/product-info/*) - Product details and requirements - Goals & Objectives (
/product-goals/*) - Targets and key metrics - Design & Roadmap (
/product-design/*) - Features and milestones - Development (
/product-development/*) - Codebases and team - Deployment (
/product-deployment/*) - Environments and pipelines - Support (
/product-support/*) - Customer support and SLA - Marketing (
/product-marketing/*) - Channels and conversion goals
Setting Up a Section
Each section has two views:
- Setup (
/section-name/setup) - Wizard for entering section data - Dashboard (
/section-name/dashboard) - Visualization of captured data
To complete a section:
- Navigate to the section's Setup page
- Complete each step of the wizard
- Save to mark the section complete
- View the Dashboard to see metrics and summaries
Completing the Lifecycle
- Start with Business Planning to establish company foundation
- Progress through each section in order
- Track overall progress on the Global Dashboard
- Use the "Continue Setup" button to jump to the next incomplete section
App Identity
| Property | Value |
|---|---|
| Package | @epicdm/flowstate-app-state |
| Base Path | /state |
| Icon | LayoutDashboard |
| Color | #6366F1 |
Related Packages
- @epicdm/flowstate-app-framework - App container framework
- @epicdm/flowstate-rxdb - Database utilities