MCPcopy Index your code
hub / github.com/bravekingzhang/gemini-pro-chatbot

github.com/bravekingzhang/gemini-pro-chatbot @main

Chat with this repo
repository ↗ · DeepWiki ↗ · + Follow
98 symbols 274 edges 35 files 3 documented · 3% updated 17mo ago★ 88
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

Gemini Pro Chatbot

A beautiful and feature-rich mobile chat application powered by Google's Gemini Pro AI model. Built with Expo and React Native.

Features

  • 🤖 Powered by Google's Gemini Pro AI model
  • 💬 Real-time streaming responses
  • 🎨 Beautiful dark theme UI
  • 📝 Code syntax highlighting
  • 💾 Persistent message storage
  • ✏️ Message editing support
  • ⚙️ Customizable system prompts
  • 🖼️ Image understanding support
  • 🎭 Multiple AI agents with different personalities
  • 🔄 Message regeneration
  • 📱 Cross-platform (iOS & Android)

Screenshots

Chat Interface

Chat Interface

  • Real-time streaming responses
  • Code syntax highlighting
  • Support for image input
  • Dark mode support

Agents Management

Agents Management

  • Create custom AI agents
  • Different personalities and purposes
  • Customizable system prompts
  • Easy agent switching

Content Discovery

Discover

  • Generate creative content
  • Share interesting responses
  • Multiple content types
  • Community interaction

Settings

Settings

  • Dark mode toggle
  • API key management
  • System prompt customization
  • Stream response settings

Dark Mode

Dark Mode

Getting Started

  1. Install dependencies bash npm install

  2. Configure your API key

  3. Get your Gemini Pro API key from Google AI Studio
  4. Add your API key in the app's settings screen

  5. Start the app bash npx expo start

  6. Run on your device:

  7. iOS: Press 'i' to open in iOS Simulator
  8. Android: Press 'a' to open in Android Emulator
  9. Scan QR code with Expo Go app on your physical device

Usage

Chat Interface

  • Type your message in the input box
  • Click the image icon to add images for analysis
  • Real-time streaming responses
  • Code blocks are automatically highlighted
  • Edit or regenerate messages as needed

Agents

  • Create custom agents for different purposes
  • Each agent has its own personality and system prompt
  • Switch between agents for different conversation styles
  • Default agents included for common use cases

Discover

  • Generate creative content like stories and poems
  • Share interesting AI responses
  • Like and collect favorite content
  • Explore community-shared content

Settings

  • Customize your experience
  • Toggle dark mode
  • Manage your API key
  • Configure system-wide preferences

Tech Stack

  • Expo / React Native
  • Google Gemini Pro API
  • React Navigation
  • AsyncStorage for persistence
  • Syntax highlighting for code blocks
  • Expo Image Picker
  • React Native Markdown

Contributing

Feel free to open issues and pull requests for any improvements you'd like to add!

Follow My WeChat Official Account

Stay updated with the latest AI development tips and tools:

WeChat Official Account QR Code

WeChat Official Account: LaoMa XiaoZhang

Scan the QR code to follow and get the latest updates on:

  • 🤖 AI Programming Tips & Tricks
  • 💻 Full-Stack Development Insights
  • 🛠️ Productivity Tools and Workflows
  • 🚀 Latest Tech Trends and Reviews

License

MIT License - feel free to use this code for your own projects!

Extension points exported contracts — how you extend this code

SyntaxHighlighterProps (Interface)
(no doc)
types/react-native-syntax-highlighter.d.ts
MessageProps (Interface)
(no doc)
components/Message.tsx
CodeBlockProps (Interface)
(no doc)
components/CodeBlock.tsx
DiscoverItem (Interface)
(no doc)
app/(tabs)/discover.tsx
Message (Interface)
(no doc)
constants/Config.ts
Chat (Interface)
(no doc)
constants/Config.ts
Agent (Interface)
(no doc)
constants/Config.ts

Core symbols most depended-on inside this repo

loadAgents
called by 8
utils/storage.ts
useTheme
called by 7
contexts/ThemeContext.tsx
saveChat
called by 5
utils/storage.ts
loadChats
called by 4
utils/storage.ts
useColorScheme
called by 4
hooks/useColorScheme.web.ts
streamCompletion
called by 2
utils/gemini.ts
handleDeleteChat
called by 2
app/chats.tsx
handleStartChat
called by 2
app/(tabs)/agent.tsx

Shape

Function 80
Method 9
Interface 7
Class 2

Languages

TypeScript89%
Kotlin11%

Modules by API surface

app/(tabs)/index.tsx12 symbols
app/(tabs)/discover.tsx9 symbols
utils/storage.ts8 symbols
app/(tabs)/agent.tsx7 symbols
app/chats.tsx6 symbols
android/app/src/main/java/com/your/app/MainApplication.kt6 symbols
contexts/ThemeContext.tsx5 symbols
components/Message.tsx5 symbols
app/(tabs)/settings.tsx5 symbols
android/app/src/main/java/com/your/app/MainActivity.kt5 symbols
constants/Config.ts3 symbols
app/agent/[id].tsx3 symbols

For agents

$ claude mcp add gemini-pro-chatbot \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact