Sovereignty page: interactive charts and mobile fixes - #1
Conversation
Replace static benchmark images with Gemini and GLM bar charts, add the Hausa evaluation scatter plot, and improve mobile layout for inline visualizations. Co-authored-by: Cursor <cursoragent@cursor.com>
📝 WalkthroughWalkthroughThis change updates sovereignty/index.html with a new CSS variable for header height used across the fixed header and sticky hscroll pin, plus styling for a wrapped logo link. The Gemini and GLM benchmark figures and the Hausa evaluation figure are converted from static images to interactive markup driven by new JavaScript: model/category datasets, chip-based category switching, SVG chart rendering, and a Hausa scatter plot. Mobile layout handling is reworked for inline visual containers and figlayer repositioning, with re-rendering triggered on layout breakpoint changes. Additional tweaks adjust chart label font sizing and conditionally remove the login button. 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@sovereignty/index.html`:
- Around line 4534-4547: The renderBenchPanels function is only drawing the
first two benchmarks via cat.benchmarks.slice(0, 2), but the coding category
defines more benchmarks that are never shown. Update renderBenchPanels to render
the full intended set by removing the truncation or otherwise aligning the
displayed benchmarks with GLM_CATEGORIES and the bench-panel/svg generation so
no configured benchmarks are silently dropped.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 7035f6f3-a9f7-4905-977e-f57b19f3cbe3
⛔ Files ignored due to path filters (2)
sovereignty/assets/gooey-wordmark.pngis excluded by!**/*.pngsovereignty/assets/zhipu-logo.svgis excluded by!**/*.svg
📒 Files selected for processing (1)
sovereignty/index.html
| function renderBenchPanels(panelsEl, cat, models) { | ||
| if (!panelsEl || !cat) return; | ||
| panelsEl.innerHTML = cat.benchmarks | ||
| .slice(0, 2) | ||
| .map( | ||
| (bench, bi) => | ||
| `<div class="bench-panel"><svg class="bench-svg" data-bench="${bi}" viewBox="0 0 700 0" role="img" aria-label="${bench.name}"></svg></div>`, | ||
| ) | ||
| .join(""); | ||
| cat.benchmarks.slice(0, 2).forEach((bench, bi) => { | ||
| const svg = panelsEl.querySelector(`svg[data-bench="${bi}"]`); | ||
| if (svg) renderBenchSvg(svg, bench, models); | ||
| }); | ||
| } |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# Inspect the target function in context
sed -n '4510,4575p' sovereignty/index.html | cat -n
# Find other benchmark panel rendering or display limits
rg -n "slice\(0,\s*2\)|renderBenchPanels|benchmarks" sovereignty/index.html
# Locate category definitions with more than two benchmarks
rg -n "benchmarks\s*:\s*\[" sovereignty/index.htmlRepository: GooeyAI/gooey-static-pages
Length of output: 5446
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# Read the benchmark category definitions around all benchmark blocks
for range in \
'3638,3700p' \
'3690,3768p' \
'3778,3838p' \
'3870,4005p'
do
echo "===== sed -n ${range} sovereignty/index.html ====="
sed -n "$range" sovereignty/index.html | cat -n
done
# Look for any explanatory text or styling around the benchmark panels
rg -n "bench-panel|bench-svg|bench-chip|Influence the AI benchmarks|two|top 2|slice\\(0, 2\\)" sovereignty/index.htmlRepository: GooeyAI/gooey-static-pages
Length of output: 14761
Only render the benchmarks you intend to show
renderBenchPanels truncates each category to slice(0, 2), but GLM_CATEGORIES.id="coding" defines five benchmarks. The other three never appear in the chart, so either render them all or remove the unused entries.
🧰 Tools
🪛 ast-grep (0.44.1)
[warning] 4535-4541: Avoid assigning untrusted data to innerHTML/outerHTML or document.write
Context: panelsEl.innerHTML = cat.benchmarks
.slice(0, 2)
.map(
(bench, bi) =>
<div class="bench-panel"><svg class="bench-svg" data-bench="${bi}" viewBox="0 0 700 0" role="img" aria-label="${bench.name}"></svg></div>,
)
.join("")
Note: [CWE-79] Improper Neutralization of Input During Web Page Generation ('Cross-site Scripting').
(inner-outer-html)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@sovereignty/index.html` around lines 4534 - 4547, The renderBenchPanels
function is only drawing the first two benchmarks via cat.benchmarks.slice(0,
2), but the coding category defines more benchmarks that are never shown. Update
renderBenchPanels to render the full intended set by removing the truncation or
otherwise aligning the displayed benchmarks with GLM_CATEGORIES and the
bench-panel/svg generation so no configured benchmarks are silently dropped.
1 participant
Summary
inline-visfigures (positioning, full-width charts, edge-to-edge overview image)Test plan
assets/zhipu-logo.svgand category pills show Coding, Agentic, Reasoning onlyMade with Cursor