diff --git a/src/components/charts/ActivityContributionChart.js b/src/components/charts/ActivityContributionChart.js index 37159c4..e049232 100644 --- a/src/components/charts/ActivityContributionChart.js +++ b/src/components/charts/ActivityContributionChart.js @@ -13,12 +13,12 @@ const ActivityContributionChart = ({ session }) => { const activityData = {}; const allActivities = []; - // ... existing course activities processing ... + // Process course activities session.user.userCourses.forEach(courseProgress => { if (courseProgress.started) { const startDate = new Date(courseProgress.startedAt); - startDate.setFullYear(new Date().getFullYear()); - const date = startDate.toISOString().split('T')[0]; + const date = new Date(startDate.getTime() - startDate.getTimezoneOffset() * 60000) + .toISOString().split('T')[0]; activityData[date] = (activityData[date] || 0) + 1; allActivities.push({ type: 'course_started', @@ -26,14 +26,48 @@ const ActivityContributionChart = ({ session }) => { date: date }); } - // ... rest of the course processing ... + if (courseProgress.completed) { + const completeDate = new Date(courseProgress.completedAt); + const date = new Date(completeDate.getTime() - completeDate.getTimezoneOffset() * 60000) + .toISOString().split('T')[0]; + activityData[date] = (activityData[date] || 0) + 1; + allActivities.push({ + type: 'course_completed', + name: courseProgress.course?.name, + date: date + }); + } }); - // ... existing lesson activities processing ... + // Process lesson activities session.user.userLessons?.forEach(lessonProgress => { - // ... lesson processing ... + if (lessonProgress.opened) { + const openDate = new Date(lessonProgress.openedAt); + const date = new Date(openDate.getTime() - openDate.getTimezoneOffset() * 60000) + .toISOString().split('T')[0]; + activityData[date] = (activityData[date] || 0) + 1; + allActivities.push({ + type: 'lesson_started', + name: lessonProgress.lesson?.name, + date: date + }); + } + if (lessonProgress.completed) { + const completeDate = new Date(lessonProgress.completedAt); + const date = new Date(completeDate.getTime() - completeDate.getTimezoneOffset() * 60000) + .toISOString().split('T')[0]; + activityData[date] = (activityData[date] || 0) + 1; + allActivities.push({ + type: 'lesson_completed', + name: lessonProgress.lesson?.name, + date: date + }); + } }); + console.log('All Learning Activities:', allActivities); + console.log('Activities by Date:', activityData); + setContributionData(activityData); setTotalActivities(Object.values(activityData).reduce((a, b) => a + b, 0)); @@ -47,30 +81,52 @@ const ActivityContributionChart = ({ session }) => { const getColor = useCallback((count) => { if (count === 0) return 'bg-gray-100'; - if (count === 1) return 'bg-purple-300'; - if (count === 2) return 'bg-purple-400'; - if (count === 3) return 'bg-purple-600'; - return 'bg-purple-700'; + if (count < 3) return 'bg-green-300'; + if (count < 6) return 'bg-green-400'; + if (count < 12) return 'bg-green-600'; + return 'bg-green-700'; }, []); const generateCalendar = useCallback(() => { const today = new Date(); - const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate()); - const calendar = []; + today.setHours(23, 59, 59, 999); - // Create 7 rows for days of the week + // Calculate the start date (52 weeks + remaining days to today) + const oneYearAgo = new Date(today); + oneYearAgo.setDate(today.getDate() - 364); + + // Start from the first Sunday before or on oneYearAgo + const startDate = new Date(oneYearAgo); + startDate.setDate(startDate.getDate() - startDate.getDay()); + + const calendar = []; for (let i = 0; i < 7; i++) { calendar[i] = []; } - // Fill in the dates - for (let d = new Date(oneYearAgo); d <= today; d.setDate(d.getDate() + 1)) { - const dateString = d.toISOString().split('T')[0]; + // Fill in the dates by week columns + let currentDate = new Date(startDate); + while (currentDate <= today) { + const weekDay = currentDate.getDay(); + // Use local timezone date string instead of ISO string + const dateString = currentDate.toLocaleDateString('en-CA'); // YYYY-MM-DD format const activityCount = contributionData[dateString] || 0; - calendar[d.getDay()].push({ - date: new Date(d), + + // Debug log + if (activityCount > 0) { + console.log('Found activity:', { + date: currentDate.toDateString(), + dateString, + activityCount + }); + } + + calendar[weekDay].push({ + date: new Date(currentDate), count: activityCount }); + + currentDate.setDate(currentDate.getDate() + 1); } return calendar; @@ -78,22 +134,33 @@ const ActivityContributionChart = ({ session }) => { const getMonthLabels = useCallback(() => { const today = new Date(); - const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate()); + today.setHours(23, 59, 59, 999); + + // Calculate exactly 52 weeks back + const oneYearAgo = new Date(today); + oneYearAgo.setDate(today.getDate() - 364); + + // Start from the first Sunday + const startDate = new Date(oneYearAgo); + startDate.setDate(startDate.getDate() - startDate.getDay()); + const months = []; let currentMonth = -1; const calendar = generateCalendar(); - for (let d = new Date(oneYearAgo); d <= today; d.setDate(d.getDate() + 1)) { - const month = d.getMonth(); + let currentDate = new Date(startDate); + while (currentDate <= today) { + const month = currentDate.getMonth(); if (month !== currentMonth) { months.push({ - name: d.toLocaleString('default', { month: 'short' }), + name: currentDate.toLocaleString('default', { month: 'short' }), index: calendar[0].findIndex( (_, weekIndex) => calendar[0][weekIndex]?.date.getMonth() === month ) }); currentMonth = month; } + currentDate.setDate(currentDate.getDate() + 1); } return months; }, [generateCalendar]); @@ -108,7 +175,7 @@ const ActivityContributionChart = ({ session }) => { {totalActivities} learning activities in the last year + data-pr-tooltip="Total number of learning activities on the platform" />
@@ -160,10 +227,10 @@ const ActivityContributionChart = ({ session }) => { Less
-
-
-
-
+
+
+
+
More
diff --git a/src/components/charts/CombinedContributionChart.js b/src/components/charts/CombinedContributionChart.js index 114c52b..52d71e5 100644 --- a/src/components/charts/CombinedContributionChart.js +++ b/src/components/charts/CombinedContributionChart.js @@ -17,8 +17,8 @@ const CombinedContributionChart = ({ username, session }) => { session.user.userCourses.forEach(courseProgress => { if (courseProgress.started) { const startDate = new Date(courseProgress.startedAt); - startDate.setFullYear(new Date().getFullYear()); - const date = startDate.toISOString().split('T')[0]; + const date = new Date(startDate.getTime() - startDate.getTimezoneOffset() * 60000) + .toLocaleDateString('en-CA'); activityData[date] = (activityData[date] || 0) + 1; allActivities.push({ type: 'course_started', @@ -28,8 +28,8 @@ const CombinedContributionChart = ({ username, session }) => { } if (courseProgress.completed) { const completeDate = new Date(courseProgress.completedAt); - completeDate.setFullYear(new Date().getFullYear()); - const date = completeDate.toISOString().split('T')[0]; + const date = new Date(completeDate.getTime() - completeDate.getTimezoneOffset() * 60000) + .toLocaleDateString('en-CA'); activityData[date] = (activityData[date] || 0) + 1; allActivities.push({ type: 'course_completed', @@ -43,8 +43,8 @@ const CombinedContributionChart = ({ username, session }) => { session.user.userLessons?.forEach(lessonProgress => { if (lessonProgress.opened) { const openDate = new Date(lessonProgress.openedAt); - openDate.setFullYear(new Date().getFullYear()); - const date = openDate.toISOString().split('T')[0]; + const date = new Date(openDate.getTime() - openDate.getTimezoneOffset() * 60000) + .toLocaleDateString('en-CA'); activityData[date] = (activityData[date] || 0) + 1; allActivities.push({ type: 'lesson_started', @@ -54,8 +54,8 @@ const CombinedContributionChart = ({ username, session }) => { } if (lessonProgress.completed) { const completeDate = new Date(lessonProgress.completedAt); - completeDate.setFullYear(new Date().getFullYear()); - const date = completeDate.toISOString().split('T')[0]; + const date = new Date(completeDate.getTime() - completeDate.getTimezoneOffset() * 60000) + .toLocaleDateString('en-CA'); activityData[date] = (activityData[date] || 0) + 1; allActivities.push({ type: 'lesson_completed', @@ -116,26 +116,39 @@ const CombinedContributionChart = ({ username, session }) => { const generateCalendar = useCallback(() => { const today = new Date(); - const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate()); - const calendar = []; + today.setHours(23, 59, 59, 999); - // Create 7 rows for days of the week + // Calculate the start date (52 weeks + remaining days to today) + const oneYearAgo = new Date(today); + oneYearAgo.setDate(today.getDate() - 364); // 52 weeks * 7 days = 364 days + + // Start from the first Sunday before or on oneYearAgo + const startDate = new Date(oneYearAgo); + startDate.setDate(startDate.getDate() - startDate.getDay()); + + const calendar = []; + // Create 7 rows for days of the week (Sunday to Saturday) for (let i = 0; i < 7; i++) { calendar[i] = []; } - // Fill in the dates - for (let d = new Date(oneYearAgo); d <= today; d.setDate(d.getDate() + 1)) { - const dateString = d.toISOString().split('T')[0]; + // Fill in the dates by week columns + let currentDate = new Date(startDate); + while (currentDate <= today) { + const weekDay = currentDate.getDay(); + const dateString = currentDate.toLocaleDateString('en-CA'); const githubCount = data?.contributionData[dateString] || 0; const activityCount = (contributionData[dateString] || 0) - (data?.contributionData[dateString] || 0); const totalCount = githubCount + activityCount; - calendar[d.getDay()].push({ - date: new Date(d), + + calendar[weekDay].push({ + date: new Date(currentDate), count: totalCount, githubCount, activityCount }); + + currentDate.setDate(currentDate.getDate() + 1); } return calendar; @@ -146,7 +159,9 @@ const CombinedContributionChart = ({ username, session }) => { const getMonthLabels = useCallback(() => { const today = new Date(); - const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate()); + const oneYearAgo = new Date(today); + oneYearAgo.setFullYear(today.getFullYear() - 1); + oneYearAgo.setDate(today.getDate() + 1); const months = []; let currentMonth = -1; diff --git a/src/components/profile/progress/UserProgress.js b/src/components/profile/progress/UserProgress.js index 569cfa2..0eff1c0 100644 --- a/src/components/profile/progress/UserProgress.js +++ b/src/components/profile/progress/UserProgress.js @@ -4,7 +4,16 @@ import { Accordion, AccordionTab } from 'primereact/accordion'; import { useSession } from 'next-auth/react'; const allTasks = [ - { status: 'Create Account', completed: true, tier: 'Pleb', courseId: null }, + { + status: 'Connect GitHub', + completed: false, + tier: 'Pleb', + courseId: null, + subTasks: [ + { status: 'Create First GitHub Repo', completed: false }, + { status: 'Push Commit', completed: false } + ] + }, { status: 'PlebDevs Starter', completed: false, @@ -16,23 +25,23 @@ const allTasks = [ { status: 'Push Commit', completed: false } ] }, - { - status: 'Frontend Course', - completed: false, - tier: 'Junior Dev', + { + status: 'Frontend Course', + completed: false, + tier: 'Junior Dev', courseId: 'f73c37f4-df2e-4f7d-a838-dce568c76136', subTasks: [ { status: 'Complete the course', completed: false }, { status: 'Submit Link to completed project', completed: false }, ] }, - { - status: 'Backend Course', - completed: false, - tier: 'Plebdev', + { + status: 'Backend Course', + completed: false, + tier: 'Plebdev', courseId: 'f6825391-831c-44da-904a-9ac3d149b7be', subTasks: [ - {status: 'Complete the course', completed: false}, + { status: 'Complete the course', completed: false }, { status: 'Submit Link to completed project', completed: false }, ] }, @@ -79,7 +88,7 @@ const UserProgress = () => { const calculateProgress = (completedCourseIds) => { let progressValue = 25; - + const remainingTasks = allTasks.slice(1); remainingTasks.forEach(task => { if (completedCourseIds.includes(task.courseId)) { @@ -92,7 +101,7 @@ const UserProgress = () => { const calculateCurrentTier = (completedCourseIds) => { let tier = 'Pleb'; - + if (completedCourseIds.includes("f538f5c5-1a72-4804-8eb1-3f05cea64874")) { tier = 'New Dev'; } @@ -102,7 +111,7 @@ const UserProgress = () => { if (completedCourseIds.includes("f6825391-831c-44da-904a-9ac3d149b7be")) { tier = 'Plebdev'; } - + setCurrentTier(tier); }; @@ -115,7 +124,7 @@ const UserProgress = () => { return (
-

Dev Journey (coming soon)

+

Dev Journey

Track your progress from Pleb to Plebdev

@@ -135,6 +144,7 @@ const UserProgress = () => {
    {tasks.map((task, index) => ( + console.log(task),
  • diff --git a/src/hooks/githubQueries/useFetchGithubCommits.js b/src/hooks/githubQueries/useFetchGithubCommits.js index f4ca2e3..f5c5da8 100644 --- a/src/hooks/githubQueries/useFetchGithubCommits.js +++ b/src/hooks/githubQueries/useFetchGithubCommits.js @@ -5,8 +5,9 @@ export function useFetchGithubCommits(username, onCommitReceived) { return useQuery({ queryKey: ['githubCommits', username], queryFn: async () => { - const oneYearAgo = new Date(); - oneYearAgo.setFullYear(oneYearAgo.getFullYear() - 1); + const today = new Date(); + const oneYearAgo = new Date(today); + oneYearAgo.setDate(today.getDate() - 364); // Exactly 52 weeks const commits = []; const contributionData = {};