mirror of
https://github.com/alexmickelson/canvasManagement.git
synced 2026-03-26 07:38:33 -06:00
handling iso date strings
This commit is contained in:
66
nextjs/src/app/course/[courseName]/calendarMonthUtils.ts
Normal file
66
nextjs/src/app/course/[courseName]/calendarMonthUtils.ts
Normal file
@@ -0,0 +1,66 @@
|
||||
interface CalendarMonth {
|
||||
year: number;
|
||||
month: number;
|
||||
weeks: (number | null)[][];
|
||||
daysByWeek: (Date | null)[][];
|
||||
}
|
||||
|
||||
const calendarMonthUtils = {
|
||||
weeksInMonth: (year: number, month: number): number => {
|
||||
const firstDayOfMonth = new Date(year, month - 1, 1).getDay();
|
||||
const daysInMonth = new Date(year, month, 0).getDate();
|
||||
const longDaysInMonth = daysInMonth + firstDayOfMonth;
|
||||
let weeks = Math.floor(longDaysInMonth / 7);
|
||||
if (longDaysInMonth % 7 > 0) {
|
||||
weeks += 1;
|
||||
}
|
||||
return weeks;
|
||||
},
|
||||
|
||||
createCalendarMonth: (year: number, month: number): CalendarMonth => {
|
||||
const daysByWeek: (Date | null)[][] = [];
|
||||
const weeksInMonth = calendarMonthUtils.weeksInMonth(year, month);
|
||||
const daysInMonth = new Date(year, month, 0).getDate();
|
||||
|
||||
let currentDay = 1;
|
||||
const firstDayOfMonth = new Date(year, month - 1, 1).getDay();
|
||||
|
||||
for (let i = 0; i < weeksInMonth; i++) {
|
||||
const thisWeek: (Date | null)[] = [];
|
||||
if (i === 0 && firstDayOfMonth !== 0) { // 0 is Sunday in JavaScript
|
||||
for (let j = 0; j < 7; j++) {
|
||||
if (j < firstDayOfMonth) {
|
||||
thisWeek.push(null);
|
||||
} else {
|
||||
thisWeek.push(new Date(year, month - 1, currentDay));
|
||||
currentDay++;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
for (let j = 0; j < 7; j++) {
|
||||
if (currentDay <= daysInMonth) {
|
||||
thisWeek.push(new Date(year, month - 1, currentDay));
|
||||
currentDay++;
|
||||
} else {
|
||||
thisWeek.push(null);
|
||||
}
|
||||
}
|
||||
}
|
||||
daysByWeek.push(thisWeek);
|
||||
}
|
||||
|
||||
const weeks = daysByWeek.map(week => week.map(day => day ? day.getDate() : null));
|
||||
|
||||
return { year, month, weeks, daysByWeek };
|
||||
},
|
||||
|
||||
getMonthsBetweenDates: (startDate: Date, endDate: Date): CalendarMonth[] => {
|
||||
const monthsInTerm = 1 + (endDate.getFullYear() - startDate.getFullYear()) * 12 + endDate.getMonth() - startDate.getMonth();
|
||||
|
||||
return Array.from({ length: monthsInTerm }, (_, monthDiff) => {
|
||||
const month = ((startDate.getMonth() + monthDiff) % 12) + 1;
|
||||
const year = startDate.getFullYear() + Math.floor((startDate.getMonth() + monthDiff) / 12);
|
||||
return calendarMonthUtils.createCalendarMonth(year, month);
|
||||
});
|
||||
}
|
||||
};
|
||||
27
nextjs/src/app/course/[courseName]/page.tsx
Normal file
27
nextjs/src/app/course/[courseName]/page.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
"use client";
|
||||
import { useLocalCourseDetailsQuery } from "@/hooks/localCoursesHooks";
|
||||
import { getDateFromStringOrThrow } from "@/models/local/timeUtils";
|
||||
|
||||
export default function Page({
|
||||
params: { courseName },
|
||||
}: {
|
||||
params: { courseName: string };
|
||||
}) {
|
||||
const { data: course } = useLocalCourseDetailsQuery(courseName);
|
||||
console.log(course);
|
||||
|
||||
const startDate = getDateFromStringOrThrow(course.settings.startDate);
|
||||
const endDate = getDateFromStringOrThrow(course.settings.endDate);
|
||||
|
||||
const months = calendarMonthUtils.getMonthsBetweenDates(startDate, endDate);
|
||||
return (
|
||||
<div>
|
||||
{course.settings.name}
|
||||
<div>
|
||||
{months.map((month) => (
|
||||
<div key={month.month + "" + month.year}>{month.month}</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -4,7 +4,6 @@ import "./globals.css";
|
||||
import { dehydrate } from "@tanstack/react-query";
|
||||
import { MyQueryClientProvider } from "@/services/utils/MyQueryClientProvider";
|
||||
import { hydrateCourses } from "@/hooks/hookHydration";
|
||||
import { LoadingAndErrorHandling } from "@/components/LoadingAndErrorHandling";
|
||||
import { createQueryClientForServer } from "@/services/utils/queryClientServer";
|
||||
|
||||
const inter = Inter({ subsets: ["latin"] });
|
||||
@@ -31,9 +30,9 @@ export default async function RootLayout({
|
||||
return (
|
||||
<html lang="en">
|
||||
<MyQueryClientProvider dehydratedState={dehydratedState}>
|
||||
<LoadingAndErrorHandling>
|
||||
{/* <LoadingAndErrorHandling> */}
|
||||
<body className={inter.className}>{children}</body>
|
||||
</LoadingAndErrorHandling>
|
||||
{/* </LoadingAndErrorHandling> */}
|
||||
</MyQueryClientProvider>
|
||||
</html>
|
||||
);
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
"use client"
|
||||
import { useLocalCoursesQuery } from "@/hooks/localCoursesHooks";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function Home() {
|
||||
const { data: courses } = useLocalCoursesQuery();
|
||||
return (
|
||||
<main className="flex min-h-screen flex-col items-center justify-between p-24">
|
||||
{courses.map((c) => (
|
||||
<div key={c.settings.name}>{c.settings.name} </div>
|
||||
<Link href={`/course/${c.settings.name}`} key={c.settings.name}>{c.settings.name} </Link>
|
||||
))}
|
||||
</main>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user