mirror of
https://github.com/alexmickelson/canvasManagement.git
synced 2026-03-25 23:28:33 -06:00
displaying tags to explain why things are not synced
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
import { useState } from "react";
|
||||
import { CalendarMonthModel } from "./calendarMonthUtils";
|
||||
import { DayOfWeek } from "@/models/local/localCourse";
|
||||
import Day from "./Day";
|
||||
import Day from "./day/Day";
|
||||
|
||||
export const CalendarMonth = ({ month }: { month: CalendarMonthModel }) => {
|
||||
const weekInMilliseconds = 604_800_000;
|
||||
|
||||
@@ -1,307 +0,0 @@
|
||||
"use client";
|
||||
import {
|
||||
dateToMarkdownString,
|
||||
getDateFromStringOrThrow,
|
||||
getDateOnlyMarkdownString,
|
||||
} from "@/models/local/timeUtils";
|
||||
import { DraggableItem, useDraggingContext } from "../context/draggingContext";
|
||||
import { useCalendarItemsContext } from "../context/calendarItemsContext";
|
||||
import { useCourseContext } from "../context/courseContext";
|
||||
import Link from "next/link";
|
||||
import { IModuleItem } from "@/models/local/IModuleItem";
|
||||
import { useLocalCourseSettingsQuery } from "@/hooks/localCourse/localCoursesHooks";
|
||||
import { getDayOfWeek } from "@/models/local/localCourse";
|
||||
import { getLectureUrl, getModuleItemUrl } from "@/services/urlUtils";
|
||||
import { LocalAssignment } from "@/models/local/assignment/localAssignment";
|
||||
import { LocalQuiz } from "@/models/local/quiz/localQuiz";
|
||||
import { LocalCoursePage } from "@/models/local/page/localCoursePage";
|
||||
import { useCanvasAssignmentsQuery } from "@/hooks/canvas/canvasAssignmentHooks";
|
||||
import { useCanvasQuizzesQuery } from "@/hooks/canvas/canvasQuizHooks";
|
||||
import { useCanvasPagesQuery } from "@/hooks/canvas/canvasPageHooks";
|
||||
import DropTargetStyling from "./DropTargetStyling";
|
||||
import { CanvasQuiz } from "@/models/canvas/quizzes/canvasQuizModel";
|
||||
import { CanvasAssignment } from "@/models/canvas/assignments/canvasAssignment";
|
||||
import { CanvasPage } from "@/models/canvas/pages/canvasPageModel";
|
||||
import { canvasService } from "@/services/canvas/canvasService";
|
||||
import { ReactNode } from "react";
|
||||
|
||||
export default function Day({ day, month }: { day: string; month: number }) {
|
||||
const dayAsDate = getDateFromStringOrThrow(
|
||||
day,
|
||||
"calculating same month in day"
|
||||
);
|
||||
const isToday =
|
||||
getDateOnlyMarkdownString(new Date()) ===
|
||||
getDateOnlyMarkdownString(dayAsDate);
|
||||
|
||||
const { data: settings } = useLocalCourseSettingsQuery();
|
||||
const { itemDropOnDay } = useDraggingContext();
|
||||
|
||||
const { todaysAssignments, todaysQuizzes, todaysPages } = useTodaysItems(day);
|
||||
|
||||
const isInSameMonth = dayAsDate.getMonth() + 1 == month;
|
||||
|
||||
const classOnThisDay = settings.daysOfWeek.includes(getDayOfWeek(dayAsDate));
|
||||
|
||||
const meetingClasses = classOnThisDay ? " bg-slate-900 " : " ";
|
||||
const monthClass = isInSameMonth
|
||||
? isToday
|
||||
? " border border-blue-700 shadow-[0_0px_10px_0px] shadow-blue-500/50 "
|
||||
: " border border-slate-700 "
|
||||
: " ";
|
||||
|
||||
return (
|
||||
<div
|
||||
className={" rounded-lg m-1 min-h-10 " + meetingClasses + monthClass}
|
||||
onDrop={(e) => itemDropOnDay(e, day)}
|
||||
onDragOver={(e) => e.preventDefault()}
|
||||
>
|
||||
<DropTargetStyling draggingClassName="bg-slate-900 shadow-[0_0px_10px_0px] shadow-blue-800/50 ">
|
||||
<DayTitle day={day} dayAsDate={dayAsDate} />
|
||||
<div>
|
||||
{todaysAssignments.map(
|
||||
({ assignment, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={assignment.name}
|
||||
type={"assignment"}
|
||||
moduleName={moduleName}
|
||||
item={assignment}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{todaysQuizzes.map(({ quiz, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={quiz.name}
|
||||
type={"quiz"}
|
||||
moduleName={moduleName}
|
||||
item={quiz}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
))}
|
||||
{todaysPages.map(({ page, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={page.name}
|
||||
type={"page"}
|
||||
moduleName={moduleName}
|
||||
item={page}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</DropTargetStyling>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function DayTitle({ day, dayAsDate }: { day: string; dayAsDate: Date }) {
|
||||
const { courseName } = useCourseContext();
|
||||
return (
|
||||
<Link className="ms-1" href={getLectureUrl(courseName, day)}>
|
||||
{dayAsDate.getDate()}
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
function useTodaysItems(day: string) {
|
||||
const dayAsDate = getDateFromStringOrThrow(
|
||||
day,
|
||||
"calculating same month in day items"
|
||||
);
|
||||
const itemsContext = useCalendarItemsContext();
|
||||
const dateKey = getDateOnlyMarkdownString(dayAsDate);
|
||||
const todaysModules = itemsContext[dateKey];
|
||||
|
||||
const { data: canvasAssignments } = useCanvasAssignmentsQuery();
|
||||
const { data: canvasQuizzes } = useCanvasQuizzesQuery();
|
||||
const { data: canvasPages } = useCanvasPagesQuery();
|
||||
const todaysAssignments: {
|
||||
moduleName: string;
|
||||
assignment: LocalAssignment;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].assignments.map((assignment) => {
|
||||
const canvasAssignment = canvasAssignments.find(
|
||||
(c) => c.name === assignment.name
|
||||
);
|
||||
return {
|
||||
moduleName,
|
||||
assignment,
|
||||
...getStatus({
|
||||
item: assignment,
|
||||
canvasItem: canvasAssignment,
|
||||
type: "assignment",
|
||||
}),
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
|
||||
const todaysQuizzes: {
|
||||
moduleName: string;
|
||||
quiz: LocalQuiz;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: string;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].quizzes.map((quiz) => {
|
||||
const canvasQuiz = canvasQuizzes.find((q) => q.title === quiz.name);
|
||||
return {
|
||||
moduleName,
|
||||
quiz,
|
||||
status: canvasQuiz
|
||||
? canvasQuiz.published
|
||||
? "published"
|
||||
: "incomplete"
|
||||
: "localOnly",
|
||||
message: "",
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
|
||||
const todaysPages: {
|
||||
moduleName: string;
|
||||
page: LocalCoursePage;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: string;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].pages.map((page) => {
|
||||
const canvasPage = canvasPages.find((p) => p.title === page.name);
|
||||
return {
|
||||
moduleName,
|
||||
page,
|
||||
status: canvasPage
|
||||
? canvasPage.published
|
||||
? "published"
|
||||
: "incomplete"
|
||||
: "localOnly",
|
||||
message: "",
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
return { todaysAssignments, todaysQuizzes, todaysPages };
|
||||
}
|
||||
|
||||
function DraggableListItem({
|
||||
type,
|
||||
moduleName,
|
||||
status,
|
||||
item,
|
||||
message,
|
||||
}: {
|
||||
type: "assignment" | "page" | "quiz";
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
moduleName: string;
|
||||
item: IModuleItem;
|
||||
message: ReactNode;
|
||||
}) {
|
||||
const { courseName } = useCourseContext();
|
||||
const { dragStart } = useDraggingContext();
|
||||
return (
|
||||
<Link
|
||||
href={getModuleItemUrl(courseName, moduleName, type, item.name)}
|
||||
shallow={true}
|
||||
className={
|
||||
" relative group " +
|
||||
" border rounded-sm px-1 mx-1 break-words mb-1 " +
|
||||
" bg-slate-800 " +
|
||||
" block " +
|
||||
(status === "localOnly" && " text-slate-500 border-slate-600 ") +
|
||||
(status === "incomplete" && " border-rose-900 ") +
|
||||
(status === "published" && " border-green-800 ")
|
||||
}
|
||||
role="button"
|
||||
draggable="true"
|
||||
onDragStart={(e) => {
|
||||
const draggableItem: DraggableItem = {
|
||||
type,
|
||||
item,
|
||||
sourceModuleName: moduleName,
|
||||
};
|
||||
e.dataTransfer.setData("draggableItem", JSON.stringify(draggableItem));
|
||||
dragStart();
|
||||
}}
|
||||
>
|
||||
{item.name}
|
||||
{status === "incomplete" && (
|
||||
<div
|
||||
className={
|
||||
" absolute opacity-0 transition-all duration-700 " +
|
||||
" group-hover:block group-hover:opacity-100" +
|
||||
" bg-gray-800 text-white text-sm " +
|
||||
" rounded py-1 px-2 bottom-full mb-2 left-1/2 transform -translate-x-1/2 " +
|
||||
" whitespace-no-wrap min-w-full max-w-96 "
|
||||
}
|
||||
role="tooltip"
|
||||
>
|
||||
{message}
|
||||
</div>
|
||||
)}
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
const getStatus = ({
|
||||
item,
|
||||
canvasItem,
|
||||
type,
|
||||
}: {
|
||||
item: LocalQuiz | LocalAssignment | LocalCoursePage;
|
||||
canvasItem?: CanvasQuiz | CanvasAssignment | CanvasPage;
|
||||
type: "assignment" | "page" | "quiz";
|
||||
}): {
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
} => {
|
||||
if (!canvasItem) return { status: "localOnly", message: "not in canvas" };
|
||||
|
||||
if (!canvasItem.published)
|
||||
return { status: "incomplete", message: "not published in canvas" };
|
||||
|
||||
if (type === "assignment") {
|
||||
const assignment = item as LocalAssignment;
|
||||
const canvasAssignment = canvasItem as CanvasAssignment;
|
||||
|
||||
if(canvasAssignment.name === "Javascript 1")
|
||||
console.log('js 1', canvasAssignment.due_at, canvasAssignment);
|
||||
|
||||
|
||||
if (!canvasAssignment.due_at)
|
||||
return { status: "incomplete", message: "due date not in canvas" };
|
||||
|
||||
if (assignment.lockAt && !canvasAssignment.lock_at)
|
||||
return { status: "incomplete", message: "lock date not in canvas" };
|
||||
|
||||
const localDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(assignment.dueAt, "comparing due dates for day")
|
||||
);
|
||||
const canvasDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(
|
||||
canvasAssignment.due_at,
|
||||
"comparing canvas due date for day"
|
||||
)
|
||||
);
|
||||
if (localDueDate !== canvasDueDate) {
|
||||
return {
|
||||
status: "incomplete",
|
||||
message: (
|
||||
<div>
|
||||
due date different
|
||||
<div>{localDueDate}</div>
|
||||
<div>{canvasDueDate}</div>
|
||||
</div>
|
||||
),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return { status: "published", message: "" };
|
||||
};
|
||||
95
nextjs/src/app/course/[courseName]/calendar/day/Day.tsx
Normal file
95
nextjs/src/app/course/[courseName]/calendar/day/Day.tsx
Normal file
@@ -0,0 +1,95 @@
|
||||
"use client";
|
||||
import {
|
||||
getDateFromStringOrThrow,
|
||||
getDateOnlyMarkdownString,
|
||||
} from "@/models/local/timeUtils";
|
||||
import { useDraggingContext } from "../../context/draggingContext";
|
||||
import { useCourseContext } from "../../context/courseContext";
|
||||
import Link from "next/link";
|
||||
import { useLocalCourseSettingsQuery } from "@/hooks/localCourse/localCoursesHooks";
|
||||
import { getDayOfWeek } from "@/models/local/localCourse";
|
||||
import { getLectureUrl } from "@/services/urlUtils";
|
||||
import DropTargetStyling from "../DropTargetStyling";
|
||||
import { DraggableListItem } from "./DraggableListItem";
|
||||
import { useTodaysItems } from "./useTodaysItems";
|
||||
|
||||
export default function Day({ day, month }: { day: string; month: number }) {
|
||||
const dayAsDate = getDateFromStringOrThrow(
|
||||
day,
|
||||
"calculating same month in day"
|
||||
);
|
||||
const isToday =
|
||||
getDateOnlyMarkdownString(new Date()) ===
|
||||
getDateOnlyMarkdownString(dayAsDate);
|
||||
|
||||
const { data: settings } = useLocalCourseSettingsQuery();
|
||||
const { itemDropOnDay } = useDraggingContext();
|
||||
|
||||
const { todaysAssignments, todaysQuizzes, todaysPages } = useTodaysItems(day);
|
||||
|
||||
const isInSameMonth = dayAsDate.getMonth() + 1 == month;
|
||||
|
||||
const classOnThisDay = settings.daysOfWeek.includes(getDayOfWeek(dayAsDate));
|
||||
|
||||
const meetingClasses = classOnThisDay ? " bg-slate-900 " : " ";
|
||||
const monthClass = isInSameMonth
|
||||
? isToday
|
||||
? " border border-blue-700 shadow-[0_0px_10px_0px] shadow-blue-500/50 "
|
||||
: " border border-slate-700 "
|
||||
: " ";
|
||||
|
||||
return (
|
||||
<div
|
||||
className={" rounded-lg m-1 min-h-10 " + meetingClasses + monthClass}
|
||||
onDrop={(e) => itemDropOnDay(e, day)}
|
||||
onDragOver={(e) => e.preventDefault()}
|
||||
>
|
||||
<DropTargetStyling draggingClassName="bg-slate-900 shadow-[0_0px_10px_0px] shadow-blue-800/50 ">
|
||||
<DayTitle day={day} dayAsDate={dayAsDate} />
|
||||
<div>
|
||||
{todaysAssignments.map(
|
||||
({ assignment, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={assignment.name}
|
||||
type={"assignment"}
|
||||
moduleName={moduleName}
|
||||
item={assignment}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{todaysQuizzes.map(({ quiz, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={quiz.name}
|
||||
type={"quiz"}
|
||||
moduleName={moduleName}
|
||||
item={quiz}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
))}
|
||||
{todaysPages.map(({ page, moduleName, status, message }) => (
|
||||
<DraggableListItem
|
||||
key={page.name}
|
||||
type={"page"}
|
||||
moduleName={moduleName}
|
||||
item={page}
|
||||
status={status}
|
||||
message={message}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</DropTargetStyling>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function DayTitle({ day, dayAsDate }: { day: string; dayAsDate: Date }) {
|
||||
const { courseName } = useCourseContext();
|
||||
return (
|
||||
<Link className="ms-1" href={getLectureUrl(courseName, day)}>
|
||||
{dayAsDate.getDate()}
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
import { IModuleItem } from "@/models/local/IModuleItem";
|
||||
import { getModuleItemUrl } from "@/services/urlUtils";
|
||||
import Link from "next/link";
|
||||
import { ReactNode } from "react";
|
||||
import { useCourseContext } from "../../context/courseContext";
|
||||
import { useDraggingContext, DraggableItem } from "../../context/draggingContext";
|
||||
|
||||
export function DraggableListItem({
|
||||
type,
|
||||
moduleName,
|
||||
status,
|
||||
item,
|
||||
message,
|
||||
}: {
|
||||
type: "assignment" | "page" | "quiz";
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
moduleName: string;
|
||||
item: IModuleItem;
|
||||
message: ReactNode;
|
||||
}) {
|
||||
const { courseName } = useCourseContext();
|
||||
const { dragStart } = useDraggingContext();
|
||||
return (
|
||||
<Link
|
||||
href={getModuleItemUrl(courseName, moduleName, type, item.name)}
|
||||
shallow={true}
|
||||
className={
|
||||
" relative group " +
|
||||
" border rounded-sm px-1 mx-1 break-words mb-1 " +
|
||||
" bg-slate-800 " +
|
||||
" block " +
|
||||
(status === "localOnly" && " text-slate-500 border-slate-600 ") +
|
||||
(status === "incomplete" && " border-rose-900 ") +
|
||||
(status === "published" && " border-green-800 ")
|
||||
}
|
||||
role="button"
|
||||
draggable="true"
|
||||
onDragStart={(e) => {
|
||||
const draggableItem: DraggableItem = {
|
||||
type,
|
||||
item,
|
||||
sourceModuleName: moduleName,
|
||||
};
|
||||
e.dataTransfer.setData("draggableItem", JSON.stringify(draggableItem));
|
||||
dragStart();
|
||||
}}
|
||||
>
|
||||
{item.name}
|
||||
{status === "incomplete" && (
|
||||
<div
|
||||
className={
|
||||
" absolute opacity-0 transition-all duration-700 " +
|
||||
" group-hover:block group-hover:opacity-100" +
|
||||
" bg-gray-800 text-white text-sm " +
|
||||
" rounded py-1 px-2 bottom-full mb-2 left-1/2 transform -translate-x-1/2 " +
|
||||
" whitespace-no-wrap min-w-full max-w-96 "
|
||||
}
|
||||
role="tooltip"
|
||||
>
|
||||
{message}
|
||||
</div>
|
||||
)}
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
106
nextjs/src/app/course/[courseName]/calendar/day/getStatus.tsx
Normal file
106
nextjs/src/app/course/[courseName]/calendar/day/getStatus.tsx
Normal file
@@ -0,0 +1,106 @@
|
||||
"use client";
|
||||
import { CanvasAssignment } from "@/models/canvas/assignments/canvasAssignment";
|
||||
import { CanvasPage } from "@/models/canvas/pages/canvasPageModel";
|
||||
import { CanvasQuiz } from "@/models/canvas/quizzes/canvasQuizModel";
|
||||
import { LocalAssignment } from "@/models/local/assignment/localAssignment";
|
||||
import { LocalCoursePage } from "@/models/local/page/localCoursePage";
|
||||
import { LocalQuiz } from "@/models/local/quiz/localQuiz";
|
||||
import {
|
||||
dateToMarkdownString,
|
||||
getDateFromStringOrThrow,
|
||||
} from "@/models/local/timeUtils";
|
||||
import { ReactNode } from "react";
|
||||
|
||||
export const getStatus = ({
|
||||
item,
|
||||
canvasItem,
|
||||
type,
|
||||
}: {
|
||||
item: LocalQuiz | LocalAssignment | LocalCoursePage;
|
||||
canvasItem?: CanvasQuiz | CanvasAssignment | CanvasPage;
|
||||
type: "assignment" | "page" | "quiz";
|
||||
}): {
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
} => {
|
||||
if (!canvasItem) return { status: "localOnly", message: "not in canvas" };
|
||||
|
||||
if (!canvasItem.published)
|
||||
return { status: "incomplete", message: "not published in canvas" };
|
||||
|
||||
if (type === "page") {
|
||||
const canvasPage = canvasItem as CanvasPage;
|
||||
const page = item as LocalCoursePage;
|
||||
|
||||
if (!canvasPage.published)
|
||||
return { status: "incomplete", message: "canvas page not published" };
|
||||
return { status: "published", message: "" };
|
||||
} else if (type === "quiz") {
|
||||
const quiz = item as LocalQuiz;
|
||||
const canvasQuiz = canvasItem as CanvasQuiz
|
||||
|
||||
|
||||
if (!canvasQuiz.due_at)
|
||||
return { status: "incomplete", message: "due date not in canvas" };
|
||||
|
||||
if (quiz.lockAt && !canvasQuiz.lock_at)
|
||||
return { status: "incomplete", message: "lock date not in canvas" };
|
||||
|
||||
const localDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(quiz.dueAt, "comparing due dates for day")
|
||||
);
|
||||
|
||||
const canvasDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(
|
||||
canvasQuiz.due_at,
|
||||
"comparing canvas due date for day"
|
||||
)
|
||||
);
|
||||
if (localDueDate !== canvasDueDate) {
|
||||
return {
|
||||
status: "incomplete",
|
||||
message: (
|
||||
<div>
|
||||
due date different
|
||||
<div>{localDueDate}</div>
|
||||
<div>{canvasDueDate}</div>
|
||||
</div>
|
||||
),
|
||||
};
|
||||
}
|
||||
|
||||
} else if (type === "assignment") {
|
||||
const assignment = item as LocalAssignment;
|
||||
const canvasAssignment = canvasItem as CanvasAssignment;
|
||||
|
||||
if (!canvasAssignment.due_at)
|
||||
return { status: "incomplete", message: "due date not in canvas" };
|
||||
|
||||
if (assignment.lockAt && !canvasAssignment.lock_at)
|
||||
return { status: "incomplete", message: "lock date not in canvas" };
|
||||
|
||||
const localDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(assignment.dueAt, "comparing due dates for day")
|
||||
);
|
||||
const canvasDueDate = dateToMarkdownString(
|
||||
getDateFromStringOrThrow(
|
||||
canvasAssignment.due_at,
|
||||
"comparing canvas due date for day"
|
||||
)
|
||||
);
|
||||
if (localDueDate !== canvasDueDate) {
|
||||
return {
|
||||
status: "incomplete",
|
||||
message: (
|
||||
<div>
|
||||
due date different
|
||||
<div>{localDueDate}</div>
|
||||
<div>{canvasDueDate}</div>
|
||||
</div>
|
||||
),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return { status: "published", message: "" };
|
||||
};
|
||||
@@ -0,0 +1,96 @@
|
||||
"use client";
|
||||
import { useCanvasAssignmentsQuery } from "@/hooks/canvas/canvasAssignmentHooks";
|
||||
import { useCanvasPagesQuery } from "@/hooks/canvas/canvasPageHooks";
|
||||
import { useCanvasQuizzesQuery } from "@/hooks/canvas/canvasQuizHooks";
|
||||
import { LocalAssignment } from "@/models/local/assignment/localAssignment";
|
||||
import { LocalCoursePage } from "@/models/local/page/localCoursePage";
|
||||
import { LocalQuiz } from "@/models/local/quiz/localQuiz";
|
||||
import {
|
||||
getDateFromStringOrThrow,
|
||||
getDateOnlyMarkdownString,
|
||||
} from "@/models/local/timeUtils";
|
||||
import { ReactNode } from "react";
|
||||
import { useCalendarItemsContext } from "../../context/calendarItemsContext";
|
||||
import { getStatus } from "./getStatus";
|
||||
|
||||
export function useTodaysItems(day: string) {
|
||||
const dayAsDate = getDateFromStringOrThrow(
|
||||
day,
|
||||
"calculating same month in day items"
|
||||
);
|
||||
const itemsContext = useCalendarItemsContext();
|
||||
const dateKey = getDateOnlyMarkdownString(dayAsDate);
|
||||
const todaysModules = itemsContext[dateKey];
|
||||
|
||||
const { data: canvasAssignments } = useCanvasAssignmentsQuery();
|
||||
const { data: canvasQuizzes } = useCanvasQuizzesQuery();
|
||||
const { data: canvasPages } = useCanvasPagesQuery();
|
||||
const todaysAssignments: {
|
||||
moduleName: string;
|
||||
assignment: LocalAssignment;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].assignments.map((assignment) => {
|
||||
const canvasAssignment = canvasAssignments.find(
|
||||
(c) => c.name === assignment.name
|
||||
);
|
||||
return {
|
||||
moduleName,
|
||||
assignment,
|
||||
...getStatus({
|
||||
item: assignment,
|
||||
canvasItem: canvasAssignment,
|
||||
type: "assignment",
|
||||
}),
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
|
||||
const todaysQuizzes: {
|
||||
moduleName: string;
|
||||
quiz: LocalQuiz;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].quizzes.map((quiz) => {
|
||||
const canvasQuiz = canvasQuizzes.find((q) => q.title === quiz.name);
|
||||
return {
|
||||
moduleName,
|
||||
quiz,
|
||||
...getStatus({
|
||||
item: quiz,
|
||||
canvasItem: canvasQuiz,
|
||||
type: "quiz",
|
||||
}),
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
|
||||
const todaysPages: {
|
||||
moduleName: string;
|
||||
page: LocalCoursePage;
|
||||
status: "localOnly" | "incomplete" | "published";
|
||||
message: ReactNode;
|
||||
}[] = todaysModules
|
||||
? Object.keys(todaysModules).flatMap((moduleName) =>
|
||||
todaysModules[moduleName].pages.map((page) => {
|
||||
const canvasPage = canvasPages.find((p) => p.title === page.name);
|
||||
return {
|
||||
moduleName,
|
||||
page,
|
||||
...getStatus({
|
||||
item: page,
|
||||
canvasItem: canvasPage,
|
||||
type: "page",
|
||||
}),
|
||||
};
|
||||
})
|
||||
)
|
||||
: [];
|
||||
return { todaysAssignments, todaysQuizzes, todaysPages };
|
||||
}
|
||||
Reference in New Issue
Block a user