Skip to content

Design feedback: subheader, controls layout, pie chart legend spacing - #9

Merged
ekoslow1-creator merged 3 commits into
mainfrom
sc-46311/design-feedback
Aug 11, 2026
Merged

Design feedback: subheader, controls layout, pie chart legend spacing#9
ekoslow1-creator merged 3 commits into
mainfrom
sc-46311/design-feedback

Conversation

@ekoslow1-creator

Copy link
Copy Markdown
Collaborator

Summary

  • Replace the Developers logo with a centered Hebrew/English subheader (Cardo font for the Hebrew line)
  • Widen and align the search bar and category toggle with the project grid; move the project count beneath them
  • Add spacing between pie chart legend labels for readability

Test plan

  • Visually confirm subheader renders correctly (Hebrew RTL + English line)
  • Confirm search bar and category toggle align with project grid at various widths
  • Confirm pie chart legend labels are readable

🤖 Generated with Claude Code

…acing

Replaces the Developers logo with a Hebrew/English subheader block,
widens and aligns the search bar and category toggle with the project
grid, and adds breathing room between pie chart legend labels.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@gitvelocity-reviewer

Copy link
Copy Markdown

📊 Code Quality Score: 30/100

Base Score 50 × ESF 0.6 = 30

Category Score Factors
🔭 Scope 11/20 13 files across UI components, data fetching, utility logic, CSS, and tests; broad surface within a single app; no new public APIs or external integrations
🏗️ Architecture 8/20 Migrates date parsing to a cleaner data model (ISO timestamps vs tag strings); introduces local/prod merge pattern in fetchProjects; removes complex viewport-math CSS hack; no new service boundaries
⚙️ Implementation 10/20 ISO date parsing with NaN guard; mostRecentCompletedMonth abstraction; Map-based dedup merge with prod-wins semantics; Legend itemSorter override with clear comment; custom scrollbar CSS
⚠️ Risk 10/20 Promise.all failure mode breaks dashboard when local server is absent (production risk); date parsing change affects all three trend charts simultaneously; no feature flag or rollback mechanism noted
✅ Quality 9/15 Tests updated to match new submission_date data model with good edge case coverage; fetchProjects merge logic (highest-risk new code) has no tests; no documentation of the local/prod merge behavior
🔒 Perf / Security 2/5 Custom scrollbar styling; SVG data URI for select dropdown arrow; no security or performance concerns introduced

Was this score accurate? 👍 Yes · 👎 No

How this was scored →

Scored by GitVelocity · How are scores calculated?

The local dev API merge is no longer needed now that the production
endpoint is up to date. Also fixes .gitignore: the unanchored data/
rule was accidentally shadowing src/data/ too; the anchored /data/
rule already covers the intended raw-dump exclusion.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR primarily applies UI/layout adjustments to the dashboard header, controls, and chart legends, and also includes functional changes to how submissions trend data is computed and displayed.

Changes:

  • Replaces the header logo with a bilingual (Hebrew/English) subheader block and adds Cardo font support.
  • Reworks dashboard controls layout (search + category select) and adjusts styling, including pie chart legend spacing and scrollbars.
  • Updates submissions trend utilities to use submission_date (ISO timestamp) and to chart through the most recently completed month, with corresponding test updates.

Reviewed changes

Copilot reviewed 12 out of 13 changed files in this pull request and generated 4 comments.

Show a summary per file
File Description
src/utils/techUsed.js Renames the MCP technology label.
src/utils/submissionsTrend.js Switches trend bucketing to submission_date and changes month windowing logic.
src/utils/tests/submissionsTrend.test.js Updates tests to match new submission_date parsing and completed-month windowing.
src/Title.jsx Replaces Developers logo with bilingual subheader content.
src/index.css Adds header/subheader styles, adjusts controls layout, tweaks project card/category styling, and adds legend spacing.
src/data/fetchProjects.js Refactors fetching into helper and improves fetch error message.
src/components/Controls.jsx Wraps input/select into a row and updates search placeholder/copy.
src/components/charts/VibeCodedTrendChart.jsx Reorders color map entries to match series ordering.
src/components/charts/types/PieChart.jsx Adds a class hook for styling pie chart legend spacing.
src/components/charts/types/LineChart.jsx Attempts to preserve legend order by disabling Recharts legend sorting.
src/components/charts/SubmissionsTrendChart.jsx Changes the chart title text.
index.html Adds Cardo font alongside EB Garamond.
.gitignore Narrows data ignore rule to repo-root /data/.
Suppressed comments (1)

src/utils/submissionsTrend.js:56

  • The PR description focuses on design/layout tweaks, but this file introduces behavioral changes to analytics (switching trend calculations to submission_date and excluding the current month). Please update the PR description to reflect these functional changes or split them into a separate PR so reviewers can assess the data/logic change independently.
// Builds the data for SubmissionsTrendChart: total submission count per
// month, for the trailing 12 months ending at the most recently completed
// month before referenceDate.
export function getSubmissionsMonthlyTrend(projects, referenceDate = new Date()) {
  const months = last12Months(mostRecentCompletedMonth(referenceDate))


💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment on lines +13 to 23
// submission_date is an ISO timestamp like "2026-07-19T14:54:00+00:00", or
// null for projects that don't have one. Turns it into a { year, monthIndex }
// object in local time, or null when there's nothing to parse.
function parseSubmissionMonth(submissionDate) {
if (!submissionDate) return null

const monthIndex = MONTH_NAMES.indexOf(match[1])
if (monthIndex === -1) return null
const date = new Date(submissionDate)
if (Number.isNaN(date.getTime())) return null

return { year: Number(match[2]), monthIndex }
return { year: date.getFullYear(), monthIndex: date.getMonth() }
}
Comment thread src/index.css
Comment thread src/components/charts/SubmissionsTrendChart.jsx
Comment on lines +17 to 22
{/* Legend's default itemSorter is 'value', which alphabetizes entries by
name — overriding the order series/<Line> below are declared in (e.g.
"Not vibe-coded" would sort before "Vibe-coded"). Disable it to keep
declaration order instead. */}
<Legend itemSorter={null} />
{series.map(({ key, name, color }) => (

@saengel saengel left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall looks great! Good work on a small, focused, branch-specific PR. Let's address some of the copilot feedback (I resolved the one that was irrelevant in my eyes) and then re-review before merging.

<BarChart
data={data}
title="Submissions, past 12 months"
title="Submissions since August 2025"

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch!

Comment thread src/components/charts/SubmissionsTrendChart.jsx
…der, safe legend sorter

- submissionsTrend.js: bucket submission months by UTC instead of local
  time so results don't shift depending on the viewer's timezone
- index.css: allow the subheader description to wrap instead of forcing
  nowrap, which caused horizontal overflow on narrow viewports
- LineChart.jsx: replace itemSorter={null} with a function that sorts
  legend items by their declared series order, since Recharts expects
  itemSorter to be callable

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

@saengel saengel left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved - great work!

@ekoslow1-creator
ekoslow1-creator merged commit e18bb61 into main Aug 11, 2026
1 check passed
@gitvelocity-reviewer

Copy link
Copy Markdown

📊 Code Quality Score: 26/100

44 base × 0.6 ESF = 26.4, rounded to 26

Category Score Factors
🔭 Scope 10/20 13 files across UI components, CSS, data fetching, utility logic, and tests; single frontend application; multiple subsystems touched but no new endpoints or external integrations
🏗️ Architecture 8/20 Meaningful data model improvement (tag strings → ISO timestamps); new mostRecentCompletedMonth helper with clear separation of concern; minor fetchProjectList extraction; UTC-aware parsing replaces fragile regex; no new external dependencies
⚙️ Implementation 9/20 ISO timestamp parsing with UTC correctness; non-obvious Recharts Legend itemSorter fix; custom scrollbar CSS with webkit pseudo-elements and color-mix(); SVG data URI for dropdown arrow; controls layout refactor is straightforward
⚠️ Risk 5/20 Assumes API provides submission_date field; silent zero-fill if field absent; no feature flags or rollback plan; CSS changes are cosmetic; no auth/DB/external API changes
✅ Quality 10/15 Test suite comprehensively updated for new submission_date field; covers null, missing, unparseable dates, multi-month bucketing, experience filtering, vibe-coded series; good inline comments on non-obvious behavior; no UI component tests but acceptable for layout/CSS changes
🔒 Perf / Security 2/5 UTC-aware parsing prevents timezone-dependent bucketing bugs; no benchmarks or threat analysis

Was this score accurate? 👍 Yes · 👎 No

How this was scored →

Scored by GitVelocity · How are scores calculated?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants