This project is a React Native template for building AI chat applications on Android and iOS. It uses Google Gemini for chat functionality and Supabase for authentication and storage. The original plant identification and shopping features were removed to serve as a lightweight starting point for multiple chatbot experiences.
The anty folder is fully decoupled from the web widget located at the repository root. You can work on the mobile app by itself without pulling in any AWS or web-specific dependencies.
- 💬 AI Chatbot: Chat with domain‑specific bots. Multiple bots can be configured (e.g. parking reservations, room bookings).
- 🎨 Configurable Palette: Colors are defined in
config/colors.jsso the palette can easily be customized. - 📱 Cross-Platform: Works on both Android and iOS using Expo.
- 🗨️ CX Chat: Basic Amazon Connect chat screen mimicking the web widget.
- 🔐 Special Message Prompts: Requests username or password when the agent sends
DFX5-ASK-USERNAMEorDFX5-ASK-PASSWORD. - 🎥 Video Escalation: Start a WebRTC video call using
AWS_VIDEO_FLOW_IDwith simple mute controls. - 🔥 Tech Stack: React Native, Expo and Supabase backend.
- Node.js (Latest LTS recommended)
- Expo CLI
- Android Studio & Xcode (for Android and iOS development)
- Supabase account
git clone https://github.com/yourusername/anty.git
cd antynpm install
# or
yarn install- Create a Supabase project at supabase.com
- Navigate to Settings > API and copy the Project URL and Anon Key.
- Set up authentication and database tables for storing user data and any domain‑specific information your bots might need.
- Create the tables required for your project, for example:
users: Store user profiles- add other domain‑specific tables as needed
Copy .env.example to .env and update the values for your environment:
SUPABASE_URL=your-supabase-url
SUPABASE_ANON_KEY=your-supabase-anon-key
GEMINI_API_KEY=your-openai-api-key # For chatbot functionality
AWS_API_GATEWAY=your-api-gateway-endpoint
AWS_CONTACT_FLOW_ID=your-contact-flow-id
AWS_INSTANCE_ID=your-connect-instance-id
AWS_VIDEO_FLOW_ID=your-video-flow-id
SPACE_FLOW_ID=space-reservation-flow-id
BUS_FLOW_ID=bus-reservation-flow-id
WIDGET_COUNTER=0
COGNITO_POOL_ID=your-cognito-identity-pool-id
COGNITO_REGION=us-east-1
STORE_SESSION_TOKEN_API_URL=https://example.com/storeSessionTokens
NEXT_PUBLIC_API_URL=https://your-api.example.com
# Valid options: DEVELOPMENT or PRODUCTION
DFX5_ENVIRONMENT=DEVELOPMENT
# Base URL for the Chime API when DFX5_ENVIRONMENT=DEVELOPMENT
DFX5_DEV_CHIME_API=https://your-dev-chime-api.example.com
# Base URL for the Chime API when DFX5_ENVIRONMENT=PRODUCTION
DFX5_PROD_CHIME_API=https://your-prod-chime-api.example.com
DFX5_LOGIN_URL=https://your-login-api.example.com/user/login
DFX5_ASSOCIATE_LOGIN_URL=https://your-login-api.example.com/associate/login
DFX5_CONNECT_INSTANCE_ARN=arn:aws:connect:us-east-1:xxxxxxxxxxxx:instance/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
CLOUD_FRONT_S3_URL=https://your-cloudfront.example.com
VIDEO_AWS_ACCESS_KEY=your-video-access-key
VIDEO_AWS_SECRET_KEY=your-video-secret-access-key
INIT_CUSTOMER_NAME=customer
INIT_CUSTOMER_USERNAME=user@example.com
INIT_LANGUAGE=es # initial language code (e.g., en or es)If STORE_SESSION_TOKEN_API_URL is set, the mobile app will send session tokens
to this endpoint whenever a Connect chat is started.
The app now includes a simple language selector component. The initial language
is taken from the INIT_LANGUAGE variable and can be changed at runtime using
the selector on the Connect chat screen.
This mobile template mirrors the web widget's functionality with two preconfigured chatbots: Space Booking and Bus Reservations. They are defined in app/(tabs)/home.tsx and their prompts live in app/(tabs)/message.tsx.
Both bots use the same Amazon Connect contact flow specified by AWS_CONTACT_FLOW_ID in your .env file. To add more bots or change these defaults, edit the bots array and systemPrompts object in the mentioned files.
The app now also supports the web widget's WIDGET_COUNTER variable. When set, WIDGET_COUNTER=0 uses SPACE_FLOW_ID while WIDGET_COUNTER=1 uses BUS_FLOW_ID automatically.
npx expo startnpm install -g eas-cli
eas login
eas build:configureeas build -p android --profile preview
# For production release
eas build -p android --profile productioneas build -p ios --profile preview
# For production release
eas build -p ios --profile productionTo host the web version of the app similarly to the chat widget:
- Run
expo export --platform webin theantydirectory. This generates adistfolder. - Upload the contents of
distto your bucket:BUCKET_NAME=<bucket-name> node scripts/upload-web-build-to-s3.js
The bucket can then be served through a CloudFront distribution.