[Feat] 백엔드 API 연동 프론트엔드 및 오류 복구 개선

[Gimini-3]

변경 내용

• 기존 화면 프로토타입을 인증 상태와 백엔드 API를 사용하는 실제 프론트엔드로 교체했습니다.
• 회원가입·로그인, 검색, 문서 목록/상세/업로드, 컬렉션, 권한, MCP 토큰, 계정, 관리자 화면을 각각의 경로와 API에 연결했습니다.
• 브라우저에는 백엔드 주소를 노출하지 않고 /api/backend/* 서버 프록시를 통해 요청하도록 구성했습니다.
• vinext catch-all 경로에서 내부 링크 클릭이 멈추던 문제를 전체 페이지 이동 방식으로 해결했습니다.
• 문서 상세 조회가 선택적 연관관계 때문에 500으로 실패하지 않도록 조회 범위를 단순화하고, 일부 상세 API 실패 시에도 목록 요약 정보를 표시하도록 보완했습니다.
• Ollama 응답 제한 시간을 환경 변수로 구성하고, AI 답변 생성이 지연되거나 실패해도 검색 결과와 근거 문서를 반환하도록 저하 응답을 추가했습니다.
• 배포된 백엔드가 최신 권한/관리 API를 아직 제공하지 않는 경우 버전 불일치 안내를 표시합니다.

원인

• 기존 프론트엔드는 정적 프로토타입 중심이라 버튼과 상세 경로가 실제 API 흐름으로 이어지지 않았습니다.
• vinext의 클라이언트 라우팅이 catch-all 페이지 이동을 정상 처리하지 못했습니다.
• 문서 상세 조회의 다중 JOIN FETCH와 프론트의 일괄 실패 처리 때문에 백엔드 한 요청이 실패하면 상세 화면 전체가 오류로 전환됐습니다.
• Ollama의 기존 30초 읽기 제한이 프론트 호스팅 요청 제한과 겹쳐 검색 요청이 서버 응답 전에 종료될 수 있었습니다.

검증

• cd frontend && npm test
  • 프로덕션 빌드 성공
  • 애플리케이션 16개 경로 서버 렌더링 성공
  • 인증 경계와 내부 링크 이동 회귀 테스트 성공
• cd frontend && npm run lint
• cd backend && env DB_PORT=5432 DB_SSLMODE=disable JWT_SECRET=docgrid-local-full-suite-secret-key-2026 ./gradlew test
  • 전체 백엔드 테스트 성공

배포 참고

• 프론트 서버는 BACKEND_API_URL을 사용합니다. 로컬 기본값은 http://localhost:8080입니다.
• 운영 EC2 백엔드는 이 변경을 병합한 뒤 함께 배포해야 문서 상세 오류 복구와 RAG 저하 응답이 적용됩니다.

Summary by CodeRabbit

새로운 기능

• 문서 검색, 컬렉션 관리, 권한 설정, MCP 토큰 관리 기능을 제공합니다.
• 로그인·회원가입과 세션 기반 인증을 지원합니다.
• 문서 업로드, 버전 업로드, 미리보기 및 다운로드를 지원합니다.
• 관리자 대시보드, 인덱싱 작업, 워커 및 사용자 관리 화면을 추가했습니다.

개선 사항

• AI 검색 서비스 장애 시 검색 후보와 인용을 포함한 안내 응답을 제공합니다.
• 백엔드 연결 및 응답 제한 시간을 설정할 수 있습니다.
• 모바일 환경의 내비게이션과 로딩·오류·알림 표시를 개선했습니다.

문서

• 설치, 환경 변수, 실행 방법 및 백엔드 연동 안내를 업데이트했습니다.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 54a521f7-c98e-473b-8a39-19274d968a79

📥 Commits

Reviewing files that changed from the base of the PR and between db4791d and a212c91.

⛔ Files ignored due to path filters (2)

• frontend/package-lock.json is excluded by !**/package-lock.json
• frontend/public/og.png is excluded by !**/*.png

📒 Files selected for processing (36)

• backend/src/main/java/com/opensource/docgrid/domain/document/repository/DocumentRepository.java
• backend/src/main/java/com/opensource/docgrid/domain/document/service/query/DocumentQueryService.java
• backend/src/main/java/com/opensource/docgrid/domain/rag/service/RagFacade.java
• backend/src/main/java/com/opensource/docgrid/global/config/OllamaServerConfig.java
• backend/src/main/resources/application.yml
• backend/src/test/java/com/opensource/docgrid/domain/document/repository/DocumentRepositoryFetchTest.java
• backend/src/test/java/com/opensource/docgrid/domain/document/service/query/DocumentQueryServiceTest.java
• backend/src/test/java/com/opensource/docgrid/domain/rag/service/RagFacadeTest.java
• frontend/.env.example
• frontend/.gitignore
• frontend/README.md
• frontend/app/[...slug]/page.tsx
• frontend/app/api/backend/[...path]/route.ts
• frontend/app/chatgpt-auth.ts
• frontend/app/components/AppShell.tsx
• frontend/app/components/AuthPage.tsx
• frontend/app/components/AuthProvider.tsx
• frontend/app/components/DocGridApp.tsx
• frontend/app/components/PrototypeApp.tsx
• frontend/app/components/UploadModal.tsx
• frontend/app/components/ui.tsx
• frontend/app/features/AccountPage.tsx
• frontend/app/features/AdminPages.tsx
• frontend/app/features/CollectionsPage.tsx
• frontend/app/features/DocumentsPage.tsx
• frontend/app/features/McpTokensPage.tsx
• frontend/app/features/PermissionsPage.tsx
• frontend/app/features/SearchPage.tsx
• frontend/app/globals.css
• frontend/app/layout.tsx
• frontend/app/lib/api-types.ts
• frontend/app/lib/api.ts
• frontend/app/page.tsx
• frontend/package.json
• frontend/tests/rendered-html.test.mjs
• frontend/vite.config.ts

---

📝 Walkthrough

Walkthrough

DocGrid 프런트엔드를 인증 기반 애플리케이션으로 교체했습니다. 백엔드에는 문서 조회 범위 조정, RAG fallback 응답, Ollama 제한 시간 설정을 적용했습니다. Next.js 백엔드 프록시와 문서·컬렉션·권한·관리자 기능을 추가했습니다.

Changes

백엔드 조회 및 RAG 처리

Layer / File(s)	Summary
문서 현재 버전 조회 backend/src/main/java/.../DocumentRepository.java, backend/src/main/java/.../DocumentQueryService.java, backend/src/test/java/.../DocumentRepositoryFetchTest.java, backend/src/test/java/.../DocumentQueryServiceTest.java	상세 조회를 현재 버전 중심 조회로 변경했습니다. 소유자와 파일 정보는 트랜잭션에서 필요할 때 로딩합니다.
RAG LLM 실패 응답 backend/src/main/java/.../RagFacade.java, backend/src/test/java/.../RagFacadeTest.java	LLM 실패 시 실패 응답을 저장하고 fallback 답변과 검색 후보 citation을 반환합니다. 영속화 실패는 별도로 전파합니다.
Ollama 제한 시간 설정 backend/src/main/java/.../OllamaServerConfig.java, backend/src/main/resources/application.yml	연결 제한 시간 5초와 읽기 제한 시간 20초를 환경설정으로 주입해 Ollama transport에 적용합니다.

DocGrid 프런트엔드 애플리케이션

Layer / File(s)	Summary
API 계약과 백엔드 프록시 frontend/app/lib/api-types.ts, frontend/app/lib/api.ts, frontend/app/api/backend/[...path]/route.ts, frontend/vite.config.ts, frontend/.env.example	공통 API 타입, JWT 요청 처리, 파일 다운로드·미리보기, 401 처리, 다중 HTTP 메서드 프록시를 추가했습니다.
인증과 애플리케이션 라우터 frontend/app/components/AuthPage.tsx, frontend/app/components/AuthProvider.tsx, frontend/app/components/DocGridApp.tsx, frontend/app/components/AppShell.tsx, frontend/app/[...slug]/page.tsx	로그인·회원가입·세션 복원과 권한 기반 라우팅을 추가했습니다. 관리자 메뉴와 모바일 내비게이션을 제공합니다.
문서 검색과 작업 화면 frontend/app/features/SearchPage.tsx, frontend/app/features/DocumentsPage.tsx, frontend/app/features/CollectionsPage.tsx, frontend/app/components/UploadModal.tsx, frontend/app/features/AccountPage.tsx, frontend/app/components/ui.tsx	검색, 문서 상세·파일 작업, 컬렉션 관리, 업로드, 계정 화면과 공통 상태 UI를 추가했습니다.
권한과 관리자 기능 frontend/app/features/PermissionsPage.tsx, frontend/app/features/McpTokensPage.tsx, frontend/app/features/AdminPages.tsx	권한 부여·회수, MCP 토큰 관리, 인덱싱 Job, Worker, 관리자 사용자 관리 화면을 추가했습니다.
스타일, 문서 및 라우트 검증 frontend/app/globals.css, frontend/README.md, frontend/app/layout.tsx, frontend/tests/rendered-html.test.mjs, frontend/package.json, frontend/.gitignore	DocGrid 스타일과 반응형 레이아웃을 반영했습니다. 실행 문서와 HTML·내비게이션 검증을 갱신했습니다.

Estimated code review effort: 5 (Critical) | ~120 minutes

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant AuthProvider
  participant DocGridApp
  participant apiRequest
  participant BackendProxy
  User->>DocGridApp: 경로 접근
  DocGridApp->>AuthProvider: 세션 상태 확인
  AuthProvider->>apiRequest: /auth/me 요청
  apiRequest->>BackendProxy: 인증 API 요청
  BackendProxy-->>apiRequest: 사용자 응답
  apiRequest-->>AuthProvider: 인증 사용자 반환
  AuthProvider-->>DocGridApp: 인증 상태 제공
  DocGridApp-->>User: 보호된 화면 또는 인증 화면 렌더링

Loading

Possibly related PRs

• DocGrid/docgrid#160: 동일한 DocumentRepository.findByIdWithDetail 및 DocumentQueryService 문서 상세 조회 흐름과 직접 연결됩니다.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/frontend-integration-stability

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}