feat(svg): add option to toggle heavy SVG Glow Filters (glow=true/false)#1925
Conversation
|
@nishtha-agarwal-211 is attempting to deploy a commit to the jhasourav07's projects Team on Vercel. A member of the Team first needs to authorize it. |
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Adds a new optional glow parameter to streak/heatmap badges, allowing users to disable SVG glow filters via query string. Defaults to true to preserve current behavior.
Changes:
- Adds
glowfield toBadgeParamstype andstreakParamsSchemawith defaulttrue. - Conditionally renders
<filter id="glow">/<filter id="hm-glow">defs andfilter="url(...)"attributes ingenerator.tsbased onparams.glow. - Threads
glowthrough the streak API route and adds unit tests for schema and SVG rendering.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| types/index.ts | Adds optional glow field to BadgeParams. |
| lib/validations.ts | Adds glow zod field with default true and string→boolean transform. |
| lib/validations.test.ts | Tests for the new glow schema behavior. |
| lib/svg/generator.ts | Conditionally emits glow filters and attributes; plumbs glow into heatmap grid. |
| lib/svg/generator.test.ts | Tests glow inclusion/omission in main and heatmap SVGs. |
| app/api/streak/route.ts | Extracts and forwards glow into badge params. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| glow: z | ||
| .string() | ||
| .optional() | ||
| .transform((val) => { | ||
| if (val === undefined) return true; | ||
| return val === 'true' || val === '1'; | ||
| }) | ||
| .default(true), |
| const filterGlow = | ||
| params.glow !== false | ||
| ? `<filter id="glow" x="-50%" y="-50%" width="200%" height="200%"><feGaussianBlur stdDeviation="${fs(5)}" result="blur" /><feComposite in="SourceGraphic" in2="blur" operator="over" /></filter>` | ||
| : ''; |
| it('renders glow filter and attributes by default', () => { | ||
| const svg = generateSVG(mockStats, { user: 'avi' } as unknown as BadgeParams, mockCalendar); | ||
| expect(svg).toContain('<filter id="glow"'); | ||
| expect(svg).toContain('filter="url(#glow)"'); | ||
| }); |
| return `<defs> | ||
| <filter id="glow" x="-50%" y="-50%" width="200%" height="200%"><feGaussianBlur stdDeviation="${fs(5)}" result="blur" /><feComposite in="SourceGraphic" in2="blur" operator="over" /></filter> | ||
| ${filterGlow} | ||
| ${gradients} | ||
| </defs>`; |
github-actions
Bot
added
the
needs-rebase
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
24 similar comments
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
|
Please pull the latest changes and resolve the conflicts so we can review it! git fetch origin
git rebase origin/main
# resolve any conflicts, then:
git push --force-with-leaseOnce resolved, the |
github-actions
Bot
removed
the
needs-rebase
Aamod007
left a comment
Aamod007
left a comment
There was a problem hiding this comment.
Adds a glow URL parameter (defaults to true, backward compatible) to toggle heavy SVG Gaussian blur filters. When glow=false, the <filter id=glow> (and hm-glow for heatmaps) tags are omitted from <defs>, and filter=url(#glow) attributes are removed from text/cell elements. Applied across regular badge SVG, wrapped SVG, heatmap SVG, and auto-theme heatmap variants.
- 6 files, +147/-21
- 1158/1158 tests pass (4 pre-existing failures from missing
gsap/react-force-graph-2ddeps) - TypeScript typecheck has no new errors
|
🎉 Congratulations @nishtha-agarwal-211! Your PR has been successfully merged. 🚀 Thank you for contributing to CommitPulse. Your work helps us build a better tool for the community.
Keep building! 💻✨ |
JhaSourav07
added
GSSoC 2026
level:intermediate
Description
Fixes #1731
Introduces a new
glowURL query parameter (glow=true/false) that allows users to enable or disable heavy SVG Gaussian blur filters (<feGaussianBlur>) and text shadow-effects on active contribution statistics/total labels.When
glow=falseis requested:<filter id="glow">(and<filter id="hm-glow">for heatmaps) tags are completely omitted from<defs>.filter="url(#glow)"(and cell-levelfilter="url(#hm-glow)"on heatmaps) attributes are conditionally removed from the text and cell elements.This provides an optimized, flatter, and crisper vector styling alternative designed to dramatically enhance scroll performance on low-end mobile devices and ensure support on markdown renderers that block filter assets.
Fixes #1731
Pillar
Visual Preview
N/A — Visual layout remains identical to baseline, but Gaussian blur filter masks are removed to output flat, sharp vector paths.
Checklist before requesting a review:
CONTRIBUTING.mdfile.localhost:3000/api/streak?user=YOUR_USERNAME).npm run formatandnpm run lintlocally and resolved all errors (CI will fail otherwise).feat(themes): ...,fix(calculate): ...).README.mdif I added a new theme or URL parameter.