feat(auth): implement Google OAuth callback with user auto-creation

API (apps/api/src/routes/auth.ts):
- Exchange authorization code for tokens via Google's token endpoint
- Decode id_token payload (JWT) to extract sub, email, name
- Find user by googleId → fall back to email match (link accounts)
- Auto-create user if neither found (role: 'user', no password)
- Create session + set cookie, redirect to /login?token=<token>

Web (apps/web/src/pages/login-page.tsx):
- Consume ?token= query param from OAuth redirect
- Store token in localStorage for future API calls
- Fetch /auth/me to hydrate Zustand store, then navigate to dashboard
- Show OAuth errors from ?error= query param

Co-Authored-By: Claude <noreply@anthropic.com>

.github/workflows/android.yml

@@ -136,6 +136,10 @@ jobs:
           rm -rf gen/android
           bun tauri android init
 
+      - name: Patch AndroidManifest (CAMERA permission)
+        working-directory: apps/tauri
+        run: bash scripts/patch-android-manifest.sh
+
       - name: Build Tauri Android APK
         working-directory: apps/tauri
         env:

apps/api/src/routes/auth.ts

@@ -18,6 +18,54 @@ import {
 import { env } from '../config/env';
 import { authCounter } from '../lib/telemetry';
 
+// ── Google OAuth Helpers ──────────────────────────────────────────────
+
+interface GoogleTokenResponse {
+  access_token: string;
+  id_token: string;
+}
+
+interface GoogleIdPayload {
+  sub: string;
+  email: string;
+  email_verified: boolean;
+  name: string;
+  picture?: string;
+}
+
+async function exchangeGoogleCode(code: string): Promise<GoogleTokenResponse> {
+  const res = await fetch('https://oauth2.googleapis.com/token', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    body: new URLSearchParams({
+      code,
+      client_id: env.googleClientId!,
+      client_secret: env.googleClientSecret!,
+      redirect_uri: env.googleRedirectUri!,
+      grant_type: 'authorization_code',
+    }),
+  });
+
+  if (!res.ok) {
+    const err = await res.text();
+    throw new Error(`Google token exchange failed: ${res.status} ${err}`);
+  }
+
+  return res.json() as Promise<GoogleTokenResponse>;
+}
+
+function decodeGoogleIdToken(idToken: string): GoogleIdPayload {
+  // JWT: header.payload.signature — we only need the payload
+  // Google's id_token is verified via the token endpoint (direct server-to-server),
+  // so we can safely decode without verifying the signature here.
+  const parts = idToken.split('.');
+  if (parts.length !== 3) {
+    throw new Error('Invalid id_token format');
+  }
+  const payload = Buffer.from(parts[1], 'base64url').toString('utf-8');
+  return JSON.parse(payload);
+}
+
 function normalizeEmail(email: unknown) {
   return typeof email === 'string' ? email.trim().toLowerCase() : '';
 }
@@ -140,11 +188,76 @@ export const authRoutes = new Elysia({ prefix: '/api/v1/auth' })
 
     set.redirect = `https://accounts.google.com/o/oauth2/v2/auth?${params.toString()}`;
   })
-  .get('/google/callback', ({ set }) => {
+  .get('/google/callback', async ({ query, set, request }) => {
     if (!env.googleOAuthEnabled) {
       set.status = 404;
       return { error: 'Google OAuth is not configured' };
     }
 
-    set.redirect = `${env.webAppUrl}/login?oauth=not-implemented`;
+    const code = (query as Record<string, string>).code;
+    const error = (query as Record<string, string>).error;
+
+    // User denied or Google returned an error
+    if (error || !code) {
+      set.redirect = `${env.webAppUrl}/login?error=${encodeURIComponent(error ?? 'missing_code')}`;
+      return;
+    }
+
+    // Exchange authorization code for tokens
+    let idPayload: GoogleIdPayload;
+    try {
+      const tokens = await exchangeGoogleCode(code);
+      idPayload = decodeGoogleIdToken(tokens.id_token);
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : 'Google auth failed';
+      set.redirect = `${env.webAppUrl}/login?error=${encodeURIComponent(msg)}`;
+      return;
+    }
+
+    // Validate email
+    if (!idPayload.email_verified || !idPayload.email) {
+      set.redirect = `${env.webAppUrl}/login?error=${encodeURIComponent('Email not verified by Google')}`;
+      return;
+    }
+
+    const googleId = idPayload.sub;
+    const email = idPayload.email.trim().toLowerCase();
+    const name = idPayload.name?.trim() ?? email.split('@')[0];
+
+    try {
+      const db = createDbClient();
+
+      // 1. Try to find user by googleId
+      let user = await db.select().from(users).where(eq(users.googleId, googleId)).limit(1).then(r => r[0] ?? null);
+
+      // 2. If not found, try by email (link existing account)
+      if (!user) {
+        user = await db.select().from(users).where(eq(users.email, email)).limit(1).then(r => r[0] ?? null);
+        if (user) {
+          // Link googleId to existing account
+          await db.update(users).set({ googleId }).where(eq(users.id, user.id));
+        }
+      }
+
+      // 3. Create new user if nothing matched
+      if (!user) {
+        const inserted = await db
+          .insert(users)
+          .values({ email, name, googleId, role: 'user' })
+          .returning();
+        user = inserted[0];
+        authCounter.labels('register', 'true').inc();
+      }
+
+      // Create session
+      const token = await createSession(user.id);
+      set.headers['Set-Cookie'] = createSessionCookie(token, request.headers);
+
+      authCounter.labels('login', 'true').inc();
+
+      // Redirect to web app with token in URL for localStorage fallback
+      set.redirect = `${env.webAppUrl}/login?token=${encodeURIComponent(token)}`;
+    } catch (err) {
+      set.redirect = `${env.webAppUrl}/login?error=${encodeURIComponent('Database unavailable')}`;
+    }
   });

apps/web/src/components/diagnose-result-view.tsx

@@ -15,7 +15,7 @@ import { RiskBadge } from "@/components/risk-badge";
 
 type Props = {
   imageUrl: string;
-  confidence: number; // contoh: 0.95
+  confidence: number;
   diseaseName: string;
   scientificName: string;
   riskLevel: string;
@@ -42,8 +42,8 @@ export function DiagnosisResultView({
 
   const getRiskLevelKey = (level: string): "low" | "medium" | "high" => {
     const normalized = level.toLowerCase();
-    if (normalized.includes("rendah")) return "low";
-    if (normalized.includes("tinggi")) return "high";
+    if (normalized.includes("rendah") || normalized === "low") return "low";
+    if (normalized.includes("tinggi") || normalized === "high") return "high";
     return "medium";
   };
 
@@ -85,18 +85,35 @@ export function DiagnosisResultView({
           <div className="space-y-2 mb-4">
             <div className="flex justify-between text-sm font-bold text-slate-700">
               <span>Tingkat Keyakinan AI</span>
-              <span className="text-emerald-600">{confidencePercent}%</span>
+              <span
+                className={
+                  confidencePercent >= 75
+                    ? "text-emerald-600"
+                    : "text-amber-500"
+                }
+              >
+                {confidencePercent}%
+              </span>
             </div>
             <div className="w-full bg-slate-200 rounded-full h-2.5 overflow-hidden">
               <div
-                className="bg-emerald-500 h-2.5 rounded-full transition-all duration-1000"
+                className={`h-2.5 rounded-full transition-all duration-1000 ${
+                  confidencePercent >= 75 ? "bg-emerald-500" : "bg-amber-500"
+                }`}
                 style={{ width: `${confidencePercent}%` }}
               ></div>
             </div>
-            <p className="text-[11px] text-emerald-600 flex items-center gap-1 font-medium">
-              <CheckCircle2 className="w-3 h-3" /> Di atas ambang batas minimum
-              (75%)
-            </p>
+            {confidencePercent >= 75 ? (
+              <p className="text-[11px] text-emerald-600 flex items-center gap-1 font-medium">
+                <CheckCircle2 className="w-3 h-3" /> Di atas ambang batas
+                minimum (75%)
+              </p>
+            ) : (
+              <p className="text-[11px] text-amber-600 flex items-center gap-1 font-medium">
+                <AlertTriangle className="w-3 h-3" /> Di bawah ambang batas
+                minimum (75%)
+              </p>
+            )}
           </div>
 
           <div className="flex items-center gap-3 pt-4 border-t border-amber-200/50">

apps/web/src/pages/login-page.tsx

@@ -1,8 +1,8 @@
-import { useState } from "react";
-import { Link, useNavigate } from "react-router-dom";
+import { useState, useEffect, useRef } from "react";
+import { Link, useNavigate, useSearchParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { AuthForm } from "@/components/auth-form";
-import { apiClient } from "@/lib/api-client";
+import { apiClient, setAuthToken } from "@/lib/api-client";
 import { useAuthStore } from "@/store/auth-store";
 
 export function LoginPage() {
@@ -10,6 +10,33 @@ export function LoginPage() {
   const queryClient = useQueryClient();
   const setUser = useAuthStore((state) => state.setUser);
   const [error, setError] = useState<string | null>(null);
+  const [searchParams] = useSearchParams();
+  const oauthTokenConsumed = useRef(false);
+
+  // Handle OAuth callback: the API redirects to /login?token=<session_token>
+  useEffect(() => {
+    const token = searchParams.get("token");
+    if (!token || oauthTokenConsumed.current) return;
+    oauthTokenConsumed.current = true;
+
+    // Store token for future API calls and fetch user
+    setAuthToken(token);
+
+    apiClient
+      .getMe()
+      .then((data) => {
+        setUser(data.user);
+        queryClient.setQueryData(["auth", "me"], data);
+        navigate("/dashboard", { replace: true });
+      })
+      .catch((err) => {
+        setAuthToken(null);
+        setError(err instanceof Error ? err.message : "Google login gagal");
+      });
+  }, [searchParams, setUser, queryClient, navigate]);
+
+  // Show OAuth error from query param
+  const oauthError = searchParams.get("error");
   const meQuery = useQuery({
     queryKey: ["auth", "me"],
     queryFn: () => apiClient.getMe(),
@@ -32,7 +59,7 @@ export function LoginPage() {
         <AuthForm
           mode="login"
           isSubmitting={mutation.isPending}
-          error={error}
+          error={oauthError || error}
           googleOAuthEnabled={Boolean(
             meQuery.data?.features.googleOAuthEnabled,
           )}

apps/web/src/pages/scan-page.tsx

@@ -16,6 +16,7 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
 import { Modal } from "@/components/ui/modal";
 import type { DiagnosisRecord } from "@zeavis/shared";
+import { diseaseCatalogSeed } from "@zeavis/shared"; // Import data seed lokal ditambahkan
 import { apiClient } from "@/lib/api-client";
 import { trackScan, trackDiagnosisResult } from "@/lib/telemetry";
 import { DiagnosisResultView } from "../components/diagnose-result-view";
@@ -95,7 +96,7 @@ export function ScanPage() {
   const [diagnosisPreview, setDiagnosisPreview] =
     useState<DiagnosisRecord | null>(null);
 
-  const diagnosesQuery = useQuery({
+  useQuery({
     queryKey: ["diagnoses"],
     queryFn: () => apiClient.getDiagnoses(),
     enabled: previewOpen,
@@ -429,29 +430,46 @@ export function ScanPage() {
               </div>
             )}
 
-            <DiagnosisResultView
-              imageUrl={
-                previewUrl ||
-                diagnosisPreview.imageUrl ||
-                "https://placehold.co/600x400?text=Foto+Daun"
-              }
-              confidence={diagnosisPreview.confidence ?? 0}
-              diseaseName={
-                diagnosisPreview.disease?.commonName ?? "Tidak Diketahui"
-              }
-              scientificName={diagnosisPreview.disease?.label ?? ""}
-              riskLevel={diagnosisPreview.disease?.riskLevel ?? "Sedang"}
-              description={
-                diagnosisPreview.disease?.description ??
-                diagnosisPreview.disease?.summary ??
-                "Deskripsi tidak tersedia."
-              }
-              symptoms={diagnosisPreview.disease?.symptoms ?? []}
-              preventions={diagnosisPreview.disease?.recommendations ?? []}
-              medicines={
-                (diagnosisPreview.disease as any)?.medicineRecommendations ?? []
-              }
-            />
+            {/* Render DiagnosisResultView dengan Fallback Obat */}
+            {(() => {
+              // Fallback logic for scientific name and medicine recommendations
+              const seedData = diagnosisPreview.disease
+                ? diseaseCatalogSeed.find(
+                    (seed) =>
+                      seed.commonName === diagnosisPreview.disease?.commonName,
+                  )
+                : null;
+
+              // If the API doesn't return medicine recommendations, use the seed data as a fallback
+              const finalMedicines =
+                (diagnosisPreview.disease as any)?.medicineRecommendations ||
+                seedData?.medicineRecommendations ||
+                [];
+
+              return (
+                <DiagnosisResultView
+                  imageUrl={
+                    previewUrl ||
+                    diagnosisPreview.imageUrl ||
+                    "https://placehold.co/600x400?text=Foto+Daun"
+                  }
+                  confidence={diagnosisPreview.confidence ?? 0}
+                  diseaseName={
+                    diagnosisPreview.disease?.commonName ?? "Tidak Diketahui"
+                  }
+                  scientificName={diagnosisPreview.disease?.label ?? ""}
+                  riskLevel={diagnosisPreview.disease?.riskLevel ?? "Sedang"}
+                  description={
+                    diagnosisPreview.disease?.description ??
+                    diagnosisPreview.disease?.summary ??
+                    "Deskripsi tidak tersedia."
+                  }
+                  symptoms={diagnosisPreview.disease?.symptoms ?? []}
+                  preventions={diagnosisPreview.disease?.recommendations ?? []}
+                  medicines={finalMedicines} // Datanya terhubung ke sini!
+                />
+              );
+            })()}
 
             {/* All Model Predictions */}
             {diagnosisPreview.predictions &&