Combine file systems into one card

This commit is contained in:
Josh Holtrop 2026-04-20 22:57:31 -04:00
parent 4b74bc01a7
commit 16f88d4401

View File

@ -182,9 +182,13 @@ if cgi.params.key?("content")
end end
if filesystems.any? if filesystems.any?
html << %(<div class="section-label">File Systems</div>) total_size = filesystems.sum { |e| e["size"].to_i }
html << %(<div class="stack">) total_used = filesystems.sum { |e| e["used"].to_i }
filesystems.each do |entry| total_pct_f = total_size > 0 ? (total_used * 100.0 / total_size) : 0.0
total_pct = total_pct_f.round
total_cls = total_pct_f >= 90 ? "bad" : total_pct_f >= 75 ? "warn" : "ok"
fs_rows = filesystems.map do |entry|
mount = CGI.escapeHTML(entry["mount"].to_s) mount = CGI.escapeHTML(entry["mount"].to_s)
source = CGI.escapeHTML(entry["source"].to_s) source = CGI.escapeHTML(entry["source"].to_s)
fstype = CGI.escapeHTML(entry["fstype"].to_s) fstype = CGI.escapeHTML(entry["fstype"].to_s)
@ -207,30 +211,62 @@ if cgi.params.key?("content")
fs_stats << ["warn", "READ-ONLY"] if entry["readonly"] fs_stats << ["warn", "READ-ONLY"] if entry["readonly"]
severities = [space_cls, inode_cls] severities = [space_cls, inode_cls]
card_cls = severities.include?("bad") ? "bad" : row_cls = severities.include?("bad") ? "bad" :
severities.include?("warn") ? "warn" : "ok" severities.include?("warn") ? "warn" : "ok"
stats_html = fs_stats.map { |c, txt| stats_html = fs_stats.map { |c, txt|
%(<span class="stat #{c}">#{CGI.escapeHTML(txt)}</span>) %(<span class="stat #{c}">#{CGI.escapeHTML(txt)}</span>)
}.join }.join
stats_block = fs_stats.empty? ? "" : stats_block = fs_stats.empty? ? "" :
%(<div class="drive-stats" style="margin-top:0.6rem;">#{stats_html}</div>) %(<div class="drive-stats">#{stats_html}</div>)
html << <<~HTML row_html = <<~HTML
<div class="card #{card_cls}"> <div class="subitem" style="flex-direction:column;align-items:stretch;gap:0.35rem;">
<div class="card-header"> <div style="display:flex;justify-content:space-between;align-items:center;">
<span class="card-title">#{mount} <span class="card-capacity">#{fstype}</span></span> <div class="subitem-left">
<span class="badge #{space_cls}">#{pct}%</span> <div class="dot #{space_cls}"></div>
<span class="subitem-name">#{mount} · #{source}</span>
<span class="card-capacity">#{fstype}</span>
</div> </div>
<div style="display:flex;justify-content:space-between;align-items:center;margin-top:0.5rem;margin-bottom:0.3rem;"> <span class="subitem-value #{space_cls}">#{pct}% · #{used_h} / #{size_h}</span>
<span style="font-size:0.72rem;color:#64748b;font-weight:600;">#{source}</span>
<span class="subitem-value #{space_cls}">#{used_h} / #{size_h}</span>
</div> </div>
<div class="bar-track" style="height:6px;"><div class="bar-fill #{space_cls}" style="width:#{pct}%"></div></div> <div class="bar-track"><div class="bar-fill #{space_cls}" style="width:#{pct}%"></div></div>
#{stats_block} #{stats_block}
</div> </div>
HTML HTML
[row_html, row_cls]
end end
severities = fs_rows.map { |_, c| c }
card_cls = severities.include?("bad") ? "bad" :
severities.include?("warn") ? "warn" : "ok"
total_used_h = CGI.escapeHTML(human_capacity(total_used))
total_size_h = CGI.escapeHTML(human_capacity(total_size))
html << %(<div class="section-label">File Systems</div>)
html << <<~HTML
<div class="card #{card_cls}">
<div class="card-header">
<span class="card-title">File Systems</span>
<span class="badge #{total_cls}">#{total_pct}%</span>
</div>
<div class="subitems">
HTML
fs_rows.each { |row_html, _| html << row_html }
html << %(</div>)
html << <<~HTML
<div style="margin-top:0.75rem;padding-top:0.6rem;border-top:1px solid #1e2433;">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.3rem;">
<span style="font-size:0.72rem;color:#64748b;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;">Total</span>
<span class="subitem-value #{total_cls}">#{total_pct}% · #{total_used_h} / #{total_size_h}</span>
</div>
<div class="bar-track" style="height:6px;"><div class="bar-fill #{total_cls}" style="width:#{total_pct}%"></div></div>
</div>
HTML
html << %(</div>) html << %(</div>)
end end