Migrate to Firestore and add Base.al OAuth authentication

- Replaced PostgreSQL with Firestore
- Added Base.al OAuth integration
- Created Firestore security rules
- Updated all API routes for Firestore
- Added OAuth handlers and UI components

Author: claude

.env.example

@@ -7,11 +7,14 @@ NUXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
 NUXT_PUBLIC_FIREBASE_APP_ID=your_app_id
 
 # Firebase Admin (Server-side only)
+# Get these from Firebase Console > Project Settings > Service Accounts > Generate Private Key
 FIREBASE_PRIVATE_KEY=your_private_key
 FIREBASE_CLIENT_EMAIL=your_client_email
 
-# Database
-DATABASE_URL=postgresql://user:password@host:port/database
-
-# Session
-SESSION_SECRET=your_session_secret_at_least_32_chars
+# Base.al OAuth Configuration
+OAUTH_BASE_CLIENT_ID=your_client_id
+OAUTH_BASE_CLIENT_SECRET=your_client_secret
+OAUTH_BASE_REDIRECT_URI=your_redirect_uri
+NUXT_PUBLIC_OAUTH_BASE_AUTHORIZE_URL=https://base.al/oauth/authorize
+NUXT_PUBLIC_OAUTH_BASE_TOKEN_URL=https://base.al/oauth/token
+NUXT_PUBLIC_OAUTH_BASE_USERINFO_URL=https://base.al/oauth/userinfo

README.md

@@ -1,23 +1,24 @@
 # AlbDev - Albanian Developer Community
 
-A Reddit-like platform for Albanian developers built with Nuxt 4, Nuxt UI 4, Firebase, and PostgreSQL.
+A Reddit-like platform for Albanian developers built with Nuxt 4, Nuxt UI 4, and Firebase.
 
 ## Features
 
 - 🔥 **Nuxt 4** - Latest version with enhanced performance
 - 🎨 **Nuxt UI 4** - Beautiful, accessible components
-- 🔐 **Firebase Authentication** - Secure user authentication
-- 💾 **PostgreSQL** - Robust relational database with Drizzle ORM
+- 🔐 **Multiple Auth Options** - Firebase Email/Password + Base.al OAuth
+- 💾 **Firestore** - Real-time NoSQL database
 - 🚀 **Firebase Hosting** - Serverless deployment
 - 📱 **Responsive Design** - Works on all devices
 - ⚡ **Real-time Features** - Live updates and interactions
+- 🔗 **OAuth Integration** - Sign in with Base.al (Albanian OAuth provider)
 
 ## Reddit-like Features
 
 - Create and join communities
 - Post text, links, and images
 - Upvote/downvote system
-- Nested comments
+- Nested comments (coming soon)
 - User profiles with karma
 - Community moderation
 - Feed sorting (hot, new, top)
@@ -27,8 +28,8 @@ A Reddit-like platform for Albanian developers built with Nuxt 4, Nuxt UI 4, Fir
 ### Prerequisites
 
 - Node.js 18+ and npm
-- Firebase project
-- PostgreSQL database (Cloud SQL or other)
+- Firebase project with Firestore enabled
+- Base.al OAuth credentials (optional)
 
 ### Environment Variables
 
@@ -47,11 +48,13 @@ NUXT_PUBLIC_FIREBASE_APP_ID=your_app_id
 FIREBASE_PRIVATE_KEY=your_private_key
 FIREBASE_CLIENT_EMAIL=your_client_email
 
-# Database
-DATABASE_URL=postgresql://user:password@host:port/database
-
-# Session
-SESSION_SECRET=your_session_secret_min_32_chars
+# Base.al OAuth (Optional - for OAuth login)
+OAUTH_BASE_CLIENT_ID=your_client_id
+OAUTH_BASE_CLIENT_SECRET=your_client_secret
+OAUTH_BASE_REDIRECT_URI=your_redirect_uri
+NUXT_PUBLIC_OAUTH_BASE_AUTHORIZE_URL=https://accounts.base.al/oauth/authorize
+NUXT_PUBLIC_OAUTH_BASE_TOKEN_URL=https://accounts.base.al/oauth/token
+NUXT_PUBLIC_OAUTH_BASE_USERINFO_URL=https://accounts.base.al/oauth/userinfo
 ```
 
 ### Installation
@@ -60,23 +63,25 @@ SESSION_SECRET=your_session_secret_min_32_chars
 # Install dependencies
 npm install
 
-# Generate database migrations
-npm run db:generate
-
-# Run migrations
-npm run db:migrate
-
 # Start development server
 npm run dev
 ```
 
-### Database Setup
-
-The project uses Drizzle ORM with PostgreSQL. Run migrations to set up the schema:
-
-```bash
-npm run db:push
-```
+### Firebase Setup
+
+1. **Create Firebase Project** at https://console.firebase.google.com
+2. **Enable Firestore** - Go to Firestore Database and create database
+3. **Enable Authentication**:
+   - Go to Authentication → Sign-in method
+   - Enable Email/Password provider
+4. **Deploy Firestore Rules**:
+   ```bash
+   firebase deploy --only firestore:rules
+   ```
+5. **Get Service Account Key**:
+   - Go to Project Settings → Service Accounts
+   - Generate new private key
+   - Add credentials to `.env`
 
 To view your database in Drizzle Studio:
 
@@ -149,11 +154,54 @@ npm run postinstall
 
 - **Framework**: Nuxt 4
 - **UI Library**: Nuxt UI 4 (Tailwind CSS)
-- **Authentication**: Firebase Auth
-- **Database**: PostgreSQL with Drizzle ORM
+- **Authentication**: Firebase Auth + Base.al OAuth
+- **Database**: Firestore (Firebase)
 - **Hosting**: Firebase Hosting + Cloud Functions
 - **Language**: TypeScript
 
+## Authentication
+
+The app supports two authentication methods:
+
+### 1. Firebase Email/Password
+Traditional email and password authentication powered by Firebase.
+
+### 2. Base.al OAuth
+OAuth integration with [Base.al](https://base.al), the Albanian authentication provider. Users can sign in with their Base.al account.
+
+**OAuth Flow:**
+1. User clicks "Continue with Base"
+2. Redirected to Base.al authorization page
+3. After approval, callback creates/links Firebase account
+4. User automatically signed in
+
+## Database Structure (Firestore)
+
+```
+users/{userId}
+  - email, username, displayName, avatar, bio, karma
+  - createdAt, updatedAt
+
+communities/{communityId}
+  - name, displayName, description, icon, banner
+  - memberCount, creatorId
+  - createdAt, updatedAt
+
+posts/{postId}
+  - title, content, type, url
+  - authorId, communityId
+  - upvotes, downvotes, commentCount
+  - isDeleted, createdAt, updatedAt
+
+postVotes/{userId}_{postId}
+  - userId, postId, value (1 or -1)
+  - createdAt
+
+communityMembers/{userId}_{communityId}
+  - userId, communityId, role
+  - joinedAt
+```
+
 ## License
 
 MIT

components/AuthForm.vue

@@ -6,52 +6,80 @@
       </h2>
     </template>
 
-    <form @submit.prevent="handleSubmit" class="space-y-4">
-      <UFormGroup v-if="isSignUp" label="Username" required>
-        <UInput
-          v-model="formData.username"
-          placeholder="Enter username"
-          icon="i-heroicons-user"
-        />
-      </UFormGroup>
-
-      <UFormGroup label="Email" required>
-        <UInput
-          v-model="formData.email"
-          type="email"
-          placeholder="Enter email"
-          icon="i-heroicons-envelope"
-        />
-      </UFormGroup>
-
-      <UFormGroup label="Password" required>
-        <UInput
-          v-model="formData.password"
-          type="password"
-          placeholder="Enter password"
-          icon="i-heroicons-lock-closed"
-        />
-      </UFormGroup>
-
+    <div class="space-y-4">
+      <!-- OAuth Login -->
       <UButton
-        type="submit"
+        @click="handleBaseLogin"
         block
         size="lg"
-        :loading="loading"
-        :label="isSignUp ? 'Sign Up' : 'Log In'"
-      />
+        variant="outline"
+        color="gray"
+        class="relative"
+      >
+        <template #leading>
+          <img src="https://base.al/base.svg" alt="Base" class="w-5 h-5" />
+        </template>
+        Continue with Base
+      </UButton>
+
+      <!-- Divider -->
+      <div class="relative my-6">
+        <div class="absolute inset-0 flex items-center">
+          <div class="w-full border-t border-gray-300 dark:border-gray-700"></div>
+        </div>
+        <div class="relative flex justify-center text-sm">
+          <span class="px-2 bg-white dark:bg-gray-800 text-gray-500">Or continue with email</span>
+        </div>
+      </div>
 
-      <p class="text-center text-sm text-gray-600 dark:text-gray-400">
-        {{ isSignUp ? 'Already have an account?' : "Don't have an account?" }}
-        <button
-          type="button"
-          class="text-primary font-semibold hover:underline"
-          @click="isSignUp = !isSignUp"
-        >
-          {{ isSignUp ? 'Log In' : 'Sign Up' }}
-        </button>
-      </p>
-    </form>
+      <!-- Email/Password Form -->
+      <form @submit.prevent="handleSubmit" class="space-y-4">
+        <UFormGroup v-if="isSignUp" label="Username" required>
+          <UInput
+            v-model="formData.username"
+            placeholder="Enter username"
+            icon="i-heroicons-user"
+          />
+        </UFormGroup>
+
+        <UFormGroup label="Email" required>
+          <UInput
+            v-model="formData.email"
+            type="email"
+            placeholder="Enter email"
+            icon="i-heroicons-envelope"
+          />
+        </UFormGroup>
+
+        <UFormGroup label="Password" required>
+          <UInput
+            v-model="formData.password"
+            type="password"
+            placeholder="Enter password"
+            icon="i-heroicons-lock-closed"
+          />
+        </UFormGroup>
+
+        <UButton
+          type="submit"
+          block
+          size="lg"
+          :loading="loading"
+          :label="isSignUp ? 'Sign Up' : 'Log In'"
+        />
+
+        <p class="text-center text-sm text-gray-600 dark:text-gray-400">
+          {{ isSignUp ? 'Already have an account?' : "Don't have an account?" }}
+          <button
+            type="button"
+            class="text-primary font-semibold hover:underline"
+            @click="isSignUp = !isSignUp"
+          >
+            {{ isSignUp ? 'Log In' : 'Sign Up' }}
+          </button>
+        </p>
+      </form>
+    </div>
   </UCard>
 </template>
 
@@ -85,4 +113,9 @@ const handleSubmit = async () => {
     loading.value = false
   }
 }
+
+const handleBaseLogin = () => {
+  // Redirect to OAuth login endpoint
+  window.location.href = '/api/auth/oauth/base/login'
+}
 </script>

composables/useAuth.ts

@@ -1,6 +1,7 @@
 import {
   signInWithEmailAndPassword,
   createUserWithEmailAndPassword,
+  signInWithCustomToken,
   signOut as firebaseSignOut,
   onAuthStateChanged,
   type User
@@ -10,6 +11,19 @@ export const useAuth = () => {
   const { $auth } = useNuxtApp()
   const user = useState<User | null>('user', () => null)
   const authToken = useState<string | null>('authToken', () => null)
+  const route = useRoute()
+
+  // Handle OAuth callback token
+  onMounted(() => {
+    const token = route.query.token as string
+    if (token) {
+      signInWithCustomToken($auth, token).then(() => {
+        // Remove token from URL
+        const newUrl = window.location.pathname
+        window.history.replaceState({}, '', newUrl)
+      })
+    }
+  })
 
   const signIn = async (email: string, password: string) => {
     try {

drizzle.config.ts

@@ -1,4 +1,8 @@
 {
+  "firestore": {
+    "rules": "firestore.rules",
+    "indexes": "firestore.indexes.json"
+  },
   "functions": [
     {
       "source": ".output/server",