feat(desktop): SaaS [1+2] 빌드 타임 env + OAuth 강제 로그인 게이트

배경:
사용자가 데스크톱 앱 Settings에서 직접 Supabase URL/Key를 입력해야 했음.
SaaS 데스크톱(Notion/Linear/Slack) 패턴에서는 사용자가 OAuth 로그인만 하면 끝이고
연결 정보는 빌드 타임에 박혀있어야 함. V1 single-user 잔재로 인한 UX 결함이었고
사용자가 'SaaS 설계가 잘못된 것 같다'고 우려할 만한 명확한 흠집.

[1] 빌드 타임 Supabase env 주입
- electron.vite.config.ts: defineConfig가 mode 받아 loadEnv('D3RO_') 호출
  - .env, .env.local 자동 로드 (vite/electron-vite 표준)
  - main 번들에 process.env.D3RO_SUPABASE_URL/ANON_KEY를 inline define으로 박음
- ConfigService:
  - BUILD_TIME_SUPABASE_URL / BUILD_TIME_SUPABASE_ANON_KEY 상수
  - isSupabaseBuildTimeConfigured() / getBuildTimeSupabase{Url,AnonKey}() 헬퍼
  - configGet('supabaseUrl'/'supabaseAnonKey')는 빌드 타임 값을 절대 우선
  - configSet은 빌드 타임 모드일 때 supabaseUrl/AnonKey 변경 거부 (덮어쓰기 방지)
- apps/desktop/.env.local 생성 (gitignored, llnocwyqvhgwpdjcqqyw 프로젝트)
- apps/desktop/env.example 템플릿 (committed)

[2] OAuth 첫 실행 강제 게이트
- CloudSyncState에 saasMode: boolean 필드 추가 (CloudSyncService.getState)
- LoginScreen.tsx 신규: Google/GitHub 버튼만 노출 (URL/Key 입력 필드 없음)
  - MetalCard + PhosphorText D3RO 디자인 시스템
  - i18n 키 재사용 (login.subtitle/google/github/terms)
- App.tsx에 AuthGate 추가:
  - cloudSync.getState로 saasMode + authenticated 조회
  - status: 'loading' | 'login-required' | 'authenticated' | 'legacy'
  - saasMode이고 인증 안 됨 → LoginScreen 강제
  - saasMode이고 인증 됨 → 기존 AppLayout
  - saasMode 아님 → 'legacy' (기존 동작 유지, 개발자가 .env.local 설정 안 한 경우)
  - onAuthChanged 구독으로 로그인 직후 자동 전환
- CloudSyncSection (Settings 안):
  - saasMode일 때 URL/Key 입력 필드 완전 숨김 (OAuth 버튼만)
  - !saasMode (legacy)일 때만 기존 입력 화면 유지

검증:
- typecheck OK
- dev 재시작 시 'CloudSync disabled — Supabase URL/key not configured' 로그 사라짐
  → 빌드 타임 env가 정상적으로 ConfigService에 주입되어 client 생성됨
- 첫 실행 시 사용자가 보는 화면 = LoginScreen (Google/GitHub만)
This commit is contained in:
윤찬 2026-04-11 09:38:12 +09:00
parent 2c2f87d7d4
commit dd1c3054dd
7 changed files with 295 additions and 11 deletions

View file

@ -1,5 +1,5 @@
import { resolve } from 'path'
import { defineConfig, externalizeDepsPlugin } from 'electron-vite'
import { defineConfig, externalizeDepsPlugin, loadEnv } from 'electron-vite'
import react from '@vitejs/plugin-react'
const sharedAlias = {
@ -10,14 +10,34 @@ const sharedAlias = {
const workspaceExclude = ['@d3ro/core', '@d3ro/ui', '@d3ro/i18n']
export default defineConfig({
// SaaS 데스크톱 클라이언트: Supabase 연결 정보를 빌드 타임에 박는다.
// `apps/desktop/.env` (committed shared defaults) + `.env.local` (gitignored, 개인/비공개 키)
// 우선순위는 vite/electron-vite의 dotenv 로드 규칙: .env.local > .env.[mode] > .env
// 환경 변수에 값이 없으면 빈 문자열로 박혀, 런타임에 ConfigService가 fallback(설정 UI 입력)으로 동작.
function loadSupabaseEnv(mode: string): { url: string; anonKey: string } {
const env = loadEnv(mode, process.cwd(), 'D3RO_')
return {
url: env.D3RO_SUPABASE_URL ?? '',
anonKey: env.D3RO_SUPABASE_ANON_KEY ?? ''
}
}
export default defineConfig(({ mode }) => {
const supabase = loadSupabaseEnv(mode)
const supabaseDefine = {
'process.env.D3RO_SUPABASE_URL': JSON.stringify(supabase.url),
'process.env.D3RO_SUPABASE_ANON_KEY': JSON.stringify(supabase.anonKey)
}
return {
main: {
plugins: [
externalizeDepsPlugin({
exclude: ['nanoid', 'electron-store', ...workspaceExclude]
})
],
resolve: { alias: sharedAlias }
resolve: { alias: sharedAlias },
define: supabaseDefine
},
preload: {
plugins: [externalizeDepsPlugin({ exclude: workspaceExclude })],
@ -62,4 +82,5 @@ export default defineConfig({
resolve: { alias: sharedAlias },
plugins: [react()]
}
}
})