feat: add google auth

app/(app)/settings/page.tsx

@@ -96,8 +96,8 @@ function AuthenticationSection() {
   return (
     <>
       <ul className="divide-y divide-border">
-        {/* Google sign-in — uncomment once the Google OAuth app clears review.
         <Row
+          icon={<GoogleGlyph />}
           label="Connect your Google account"
           action={
             <a
@@ -108,7 +108,6 @@ function AuthenticationSection() {
             </a>
           }
         />
-        */}
         <Row
           icon={<FacebookGlyph />}
           label="Connect your Facebook account"
@@ -173,6 +172,34 @@ function LegalLink({ href, label }: { href: string; label: string }) {
 
 // ─── Row helper ────────────────────────────────────────────────────────
 
+function GoogleGlyph() {
+  return (
+    <svg
+      className="size-4"
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        fill="#4285F4"
+        d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.76h3.56c2.08-1.92 3.28-4.74 3.28-8.09Z"
+      />
+      <path
+        fill="#34A853"
+        d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.56-2.76c-.99.66-2.25 1.06-3.72 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84A11 11 0 0 0 12 23Z"
+      />
+      <path
+        fill="#FBBC05"
+        d="M5.84 14.11A6.59 6.59 0 0 1 5.5 12c0-.73.13-1.45.34-2.11V7.05H2.18A11 11 0 0 0 1 12c0 1.78.43 3.46 1.18 4.95l3.66-2.84Z"
+      />
+      <path
+        fill="#EA4335"
+        d="M12 5.38c1.62 0 3.06.56 4.21 1.65l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.05l3.66 2.84C6.71 7.31 9.14 5.38 12 5.38Z"
+      />
+    </svg>
+  );
+}
+
 function FacebookGlyph() {
   return (
     <svg

components/auth/oauth-buttons.tsx

@@ -35,7 +35,6 @@ export function OAuthButtons({ next, showDivider = true }: Props) {
   return (
     <div className="space-y-3">
       <div className="grid grid-cols-1 gap-2">
-        {/* Google sign-in — uncomment once the Google OAuth app clears review.
         <a
           href={startUrl("google")}
           className="h-11 inline-flex items-center justify-center gap-2 rounded-md border border-border bg-card text-sm font-medium text-foreground hover:bg-muted transition-colors"
@@ -43,7 +42,6 @@ export function OAuthButtons({ next, showDivider = true }: Props) {
           <GoogleIcon className="size-4" />
           Login with Google
         </a>
-        */}
         <a
           href={startUrl("facebook")}
           className="h-11 inline-flex items-center justify-center gap-2 rounded-md border border-border bg-card text-sm font-medium text-foreground hover:bg-muted transition-colors"
@@ -65,9 +63,6 @@ export function OAuthButtons({ next, showDivider = true }: Props) {
   );
 }
 
-// Kept exported-internally so the Google block above can be uncommented
-// without re-importing or re-pasting the SVG.
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function GoogleIcon({ className }: { className?: string }) {
   return (
     <svg className={className} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden>