A beautiful Flutter AI chat application with voice support, powered by Groq/OpenAI and Supabase.
- 🤖 AI Conversations: Chat with Groq (free) or OpenAI's GPT-3.5 Turbo
- 🎤 Voice Input: Speak your messages using speech-to-text
- 🔊 Voice Output: Listen to AI responses with text-to-speech
- 💬 Chat History: View and manage your conversation history
- 🔐 Authentication: Secure email/password authentication with Supabase
- 🎨 Beautiful UI: Clean, modern interface with dark theme
- 📱 Real-time Streaming: See AI responses as they're generated
- 🔄 Flexible AI Providers: Easy switching between Groq and OpenAI
- Frontend: Flutter
- State Management: Riverpod (with code generation)
- Backend: Supabase (Authentication & Database)
- AI Providers:
- Groq (Qwen 3 32B - Free)
- OpenAI GPT-3.5 Turbo (Paid)
- Voice:
speech_to_textfor voice inputflutter_ttsfor text-to-speech
- Environment:
flutter_dotenvfor secure API key management
- Flutter SDK (3.9.2 or higher)
- Dart SDK
- Supabase Account (Sign up here)
- AI Provider API Key (choose one):
- Groq API Key (Get free key here)
- OpenAI API Key (Get one here)
git clone https://github.com/jabguru/AI-Chat-App.git
cd AI-Chat-Appflutter pub get- Go to supabase.com and sign in
- Click "New Project"
- Fill in your project details
- Wait for the project to be created
- In your Supabase project, go to Settings (gear icon)
- Click API in the sidebar
- Copy the following:
- Project URL (looks like:
https://xxxxx.supabase.co) - anon/public key (the
anonkey)
- Project URL (looks like:
- In your Supabase project, go to SQL Editor
- Click New Query
- Copy the entire content of
supabase_schema.sqlfrom this project - Paste it into the SQL editor
- Click Run (or press Cmd/Ctrl + Enter)
- You should see "Success. No rows returned" - that's good!
Create a .env file in the root of the project:
SUPABASE_URL=your_supabase_url_here
SUPABASE_ANON_KEY=your_supabase_anon_key_here
OPENAI_API_KEY=your_openai_api_key_here
GROQ_API_KEY=your_groq_api_key_hereNote: You only need to fill in the API key for the AI provider you want to use. Leave the other blank.
By default, the app uses Groq (free). To switch to OpenAI:
- Open
lib/shared/services/ai_service_factory.dart - Change the
currentProviderline:
// Use Groq (default)
static AIProvider currentProvider = AIProvider.groq;
// Or use OpenAI
static AIProvider currentProvider = AIProvider.openai;Add the following to your ios/Runner/Info.plist:
<key>NSMicrophoneUsageDescription</key>
<string>This app needs access to the microphone for voice input.</string>
<key>NSSpeechRecognitionUsageDescription</key>
<string>This app needs access to speech recognition for voice input.</string>Add the following permissions to your android/app/src/main/AndroidManifest.xml:
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.BLUETOOTH"/>
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT"/>Also add this inside the <queries> section (or create it if it doesn't exist):
<queries>
<intent>
<action android:name="android.intent.action.PROCESS_TEXT"/>
<data android:mimeType="text/plain"/>
</intent>
<intent>
<action android:name="android.speech.RecognitionService"/>
</intent>
</queries>Note: The Bluetooth permissions are required by the speech_to_text package for certain devices. The RecognitionService query is required for Android 11+ to discover speech recognition services.
Run the code generator to generate Riverpod providers:
dart run build_runner build --delete-conflicting-outputsflutter run- Sign Up/Login: Create an account or log in with your email and password
- Verify Email: Check your email for verification link (required before chatting)
- Start Chatting: Type a message or tap the microphone icon to speak
- Listen to Responses: Tap the speaker icon on AI messages to hear them read aloud
- View History: Open the drawer (tap the menu icon) to see all your chat sessions
- New Chat: Tap the + icon in the app bar to start a new conversation
- Delete Chats: Tap the delete icon next to any chat in the history drawer
| Feature | Groq (Default) | OpenAI |
|---|---|---|
| Cost | Free | Paid (requires $5 minimum) |
| Model | Qwen 3 32B | GPT-3.5 Turbo |
| Speed | Very Fast | Fast |
| Streaming | Simulated | Real-time |
| Quality | Excellent | Excellent |
lib/
├── core/
│ ├── config/
│ │ └── env_config.dart # Environment configuration
│ ├── theme/
│ │ ├── colors.dart # App colors
│ │ └── theme.dart # Theme configuration
│ └── widgets/
│ └── ... # Reusable widgets
├── features/
│ ├── auth/
│ │ ├── data/
│ │ ├── presentation/
│ │ └── providers/ # Auth state management
│ └── chat/
│ ├── data/
│ │ └── models/ # Message & ChatSession models
│ ├── presentation/
│ │ └── chat_screen.dart # Main chat UI
│ └── providers/
│ └── chat_provider.dart # Chat state management
├── shared/
│ └── services/
│ ├── ai_service.dart # AI service interface
│ ├── ai_service_factory.dart # Provider switching logic
│ ├── openai_service.dart # OpenAI implementation
│ ├── groq_service.dart # Groq implementation
│ ├── supabase_service.dart # Supabase integration
│ └── voice_service.dart # Voice input/output
└── main.dart # App entry point
The app uses an abstraction layer that makes it easy to switch between AI providers:
Edit lib/shared/services/ai_service_factory.dart:
static AIProvider currentProvider = AIProvider.groq; // or AIProvider.openaiYou can programmatically switch providers:
AIServiceFactory.switchTo(AIProvider.openai);
// or
AIServiceFactory.switchTo(AIProvider.groq);- Check your spam folder for the verification email
- Make sure email confirmation is enabled in your Supabase project settings
- Ensure microphone permissions are granted in device settings
- Check that the correct permissions are added to Info.plist (iOS) or AndroidManifest.xml (Android)
- Make sure all Bluetooth permissions are added (required by speech_to_text package)
- Verify the
RecognitionServicequery intent is added to AndroidManifest.xml (required for Android 11+) - If speech recognition fails, try testing on a physical device instead of an emulator
- Check that Google app or other speech recognition service is installed and up-to-date
- Text-to-Speech (TTS): If you don't hear any voice output on emulator:
- Open emulator's Settings > System > Languages & input > Text-to-speech output
- Select Google Text-to-Speech Engine as preferred engine
- Install voice data if prompted, or install "Google Text-to-Speech" from Play Store
- Restart your app after configuring TTS
- Ensure both microphone and speech recognition permissions are in Info.plist
- Text-to-Speech (TTS): If you don't hear any voice output, you need to download a voice:
- Open iOS Settings > Accessibility > Spoken Content > Voices
- Select English and download a voice (e.g., "Samantha" or "Alex")
- Restart your app after downloading the voice
- Speech-to-Text (STT): Does not work on iOS Simulator - you must use a physical iPhone/iPad device
- For best results with voice features, always test on a physical device
If code generation fails, try:
flutter clean
flutter pub get
dart run build_runner clean
dart run build_runner build --delete-conflicting-outputs- Make sure your
.envfile is in the project root - Verify API keys are valid and have sufficient credits/quota
- Restart the app after changing
.envfile
Contributions are welcome! Please feel free to submit a Pull Request.
- Design inspiration from AI Chat Bot
- Groq for providing free, fast LLM inference
- Supabase for backend infrastructure



