Mail Bites - Gmail Chrome Extension

Summarize unread emails in your inbox and generate a summary and a to-do list and works for Gmail. It will also highlight key action items, dates, and deadlines, prioritize emails by time-sensitive content, and assist with drafting replies using Large Language Models.

Features

• Inbox Summary -Megan
• To-Do List -Mona
• Reply Generation -Darren
• Prioritization -Fiona

Landing Page

View our landing page live here: https://mkhosla11.github.io/mail-bites-landing-page/

Setup

Note that to run this extension before this is published on Chrome Web Store, you need to repeat the set up process individually to successfully launch this extension. At the end of the setup, you also need to add the testing gmail in the Audience tab in Google Cloud Project.

1. Create a Google Cloud Project

1. Go to the Google Cloud Console
2. Create a new project
3. Enable the Gmail API:
   • In the sidebar, navigate to "APIs & Services" > "Library"
   • Search for "Gmail API" and enable it

2. Set Up OAuth 2.0 Credentials

1. In the sidebar, navigate to "APIs & Services" > "Credentials"
2. Click "Create Credentials" and select "OAuth client ID"
3. Select "Chrome Extension" as the application type
4. Enter a name for your OAuth client
5. For "Application ID", enter the extension ID (you'll get this after loading the extension in Chrome for the first time but for now enter an id of a different chrome extension found under chrome://extensions/)
6. Click "Create"
7. Note your Client ID - you'll need it in the next step
8. Go to "Audience" and add your email in Test users
9. In the sidebar, navigate to "APIs & Services" > "Library"
10. Search for the Gemini API, and enable it.
11. Then in the sidebar, navigate to "APIs & Services" > "Credentials" and take not of your API key.

3. Update the Extension Manifest

1. Clone the repository and open it in a code editor such as Visual Studio Code.
2. Open public/manifest.json
3. Replace YOUR_CLIENT_ID.apps.googleusercontent.com (or where you see "client_id") with your actual client ID from the previous step
4. Replace GEMINI_API_KEY in background.js with your API key from the previous step (or find const GEMINI_API_KEY and add your key after the equal sign)
5. Find const clientId and add your client ID after the equal sign in background.js

4. Install Dependencies and Build the Extension

# Install dependencies
npm install

# Build the extension
npm run build

5. Load the Extension in Chrome

1. Open Chrome and go to chrome://extensions/
2. Enable "Developer mode" (toggle in the top-right corner)
3. Click "Load unpacked" and select the dist folder from your project
4. Note the extension ID that appears under the extension name - you'll need to add this to your OAuth client configuration
5. Go back to the Google Cloud Console, update your OAuth client with this extension ID (click the edit button and change the ID)

6. Use the Extension

1. Click the Mail Bites icon in your Chrome toolbar
2. Click "Connect to Gmail" and follow the authentication flow
3. Once authenticated, you can view and interact with your emails

Development

# Run in development mode with hot reload
npm run dev

# Build for production
npm run build

# Run tests
npm test

Future Work

• Adapt for Outlook and other email services
• Add automatic send email features
• Directly add to google calendar for meetings and events
• Give an estimate time for how long to read the unread emails

Privacy Notice

Mail Bites processes your Gmail data locally within the extension. No email data is sent to external servers. The extension uses OAuth 2.0 to authenticate with Gmail, giving you control over what data you share and the ability to revoke access at any time through your Google Account settings.

License

MIT