This comprehensive partner portal provides studio owners with a complete suite of tools to manage their fitness/wellness business through the Hobbyist platform.
The partner portal is built using modern web technologies with a focus on user experience and operational efficiency:
- Framework: React with TypeScript
- Styling: Tailwind CSS with custom components
- Animations: Framer Motion for smooth transitions
- Charts: Chart.js for analytics visualizations
- State Management: React hooks with TypeScript interfaces
web-partner/
├── app/
│ ├── onboarding/
│ │ ├── OnboardingWizard.tsx
│ │ ├── steps/
│ │ │ └── BusinessInfoStep.tsx
│ │ └── context/
│ └── dashboard/
│ ├── DashboardLayout.tsx
│ ├── DashboardOverview.tsx
│ ├── classes/
│ │ └── ClassManagement.tsx
│ ├── staff/
│ │ └── StaffManagement.tsx
│ ├── bookings/
│ │ └── BookingManagement.tsx
│ └── settings/
│ └── SettingsManagement.tsx
└── README.md
- Portal form/data flow audit:
docs/form-flow-audit.mdclarifies backend dependencies for each dashboard section. - Ops references for manual payouts live in the monorepo root (
docs/guides/*,scripts/manual_payout.py).
- Business Information Collection: Company details, legal information, contact details
- Address & Location Setup: Complete business address with validation
- Verification Process: Document upload and business verification
- Studio Profile Creation: Branding, description, and visual setup
- Services & Class Configuration: Initial class type and service setup
- Payment Integration: Stripe/Apple Pay setup and configuration
- Review & Submission: Final review before account activation
Key Components:
- Progressive form validation
- Visual progress indicator
- Data persistence between steps
- Mobile-responsive design
- Revenue Metrics: Daily, weekly, monthly revenue tracking
- Student Analytics: Active students, new signups, retention rates
- Class Performance: Capacity utilization, popular classes, ratings
- KPI Widgets: Key performance indicators with trend analysis
Features:
- Interactive charts and graphs
- Real-time data updates
- Exportable reports
- Time period filtering
- Quick action buttons
- Class Creation: Complete class setup with scheduling
- Bulk Operations: Multi-class management capabilities
- Instructor Assignment: Staff assignment and management
- Capacity Management: Waitlist and enrollment controls
- Pricing Configuration: Flexible pricing models
- Schedule Integration: Calendar view and time slot management
Capabilities:
- Drag-and-drop scheduling
- Duplicate class functionality
- Bulk status updates
- Advanced filtering and search
- Image and media management
- Role-Based Access Control: Admin, Instructor, Assistant roles
- Invitation Workflow: Email-based invitation system
- Permission Management: Granular permission settings
- Performance Tracking: Class counts, ratings, student feedback
- Availability Management: Schedule and time slot coordination
- Certification Tracking: Credentials and qualification management
Staff Features:
- Bulk invitation capabilities
- Staff performance analytics
- Availability calendar integration
- Automated reminder systems
- Real-Time Booking Overview: Live booking status and updates
- Student Communication: Direct messaging and notifications
- Payment Processing: Refunds, payment tracking, financial management
- Cancellation Management: Policy enforcement and automated handling
- Waitlist Management: Automatic enrollment and notifications
- Special Requirements: Accommodation tracking and management
Communication Tools:
- In-app messaging system
- Automated email notifications
- SMS integration capabilities
- Bulk communication features
- Studio Configuration: Business settings and operational preferences
- Subscription Plans: Tiered pricing with feature limitations
- Payment Methods: Card management and billing automation
- Booking Policies: Cancellation rules and refund policies
- Privacy Settings: Data visibility and sharing controls
- Integration Management: Third-party service connections
Settings Categories:
- General studio information
- Billing and subscription management
- Booking policies and rules
- Notification preferences
- Privacy and security settings
- Third-party integrations
- Color Palette: Blue primary (#3B82F6), with status-specific colors
- Typography: Clean, professional font hierarchy
- Spacing: Consistent 8px grid system
- Components: Reusable UI components with variants
- Icons: Lucide React icon library for consistency
- Responsive Design: Mobile-first approach with desktop optimization
- Accessibility: ARIA labels, keyboard navigation, screen reader support
- Loading States: Skeleton screens and progress indicators
- Error Handling: Comprehensive error states with recovery options
- Animation: Smooth transitions using Framer Motion
- React hooks for local component state
- Context API for global state sharing
- TypeScript interfaces for type safety
- Form validation with error handling
- Mock data structures representing real API responses
- Optimistic updates for better user experience
- Local state persistence during onboarding
- Bulk operations with transaction-like behavior
- Component lazy loading
- Image optimization
- Chart data virtualization
- Efficient re-rendering patterns
The system is designed to work with the existing Hobbyist database schema:
- Studios Table: Business information, settings, subscription status
- Studio_Staff Table: Staff members, roles, permissions, availability
- Classes Table: Class definitions, schedules, pricing, capacity
- Class_Sessions Table: Individual class instances with bookings
- Bookings Table: Student reservations, payments, status tracking
- Users Table: Student profiles, preferences, booking history
- Multi-step onboarding wizard with validation
- Comprehensive dashboard with analytics
- Class management with CRUD operations
- Staff invitation and management system
- Booking management with student communication
- Settings and subscription management
- Responsive design across all components
- TypeScript implementation with type safety
- Real-time WebSocket integration for live updates
- Advanced analytics with custom report builder
- Mobile app companion for staff management
- AI-powered insights and recommendations
- Advanced marketing automation tools
- Multi-location management capabilities
The partner portal is designed to achieve:
- 90% onboarding completion rate through streamlined wizard
- 50% reduction in support requests via intuitive self-service tools
- 30% increase in studio efficiency through automated management features
- 95% user satisfaction score based on usability testing
- Zero-downtime deployment with progressive enhancement
- Automated regression script lives at
scripts/partner-regression-check.jsand writes timestamped reports totest-results/. - See
docs/regression-checks.mdfor execution steps and links to the payout runbooks stored in../docs/guides/.
- Data Encryption: All sensitive data encrypted in transit and at rest
- Role-Based Access: Granular permissions with principle of least privilege
- Audit Logging: Complete activity tracking for compliance
- GDPR Compliance: Privacy controls and data portability features
- PCI DSS Standards: Secure payment processing integration
Built for HobbyistSwiftUI Partner Portal - Empowering fitness and wellness studios with comprehensive management tools.