Merge branch 'main' into rss-blog

Author: LadyBluenotes

package.json

@@ -33,6 +33,8 @@
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.12",
     "@radix-ui/react-toast": "^1.2.2",
+    "@react-three/drei": "^10.7.7",
+    "@react-three/fiber": "^9.5.0",
     "@sentry/react": "^8.35.0",
     "@sentry/vite-plugin": "^2.22.6",
     "@tailwindcss/typography": "^0.5.13",
@@ -84,6 +86,7 @@
     "resend": "^6.6.0",
     "shiki": "^1.4.0",
     "tailwind-merge": "^1.14.0",
+    "three": "^0.182.0",
     "unified": "^11.0.5",
     "unist-util-visit": "^5.0.0",
     "uploadthing": "^7.7.4",
@@ -103,6 +106,7 @@
     "@types/react": "^19.2.0",
     "@types/react-dom": "^19.2.0",
     "@types/remove-markdown": "^0.3.4",
+    "@types/three": "^0.182.0",
     "autoprefixer": "^10.4.18",
     "dotenv-cli": "^8.0.0",
     "drizzle-kit": "^0.31.7",

pnpm-lock.yaml

@@ -17,11 +17,26 @@ import type { OAuthProvider } from './types'
 export const authClient = {
   signIn: {
     /**
-     * Initiate OAuth sign-in with a social provider
+     * Initiate OAuth sign-in with a social provider (full page redirect)
      */
     social: ({ provider }: { provider: OAuthProvider }) => {
       window.location.href = `/auth/${provider}/start`
     },
+
+    /**
+     * Initiate OAuth sign-in in a popup window (for modal-based login)
+     */
+    socialPopup: ({ provider }: { provider: OAuthProvider }) => {
+      const width = 500
+      const height = 600
+      const left = window.screenX + (window.outerWidth - width) / 2
+      const top = window.screenY + (window.outerHeight - height) / 2
+      window.open(
+        `/auth/${provider}/start?popup=true`,
+        'tanstack-oauth',
+        `width=${width},height=${height},left=${left},top=${top},popup=yes`,
+      )
+    },
   },
 
   /**

src/auth/client.ts

@@ -64,6 +64,9 @@ export {
   createOAuthStateCookie,
   clearOAuthStateCookie,
   getOAuthStateCookie,
+  createOAuthPopupCookie,
+  clearOAuthPopupCookie,
+  isOAuthPopupMode,
   SESSION_DURATION_MS,
   SESSION_MAX_AGE_SECONDS,
 } from './session.server'

src/auth/index.server.ts

@@ -186,7 +186,7 @@ export function buildGitHubAuthUrl(
     clientId,
   )}&redirect_uri=${encodeURIComponent(
     redirectUri,
-  )}&scope=user:email&state=${state}`
+  )}&scope=user:email&state=${encodeURIComponent(state)}`
 }
 
 /**
@@ -201,7 +201,7 @@ export function buildGoogleAuthUrl(
     clientId,
   )}&redirect_uri=${encodeURIComponent(
     redirectUri,
-  )}&response_type=code&scope=openid email profile&state=${state}`
+  )}&response_type=code&scope=openid email profile&state=${encodeURIComponent(state)}`
 }
 
 /**

src/auth/oauth.server.ts

@@ -264,6 +264,19 @@ export function getOAuthStateCookie(request: Request): string | null {
   return decodeURIComponent(stateCookie.split('=').slice(1).join('=').trim())
 }
 
+export function createOAuthPopupCookie(isProduction: boolean): string {
+  return `oauth_popup=1; HttpOnly; Path=/; Max-Age=${10 * 60}; SameSite=Lax${isProduction ? '; Secure' : ''}`
+}
+
+export function clearOAuthPopupCookie(isProduction: boolean): string {
+  return `oauth_popup=; HttpOnly; Path=/; Max-Age=0; SameSite=Lax${isProduction ? '; Secure' : ''}`
+}
+
+export function isOAuthPopupMode(request: Request): boolean {
+  const cookies = request.headers.get('cookie') || ''
+  return cookies.split(';').some((c) => c.trim().startsWith('oauth_popup=1'))
+}
+
 // ============================================================================
 // Session Constants
 // ============================================================================