@nualang/nualang-ui-components 0.1.1400 → 0.2.0

package/dist/Tables/Progress/useProgressUrlParams.test.js

@@ -1,183 +0,0 @@
-import React from "react";
-import { render, waitFor } from "@testing-library/react";
-import { describe, it, expect, vi } from "vitest";
-import useProgressUrlParams from "./useProgressUrlParams";
-import { jsx as _jsx } from "react/jsx-runtime";
-function TestComponent(props) {
-  useProgressUrlParams(props.opts);
-  return null;
-}
-describe("useProgressUrlParams", () => {
-  it("reads URL on mount and calls setters for course/section/topic/roleplay", async () => {
-    const setSelectedCourse = vi.fn();
-    const setSelectedSection = vi.fn();
-    const setSelectedTopic = vi.fn();
-    const setSelectedRoleplay = vi.fn();
-    const coursesWithSections = [{
-      courseId: "c1",
-      sections: [{
-        sectionId: "s1",
-        topics: [{
-          topicId: "t1",
-          roleplays: [{
-            roleplayId: "r1"
-          }]
-        }]
-      }]
-    }];
-
-    // Set the initial URL
-    window.history.replaceState({}, "", "/path?courseId=c1&sectionId=s1&topicId=t1&roleplayId=r1");
-    render(/*#__PURE__*/_jsx(TestComponent, {
-      opts: {
-        availableReportTypes: ["summary"],
-        reportType: null,
-        setReportType: vi.fn(),
-        assignments: [],
-        selectedAssignment: null,
-        setSelectedAssignment: vi.fn(),
-        coursesWithSections,
-        selectedCourse: null,
-        setSelectedCourse,
-        selectedSection: null,
-        setSelectedSection,
-        selectedTopic: null,
-        setSelectedTopic,
-        selectedRoleplay: null,
-        setSelectedRoleplay
-      }
-    }));
-    await waitFor(() => {
-      expect(setSelectedCourse).toHaveBeenCalledWith(coursesWithSections[0]);
-      expect(setSelectedSection).toHaveBeenCalled();
-      expect(setSelectedTopic).toHaveBeenCalled();
-      expect(setSelectedRoleplay).toHaveBeenCalled();
-    });
-  });
-  it("replaces URL when selections are provided", async () => {
-    const replaceSpy = vi.spyOn(window.history, "replaceState");
-    const selectedCourse = {
-      courseId: "c2"
-    };
-    const selectedSection = {
-      sectionId: "s2"
-    };
-    const selectedTopic = {
-      topicId: "t2"
-    };
-    const selectedRoleplay = {
-      roleplayId: "r2"
-    };
-    const selectedAssignment = {
-      assignmentId: "a1"
-    };
-
-    // Set base pathname
-    window.history.replaceState({}, "", "/base");
-    render(/*#__PURE__*/_jsx(TestComponent, {
-      opts: {
-        availableReportTypes: ["summary", "detail"],
-        reportType: "detail",
-        setReportType: vi.fn(),
-        assignments: [],
-        selectedAssignment,
-        setSelectedAssignment: vi.fn(),
-        coursesWithSections: [],
-        selectedCourse,
-        setSelectedCourse: vi.fn(),
-        selectedSection,
-        setSelectedSection: vi.fn(),
-        selectedTopic,
-        setSelectedTopic: vi.fn(),
-        selectedRoleplay,
-        setSelectedRoleplay: vi.fn()
-      }
-    }));
-    await waitFor(() => {
-      expect(replaceSpy).toHaveBeenCalled();
-      const calledArgs = replaceSpy.mock.calls.at(-1);
-      // third argument is the new URL
-      const newUrl = calledArgs[2];
-      expect(newUrl).toContain("/base?");
-      expect(newUrl).toContain("courseId=c2");
-      expect(newUrl).toContain("sectionId=s2");
-      expect(newUrl).toContain("topicId=t2");
-      expect(newUrl).toContain("roleplayId=r2");
-      expect(newUrl).toContain("assignmentId=a1");
-      expect(newUrl).toContain("reportType=detail");
-    });
-    replaceSpy.mockRestore();
-  });
-  it("waits for data before initializing", async () => {
-    const setSelectedCourse = vi.fn();
-
-    // Setup: URL has a course ID
-    const initialUrl = "/path?courseId=waiting_course";
-    window.history.replaceState({}, "", initialUrl);
-
-    // Spy AFTER the setup replaceState call so setup isn't counted
-    const replaceSpy = vi.spyOn(window.history, "replaceState");
-
-    // 1. Render with empty data
-    // It should NOT call setSelectedCourse yet
-    const {
-      rerender
-    } = render(/*#__PURE__*/_jsx(TestComponent, {
-      opts: {
-        availableReportTypes: ["courses"],
-        reportType: null,
-        setReportType: vi.fn(),
-        assignments: [],
-        selectedAssignment: null,
-        setSelectedAssignment: vi.fn(),
-        coursesWithSections: [],
-        // Empty initially!
-        selectedCourse: null,
-        setSelectedCourse,
-        selectedSection: null,
-        setSelectedSection: vi.fn(),
-        selectedTopic: null,
-        setSelectedTopic: vi.fn(),
-        selectedRoleplay: null,
-        setSelectedRoleplay: vi.fn()
-      }
-    }));
-
-    // Expectation 1: Should NOT have selected anything yet
-    expect(setSelectedCourse).not.toHaveBeenCalled();
-    // Expectation 2: Should NOT have replaced state (clearing the URL)
-    expect(replaceSpy).not.toHaveBeenCalled();
-
-    // 2. Rerender with data arrived
-    const loadedCourse = {
-      courseId: "waiting_course",
-      sections: []
-    };
-    rerender(/*#__PURE__*/_jsx(TestComponent, {
-      opts: {
-        availableReportTypes: ["courses"],
-        reportType: null,
-        setReportType: vi.fn(),
-        assignments: [],
-        selectedAssignment: null,
-        setSelectedAssignment: vi.fn(),
-        coursesWithSections: [loadedCourse],
-        // Data arrived!
-        selectedCourse: null,
-        setSelectedCourse,
-        selectedSection: null,
-        setSelectedSection: vi.fn(),
-        selectedTopic: null,
-        setSelectedTopic: vi.fn(),
-        selectedRoleplay: null,
-        setSelectedRoleplay: vi.fn()
-      }
-    }));
-
-    // Expectation 3: Now it should initialize
-    await waitFor(() => {
-      expect(setSelectedCourse).toHaveBeenCalledWith(loadedCourse);
-    });
-    replaceSpy.mockRestore();
-  });
-});

package/dist/Tables/Progress/utils.js

@@ -1,214 +0,0 @@
-import { calcCompletions, calcPercentageCompletion, getScoreValues } from "../../utils";
-
-// Helper function to calculate how many days late a submission is
-function calculateDaysLate(submissionTimestamp, dueDateMs) {
-  const daysDifference = (submissionTimestamp - dueDateMs) / (1000 * 60 * 60 * 24);
-  if (daysDifference <= 0) return 0; // Not actually late
-  return Math.max(1, Math.ceil(daysDifference)); // Round up, minimum 1 day
-}
-export const formatMemberCourseCompletions = (courses = [], completions = [], assignmentExercises, isChallengeModeStudent = false, selectedAssignment = null, reportType = "course", isReadWriteModeStudent = false) => {
-  const dueDateMs = selectedAssignment?.dueDate ? new Date(selectedAssignment.dueDate).getTime() : null;
-  const initialStatsObject = courses.reduce((obj, v) => {
-    const scoreValues = getScoreValues("course", v.courseId, completions);
-    obj[v.courseId] = {
-      percentComplete: {
-        completed: 0,
-        total: 0,
-        percentage: 0
-      },
-      percentCorrect: scoreValues[0],
-      avgPronunciationScore: {
-        percentage: scoreValues[1]
-      },
-      sections: []
-    };
-    return obj;
-  }, {});
-  const stats = courses.reduce((previousValue, currentValue) => {
-    const sectionsWithProgress = calcCompletions(currentValue.sections, completions, assignmentExercises, isChallengeModeStudent, isReadWriteModeStudent);
-    const percentCompletion = calcPercentageCompletion(sectionsWithProgress);
-    previousValue[currentValue.courseId].percentComplete = percentCompletion;
-    const initialSectionsObject = sectionsWithProgress.reduce((sectionObj, sectionVal) => {
-      sectionObj[sectionVal.sectionId] = {
-        percentComplete: {
-          completed: 0,
-          total: 0,
-          percentage: 0
-        },
-        percentCorrect: {
-          completed: 0,
-          total: 0,
-          percentage: 0
-        },
-        avgPronunciationScore: {
-          percentage: -1
-        },
-        topics: {}
-      };
-      return sectionObj;
-    }, {});
-    const formattedSections = sectionsWithProgress.reduce((sectionObj, sectionVal) => {
-      const initialTopicsObject = sectionVal.topics.reduce((topicObj, topicVal) => {
-        topicObj[topicVal.topicId] = {
-          percentComplete: {
-            completed: 0,
-            total: 0,
-            percentage: 0
-          },
-          percentCorrect: {
-            completed: 0,
-            total: 0,
-            percentage: 0
-          },
-          avgPronunciationScore: {
-            percentage: -1
-          },
-          topics: {}
-        };
-        return topicObj;
-      }, {});
-      const formattedTopics = sectionVal.topics.reduce((topicObj, topicVal) => {
-        const topicCompletions = completions.filter(completion => completion.topicId === topicVal.topicId);
-        topicObj[topicVal.topicId] = {
-          percentComplete: topicVal.completion,
-          percentCorrect: topicVal.percentCorrect,
-          avgPronunciationScore: topicVal.avgPronunciationScore,
-          completions: topicCompletions,
-          ...(selectedAssignment && reportType === "assignments" && {
-            submittedLate: (() => {
-              if (!dueDateMs) return {
-                isLate: false
-              };
-              const courseSectionTopicId = `${topicVal.courseSectionId}|${topicVal.topicId}`;
-              const topicAssignmentExercises = assignmentExercises?.filter(e => e.courseSectionTopicId === courseSectionTopicId);
-              if (!topicAssignmentExercises?.length) return {
-                isLate: false
-              };
-              const relevantCompletions = topicCompletions.filter(c => topicAssignmentExercises.some(e => {
-                if (e.name && c.exercise !== e.name) return false;
-                if (e.roleplayId && c.roleplayId !== e.roleplayId) return false;
-                if (e.botId && c.botId !== e.botId) return false;
-                return true;
-              }));
-              const lateCompletion = relevantCompletions.find(c => c.createdAt > dueDateMs);
-              return lateCompletion ? {
-                isLate: true,
-                daysLate: calculateDaysLate(lateCompletion.createdAt, dueDateMs)
-              } : {
-                isLate: false
-              };
-            })()
-          })
-        };
-        return topicObj;
-      }, initialTopicsObject);
-      sectionObj[sectionVal.sectionId] = {
-        percentComplete: sectionVal.completion,
-        percentCorrect: sectionVal.percentCorrect,
-        avgPronunciationScore: sectionVal.avgPronunciationScore,
-        topics: formattedTopics,
-        ...(selectedAssignment && reportType === "assignments" && {
-          submittedLate: (() => {
-            const lateTopics = Object.values(formattedTopics).filter(t => t.submittedLate?.isLate);
-            if (lateTopics.length === 0) return {
-              isLate: false
-            };
-            const maxDaysLate = Math.max(...lateTopics.map(topic => topic?.submittedLate?.daysLate));
-            return {
-              isLate: true,
-              daysLate: maxDaysLate
-            };
-          })()
-        })
-      };
-      return sectionObj;
-    }, initialSectionsObject);
-    previousValue[currentValue.courseId].sections = formattedSections;
-    if (selectedAssignment && reportType === "assignments") {
-      const lateSections = Object.values(formattedSections).filter(s => s.submittedLate?.isLate);
-      if (lateSections.length === 0) {
-        previousValue[currentValue.courseId].submittedLate = {
-          isLate: false
-        };
-      } else {
-        const maxDaysLate = Math.max(...lateSections.map(section => section?.submittedLate?.daysLate));
-        previousValue[currentValue.courseId].submittedLate = {
-          isLate: true,
-          daysLate: maxDaysLate
-        };
-      }
-    }
-    return previousValue;
-  }, initialStatsObject);
-  return stats;
-};
-export const formatMemberAssignmentCompletions = (assignments = [], courses = [], completions = [], isChallengeModeStudent = false, isReadWriteModeStudent = false) => {
-  const stats = assignments.reduce((obj, assignment) => {
-    const assignmentCompletions = completions.filter(completion => assignment.exercises?.some(e => {
-      if (!e.name && !e.roleplayId && !e.botId && !e.courseSectionTopicId) return false;
-      if (e.name && completion.exercise !== e.name) return false;
-      if (e.roleplayId && completion.roleplayId !== e.roleplayId) return false;
-      if (e.botId && completion.botId !== e.botId) return false;
-      if (e.courseSectionTopicId && `${completion.courseSectionId}|${completion.topicId}` !== e.courseSectionTopicId) return false;
-      return true;
-    }));
-    const assignmentCourseCompletions = formatMemberCourseCompletions(courses, assignmentCompletions, assignment?.exercises, isChallengeModeStudent, null, "course", isReadWriteModeStudent);
-    const accumulator = {
-      percentComplete: {
-        completed: 0,
-        total: 0,
-        percentage: 0
-      },
-      percentCorrect: {
-        completed: 0,
-        total: 0,
-        percentage: 0
-      },
-      avgPronunciationScore: {
-        total: 0,
-        sum: 0,
-        percentage: 0
-      },
-      submittedLate: {
-        isLate: false
-      }
-    };
-    if (assignment.dueDate) {
-      const dueDateMs = new Date(assignment.dueDate).getTime();
-      const lateCompletion = assignmentCompletions.find(completion => completion.createdAt > dueDateMs);
-      if (lateCompletion) {
-        accumulator.submittedLate = {
-          isLate: true,
-          daysLate: calculateDaysLate(lateCompletion.createdAt, dueDateMs)
-        };
-      }
-    }
-    Object.values(assignmentCourseCompletions).forEach(course => {
-      if (course?.percentComplete) {
-        accumulator.percentComplete.completed += course.percentComplete.completed || 0;
-        accumulator.percentComplete.total += course.percentComplete.total || 0;
-      }
-      if (course?.percentCorrect) {
-        accumulator.percentCorrect.completed += course.percentCorrect.completed || 0;
-        accumulator.percentCorrect.total += course.percentCorrect.total || 0;
-      }
-      if (course?.avgPronunciationScore && course.avgPronunciationScore.percentage >= 0) {
-        accumulator.avgPronunciationScore.total += 1;
-        accumulator.avgPronunciationScore.sum += course.avgPronunciationScore.percentage;
-      }
-    });
-    if (accumulator.percentComplete.total > 0) {
-      accumulator.percentComplete.percentage = Math.floor(accumulator.percentComplete.completed / accumulator.percentComplete.total * 100);
-    }
-    if (accumulator.percentCorrect.total > 0) {
-      accumulator.percentCorrect.percentage = Math.floor(accumulator.percentCorrect.completed / accumulator.percentCorrect.total * 100);
-    }
-    if (accumulator.avgPronunciationScore.total > 0) {
-      accumulator.avgPronunciationScore.percentage = Math.floor(accumulator.avgPronunciationScore.sum / accumulator.avgPronunciationScore.total);
-    }
-    delete accumulator.avgPronunciationScore.sum;
-    obj[assignment.assignmentId] = accumulator;
-    return obj;
-  }, {});
-  return stats;
-};

package/dist/Tables/Progress/utils.test.js

@@ -1,129 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { formatMemberCourseCompletions, formatMemberAssignmentCompletions } from "./utils";
-import { courses, assignments, completions } from "../../../../.storybook/sampleProps";
-
-// A due date in the past; completions after this are "late"
-const DUE_DATE = "2026-03-10T12:00:00.000Z";
-const DUE_DATE_MS = new Date(DUE_DATE).getTime();
-const ON_TIME_TS = DUE_DATE_MS - 1000; // 1 s before due date
-const LATE_1_DAY_TS = DUE_DATE_MS + 25 * 60 * 60 * 1000; // ~25 h after = 2 days late (ceil)
-const LATE_3_DAYS_TS = DUE_DATE_MS + 3 * 24 * 60 * 60 * 1000 + 1000; // just over 3 days
-
-const baseAssignment = {
-  assignmentId: "test-a1",
-  dueDate: DUE_DATE,
-  exercises: [{
-    courseSectionTopicId: `${courses[0].courseId}|${courses[0].sections[0].sectionId}|${courses[0].sections[0].topics[0].topicId}`,
-    name: "translation"
-  }]
-};
-const makeCompletion = createdAt => ({
-  courseId: courses[0].courseId,
-  sectionId: courses[0].sections[0].sectionId,
-  courseSectionId: `${courses[0].courseId}|${courses[0].sections[0].sectionId}`,
-  topicId: courses[0].sections[0].topics[0].topicId,
-  memberId: "490230",
-  createdAt,
-  updatedAt: createdAt,
-  exercise: "translation",
-  createdBy: "490230"
-});
-describe("Progress utils", () => {
-  it("formatMemberCourseCompletions returns object keyed by courseId", () => {
-    const result = formatMemberCourseCompletions(courses, completions);
-    expect(Object.keys(result).length).toBeGreaterThan(0);
-    expect(result).toHaveProperty(courses[0].courseId);
-    const courseData = result[courses[0].courseId];
-    expect(courseData).toHaveProperty("percentComplete");
-    expect(courseData).toHaveProperty("percentCorrect");
-    expect(courseData).toHaveProperty("avgPronunciationScore");
-    expect(courseData).toHaveProperty("sections");
-  });
-  it("formatMemberCourseCompletions returns zero-state for empty completions", () => {
-    const result = formatMemberCourseCompletions(courses, []);
-    const firstCourse = result[courses[0].courseId];
-    expect(firstCourse.percentComplete.percentage).toBe(0);
-  });
-  it("formatMemberAssignmentCompletions returns object keyed by assignmentId", () => {
-    const result = formatMemberAssignmentCompletions(assignments, courses, completions);
-    expect(Object.keys(result).length).toBeGreaterThanOrEqual(0);
-    if (assignments && assignments.length) {
-      expect(result).toHaveProperty(assignments[0].assignmentId);
-      const assignmentData = result[assignments[0].assignmentId];
-      expect(assignmentData).toHaveProperty("percentComplete");
-      expect(assignmentData).toHaveProperty("percentCorrect");
-      expect(assignmentData).toHaveProperty("avgPronunciationScore");
-    }
-  });
-  it("formatMemberAssignmentCompletions handles empty inputs", () => {
-    const result = formatMemberAssignmentCompletions([], courses, []);
-    expect(result).toEqual({});
-  });
-
-  // --- submittedLate: assignment-level ---
-
-  it("submittedLate is false when there is no dueDate on the assignment", () => {
-    const assignment = {
-      ...baseAssignment,
-      dueDate: undefined
-    };
-    const result = formatMemberAssignmentCompletions([assignment], courses, [makeCompletion(LATE_1_DAY_TS)]);
-    expect(result[assignment.assignmentId].submittedLate).toEqual({
-      isLate: false
-    });
-  });
-  it("submittedLate is false when completion is on time", () => {
-    const result = formatMemberAssignmentCompletions([baseAssignment], courses, [makeCompletion(ON_TIME_TS)]);
-    expect(result[baseAssignment.assignmentId].submittedLate).toEqual({
-      isLate: false
-    });
-  });
-  it("submittedLate is false when there are no completions", () => {
-    const result = formatMemberAssignmentCompletions([baseAssignment], courses, []);
-    expect(result[baseAssignment.assignmentId].submittedLate).toEqual({
-      isLate: false
-    });
-  });
-  it("submittedLate.isLate is true when completion is past the due date", () => {
-    const result = formatMemberAssignmentCompletions([baseAssignment], courses, [makeCompletion(LATE_1_DAY_TS)]);
-    expect(result[baseAssignment.assignmentId].submittedLate.isLate).toBe(true);
-  });
-  it("submittedLate.daysLate is correct for a 3-day late completion", () => {
-    const result = formatMemberAssignmentCompletions([baseAssignment], courses, [makeCompletion(LATE_3_DAYS_TS)]);
-    const {
-      submittedLate
-    } = result[baseAssignment.assignmentId];
-    expect(submittedLate.isLate).toBe(true);
-    expect(submittedLate.daysLate).toBeGreaterThanOrEqual(3);
-  });
-  it("submittedLate reflects the earliest late completion when multiple exist", () => {
-    const veryLateTs = DUE_DATE_MS + 10 * 24 * 60 * 60 * 1000;
-    const result = formatMemberAssignmentCompletions([baseAssignment], courses, [makeCompletion(LATE_1_DAY_TS), makeCompletion(veryLateTs)]);
-    // Assignment-level submittedLate is based on any late completion (finds first)
-    expect(result[baseAssignment.assignmentId].submittedLate.isLate).toBe(true);
-  });
-
-  // --- submittedLate: topic-level via formatMemberCourseCompletions ---
-
-  it("topic submittedLate is false when completion is on time", () => {
-    const assignment = baseAssignment;
-    const result = formatMemberCourseCompletions(courses, [makeCompletion(ON_TIME_TS)], assignment.exercises, false, assignment, "assignments");
-    const topicData = result[courses[0].courseId]?.sections?.[courses[0].sections[0].sectionId]?.topics?.[courses[0].sections[0].topics[0].topicId];
-    expect(topicData?.submittedLate).toEqual({
-      isLate: false
-    });
-  });
-  it("topic submittedLate.isLate is true when completion is past the due date", () => {
-    const assignment = baseAssignment;
-    const result = formatMemberCourseCompletions(courses, [makeCompletion(LATE_1_DAY_TS)], assignment.exercises, false, assignment, "assignments");
-    const topicData = result[courses[0].courseId]?.sections?.[courses[0].sections[0].sectionId]?.topics?.[courses[0].sections[0].topics[0].topicId];
-    expect(topicData?.submittedLate?.isLate).toBe(true);
-    expect(topicData?.submittedLate?.daysLate).toBeGreaterThanOrEqual(1);
-  });
-  it("topic submittedLate is not set in courses reportType (no dueDate check)", () => {
-    // When reportType is "course" (default), submittedLate should not be attached
-    const result = formatMemberCourseCompletions(courses, [makeCompletion(LATE_1_DAY_TS)], null, false, null, "course");
-    const topicData = result[courses[0].courseId]?.sections?.[courses[0].sections[0].sectionId]?.topics?.[courses[0].sections[0].topics[0].topicId];
-    expect(topicData?.submittedLate).toBeUndefined();
-  });
-});

package/dist/Tables/Progress/viewState.js

@@ -1,27 +0,0 @@
-export function deriveCurrentView({
-  reportType,
-  selectedAssignment,
-  selectedTopic,
-  selectedRoleplay,
-  selectedPhraseList,
-  selectedCourse,
-  selectedSection
-}) {
-  // Assignment views take precedence when reportType is assignments
-  if (reportType === "assignments") {
-    if (selectedAssignment && selectedTopic && selectedRoleplay) return "assignment-roleplay";
-    if (selectedAssignment && selectedTopic && selectedPhraseList) return "assignment-phrase-list";
-    if (selectedAssignment && selectedTopic) return "assignment-topic";
-    if (selectedAssignment) return "assignment-topics";
-    return "assignments";
-  }
-
-  // Course/section/topic/roleplay/phrase-list navigation
-  if (selectedCourse && selectedSection && selectedTopic && selectedRoleplay) return "roleplay";
-  if (selectedCourse && selectedSection && selectedTopic && selectedPhraseList) return "phrase-list";
-  if (selectedCourse && selectedSection && selectedTopic) return "topic";
-  if (selectedCourse && selectedSection) return "section";
-  if (selectedCourse) return "course";
-  return "all_courses";
-}
-export default deriveCurrentView;