reopt designreopt design
DocsExploreToolsPricingBuilder
Explore/
opt-ui161opt-charts21opt-datagrid5opt-editor5opt-chat6opt-shell14brandapp-ui8Examples12
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

© 2026 reopt-ai. All rights reserved.

Explore/brandapp-ui/Session Expired Dialog
Session Modalbrandapp-ui example

Session Expired Dialog

한 번 로그인된 세션이 만료되거나 401 응답이 발생하면 전역 모달로 재로그인을 유도합니다. forceReauth=true 면 backdrop/ESC dismiss 가 비활성화됩니다.

Global re-auth modal triggered by session truthy→falsy transition or the reopt:session-expired window event.

authsessiondialogglobal
opt surface add session-expired-dialog
SessionExpiredDialogSESSION_EXPIRED_EVENT
1024px

forceReauth 옵션

true(기본)이면 backdrop/ESC dismiss 가 비활성화되어 사용자가 반드시 재로그인을 거쳐야 합니다.

트리거

실제 환경에서는 (1) authClient.useSession()이 truthy→falsy 로 전이되거나 (2) 보호된 fetch 헬퍼가 401 응답을 받아 reopt:session-expired 윈도우 이벤트를 디스패치할 때 자동으로 열립니다.

이 데모는 트리거 버튼으로 모달을 즉시 열어 비교합니다. 실제 Surface는 자동 감지 + window 이벤트로만 열립니다.

Related Examples

User Menubrandapp-ui

Reopt User Menu

세션 상태에 따라 Avatar + Dropdown(로그아웃) 또는 로그인 버튼을 렌더하는 사용자 메뉴. 로딩/비로그인/로그인 3-state 를 자동 분기합니다.

authsessiondropdownavatar
ReoptUserMenu
Open
🔒

로그인이 필요합니다

이 화면을 이용하려면 Reopt 계정으로 로그인해주세요.

Auth Gatebrandapp-ui

Sign In Gate

authClient.useSession() 상태에 따라 children/EmptyState/Skeleton 을 분기하는 게이트. 비로그인 시 인라인 안내와 SignInWithReoptButton CTA 가 노출됩니다.

authsessionempty-stategate
SignInGate
Open
BrandApp Control
healthy

1,248

OAuth sessions

18

EAV entities

8,420

AI credits

3/4

Published terms

SDK verifierready

server-only clients · webhooks · terms

Controlbrandapp-ui

BrandApp Control Center

brandapp-sdk 인증, SDK verifier, OAuth secret rotation, EAV drift remediation, AI credit guard, webhook replay, 약관 publish 클라이언트를 한 화면에서 점검하는 운영 콘솔형 Surface입니다.

brandapp-sdkverifierautheavai+1
createReoptEavClientcreateReoptTermsClientcreateBrandappProviderSignInGate
Open
PreviousSign In GateNextReopt AI Chat