@startuml state-ui
!theme plain
title sofarr — Frontend UI State Diagram

[*] --> SplashScreen : Page load

state SplashScreen {
  state "Showing splash\n(min 1.2s)" as showing
}

SplashScreen --> CheckAuth : checkAuthentication()

state CheckAuth <<choice>>
CheckAuth --> LoginForm : No session cookie
CheckAuth --> Dashboard : Valid session

state LoginForm {
  state "Idle" as lf_idle
  state "Submitting" as lf_submit
  state "Error" as lf_error

  lf_idle --> lf_submit : Submit form
  lf_submit --> lf_error : Auth failed
  lf_error --> lf_submit : Re-submit
  lf_submit --> FadeOutLogin : Auth success
}

state FadeOutLogin {
  state "CSS transition\n(opacity → 0)" as fade
}

FadeOutLogin --> SplashScreen2 : Show splash\nwhile loading

state SplashScreen2 as "Splash (loading data)" {
  state "fetchUserDownloads()" as fetching
}

SplashScreen2 --> Dashboard : Data loaded\ndismissSplash()

state Dashboard {
  state "Rendering Cards" as rendering
  state "Auto Refreshing" as refreshing
  state "Status Panel Open" as status_open
  state "Status Panel Closed" as status_closed

  [*] --> rendering
  rendering --> refreshing : startAutoRefresh()
  refreshing --> rendering : fetchUserDownloads()\n→ renderDownloads()
  rendering --> rendering : Theme change

  status_closed --> status_open : Click "Status" btn\n(admin only)
  status_open --> status_closed : Click close (×)
  status_open --> status_open : Auto-refresh\nrenderStatusPanel()

  [*] --> status_closed

  state "Refresh Rate" as rr {
    state "1s" as r1
    state "5s (default)" as r5
    state "10s" as r10
    state "Off" as roff
    r5 --> r1 : User selects
    r5 --> r10
    r5 --> roff
    r1 --> r5
    r1 --> r10
    r1 --> roff
    r10 --> r1
    r10 --> r5
    r10 --> roff
    roff --> r1
    roff --> r5
    roff --> r10
  }
}

Dashboard --> LoginForm : Logout\n(clear cookie,\nstopAutoRefresh)

@enduml