Skip to content

Commit 59b37f4

Browse files
authored
fix(svg): use actual weekday for tower positioning (JhaSourav07#2044)
## Description Fixes JhaSourav07#2043 This PR fixes an SVG layout bug where contribution towers are rendered in incorrect day-of-week rows when the contribution range starts in the middle of a week. Previously, `computeTowers()` used the array index of `contributionDays` as the day-of-week coordinate: ```ts const coords = projectIsometric(i, j); ``` This incorrectly assumes that `contributionDays[0]` always represents Sunday. For partial first weeks (e.g., custom `from` dates or new GitHub accounts), the first entry may actually be Wednesday, Thursday, etc., causing towers to be shifted into the wrong rows. The fix derives the actual weekday from the contribution date: ```ts const dayOfWeekIndex = new Date(day.date).getUTCDay(); const coords = projectIsometric(i, dayOfWeekIndex); ``` This ensures correct tower placement regardless of whether a week is complete or partial. ## Pillar * [ ] 🎨 Pillar 1 — New Theme Design * [x] 📐 Pillar 2 — Geometric SVG Improvement * [ ] 🕐 Pillar 3 — Timezone Logic Optimization * [x] 🛠️ Other (Bug fix, refactoring, docs) ## Visual Preview N/A – layout positioning fix. SVG output was verified using a date range that begins mid-week and towers now align with their correct weekday rows. ## Checklist before requesting a review: * [x] I have read the `CONTRIBUTING.md` file. * [x] I have tested these changes locally (`localhost:3000/api/streak?user=YOUR_USERNAME`). * [x] I have run `npm run format` and `npm run lint` locally and resolved all errors (CI will fail otherwise). * [x] My commits follow the Conventional Commits format (e.g., `feat(themes): ...`, `fix(calculate): ...`). * [ ] I have updated `README.md` if I added a new theme or URL parameter. (Not applicable) * [x] I have started the repo. * [x] I have made sure that i have only one commit to merge in this PR. * [x] The SVG output matches the CommitPulse "premium quality" aesthetic standard (no raw elements, smooth animations, correct fonts). * [x] (Recommended) I joined the CommitPulse Discord community for contributor discussions, mentorship, and faster PR support.
2 parents 3ed113d + 2aff30e commit 59b37f4

2 files changed

Lines changed: 8 additions & 7 deletions

File tree

lib/svg/layout.test.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -223,22 +223,22 @@ it('assigns correct row and col values based on week/day position', () => {
223223
weeks: [
224224
{
225225
contributionDays: [
226+
{ contributionCount: 1, date: '2024-06-09' },
226227
{ contributionCount: 1, date: '2024-06-10' },
227228
{ contributionCount: 1, date: '2024-06-11' },
228-
{ contributionCount: 1, date: '2024-06-12' },
229229
],
230230
},
231231
{
232232
contributionDays: [
233-
{ contributionCount: 1, date: '2024-06-13' },
234-
{ contributionCount: 1, date: '2024-06-14' },
235-
{ contributionCount: 1, date: '2024-06-15' },
233+
{ contributionCount: 1, date: '2024-06-16' },
234+
{ contributionCount: 1, date: '2024-06-17' },
235+
{ contributionCount: 1, date: '2024-06-18' },
236236
],
237237
},
238238
],
239239
} as unknown as ContributionCalendar;
240240

241-
const towers = computeTowers(calendar, 'linear', '2024-06-15');
241+
const towers = computeTowers(calendar, 'linear', '2024-06-18');
242242

243243
expect(towers[0].row).toBe(0);
244244
expect(towers[0].col).toBe(0);

lib/svg/layout.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,8 @@ export function computeTowers(
123123
? `TODAY: ${day.date}: ${count} ${unit}`
124124
: `${day.date}: ${count} ${unit}`;
125125

126-
const coords = projectIsometric(i, j);
126+
const dayOfWeekIndex = new Date(day.date).getUTCDay();
127+
const coords = projectIsometric(i, dayOfWeekIndex);
127128

128129
let intensityLevel = 0;
129130
if (hasCommits) {
@@ -153,7 +154,7 @@ export function computeTowers(
153154
strokeOpacity: isGhost ? 0.3 : 0,
154155
strokeWidth: isGhost ? 0.5 : 0,
155156
row: i,
156-
col: j,
157+
col: dayOfWeekIndex,
157158
intensityLevel,
158159
});
159160
});

0 commit comments

Comments
 (0)