Flutter SalonManager Skill

Migrate a React Vite SalonManager app to Flutter with Riverpod, Material 3, and Supabase.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/vibewithyou/salonmanagerreport --skill flutter-salonmanager-skill
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Flutter SalonManager Skill
Source: https://github.com/vibewithyou/salonmanagerreport/tree/main/mnt/skills/user/flutter-salonmanager
Command: npx skills add https://github.com/vibewithyou/salonmanagerreport --skill flutter-salonmanager-skill

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide and patterns for migrating the existing React Vite-based SalonManager application to Flutter, ensuring a smooth transition of features, architecture, and state management.

Core Features & Use Cases

  • Architecture Migration: Guidance on moving from React's component-based structure to Flutter's feature-first architecture.
  • State Management: Detailed patterns for migrating from TanStack Query and React Context to Riverpod.
  • UI Component Mapping: Equivalents for common shadcn/ui components in Flutter Material 3.
  • Supabase Integration: Best practices for setting up and using Supabase for authentication, real-time data, and storage in Flutter.
  • Feature Migration: Specific guidance for key modules like Gallery, Booking, Chat, and POS.
  • Use Case: A developer needs to refactor the existing React booking wizard into a Flutter equivalent, leveraging Riverpod for state and Material 3 widgets for the UI.

Quick Start

Follow the provided Flutter Riverpod patterns to implement the booking wizard feature.

Frequently Asked Questions about Flutter SalonManager Skill

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate React TanStack Query state management to Flutter?

To migrate React TanStack Query to Flutter, you transition your asynchronous state management to Riverpod. This Skill provides detailed patterns for replacing React Context and TanStack Query with Riverpod providers to handle data fetching and caching.

What are the Flutter Material 3 equivalents for shadcn/ui components?

Flutter Material 3 equivalents for shadcn/ui components involve mapping React UI libraries to native Flutter widgets. This Skill offers specific UI component mapping strategies to translate shadcn/ui elements directly into Material 3 design patterns.

How do I set up Supabase authentication and real-time subscriptions in Flutter?

Setting up Supabase authentication and real-time subscriptions in Flutter requires configuring the Supabase client and listening to data streams. This Skill covers best practices for Supabase integration, including real-time data synchronization and storage.

Can I use GoRouter for navigation when migrating a React Vite app to Flutter?

Yes, you can use GoRouter for navigation when migrating a React Vite app to Flutter. This Skill details implementing GoRouter for navigation, responsive design, and internationalization alongside feature-first architectural patterns.

What is the best way to model immutable data when migrating React to Flutter?

The best way to model immutable data when migrating React to Flutter is using the Freezed package. This Skill demonstrates data modeling with Freezed to handle common patterns like form handling and image uploads effectively.

Does this migration guide cover specific SalonManager features like Booking and POS?

Yes, this migration guide covers specific SalonManager features including Gallery, Booking, Chat, and POS. It provides targeted code examples for refactoring these existing React modules into Flutter equivalents using Riverpod and Material 3.