analytica-frontend-lib 1.2.47 → 1.2.49

package/dist/index.js

@@ -143,6 +143,7 @@ __export(src_exports, {
   Radio: () => Radio_default,
   RadioGroup: () => RadioGroup,
   RadioGroupItem: () => RadioGroupItem,
+  RecommendedLessonDetails: () => RecommendedLessonDetails_default,
   RecommendedLessonsHistory: () => RecommendedLessonsHistory,
   STUDENT_ACTIVITY_STATUS: () => STUDENT_ACTIVITY_STATUS,
   SUBTYPE_ENUM: () => SUBTYPE_ENUM,
@@ -164,6 +165,7 @@ __export(src_exports, {
   SkeletonText: () => SkeletonText,
   StatisticsCard: () => StatisticsCard,
   Stepper: () => Stepper_default,
+  StudentLessonStatus: () => StudentLessonStatus,
   SubjectEnum: () => SubjectEnum,
   SubjectInfo: () => SubjectInfo,
   Support: () => Support_default,
@@ -192,15 +194,19 @@ __export(src_exports, {
   createNotificationStore: () => createNotificationStore,
   createNotificationsHook: () => createNotificationsHook,
   createQuestionsListHook: () => createQuestionsListHook,
+  createRecommendedLessonDetailsHook: () => createRecommendedLessonDetailsHook,
   createRecommendedLessonsHistoryHook: () => createRecommendedLessonsHistoryHook,
   createUseActivityFiltersData: () => createUseActivityFiltersData,
   createUseNotificationStore: () => createUseNotificationStore,
   createUseNotifications: () => createUseNotifications,
   createUseQuestionsList: () => createUseQuestionsList,
+  createUseRecommendedLessonDetails: () => createUseRecommendedLessonDetails,
   createUseRecommendedLessonsHistory: () => createUseRecommendedLessonsHistory,
   createZustandAuthAdapter: () => createZustandAuthAdapter,
+  deriveStudentStatus: () => deriveStudentStatus,
   determineGoalStatus: () => determineGoalStatus,
   formatDateToBrazilian: () => formatDateToBrazilian,
+  formatDaysToComplete: () => formatDaysToComplete,
   formatFileSize: () => formatFileSize,
   formatQuestionNumbers: () => formatQuestionNumbers,
   formatTimeAgo: () => formatTimeAgo,
@@ -217,13 +223,19 @@ __export(src_exports, {
   getStatusBadgeAction: () => getStatusBadgeAction,
   getStatusBadgeConfig: () => getStatusBadgeConfig,
   getStatusText: () => getStatusText,
+  getStudentStatusBadgeAction: () => getStudentStatusBadgeAction,
   getSubjectColorClass: () => getSubjectColorClass,
   getSubjectColorWithOpacity: () => getSubjectColorWithOpacity,
   getSubjectIcon: () => getSubjectIcon,
   getSubjectInfo: () => getSubjectInfo,
   getSubjectName: () => getSubjectName,
+  goalApiResponseSchema: () => goalApiResponseSchema,
+  goalDetailsApiResponseSchema: () => goalDetailsApiResponseSchema,
   goalsHistoryApiResponseSchema: () => goalsHistoryApiResponseSchema,
   handleGoalFetchError: () => handleGoalFetchError,
+  handleLessonDetailsFetchError: () => handleLessonDetailsFetchError,
+  historyApiResponseSchema: () => historyApiResponseSchema,
+  isDeadlinePassed: () => isDeadlinePassed,
   isFormValid: () => isFormValid,
   isStepValid: () => isStepValid,
   mapApiStatusToInternal: () => mapApiStatusToInternal,
@@ -3961,7 +3973,7 @@ var AlertsManagerView = ({
   const handleClose = () => {
     onClose?.();
   };
-  const formatDate = (dateInput) => {
+  const formatDate2 = (dateInput) => {
     const date = dateInput instanceof Date ? dateInput : new Date(dateInput);
     if (Number.isNaN(date.getTime())) return String(dateInput);
     return date.toLocaleDateString("pt-BR", {
@@ -3995,7 +4007,7 @@ var AlertsManagerView = ({
         /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Divider_default, { className: "my-4" }),
         /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex justify-between items-center mb-4 px-2", children: [
           /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text_default, { size: "sm", weight: "bold", className: "text-text-700", children: "Enviado em" }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text_default, { size: "sm", weight: "medium", className: "text-text-900", children: formatDate(alertData.sentAt) })
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Text_default, { size: "sm", weight: "medium", className: "text-text-900", children: formatDate2(alertData.sentAt) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Divider_default, { className: "my-4" }),
         /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Table_default, { variant: "borderless", className: "table-fixed", children: [
@@ -6090,8 +6102,8 @@ var ProgressBar_default = ProgressBar;
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var SIZE_CLASSES9 = {
   small: {
-    container: "w-[90px] h-[90px]",
-    // 90px circle from design specs
+    container: "w-[107px] h-[107px]",
+    // 107px circle to fit labels like "CONCLUÍDO"
     strokeWidth: 4,
     // 4px stroke width - matches ProgressBar small (h-1)
     textSize: "2xl",
@@ -6099,13 +6111,13 @@ var SIZE_CLASSES9 = {
     textWeight: "medium",
     // font-weight: 500
     labelSize: "2xs",
-    // Will be overridden with custom 8px in className
+    // 10px for status label
     labelWeight: "bold",
     // font-weight: 700
     spacing: "gap-0",
     // Reduced gap between percentage and label for better spacing
-    contentWidth: "max-w-[50px]"
-    // Reduced width to fit text inside circle
+    contentWidth: "max-w-[85px]"
+    // Width to fit labels like "CONCLUÍDO" inside circle
   },
   medium: {
     container: "w-[152px] h-[152px]",
@@ -6164,11 +6176,11 @@ var ProgressCircle = ({
   const percentage = max === 0 ? 0 : clampedValue / max * 100;
   const sizeClasses = SIZE_CLASSES9[size];
   const variantClasses = VARIANT_CLASSES3[variant];
-  const radius = size === "small" ? 37 : 64;
+  const radius = size === "small" ? 49 : 64;
   const circumference = 2 * Math.PI * radius;
   const strokeDashoffset = circumference - percentage / 100 * circumference;
-  const center = size === "small" ? 45 : 76;
-  const svgSize = size === "small" ? 90 : 152;
+  const center = size === "small" ? 53.5 : 76;
+  const svgSize = size === "small" ? 107 : 152;
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
     "div",
     {
@@ -21099,6 +21111,41 @@ var GOAL_STATUS_OPTIONS = [
   { id: "VENCIDA" /* VENCIDA */, name: "Vencida" },
   { id: "CONCLUIDA" /* CONCLUIDA */, name: "Conclu\xEDda" }
 ];
+var StudentLessonStatus = /* @__PURE__ */ ((StudentLessonStatus2) => {
+  StudentLessonStatus2["A_INICIAR"] = "A INICIAR";
+  StudentLessonStatus2["EM_ANDAMENTO"] = "EM ANDAMENTO";
+  StudentLessonStatus2["NAO_FINALIZADO"] = "N\xC3O FINALIZADO";
+  StudentLessonStatus2["CONCLUIDO"] = "CONCLU\xCDDO";
+  return StudentLessonStatus2;
+})(StudentLessonStatus || {});
+var getStudentStatusBadgeAction = (status) => {
+  const actionMap = {
+    ["CONCLU\xCDDO" /* CONCLUIDO */]: "success",
+    ["EM ANDAMENTO" /* EM_ANDAMENTO */]: "info",
+    ["A INICIAR" /* A_INICIAR */]: "warning",
+    ["N\xC3O FINALIZADO" /* NAO_FINALIZADO */]: "error"
+  };
+  return actionMap[status] ?? "warning";
+};
+var isDeadlinePassed = (deadline) => {
+  if (!deadline) return false;
+  return new Date(deadline) < /* @__PURE__ */ new Date();
+};
+var deriveStudentStatus = (progress, completedAt, deadline) => {
+  if (completedAt) return "CONCLU\xCDDO" /* CONCLUIDO */;
+  if (progress === 100) return "CONCLU\xCDDO" /* CONCLUIDO */;
+  if (isDeadlinePassed(deadline ?? null) && progress < 100) {
+    return "N\xC3O FINALIZADO" /* NAO_FINALIZADO */;
+  }
+  if (progress === 0) return "A INICIAR" /* A_INICIAR */;
+  if (progress > 0) return "EM ANDAMENTO" /* EM_ANDAMENTO */;
+  return "A INICIAR" /* A_INICIAR */;
+};
+var formatDaysToComplete = (daysToComplete) => {
+  if (daysToComplete === null) return null;
+  if (daysToComplete === 1) return "1 dia";
+  return `${daysToComplete} dias`;
+};
 
 // src/hooks/useRecommendedLessons.ts
 var import_react68 = require("react");
@@ -21730,6 +21777,594 @@ var RecommendedLessonsHistory = ({
     }
   );
 };
+
+// src/components/RecommendedLessonDetails/RecommendedLessonDetails.tsx
+var import_react75 = require("react");
+
+// src/components/RecommendedLessonDetails/components/Breadcrumb.tsx
+var import_react70 = require("@phosphor-icons/react");
+var import_jsx_runtime84 = require("react/jsx-runtime");
+var Breadcrumb = ({ items, onItemClick }) => /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("nav", { className: "flex items-center gap-2 text-sm", "aria-label": "Breadcrumb", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
+  Text_default,
+  {
+    as: "span",
+    className: "flex items-center gap-2",
+    children: [
+      index > 0 && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_react70.CaretRightIcon, { size: 14, className: "text-text-500" }),
+      item.path ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: () => onItemClick?.(item.path),
+          className: "text-text-600 hover:text-primary-700 transition-colors",
+          children: item.label
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Text_default, { as: "span", className: "text-text-950 font-medium", children: item.label })
+    ]
+  },
+  item.path ?? item.label
+)) });
+
+// src/components/RecommendedLessonDetails/components/LessonHeader.tsx
+var import_react71 = require("@phosphor-icons/react");
+
+// src/components/RecommendedLessonDetails/utils/lessonDetailsUtils.ts
+var formatDate = (dateString) => {
+  if (!dateString) return "-";
+  const date = new Date(dateString);
+  if (Number.isNaN(date.getTime())) return "-";
+  return date.toLocaleDateString("pt-BR", {
+    day: "2-digit",
+    month: "2-digit",
+    year: "numeric"
+  });
+};
+var transformStudentForDisplay = (student, deadline) => ({
+  id: student.userInstitutionId,
+  name: student.name,
+  status: deriveStudentStatus(student.progress, student.completedAt, deadline),
+  completionPercentage: student.progress,
+  duration: formatDaysToComplete(student.daysToComplete)
+});
+
+// src/components/RecommendedLessonDetails/components/LessonHeader.tsx
+var import_jsx_runtime85 = require("react/jsx-runtime");
+var LessonHeader = ({
+  data,
+  onViewLesson,
+  mapSubjectNameToEnum,
+  viewLessonLabel
+}) => {
+  const { goal, breakdown } = data;
+  const subjectName = goal.lessonsGoals[0]?.supLessonsProgress?.lesson?.subject?.name || "";
+  const subjectEnum = mapSubjectNameToEnum?.(subjectName);
+  const subjectInfo = subjectEnum ? getSubjectInfo(subjectEnum) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: "bg-background rounded-xl border border-border-50 p-6", children: /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+        Text_default,
+        {
+          as: "h1",
+          size: "xl",
+          weight: "bold",
+          className: "text-text-950 lg:text-2xl",
+          children: goal.title
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "flex flex-wrap items-center gap-2 text-sm text-text-600", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(Text_default, { as: "span", size: "sm", className: "text-text-600", children: [
+          "In\xEDcio em ",
+          formatDate(goal.startDate)
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }),
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(Text_default, { as: "span", size: "sm", className: "text-text-600", children: [
+          "Prazo final ",
+          formatDate(goal.finalDate)
+        ] }),
+        breakdown?.schoolName && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(import_jsx_runtime85.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-600", children: breakdown.schoolName })
+        ] }),
+        subjectName && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(import_jsx_runtime85.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(Text_default, { as: "span", size: "sm", className: "flex items-center gap-1", children: [
+            subjectInfo && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+              Text_default,
+              {
+                as: "span",
+                className: cn(
+                  "size-5 rounded flex items-center justify-center text-white",
+                  subjectInfo.colorClass
+                ),
+                children: subjectInfo.icon
+              }
+            ),
+            subjectName
+          ] })
+        ] }),
+        breakdown?.className && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(import_jsx_runtime85.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-400", children: "\u2022" }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Text_default, { as: "span", size: "sm", className: "text-text-600", children: breakdown.className })
+        ] })
+      ] })
+    ] }),
+    onViewLesson && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+      Button_default,
+      {
+        variant: "solid",
+        action: "primary",
+        size: "small",
+        iconLeft: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_react71.BookBookmarkIcon, { size: 16 }),
+        onClick: onViewLesson,
+        children: viewLessonLabel
+      }
+    )
+  ] }) });
+};
+
+// src/components/RecommendedLessonDetails/components/LoadingSkeleton.tsx
+var import_jsx_runtime86 = require("react/jsx-runtime");
+var LoadingSkeleton = () => /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex flex-col gap-6", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonText, { width: 256 }),
+  /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "bg-background rounded-xl border border-border-50 p-6", children: /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonText, { width: "75%", height: 28 }),
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonText, { width: "50%" })
+  ] }) }),
+  /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonText, { width: 192, height: 20 }),
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonRounded, { height: 140 }),
+      /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonRounded, { height: 140 }),
+      /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonRounded, { height: 140 })
+    ] })
+  ] }),
+  /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "bg-background rounded-xl border border-border-50 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SkeletonTable, { rows: 4, columns: 5 }) })
+] });
+
+// src/components/RecommendedLessonDetails/components/ResultsSection.tsx
+var import_react72 = require("@phosphor-icons/react");
+var import_jsx_runtime87 = require("react/jsx-runtime");
+var ResultsSection = ({ data, labels }) => {
+  const { details } = data;
+  const { aggregated, contentPerformance } = details;
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Text_default, { as: "h2", size: "md", weight: "semibold", className: "text-text-950", children: labels.resultsTitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: "bg-background rounded-xl border border-border-50 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-primary-50", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+        ProgressCircle_default,
+        {
+          value: aggregated.completionPercentage,
+          size: "small",
+          variant: "blue",
+          label: labels.completedLabel,
+          showPercentage: true
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-success-200", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            as: "span",
+            className: "size-8 rounded-full flex items-center justify-center bg-warning-300 mb-2",
+            children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_react72.TrophyIcon, { size: 18, weight: "fill", className: "text-white" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            size: "2xs",
+            weight: "bold",
+            className: "text-text-700 uppercase text-center leading-none mb-1",
+            children: labels.bestResultLabel
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            size: "xl",
+            weight: "bold",
+            className: "text-success-700 text-center leading-none tracking-wide",
+            children: contentPerformance.best?.contentName || "-"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "flex flex-col items-center justify-center rounded-xl p-4 min-h-28 bg-error-100", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            as: "span",
+            className: "size-8 rounded-full flex items-center justify-center bg-error-300 mb-2",
+            children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_react72.WarningIcon, { size: 18, weight: "fill", className: "text-error-700" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            size: "2xs",
+            weight: "bold",
+            className: "text-text-700 uppercase text-center leading-none mb-1",
+            children: labels.hardestTopicLabel
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          Text_default,
+          {
+            size: "xl",
+            weight: "bold",
+            className: "text-error-700 text-center leading-none tracking-wide",
+            children: contentPerformance.worst?.contentName || "-"
+          }
+        )
+      ] })
+    ] }) })
+  ] });
+};
+
+// src/components/RecommendedLessonDetails/components/StudentsTable.tsx
+var import_react73 = require("react");
+var import_react74 = require("@phosphor-icons/react");
+var import_jsx_runtime88 = require("react/jsx-runtime");
+var StudentsTable = ({
+  students,
+  onViewPerformance,
+  labels,
+  emptyMessage = "Nenhum aluno encontrado"
+}) => {
+  const { sortedData, sortColumn, sortDirection, handleSort } = useTableSort(students);
+  const canViewPerformance = (0, import_react73.useCallback)((student) => {
+    return student.status === "CONCLU\xCDDO" /* CONCLUIDO */ || student.status === "N\xC3O FINALIZADO" /* NAO_FINALIZADO */;
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "bg-background rounded-xl border border-border-50 overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Table_default, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(TableRow, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+        TableHead,
+        {
+          sortable: true,
+          sortDirection: sortColumn === "name" ? sortDirection : void 0,
+          onSort: () => handleSort("name"),
+          children: labels.studentColumn
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+        TableHead,
+        {
+          sortable: true,
+          sortDirection: sortColumn === "status" ? sortDirection : void 0,
+          onSort: () => handleSort("status"),
+          children: labels.statusColumn
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+        TableHead,
+        {
+          sortable: true,
+          sortDirection: sortColumn === "completionPercentage" ? sortDirection : void 0,
+          onSort: () => handleSort("completionPercentage"),
+          children: labels.completionColumn
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableHead, { children: labels.durationColumn }),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableHead, { className: "w-[140px]" })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableBody, { children: sortedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { colSpan: 5, className: "text-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Text_default, { size: "sm", className: "text-text-500", children: emptyMessage }) }) }) : sortedData.map((student) => /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(TableRow, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+          Text_default,
+          {
+            as: "span",
+            className: "size-8 rounded-full bg-background-100 flex items-center justify-center",
+            children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_react74.UserIcon, { size: 16, className: "text-text-500" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Text_default, { size: "sm", className: "text-text-950", children: student.name })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+        Badge_default,
+        {
+          variant: "solid",
+          action: getStudentStatusBadgeAction(student.status),
+          size: "small",
+          children: student.status
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex flex-col gap-1 min-w-[120px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(Text_default, { size: "sm", className: "text-primary-700 font-medium", children: [
+          student.completionPercentage,
+          "%"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+          ProgressBar_default,
+          {
+            value: student.completionPercentage,
+            size: "small",
+            variant: "blue",
+            className: "w-full max-w-[100px]"
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Text_default, { size: "sm", className: "text-text-700", children: student.duration ?? "-" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(TableCell, { children: canViewPerformance(student) ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+        Button_default,
+        {
+          variant: "outline",
+          size: "extra-small",
+          onClick: () => onViewPerformance?.(student.id),
+          children: labels.viewPerformance
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Button_default, { variant: "outline", size: "extra-small", disabled: true, children: labels.viewPerformance }) })
+    ] }, student.id)) })
+  ] }) });
+};
+
+// src/components/RecommendedLessonDetails/types.ts
+var DEFAULT_LABELS = {
+  viewLesson: "Ver aula",
+  viewPerformance: "Ver desempenho",
+  resultsTitle: "Resultados da aula recomendada",
+  completedLabel: "CONCLU\xCDDO",
+  bestResultLabel: "MELHOR RESULTADO",
+  hardestTopicLabel: "MAIOR DIFICULDADE",
+  studentColumn: "Aluno",
+  statusColumn: "Status",
+  completionColumn: "Conclus\xE3o",
+  durationColumn: "Dura\xE7\xE3o"
+};
+
+// src/components/RecommendedLessonDetails/RecommendedLessonDetails.tsx
+var import_jsx_runtime89 = require("react/jsx-runtime");
+var RecommendedLessonDetails = ({
+  data,
+  loading = false,
+  error = null,
+  onViewLesson,
+  onViewStudentPerformance,
+  onBreadcrumbClick,
+  mapSubjectNameToEnum,
+  breadcrumbs,
+  labels: customLabels,
+  className
+}) => {
+  const labels = (0, import_react75.useMemo)(
+    () => ({ ...DEFAULT_LABELS, ...customLabels }),
+    [customLabels]
+  );
+  const defaultBreadcrumbs = (0, import_react75.useMemo)(
+    () => [
+      { label: "Aulas recomendadas", path: "/aulas-recomendadas" },
+      { label: data?.goal.title || "Detalhes" }
+    ],
+    [data?.goal.title]
+  );
+  const breadcrumbItems = breadcrumbs || defaultBreadcrumbs;
+  const displayStudents = (0, import_react75.useMemo)(() => {
+    if (!data?.details.students) return [];
+    const deadline = data?.goal.finalDate;
+    return data.details.students.map(
+      (student) => transformStudentForDisplay(student, deadline)
+    );
+  }, [data?.details.students, data?.goal.finalDate]);
+  if (loading) {
+    return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+      "div",
+      {
+        className: cn("flex flex-col gap-6", className),
+        "data-testid": "lesson-details-loading",
+        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(LoadingSkeleton, {})
+      }
+    );
+  }
+  if (error) {
+    return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+      "div",
+      {
+        className: cn(
+          "flex flex-col items-center justify-center py-12",
+          className
+        ),
+        "data-testid": "lesson-details-error",
+        children: /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Text_default, { size: "md", className: "text-error-700", children: error })
+      }
+    );
+  }
+  if (!data) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+    "div",
+    {
+      className: cn("flex flex-col gap-6", className),
+      "data-testid": "recommended-lesson-details",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Breadcrumb, { items: breadcrumbItems, onItemClick: onBreadcrumbClick }),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          LessonHeader,
+          {
+            data,
+            onViewLesson,
+            mapSubjectNameToEnum,
+            viewLessonLabel: labels.viewLesson
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(ResultsSection, { data, labels }),
+        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+          StudentsTable,
+          {
+            students: displayStudents,
+            onViewPerformance: onViewStudentPerformance,
+            labels
+          }
+        )
+      ]
+    }
+  );
+};
+var RecommendedLessonDetails_default = RecommendedLessonDetails;
+
+// src/hooks/useRecommendedLessonDetails.ts
+var import_react76 = require("react");
+var import_zod5 = require("zod");
+var goalLessonSubjectSchema = import_zod5.z.object({
+  id: import_zod5.z.string(),
+  name: import_zod5.z.string(),
+  color: import_zod5.z.string(),
+  icon: import_zod5.z.string()
+});
+var lessonContentSchema = import_zod5.z.object({
+  id: import_zod5.z.string(),
+  name: import_zod5.z.string()
+});
+var goalLessonSchema = import_zod5.z.object({
+  id: import_zod5.z.string(),
+  content: lessonContentSchema,
+  subtopic: lessonContentSchema,
+  topic: lessonContentSchema,
+  subject: goalLessonSubjectSchema
+});
+var goalLessonProgressSchema = import_zod5.z.object({
+  id: import_zod5.z.string(),
+  userId: import_zod5.z.string(),
+  lessonId: import_zod5.z.string(),
+  progress: import_zod5.z.number(),
+  lesson: goalLessonSchema
+});
+var goalLessonGoalItemSchema = import_zod5.z.object({
+  goalId: import_zod5.z.string(),
+  supLessonsProgressId: import_zod5.z.string(),
+  supLessonsProgress: goalLessonProgressSchema
+});
+var goalMetadataSchema = import_zod5.z.object({
+  id: import_zod5.z.string(),
+  title: import_zod5.z.string(),
+  startDate: import_zod5.z.string(),
+  finalDate: import_zod5.z.string(),
+  progress: import_zod5.z.number(),
+  lessonsGoals: import_zod5.z.array(goalLessonGoalItemSchema)
+});
+var goalApiResponseSchema = import_zod5.z.object({
+  message: import_zod5.z.string(),
+  data: goalMetadataSchema
+});
+var goalDetailStudentSchema = import_zod5.z.object({
+  userInstitutionId: import_zod5.z.string(),
+  userId: import_zod5.z.string(),
+  name: import_zod5.z.string(),
+  progress: import_zod5.z.number(),
+  completedAt: import_zod5.z.string().nullable(),
+  avgScore: import_zod5.z.number().nullable(),
+  daysToComplete: import_zod5.z.number().nullable()
+});
+var goalDetailAggregatedSchema = import_zod5.z.object({
+  completionPercentage: import_zod5.z.number(),
+  avgScore: import_zod5.z.number().nullable()
+});
+var goalDetailContentPerformanceItemSchema = import_zod5.z.object({
+  contentId: import_zod5.z.string(),
+  contentName: import_zod5.z.string(),
+  rate: import_zod5.z.number()
+}).nullable();
+var goalDetailContentPerformanceSchema = import_zod5.z.object({
+  best: goalDetailContentPerformanceItemSchema,
+  worst: goalDetailContentPerformanceItemSchema
+});
+var goalDetailsDataSchema = import_zod5.z.object({
+  students: import_zod5.z.array(goalDetailStudentSchema),
+  aggregated: goalDetailAggregatedSchema,
+  contentPerformance: goalDetailContentPerformanceSchema
+});
+var goalDetailsApiResponseSchema = import_zod5.z.object({
+  message: import_zod5.z.string(),
+  data: goalDetailsDataSchema
+});
+var goalBreakdownSchema2 = import_zod5.z.object({
+  classId: import_zod5.z.string().uuid(),
+  className: import_zod5.z.string(),
+  schoolId: import_zod5.z.string(),
+  schoolName: import_zod5.z.string(),
+  studentCount: import_zod5.z.number(),
+  completedCount: import_zod5.z.number()
+});
+var historyGoalItemSchema = import_zod5.z.object({
+  goal: import_zod5.z.object({ id: import_zod5.z.string().uuid() }),
+  breakdown: import_zod5.z.array(goalBreakdownSchema2)
+});
+var historyApiResponseSchema = import_zod5.z.object({
+  message: import_zod5.z.string(),
+  data: import_zod5.z.object({
+    goals: import_zod5.z.array(historyGoalItemSchema),
+    total: import_zod5.z.number()
+  })
+});
+var handleLessonDetailsFetchError = (error) => {
+  if (error instanceof import_zod5.z.ZodError) {
+    console.error("Erro ao validar dados dos detalhes da aula:", error);
+    return "Erro ao validar dados dos detalhes da aula";
+  }
+  console.error("Erro ao carregar detalhes da aula:", error);
+  return "Erro ao carregar detalhes da aula";
+};
+var createUseRecommendedLessonDetails = (apiClient) => {
+  return (lessonId) => {
+    const [state, setState] = (0, import_react76.useState)({
+      data: null,
+      loading: true,
+      error: null
+    });
+    const fetchLessonDetails = (0, import_react76.useCallback)(async () => {
+      if (!lessonId) {
+        setState({
+          data: null,
+          loading: false,
+          error: "ID da aula n\xE3o encontrado"
+        });
+        return;
+      }
+      setState((prev) => ({ ...prev, loading: true, error: null }));
+      try {
+        const promises = [
+          apiClient.fetchGoal(lessonId),
+          apiClient.fetchGoalDetails(lessonId),
+          apiClient.fetchBreakdown ? apiClient.fetchBreakdown(lessonId) : Promise.resolve(null)
+        ];
+        const [goalResponse, detailsResponse, historyResponse] = await Promise.all(promises);
+        const validatedGoal = goalApiResponseSchema.parse(goalResponse);
+        const validatedDetails = goalDetailsApiResponseSchema.parse(detailsResponse);
+        let breakdown;
+        if (historyResponse) {
+          const validatedHistory = historyApiResponseSchema.parse(historyResponse);
+          const historyItem = validatedHistory.data.goals.find(
+            (g) => g.goal.id === lessonId
+          );
+          breakdown = historyItem?.breakdown[0];
+        }
+        const lessonData = {
+          goal: validatedGoal.data,
+          details: validatedDetails.data,
+          breakdown
+        };
+        setState({
+          data: lessonData,
+          loading: false,
+          error: null
+        });
+      } catch (error) {
+        const errorMessage = handleLessonDetailsFetchError(error);
+        setState({
+          data: null,
+          loading: false,
+          error: errorMessage
+        });
+      }
+    }, [lessonId]);
+    (0, import_react76.useEffect)(() => {
+      fetchLessonDetails();
+    }, [fetchLessonDetails]);
+    return {
+      ...state,
+      refetch: fetchLessonDetails
+    };
+  };
+};
+var createRecommendedLessonDetailsHook = createUseRecommendedLessonDetails;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ACTIVITY_AVAILABILITY,
@@ -21845,6 +22480,7 @@ var RecommendedLessonsHistory = ({
   Radio,
   RadioGroup,
   RadioGroupItem,
+  RecommendedLessonDetails,
   RecommendedLessonsHistory,
   STUDENT_ACTIVITY_STATUS,
   SUBTYPE_ENUM,
@@ -21866,6 +22502,7 @@ var RecommendedLessonsHistory = ({
   SkeletonText,
   StatisticsCard,
   Stepper,
+  StudentLessonStatus,
   SubjectEnum,
   SubjectInfo,
   Support,
@@ -21894,15 +22531,19 @@ var RecommendedLessonsHistory = ({
   createNotificationStore,
   createNotificationsHook,
   createQuestionsListHook,
+  createRecommendedLessonDetailsHook,
   createRecommendedLessonsHistoryHook,
   createUseActivityFiltersData,
   createUseNotificationStore,
   createUseNotifications,
   createUseQuestionsList,
+  createUseRecommendedLessonDetails,
   createUseRecommendedLessonsHistory,
   createZustandAuthAdapter,
+  deriveStudentStatus,
   determineGoalStatus,
   formatDateToBrazilian,
+  formatDaysToComplete,
   formatFileSize,
   formatQuestionNumbers,
   formatTimeAgo,
@@ -21919,13 +22560,19 @@ var RecommendedLessonsHistory = ({
   getStatusBadgeAction,
   getStatusBadgeConfig,
   getStatusText,
+  getStudentStatusBadgeAction,
   getSubjectColorClass,
   getSubjectColorWithOpacity,
   getSubjectIcon,
   getSubjectInfo,
   getSubjectName,
+  goalApiResponseSchema,
+  goalDetailsApiResponseSchema,
   goalsHistoryApiResponseSchema,
   handleGoalFetchError,
+  handleLessonDetailsFetchError,
+  historyApiResponseSchema,
+  isDeadlinePassed,
   isFormValid,
   isStepValid,
   mapApiStatusToInternal,