3-5 New Charts - #4
Conversation
…r bucketing Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
…pty experience trend - getToolUsageCounts now filters sefaria_tools_used to string entries before normalizing, so a non-string entry (null, number, etc.) in this free-text user-submitted field is skipped instead of throwing and blanking out all four Charts & Analytics charts via the outer catch handler. - Move the experienceTrend.length === 0 empty-state message inline (matching the pie chart's own conditional-render guard) instead of an early return, so the two bar charts and the pie chart still render when there's no experience-level data. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Shares VIBE_CODED_SERIES between submissionsTrend.js and ChartsAndAnalytics.jsx (mirroring the EXPERIENCE_LEVELS precedent) instead of hardcoding the strings twice, and adds a one-sentence caption noting vibe_coded is a newly-tracked field so the chart isn't misread as a real overnight trend reversal. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Extracts known technology names from the free-text tech_used_raw field via case-insensitive substring matching, with "Claude Code" checked and excluded first so it doesn't double-count toward the generic Claude/Anthropic API bucket. Shows the top 8 by project count as a horizontal bar chart, matching the existing keyword-frequency chart's style.
Reuses the fixed-order categorical hue palette already used in the charts (blue/orange/aqua/violet/magenta, gray for Uncategorized). Background and border are computed via color-mix() at low strength so each pill stays pale; text is mixed toward --text-h for a muted look instead of a fully saturated hue.
…chart
Recharts' category axis auto-hides tick labels it calculates would
overlap; interval={0} disables that, and the wider axis column gives
longer labels like "Claude/Anthropic API" room to fit.
📊 Code Quality Score: 42/100
Was this score accurate? 👍 Yes · 👎 No Scored by GitVelocity · How are scores calculated? |
saengel
left a comment
There was a problem hiding this comment.
Overall, fantastic work! Some comments and learning opportunities - happy to review together when we meet next.
|
|
||
| // Fixed-order categorical hues; gray is reserved for the "Other" bucket and | ||
| // is never one of the 6 identity colors. | ||
| const TOOL_SLICE_COLORS = ['#2a78d6', '#eb6834', '#1baf7a', '#eda100', '#e87ba4', '#008300'] |
There was a problem hiding this comment.
Do these match the Sefaria-specific color palette? Worth a quick check (for all of the colors used)
| </ResponsiveContainer> | ||
|
|
||
| <h2>Submissions by experience level</h2> | ||
| {experienceTrend.length === 0 ? ( |
There was a problem hiding this comment.
Each chart should be scoped into its own wrapper React component and JSX file, and then rendered here to make the code more readable, organized and reusable.
(Learn more about this practice here)
| label={(props) => | ||
| props.index === experienceTrend.length - 1 ? ( | ||
| <text | ||
| x={props.x + 6} |
There was a problem hiding this comment.
What's going on with the calculations here? Why is it necessary to add 6?
|
|
||
| <h2>Most-used Sefaria API endpoints</h2> | ||
| {toolUsage.length === 0 ? ( | ||
| <p>No endpoint data available yet.</p> |
There was a problem hiding this comment.
I'd change this text (everywhere on the page) to Data unavailable
|
|
||
| <h2>Vibe-coded vs. not, past 12 months</h2> | ||
| <p> | ||
| "Vibe-coded" is a newly-tracked field, so earlier months may be undercounted or unreported rather than confirmed non-vibe-coded. |
| </ResponsiveContainer> | ||
| )} | ||
|
|
||
| <h2>Vibe-coded vs. not, past 12 months</h2> |
There was a problem hiding this comment.
More accurate to say tracked since July 2026 since we unfortunately don't have it explicitly from much earlier
| @@ -1,3 +1,5 @@ | |||
| import { getCategoryColor } from '../utils/categories.js' | |||
|
|
|||
There was a problem hiding this comment.
This is a great example of a small, composable component
| @@ -0,0 +1,21 @@ | |||
| import { test } from 'node:test' | |||
There was a problem hiding this comment.
Wonderful that you added tests - always important. Let's reassess the best testing framework etc soon, we use Playwright on Sefaria-Project, might be worth aligning.
| @@ -1,2 +1,2 @@ | |||
| :root { | |||
| /* Sefaria brand palette */ | |||
There was a problem hiding this comment.
I would double check, not sure Claude got it right. Let's also make this the one source of truth for the colors if possible and import from here as much as possible.
| // get counted toward the generic Claude/Anthropic API bucket. | ||
| const CLAUDE_CODE_PATTERN = 'claude code' | ||
|
|
||
| export const KNOWN_TECHNOLOGIES = [ |
There was a problem hiding this comment.
This probably needs to be more robust to be useful in the future, might be a bit too fitted to the current data - but we can leave for now and remove in the future/adapt as needed.
New charts for the dashboard