- name: Statistics
  columns:
    - size: small
      widgets:
        - type: custom-api
          title: Jellyfin
          base-url: https://jellyfin.${GROUND_DOMAIN}
          options:
            url: https://jellyfin.${GROUND_DOMAIN}
            key: ${JELLYFIN_API_KEY}
          template: |
            {{ $url := .Options.StringOr "url" "" }}
            {{ $key := .Options.StringOr "key" "" }}

            {{- if or (eq $url "") (eq $key "") -}}
              <p>Error: The URL or API key was not configured in the widget options.</p>
            {{- else -}}
              {{- $auth := printf "MediaBrowser Token=\"%s\"" $key -}}
              {{- $countsUrl := printf "%s/Items/Counts" $url -}}
              {{- $jellyfinData := newRequest $countsUrl | withHeader "Authorization" $auth | getResponse -}}
              {{- $audiobooksUrl := printf "%s/Items?IncludeItemTypes=AudioBook&Recursive=true&Limit=0&EnableTotalRecordCount=true" $url -}}
              {{- $audiobooksData := newRequest $audiobooksUrl | withHeader "Authorization" $auth | getResponse -}}

              {{- if and (eq $jellyfinData.Response.StatusCode 200) (eq $audiobooksData.Response.StatusCode 200) -}}
                <div style="display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 1.5rem; text-align: center;">
                  <div>
                    <div class="color-highlight size-h3">{{ $jellyfinData.JSON.Int "MovieCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">Movies</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $jellyfinData.JSON.Int "SeriesCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">TV Shows</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $jellyfinData.JSON.Int "EpisodeCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">Episodes</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $jellyfinData.JSON.Int "SongCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">Songs</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $jellyfinData.JSON.Int "BookCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">Books</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $audiobooksData.JSON.Int "TotalRecordCount" | formatNumber }}</div>
                    <div class="size-h5 uppercase">Audiobooks</div>
                  </div>
                </div>
              {{- else -}}
                <p>Failed to fetch Jellyfin library counts (Counts: {{ $jellyfinData.Response.StatusCode }}, Audiobooks: {{ $audiobooksData.Response.StatusCode }}).</p>
              {{- end -}}
            {{- end -}}

        - type: custom-api
          title: SABnzbd
          cache: 30s
          url: https://sabnzbd.${GROUND_DOMAIN}/api?output=json&apikey=${SABNZBD_API_KEY}&mode=queue
          headers:
            Authorization: Basic ${AUTHENTIK_BASIC_AUTH}
            Accept: application/json
          template: |
            <div class="p-2">
              <div class="flex justify-between mb-2">
                <div class="flex-1">
                  <div class="size-h6">SPEED</div>
                  <div class="color-highlight size-h3">{{ if eq (.JSON.String "queue.status") "Downloading" }}{{ .JSON.String "queue.speed" }}B/s{{ else }}Paused{{ end }}</div>
                </div>
                <div class="flex-1">
                  <div class="size-h6">TIME LEFT</div>
                  <div class="color-highlight size-h3">{{ if eq (.JSON.String "queue.status") "Downloading" }}{{ .JSON.String "queue.timeleft" }}{{ else }}--:--:--{{ end }}</div>
                </div>
              </div>
              <div class="flex justify-between mb-2">
                <div class="flex-1">
                  <div class="size-h6">QUEUE</div>
                  <div class="color-highlight size-h3">{{ .JSON.Int "queue.noofslots" }} items</div>
                </div>
                <div class="flex-1">
                  <div class="size-h6">SIZE</div>
                  <div class="color-highlight size-h3">{{ .JSON.Float "queue.mb" | printf "%.1f" }}MB</div>
                </div>
              </div>
            </div>

        - type: custom-api
          title: qBittorrent
          cache: 10s
          options:
            view: "basic"
            mode: "upload"
          subrequests:
            transfer:
              url: https://qui.${GROUND_DOMAIN}/proxy/${QUI_API_TOKEN}/api/v2/transfer/info
            seeding:
              url: https://qui.${GROUND_DOMAIN}/proxy/${QUI_API_TOKEN}/api/v2/torrents/info
              parameters:
                filter: seeding
            leeching:
              url: https://qui.${GROUND_DOMAIN}/proxy/${QUI_API_TOKEN}/api/v2/torrents/info
              parameters:
                filter: downloading
          template: |
            {{ $transfer := .Subrequest "transfer" }}
            {{ $seeding := .Subrequest "seeding" }}
            {{ $leeching := .Subrequest "leeching" }}

            {{ if and (eq $transfer.Response.StatusCode 200) (eq $seeding.Response.StatusCode 200) (eq $leeching.Response.StatusCode 200) }}
              {{ $isDetailed := eq (.Options.StringOr "view" "detailed") "detailed" }}
              {{ $mode := .Options.StringOr "mode" "default" }}

              {{ if $isDetailed }}
              <div class="list" style="--list-gap: 15px;">
                <div class="flex justify-between text-center">
                  <div>
                    {{ $dlSpeed := $transfer.JSON.Float "dl_info_speed" }}
                    {{ if eq $mode "upload" }}
                      <div class="color-highlight size-h3">{{ printf "%.1f MB/s" (div $dlSpeed 1000000.0) }}</div>
                    {{ else }}
                      {{ if lt $dlSpeed 1048576.0 }}
                        <div class="color-highlight size-h3">{{ printf "%.0f KiB/s" (div $dlSpeed 1024.0) }}</div>
                      {{ else }}
                        <div class="color-highlight size-h3">{{ printf "%.1f MiB/s" (div $dlSpeed 1048576.0) }}</div>
                      {{ end }}
                    {{ end }}
                    <div class="size-h6">DOWNLOADING</div>
                  </div>

                  {{ if eq $mode "upload" }}
                  <div>
                    {{ $ulSpeed := $transfer.JSON.Float "up_info_speed" }}
                    <div class="color-highlight size-h3">{{ printf "%.1f MB/s" (div $ulSpeed 1000000.0) }}</div>
                    <div class="size-h6">UPLOADING</div>
                  </div>
                  {{ end }}

                  <div>
                    <div class="color-highlight size-h3">{{ len ($seeding.JSON.Array "") }}</div>
                    <div class="size-h6">SEEDING</div>
                  </div>

                  {{ if eq $mode "default" }}
                  <div>
                    <div class="color-highlight size-h3">{{ len ($leeching.JSON.Array "") }}</div>
                    <div class="size-h6">LEECHING</div>
                  </div>
                  {{ end }}
                </div>

                {{ $downloadingTorrents := $leeching.JSON.Array "" }}
                {{ if gt (len $downloadingTorrents) 0 }}
                  <div style="margin-top: 15px;">
                    <ul class="list collapsible-container" data-collapse-after="0" style="--list-gap: 15px;">
                      {{ range $t := $downloadingTorrents }}
                        {{ $state := $t.String "state" }}
                        {{ $icon := "?" }}
                        {{ if ge ($t.Int "completed") ($t.Int "size") }}{{ $icon = "OK" }}
                        {{ else if eq $state "downloading" "forcedDL" }}{{ $icon = "v" }}
                        {{ else if eq $state "pausedDL" "stoppedDL" "pausedUP" "stalledDL" "stalledUP" "queuedDL" "queuedUP" }}{{ $icon = "||" }}
                        {{ else if eq $state "error" "missingFiles" }}{{ $icon = "!" }}
                        {{ else if eq $state "checkingDL" "checkingUP" "allocating" }}{{ $icon = "..." }}
                        {{ else if eq $state "checkingResumeData" }}{{ $icon = "R" }}
                        {{ end }}

                        <li class="flex items-center" style="gap: 10px;">
                          <div class="size-h4" style="flex-shrink: 0;">{{ $icon }}</div>
                          <div style="flex-grow: 1; min-width: 0;">
                            <div class="text-truncate color-highlight">{{ $t.String "name" }}</div>
                            <div title="{{ $t.Float "progress" | mul 100 | printf "%.1f" }}%" style="background: rgba(128, 128, 128, 0.2); border-radius: 5px; height: 6px; margin-top: 5px; overflow: hidden;">
                              <div style="width: {{ $t.Float "progress" | mul 100 }}%; background-color: var(--color-positive); height: 100%; border-radius: 5px;"></div>
                            </div>
                          </div>
                          <div style="flex-shrink: 0; text-align: right; width: 80px;">
                            {{ $dlSpeed := $t.Float "dlspeed" }}
                            <div class="size-sm color-paragraph">
                              {{ if eq $mode "upload" }}
                                {{ if lt $dlSpeed 1000.0 }}--{{ else }}{{ printf "%.1f MB/s" (div $dlSpeed 1000000.0) }}{{ end }}
                              {{ else }}
                                {{ if lt $dlSpeed 1024.0 }}--{{ else if lt $dlSpeed 1048576.0 }}{{ printf "%.0f KiB/s" (div $dlSpeed 1024.0) }}{{ else }}{{ printf "%.1f MiB/s" (div $dlSpeed 1048576.0) }}{{ end }}
                              {{ end }}
                            </div>
                            {{ $eta := $t.Int "eta" }}
                            <div class="size-sm color-paragraph">
                              {{ if eq $eta 8640000 }}inf
                              {{ else if gt $eta 3600 }}{{ printf "%dh %dm" (div $eta 3600) (mod (div $eta 60) 60) }}
                              {{ else if gt $eta 0 }}{{ printf "%dm" (div $eta 60) }}
                              {{ else }}--{{ end }}
                            </div>
                          </div>
                        </li>
                      {{ end }}
                    </ul>
                  </div>
                {{ end }}

                {{ if eq $mode "upload" }}
                  {{ $seedingTorrents := $seeding.JSON.Array "" }}
                  {{ if gt (len $seedingTorrents) 0 }}
                    <div style="margin-top: 20px;">
                      <ul class="list collapsible-container" data-collapse-after="0" style="--list-gap: 15px;">
                        {{ range $t := $seedingTorrents }}
                          {{ $state := $t.String "state" }}
                          {{ $icon := "^" }}
                          {{ if eq $state "pausedUP" "stoppedUP" "stalledUP" "queuedUP" }}{{ $icon = "||" }}
                          {{ else if eq $state "error" "missingFiles" }}{{ $icon = "!" }}
                          {{ else if eq $state "checkingUP" }}{{ $icon = "..." }}
                          {{ else if eq $state "checkingResumeData" }}{{ $icon = "R" }}
                          {{ end }}

                          <li class="flex items-center" style="gap: 10px;">
                            <div class="size-h4" style="flex-shrink: 0;">{{ $icon }}</div>
                            <div style="flex-grow: 1; min-width: 0;">
                              <div class="text-truncate color-highlight">{{ $t.String "name" }}</div>
                              <div class="size-sm color-paragraph">
                                Ratio: {{ printf "%.2f" ($t.Float "ratio") }} |
                                Size: {{ printf "%.1f GB" (div ($t.Float "size") 1073741824.0) }}
                              </div>
                            </div>
                            <div style="flex-shrink: 0; text-align: right; width: 80px;">
                              {{ $ulSpeed := $t.Float "upspeed" }}
                              <div class="size-sm color-paragraph">
                                {{ if lt $ulSpeed 1000.0 }}--{{ else }}{{ printf "%.1f MB/s" (div $ulSpeed 1000000.0) }}{{ end }}
                              </div>
                              <div class="size-sm color-paragraph">Upload</div>
                            </div>
                          </li>
                        {{ end }}
                      </ul>
                    </div>
                  {{ end }}
                {{ end }}
              </div>

              {{ else }}
              <div class="flex justify-between text-center">
                <div>
                  {{ $dlSpeed := $transfer.JSON.Float "dl_info_speed" }}
                  <div class="color-highlight size-h3">{{ printf "%.1f MB/s" (div $dlSpeed 1000000.0) }}</div>
                  <div class="size-h6">DOWNLOADING</div>
                </div>
                {{ if eq $mode "upload" }}
                <div>
                  {{ $ulSpeed := $transfer.JSON.Float "up_info_speed" }}
                  <div class="color-highlight size-h3">{{ printf "%.1f MB/s" (div $ulSpeed 1000000.0) }}</div>
                  <div class="size-h6">UPLOADING</div>
                </div>
                {{ end }}
                <div>
                  <div class="color-highlight size-h3">{{ len ($seeding.JSON.Array "") }}</div>
                  <div class="size-h6">SEEDING</div>
                </div>
                {{ if eq $mode "default" }}
                <div>
                  <div class="color-highlight size-h3">{{ len ($leeching.JSON.Array "") }}</div>
                  <div class="size-h6">LEECHING</div>
                </div>
                {{ end }}
              </div>
              {{ end }}
            {{ else }}
              <div class="color-negative text-center">
                <p>Error fetching qBittorrent data.</p>
                <p class="size-sm">Check QUI proxy URL and token.</p>
              </div>
            {{ end }}

        - type: custom-api
          title: Dockhand
          title-url: https://dockhand.${GROUND_DOMAIN}
          cache: 1h
          url: https://dockhand.${GROUND_DOMAIN}/api/environments?env=1
          headers:
            Authorization: Bearer ${DOCKHAND_API_TOKEN}
          subrequests:
            containers:
              url: https://dockhand.${GROUND_DOMAIN}/api/containers?env=1
              headers:
                Authorization: Bearer ${DOCKHAND_API_TOKEN}
            images:
              url: https://dockhand.${GROUND_DOMAIN}/api/images?env=1
              headers:
                Authorization: Bearer ${DOCKHAND_API_TOKEN}
            networks:
              url: https://dockhand.${GROUND_DOMAIN}/api/networks?env=1
              headers:
                Authorization: Bearer ${DOCKHAND_API_TOKEN}
            volumes:
              url: https://dockhand.${GROUND_DOMAIN}/api/volumes?env=1
              headers:
                Authorization: Bearer ${DOCKHAND_API_TOKEN}
            stacks:
              url: https://dockhand.${GROUND_DOMAIN}/api/stacks?env=1
              headers:
                Authorization: Bearer ${DOCKHAND_API_TOKEN}
          template: |
            <style>
              .dockhand-icon {
                height: 1.5em;
                margin-bottom: 0.25em;
              }
            </style>

            {{ $containers := (.Subrequest "containers").JSON.Array "" }}
            {{ $images := (.Subrequest "images").JSON.Array "" }}
            {{ $networks := (.Subrequest "networks").JSON.Array "" }}
            {{ $volumes := (.Subrequest "volumes").JSON.Array "" }}
            {{ $stacks := (.Subrequest "stacks").JSON.Array "" }}

            {{ $running := 0 }}
            {{ $stopped := 0 }}
            {{ range $containers }}
              {{ if eq (.String "state") "running" }}
                {{ $running = add $running 1 }}
              {{ else }}
                {{ $stopped = add $stopped 1 }}
              {{ end }}
            {{ end }}

            <div style="display:flex; justify-content:space-between; gap:12px; margin-top:0.5em;">
              <div data-popover-type="text" data-popover-text="Running containers"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div class="size-h3 color-highlight">{{ $running }}</div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/container-running.svg" alt="">
              </div>

              <div data-popover-type="text" data-popover-text="Stopped containers"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div class="size-h3 color-highlight">{{ $stopped }}</div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/container-stopped.svg" alt="">
              </div>

              <div data-popover-type="html" data-popover-position="bottom" data-popover-margin="0.2rem"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div class="size-h3 color-highlight">{{ len $images }}</div>
                <div data-popover-html="">
                  <div style="margin-bottom:0.75rem;">Images</div>
                  {{ $unused := 0 }}
                  {{ $totalBytes := 0 }}
                  {{ range $images }}
                    {{ if eq (.Int "containers") 0 }}
                      {{ $unused = add $unused 1 }}
                    {{ end }}
                    {{ $totalBytes = add $totalBytes (.Int "size") }}
                  {{ end }}
                  {{ $totalGB := div $totalBytes 1073741824 }}
                  {{ $decimal := mod (div $totalBytes 1048576) 1024 }}
                  <div style="display:flex; justify-content:space-between; gap:0.5rem;">
                    <div>Unused images:</div>
                    <div class="color-highlight">{{ $unused }}</div>
                  </div>
                  <div style="display:flex; justify-content:space-between; gap:0.5rem;">
                    <div>Total size:</div>
                    <div class="color-highlight">{{ printf "%d.%02d GB" $totalGB $decimal }}</div>
                  </div>
                </div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/images.svg" alt="" style="margin-top:0.25rem;">
              </div>

              <div data-popover-type="text" data-popover-text="Volumes"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div class="size-h3 color-highlight">{{ len $volumes }}</div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/volumes.svg" alt="">
              </div>

              <div data-popover-type="html" data-popover-margin="0.2rem" data-popover-position="bottom"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div data-popover-html="" style="white-space:nowrap; width:max-content;">
                  <div style="margin-bottom:0.75rem;">Networks</div>
                  {{ $userDefined := 0 }}
                  {{ $system := 0 }}
                  {{ range $networks }}
                    {{ if gt (len (.Array "containers")) 0 }}
                      {{ $userDefined = add $userDefined 1 }}
                    {{ else }}
                      {{ $system = add $system 1 }}
                    {{ end }}
                  {{ end }}
                  <div style="display:flex; justify-content:space-between; gap:0.5rem;">
                    <div>In use:</div>
                    <div class="color-highlight">{{ $userDefined }}</div>
                  </div>
                  <div style="display:flex; justify-content:space-between; gap:0.5rem;">
                    <div>Unused:</div>
                    <div class="color-highlight">{{ $system }}</div>
                  </div>
                </div>
                <div class="size-h3 color-highlight">{{ len $networks }}</div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/networks.svg" alt="">
              </div>

              <div data-popover-type="text" data-popover-text="Stacks"
                   style="flex:1; display:flex; flex-direction:column; align-items:center;">
                <div class="size-h3 color-highlight">{{ len $stacks }}</div>
                <img class="dockhand-icon" src="/assets/icons/dockhand/stacks.svg" alt="">
              </div>
            </div>

    - size: full
      widgets:
        - type: split-column
          widgets:
            - type: custom-api
              title: Indexers
              cache: 1m
              options:
                url: https://prowlarr.${GROUND_DOMAIN}
                base-url: https://prowlarr.${GROUND_DOMAIN}
                api-key: ${PROWLARR_API_KEY}
                collapse-after: 999
              template: |
                {{ $apiBaseUrl := .Options.StringOr "base-url" "" }}
                {{ $key := .Options.StringOr "api-key" "" }}
                {{ $url := .Options.StringOr "url" "" }}
                {{ $collapseAfter := .Options.IntOr "collapse-after" 5 }}

                {{ if or (eq $apiBaseUrl "") (eq $key "") (eq $url "") }}
                  <div class="widget-error-header">
                    <div class="color-negative size-h3">ERROR</div>
                    <span class="asset-icon widget-error-icon" style="--asset-icon: url('/assets/icons/status/widget-error.svg'); --asset-color: var(--color-negative)"></span>
                  </div>
                  <p class="break-all">Some options are not set or malformed.</p>
                {{ else }}
                  {{ $indexUrl := printf "%s/api/v1/indexer" $apiBaseUrl }}
                  {{ $indexData := newRequest $indexUrl
                    | withHeader "Accept" "application/json"
                    | withHeader "Authorization" "Basic ${AUTHENTIK_BASIC_AUTH}"
                    | withHeader "X-Api-Key" $key
                    | getResponse }}

                  {{ if eq $indexData.Response.StatusCode 200 }}
                    <style>
                      .prowlarr-indexers .prowlarr-index-item {
                        align-items: center;
                      }
                      .prowlarr-indexers .prowlarr-index-item > span {
                        text-transform: capitalize;
                        background: var(--color-background);
                        padding: 0.2rem 0.75rem;
                        border: 1px solid var(--color-widget-content-border);
                        border-radius: var(--border-radius);
                        font-size: var(--font-size-tiny);
                      }
                    </style>

                    <ul class="prowlarr-indexers list list-gap-10 collapsible-container" data-collapse-after="{{ $collapseAfter }}">
                      {{ range $indexData.JSON.Array "" }}
                        <li class="flex items-center gap-12 prowlarr-index-item">
                          <a href="{{ $url }}" target="_blank" class="size-title-dynamic color-highlight text-truncate block grow">{{ .String "name" }}</a>
                          <span>{{ .String "privacy" }}</span>
                          {{ if .Bool "enable" }}
                            <div class="margin-left-auto shrink-0" data-popover-type="text" data-popover-position="above" data-popover-text="Enabled" aria-label="Enabled">
                              <div class="monitor-site-status-icon-compact" title="Enabled">
                                <span class="asset-icon indexer-status-icon" style="--asset-icon: url('/assets/icons/status/enabled.svg'); --asset-color: var(--color-positive)"></span>
                              </div>
                            </div>
                          {{ else }}
                            <div class="margin-left-auto shrink-0" data-popover-type="text" data-popover-position="above" data-popover-text="Disabled" aria-label="Disabled">
                              <div class="monitor-site-status-icon-compact" title="Disabled">
                                <span class="asset-icon indexer-status-icon" style="--asset-icon: url('/assets/icons/status/disabled.svg'); --asset-color: var(--color-negative)"></span>
                              </div>
                            </div>
                          {{ end }}
                        </li>
                      {{ end }}
                    </ul>
                  {{ else }}
                    <p>Failed to fetch data (Status: {{ $indexData.Response.StatusCode }})</p>
                  {{ end }}
                {{ end }}

            - type: custom-api
              title: Server Stats
              cache: 5m
              options:
                base-url: https://beszel.${GROUND_DOMAIN}
                email: ${BESZEL_EMAIL}
                password: ${BESZEL_PASSWORD}
              template: |
                {{ $baseURL := .Options.StringOr "base-url" "" }}
                {{ $email := .Options.StringOr "email" "" }}
                {{ $password := .Options.StringOr "password" "" }}

                {{ define "errorMsg" }}
                  <div class="widget-error-header">
                    <div class="color-negative size-h3">ERROR</div>
                    <span class="asset-icon widget-error-icon" style="--asset-icon: url('/assets/icons/status/widget-error.svg'); --asset-color: var(--color-negative)"></span>
                  </div>
                  <p class="break-all">{{ . }}</p>
                {{ end }}

                {{ define "formatGigabytes" }}
                  {{ $value := . }}
                  {{ $label := "GiB" }}
                  {{- if lt $value 1.0 }}
                    {{ $value = mul $value 1024.0 }}
                    {{ $label = "MiB" }}
                  {{- else if lt $value 1024.0 }}
                  {{ else }}
                    {{ $value = div $value 1024.0 }}
                    {{ $label = "TiB" }}
                  {{ end }}
                  {{ printf "%.1f" $value }} <span class="color-base size-h5">{{ $label }}</span>
                {{ end }}

                {{ if or (eq $baseURL "") (eq $email "") (eq $password "") }}
                  {{ template "errorMsg" "Some required options are not set." }}
                {{ else }}
                  {{ $authBody := printf "{\"identity\":%s,\"password\":%s}" (.Options.JSON "email") (.Options.JSON "password") }}
                  {{ $authResponse := newRequest (print $baseURL "/api/collections/users/auth-with-password")
                    | withParameter "fields" "token"
                    | withHeader "Content-Type" "application/json"
                    | withStringBody $authBody
                    | getResponse }}

                  {{ if ne $authResponse.Response.StatusCode 200 }}
                    {{ template "errorMsg" (printf "Beszel authentication failed: %s" $authResponse.Response.Status) }}
                  {{ else }}
                    {{ $token := concat "Bearer " ($authResponse.JSON.String "token") }}

                    {{ $systemsResponse := newRequest (print $baseURL "/api/collections/systems/records")
                      | withHeader "Authorization" $token
                      | getResponse }}

                    {{ if ne $systemsResponse.Response.StatusCode 200 }}
                      {{ template "errorMsg" (printf "Failed to fetch Beszel systems: %s" $systemsResponse.Response.Status) }}
                    {{ else }}
                    {{ range $n, $system := $systemsResponse.JSON.Array "items" }}
                    {{ $status := $system.String "status" }}

                    {{ $systemStatsRequest := newRequest (print $baseURL "/api/collections/system_stats/records")
                      | withHeader "Authorization" $token
                      | withParameter "sort" "-created"
                      | withParameter "page" "1"
                      | withParameter "perPage" "1"
                      | withParameter "filter" (print "type='1m'&&system='" ($system.String "id") "'")
                      | getResponse }}

                    {{ $systemStatItems := $systemStatsRequest.JSON.Array "items" }}

                    {{ $hostname := $system.String "name" }}
                    {{ $uptimeSec := $system.Float "info.u" }}

                    {{ $systemTemp := $system.Float "info.dt" }}

                    {{ $cpuLoad := $system.Float "info.cpu" }}
                    {{ $cpuLoad1m := $system.Float "info.la.0" }}
                    {{ $cpuLoad15m := $system.Float "info.la.2" }}

                    {{ $memoryUsedPercent := $system.Float "info.mp" }}
                    {{ $rootUsedPercent := $system.Float "info.dp" }}

                    {{ $hasStats := false }}
                    {{ $systemStats := "" }}

                    {{ $memoryTotalGb := 0.0 }}
                    {{ $memoryUsedGb := 0.0 }}
                    {{ $swapTotalGb := 0.0 }}
                    {{ $swapUsedGb := 0.0 }}
                    {{ $swapUsedPercent := 0.0 }}
                    {{ $rootTotalGb := 0.0 }}
                    {{ $rootUsedGb := 0.0 }}

                    {{ if gt (len $systemStatItems) 0 }}
                      {{ $hasStats = true }}
                      {{ $systemStats = index $systemStatItems 0 }}

                      {{ $memoryTotalGb = $systemStats.Float "stats.m" }}
                      {{ $memoryUsedGb = $systemStats.Float "stats.mu" }}

                      {{ $swapTotalGb = $systemStats.Float "stats.s" }}
                      {{ $swapUsedGb = $systemStats.Float "stats.su" }}
                      {{ if gt $swapTotalGb 0.0 }}
                        {{ $swapUsedPercent = mul (div $swapUsedGb $swapTotalGb) 100.0 }}
                      {{ end }}

                      {{ $rootTotalGb = $systemStats.Float "stats.d" }}
                      {{ $rootUsedGb = $systemStats.Float "stats.du" }}
                    {{ end }}

                    <div class="server">
                      <div class="server-info">
                        <div class="server-details">
                          <div class="server-name color-highlight size-h3">{{ $hostname }}</div>
                          <div>
                            {{ if eq $status "up" }}
                              <span>{{ printf "%.1f" (mul $uptimeSec 0.000011574) }}d</span> uptime
                            {{ else }}
                              unreachable
                            {{ end }}
                          </div>
                        </div>
                        <div class="shrink-0"{{ if eq $status "up" }} data-popover-type="html" data-popover-margin="0.2rem" data-popover-max-width="400px"{{ end }}>
                          {{- if eq $status "up" }}
                          <div data-popover-html>
                            <div class="flex">
                              <div class="size-h5 text-compact">Kernel</div>
                              <div class="value-separator"></div>
                              <div class="color-highlight">{{ $system.String "info.k" }}</div>
                            </div>
                            <div class="flex">
                              <div class="size-h5 text-compact">CPU</div>
                              <div class="value-separator"></div>
                              <div class="color-highlight">{{ $system.String "info.m" }}</div>
                            </div>
                          </div>
                          {{- end }}
                          <span class="asset-icon server-icon" style="--asset-icon: url('/assets/icons/beszel/server.svg'); --asset-color: var(--color-{{ if eq $status "up" }}positive{{ else }}negative{{ end }})"></span>
                        </div>
                      </div>

                      <div class="server-stats">
                        <div class="flex-1">
                          <div class="flex items-end size-h5">
                            <div>CPU</div>
                            {{- if ge $systemTemp 80.0 }}
                            <span class="asset-icon server-spicy-cpu-icon" style="--asset-icon: url('/assets/icons/beszel/fire.svg'); --asset-color: var(--color-negative)"></span>
                            {{- end }}
                            <div class="color-highlight margin-left-auto text-very-compact">{{ $cpuLoad }} <span class="color-base">%</span></div>
                          </div>
                          <div data-popover-type="html">
                            <div data-popover-html>
                              <div class="flex">
                                <div class="size-h5">1M AVG</div>
                                <div class="value-separator"></div>
                                <div class="color-highlight text-very-compact">{{ printf "%.1f" $cpuLoad1m }} <span class="color-base size-h5">%</span></div>
                              </div>
                              <div class="flex margin-top-3">
                                <div class="size-h5">15M AVG</div>
                                <div class="value-separator"></div>
                                <div class="color-highlight text-very-compact">{{ printf "%.1f" $cpuLoad15m }} <span class="color-base size-h5">%</span></div>
                              </div>
                              <div class="flex margin-top-3">
                                <div class="size-h5">TEMP C</div>
                                <div class="value-separator"></div>
                                <div class="color-highlight text-very-compact">{{ printf "%.1f" $systemTemp }} <span class="color-base size-h5">C</span></div>
                              </div>
                            </div>

                            <div class="progress-bar progress-bar-combined">
                              <div class="progress-value{{ if ge $cpuLoad1m 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $cpuLoad1m }}"></div>
                              <div class="progress-value{{ if ge $cpuLoad15m 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $cpuLoad15m }}"></div>
                            </div>
                          </div>
                        </div>

                        <div class="flex-1">
                          <div class="flex justify-between items-end size-h5">
                            <div>RAM</div>
                            <div class="color-highlight text-very-compact">{{ $memoryUsedPercent }} <span class="color-base">%</span></div>
                          </div>
                          <div data-popover-type="html">
                            {{- if $hasStats }}
                            <div data-popover-html>
                              <div class="flex">
                                <div class="size-h5">RAM</div>
                                <div class="value-separator"></div>
                                <div class="color-highlight text-very-compact">
                                  {{ template "formatGigabytes" $memoryUsedGb }} <span class="color-base size-h5">/</span> {{ template "formatGigabytes" $memoryTotalGb }}
                                </div>
                              </div>
                              {{- if gt $swapTotalGb 0.0 }}
                              <div class="flex margin-top-3">
                                <div class="size-h5">SWAP</div>
                                <div class="value-separator"></div>
                                <div class="color-highlight text-very-compact">
                                  {{ template "formatGigabytes" $swapUsedGb }} <span class="color-base size-h5">/</span> {{ template "formatGigabytes" $swapTotalGb }}
                                </div>
                              </div>
                              {{- end }}
                            </div>
                            {{- end }}
                            <div class="progress-bar progress-bar-combined">
                              <div class="progress-value{{ if ge $memoryUsedPercent 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $memoryUsedPercent }}"></div>
                              {{- if gt $swapTotalGb 0.0 }}
                              <div class="progress-value{{ if ge $swapUsedPercent 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $swapUsedPercent }}"></div>
                              {{- end }}
                            </div>
                          </div>
                        </div>

                        <div class="flex-1">
                          <div class="flex justify-between items-end size-h5">
                            <div>DISK</div>
                            <div class="color-highlight text-very-compact">{{ $rootUsedPercent }} <span class="color-base">%</span></div>
                          </div>
                          <div data-popover-type="html">
                            {{- if $hasStats }}
                            <div data-popover-html>
                              <ul class="list list-gap-2">
                                <li class="flex">
                                  <div class="size-h5">/</div>
                                  <div class="value-separator"></div>
                                  <div class="color-highlight text-very-compact">
                                    {{ template "formatGigabytes" $rootUsedGb }} <span class="color-base size-h5">/</span> {{ template "formatGigabytes" $rootTotalGb }}
                                  </div>
                                </li>
                                {{ range $key, $efs := ($systemStats.Get "stats.efs").Map }}
                                  <li class="flex">
                                    <div class="size-h5">{{ $key }}</div>
                                    <div class="value-separator"></div>
                                    <div class="color-highlight text-very-compact">
                                      {{ template "formatGigabytes" (($efs.Get "du").Float) }} <span class="color-base size-h5">/</span> {{ template "formatGigabytes" (($efs.Get "d").Float) }}
                                    </div>
                                  </li>
                                {{ end }}
                              </ul>
                            </div>
                            {{- end }}
                            <div class="progress-bar progress-bar-combined">
                              <div class="progress-value{{ if ge $rootUsedPercent 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $rootUsedPercent }}"></div>
                              {{ range $key, $efs := ($system.Get "info.efs").Map }}
                                {{ $percent := $efs.Float }}
                                <div class="progress-value{{ if ge $percent 85.0 }} progress-value-notice{{ end }}" style="--percent: {{ $percent }}"></div>
                              {{ end }}
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  {{ end }}
                  {{ end }}
                  {{ end }}
                {{ end }}

            - type: custom-api
              title: Immich Stats
              cache: 10m
              url: https://immich.${GROUND_DOMAIN}/api/server/statistics
              headers:
                x-api-key: ${IMMICH_API_KEY}
              subrequests:
                storage:
                  url: https://immich.${GROUND_DOMAIN}/api/server/storage
                  headers:
                    x-api-key: ${IMMICH_API_KEY}
              template: |
                {{ $photos := .JSON.Int "photos" }}
                {{ $videos := .JSON.Int "videos" }}
                {{ $usageGiB := div (toFloat (.JSON.Int "usage")) 1073741824.0 }}
                {{ $storage := .Subrequest "storage" }}
                {{ $storageOK := and (ge $storage.Response.StatusCode 200) (le $storage.Response.StatusCode 299) }}
                {{ $totalGiB := 0.0 }}
                {{ $percentage := 0.0 }}
                {{ if $storageOK }}
                  {{ $totalGiB = div (toFloat ($storage.JSON.Int "diskSizeRaw")) 1073741824.0 }}
                  {{ $percentage = $storage.JSON.Float "diskUsagePercentage" }}
                {{ end }}

                <div style="display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; text-align: center;">
                  <div>
                    <div class="color-highlight size-h3">{{ $photos | formatNumber }}</div>
                    <div class="size-h6">PHOTOS</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ $videos | formatNumber }}</div>
                    <div class="size-h6">VIDEOS</div>
                  </div>
                  <div>
                    <div class="color-highlight size-h3">{{ printf "%.1f" $usageGiB }} <span class="color-base size-h5">GiB</span></div>
                    <div class="size-h6">STORAGE</div>
                  </div>
                </div>
                {{ if $storageOK }}
                  <div class="immich-storage-label">
                    <span>{{ printf "%.1f" $usageGiB }} / {{ printf "%.1f" $totalGiB }} GiB</span>
                    <span>{{ printf "%.1f" $percentage }}%</span>
                  </div>
                  <div class="progress-bar"><div class="progress-value" style="--percent: {{ $percentage }}"></div></div>
                {{ else }}
                  <div class="color-negative size-h5 margin-top-10">Storage total unavailable.</div>
                {{ end }}

    - size: small
      widgets:
        - type: custom-api
          cache: 1h
          title: Internet Speed (Euclid)
          title-url: https://speedtest.${GROUND_DOMAIN}
          url: https://speedtest.${GROUND_DOMAIN}/api/v1/results/latest
          headers:
            Authorization: Bearer ${SPEEDTEST_API_TOKEN}
            Accept: application/json
          subrequests:
            stats:
              url: https://speedtest.${GROUND_DOMAIN}/api/v1/stats
              headers:
                Authorization: Bearer ${SPEEDTEST_API_TOKEN}
                Accept: application/json
          options:
            showPercentageDiff: true
          template: |
            {{ $showPercentage := .Options.BoolOr "showPercentageDiff" true }}
            {{ $stats := .Subrequest "stats" }}

            <div class="flex justify-between text-center margin-block-3">
              <div>
                {{ $downloadChange := percentChange (.JSON.Float "data.download_bits") ($stats.JSON.Float "data.download.avg_bits") }}
                {{ if $showPercentage }}
                  <div class="size-small {{ if gt $downloadChange 0.0 }}color-positive{{ else if lt $downloadChange 0.0 }}color-negative{{ else }}color-primary{{ end }}" style="display: inline-flex; align-items: center;">
                    {{ $downloadChange | printf "%+.1f%%" }}
                  </div>
                {{ end }}
                <div class="color-highlight size-h3">{{ .JSON.Float "data.download_bits" | mul 0.000001 | printf "%.1f" }}</div>
                <div class="size-h6">DOWNLOAD</div>
              </div>
              <div>
                {{ $uploadChange := percentChange (.JSON.Float "data.upload_bits") ($stats.JSON.Float "data.upload.avg_bits") }}
                {{ if $showPercentage }}
                  <div class="size-small {{ if gt $uploadChange 0.0 }}color-positive{{ else if lt $uploadChange 0.0 }}color-negative{{ else }}color-primary{{ end }}" style="display: inline-flex; align-items: center;">
                    {{ $uploadChange | printf "%+.1f%%" }}
                  </div>
                {{ end }}
                <div class="color-highlight size-h3">{{ .JSON.Float "data.upload_bits" | mul 0.000001 | printf "%.1f" }}</div>
                <div class="size-h6">UPLOAD</div>
              </div>
              <div>
                {{ $pingChange := percentChange (.JSON.Float "data.ping") ($stats.JSON.Float "data.ping.avg") }}
                {{ if $showPercentage }}
                  <div class="size-small {{ if gt $pingChange 0.0 }}color-negative{{ else if lt $pingChange 0.0 }}color-positive{{ else }}color-primary{{ end }}" style="display: inline-flex; align-items: center;">
                    {{ $pingChange | printf "%+.1f%%" }}
                  </div>
                {{ end }}
                <div class="color-highlight size-h3">{{ .JSON.Float "data.ping" | printf "%.0f ms" }}</div>
                <div class="size-h6">PING</div>
              </div>
            </div>