`GOOGLE_AUTH_SETUP.md`

107 lines

# Google OAuth Setup Instructions for Bubbe AI

## Setup Complete! ✅

Google Authentication has been successfully integrated into your Bubbe AI application. Follow these steps to complete the configuration:

## 1. Get Google OAuth Credentials

1. Go to [Google Cloud Console](https://console.cloud.google.com/)
2. Create a new project or select an existing one
3. Enable the Google+ API:
- Go to "APIs & Services" → "Library"
- Search for "Google+ API"
- Click "Enable"

4. Create OAuth 2.0 credentials:
- Go to "APIs & Services" → "Credentials"
- Click "Create Credentials" → "OAuth client ID"
- Choose "Web application"
- Name it "Bubbe AI"

5. Configure OAuth settings:
- **Authorized JavaScript origins:**
- `http://45.61.58.125:3011`
- `http://localhost:3011` (for development)

- **Authorized redirect URIs:**
- `http://45.61.58.125:3011/api/auth/callback/google`
- `http://localhost:3011/api/auth/callback/google`

6. Copy your credentials:
- Client ID
- Client Secret

## 2. Update Environment Variables

Edit `/root/Projects/dear-bubbe-nextjs/.env.local` and replace:

```bash
GOOGLE_CLIENT_ID=YOUR_GOOGLE_CLIENT_ID
GOOGLE_CLIENT_SECRET=YOUR_GOOGLE_CLIENT_SECRET
```

With your actual credentials from Google Cloud Console.

## 3. Restart the Application

```bash
pm2 restart bubbe
```

## 4. Test the Integration

1. Visit http://45.61.58.125:3011
2. Click "Sign in with Google" in the header
3. Authorize the application
4. You should see your Google profile picture and name in the header

## Features Added

✅ Google OAuth integration with NextAuth.js
✅ Session management
✅ User profile display in header
✅ Sign in/Sign out functionality
✅ Secure JWT-based sessions
✅ Professional Google sign-in button with logo

## Security Notes

- NEXTAUTH_SECRET and JWT_SECRET have been generated with strong random values
- Sessions expire after 30 days
- All auth routes are protected at `/api/auth/*`
- User data is stored in JWT tokens (stateless)

## Optional: Add User Persistence

If you want to save user data to a database, you can:

1. Install a database adapter (Prisma, MongoDB, etc.)
2. Update the `signIn` callback in `/lib/auth.ts` to save user data
3. Add user preferences and conversation history

## Troubleshooting

If authentication isn't working:

1. Check that Google OAuth credentials are correct in `.env.local`
2. Verify redirect URIs match exactly in Google Console
3. Check PM2 logs: `pm2 logs bubbe`
4. Ensure cookies are enabled in browser
5. Try clearing browser cache and cookies

## Files Modified/Created

- `/lib/auth.ts` - NextAuth configuration
- `/app/api/auth/[...nextauth]/route.ts` - Auth API routes
- `/app/providers.tsx` - Added SessionProvider
- `/app/page.tsx` - Added Google sign-in button
- `.env.local` - Added OAuth credentials

## Next Steps

1. Add the actual Google credentials
2. Restart the application
3. Test the sign-in flow
4. Optional: Add user preferences storage
5. Optional: Store conversation history per user