@local-civics/mgmt-ui 0.1.229 → 0.1.231

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useState, useMemo } from 'react';
-import { IconChevronRight, IconVideo, IconSwitchHorizontal, IconLogout, IconHome2, IconGauge, IconCategory2, IconRoute, IconAlbum, IconLambda, IconClipboard, IconBuilding, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconCaretDown, IconCaretUp, IconChevronDown, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconPointer, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook, IconExternalLink, IconChevronLeft } from '@tabler/icons';
+import { IconChevronRight, IconVideo, IconSwitchHorizontal, IconLogout, IconHome2, IconGauge, IconCategory2, IconRoute, IconAlbum, IconLambda, IconClipboard, IconBuilding, IconBooks, IconBackpack, IconClipboardCopy, IconTableExport, IconCaretDown, IconCaretUp, IconChevronDown, IconArrowLeft, IconSearch, IconCheck, IconTrash, IconPlus, IconLink, IconDownload, IconCloudUpload, IconInfoCircle, IconPlaylistAdd, IconPointer, IconX, IconScribble, IconSchool, IconPodium, IconBriefcase, IconPresentation, IconNews, IconTools, IconBrandInstagram, IconBrandLinkedin, IconBrandFacebook, IconChevronLeft } from '@tabler/icons';
 import { Avatar, createStyles, Modal, Center, Loader, Container, Group, Button, Title, Text, Image, Drawer, Divider, TextInput, Tooltip, ActionIcon, SimpleGrid, Badge as Badge$1, Card, UnstyledButton, Overlay, Stack as Stack$5, ThemeIcon, Checkbox, Autocomplete, createEmotionCache, MantineProvider, AppShell } from '@mantine/core';
 import { Link } from 'react-router-dom';
 import 'external-svg-loader';
@@ -3335,31 +3335,21 @@ const SplitButton = (props) => {
 };
 
 function Stack(props) {
-  const { items, hideBadge, hideLesson, hidePathway } = props;
+  const { items, hideBadge, hideLesson, hidePathway, onBadgeClick, onLessonClick, onPathwayClick } = props;
   if (!items.length)
     return null;
   const columns = [
-    "minmax(0,2fr)",
     !hidePathway && "minmax(0,1.3fr)",
-    !hideLesson && "minmax(0,1.3fr)",
     !hideBadge && "minmax(0,1.3fr)",
+    !hideLesson && "minmax(0,1.3fr)",
+    "minmax(0,2fr)",
     "auto"
   ].filter(Boolean).join(" ");
   const headerCell = "border-b border-slate-100 pb-2 text-[10.5px] font-extrabold uppercase tracking-wide text-slate-400";
   const dataCell = "py-3";
-  return /* @__PURE__ */ React.createElement("div", { className: "grid items-center gap-x-3", style: { gridTemplateColumns: columns } }, /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Question"), !hidePathway && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Pathway"), !hideLesson && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Lesson"), !hideBadge && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Badge"), /* @__PURE__ */ React.createElement("div", { className: headerCell }), items.map((row, i) => {
+  return /* @__PURE__ */ React.createElement("div", { className: "grid items-center gap-x-3", style: { gridTemplateColumns: columns } }, !hidePathway && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Pathway"), !hideBadge && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Badge"), !hideLesson && /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Lesson"), /* @__PURE__ */ React.createElement("div", { className: headerCell }, "Question"), /* @__PURE__ */ React.createElement("div", { className: headerCell }), items.map((row, i) => {
     const rowBorder = i > 0 ? "border-t border-slate-100" : "";
-    return /* @__PURE__ */ React.createElement(React.Fragment, { key: i }, /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} text-xs font-semibold text-dark-blue-400` }, row.question), !hidePathway && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.pathwayName || "\u2014"), !hideLesson && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.lessonName), !hideBadge && /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.badgeName), /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} flex shrink-0 gap-2` }, /* @__PURE__ */ React.createElement(
-      "a",
-      {
-        href: row.link,
-        target: "_blank",
-        rel: "noopener noreferrer",
-        className: "flex items-center gap-1 rounded-md border border-slate-200 px-2.5 py-1.5 text-[11px] font-bold text-slate-600 no-underline hover:bg-slate-50"
-      },
-      /* @__PURE__ */ React.createElement(IconExternalLink, { size: 12, stroke: 2 }),
-      "Preview"
-    ), /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React.createElement(React.Fragment, { key: i }, !hidePathway && (row.pathwayId && onPathwayClick ? /* @__PURE__ */ React.createElement("button", { type: "button", onClick: () => onPathwayClick(row.pathwayId), className: `${dataCell} ${rowBorder} truncate text-left text-[11px] font-semibold text-sky-blue-400 hover:underline` }, row.pathwayName || "\u2014") : /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.pathwayName || "\u2014")), !hideBadge && (row.badgeId && onBadgeClick ? /* @__PURE__ */ React.createElement("button", { type: "button", onClick: () => onBadgeClick(row.badgeId), className: `${dataCell} ${rowBorder} truncate text-left text-[11px] font-semibold text-sky-blue-400 hover:underline` }, row.badgeName) : /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.badgeName)), !hideLesson && (row.lessonId && onLessonClick ? /* @__PURE__ */ React.createElement("button", { type: "button", onClick: () => onLessonClick(row.lessonId), className: `${dataCell} ${rowBorder} truncate text-left text-[11px] font-semibold text-sky-blue-400 hover:underline` }, row.lessonName) : /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} truncate text-[11px] text-slate-500` }, row.lessonName)), /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} text-xs font-semibold text-dark-blue-400` }, row.question), /* @__PURE__ */ React.createElement("div", { className: `${dataCell} ${rowBorder} flex shrink-0 gap-2` }, /* @__PURE__ */ React.createElement(
       "a",
       {
         href: row.link,
@@ -3438,14 +3428,33 @@ function Table(props) {
         "Review Submission"
       )),
       /* @__PURE__ */ React.createElement(IconChevronRight, { size: 16, stroke: 2, className: `w-4 shrink-0 text-slate-300 transition-transform ${isOpen ? "rotate-90" : ""}` })
-    ), isOpen && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 px-4 py-3" }, /* @__PURE__ */ React.createElement(Stack, { items: row.submissions, hideBadge: props.hideBadge, hideLesson: props.hideLesson, hidePathway: props.hidePathway })));
+    ), isOpen && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 px-4 py-3" }, /* @__PURE__ */ React.createElement(
+      Stack,
+      {
+        items: row.submissions,
+        hideBadge: props.hideBadge,
+        hideLesson: props.hideLesson,
+        hidePathway: props.hidePathway,
+        onBadgeClick: props.onBadgeClick,
+        onLessonClick: props.onLessonClick,
+        onPathwayClick: props.onPathwayClick
+      }
+    )));
   }));
 }
 
 const initials = (name) => name.split(" ").map((w) => w[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
 function SubmissionDetail(props) {
   const { student } = props;
-  return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-4 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 text-xs text-slate-400" }, /* @__PURE__ */ React.createElement("button", { onClick: props.onBack, className: "font-bold text-sky-blue-400 hover:underline" }, "File Locker"), /* @__PURE__ */ React.createElement("span", null, "/"), /* @__PURE__ */ React.createElement("span", { className: "font-bold text-dark-blue-400" }, student.name)), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, student.avatar ? /* @__PURE__ */ React.createElement("img", { src: student.avatar, className: "h-12 w-12 shrink-0 rounded-full object-cover", alt: "" }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-gradient-to-br from-mint-400 to-dark-blue-400 text-sm font-bold text-white" }, initials(student.name)), /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, student.name), /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-slate-400" }, student.email, props.context ? ` \xB7 ${props.context}` : "")), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-slate-100 px-3 py-1 text-xs font-bold text-slate-500" }, student.submissions.length, " file", student.submissions.length === 1 ? "" : "s")), /* @__PURE__ */ React.createElement("div", { className: "rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, "Files"), /* @__PURE__ */ React.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React.createElement(Stack, { items: student.submissions }))), /* @__PURE__ */ React.createElement("div", { className: "flex gap-3" }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-4 px-4 py-8" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 text-xs text-slate-400" }, /* @__PURE__ */ React.createElement("button", { onClick: props.onBack, className: "font-bold text-sky-blue-400 hover:underline" }, "File Locker"), /* @__PURE__ */ React.createElement("span", null, "/"), /* @__PURE__ */ React.createElement("span", { className: "font-bold text-dark-blue-400" }, student.name)), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-4 rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, student.avatar ? /* @__PURE__ */ React.createElement("img", { src: student.avatar, className: "h-12 w-12 shrink-0 rounded-full object-cover", alt: "" }) : /* @__PURE__ */ React.createElement("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-gradient-to-br from-mint-400 to-dark-blue-400 text-sm font-bold text-white" }, initials(student.name)), /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold text-dark-blue-400" }, student.name), /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-slate-400" }, student.email, props.context ? ` \xB7 ${props.context}` : "")), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-slate-100 px-3 py-1 text-xs font-bold text-slate-500" }, student.submissions.length, " file", student.submissions.length === 1 ? "" : "s")), /* @__PURE__ */ React.createElement("div", { className: "rounded-2xl border border-slate-200 bg-white p-5 shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, "Files"), /* @__PURE__ */ React.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React.createElement(
+    Stack,
+    {
+      items: student.submissions,
+      onBadgeClick: props.onBadgeClick,
+      onLessonClick: props.onLessonClick,
+      onPathwayClick: props.onPathwayClick
+    }
+  ))), /* @__PURE__ */ React.createElement("div", { className: "flex gap-3" }, /* @__PURE__ */ React.createElement(
     "button",
     {
       onClick: () => props.onNav(-1),
@@ -3536,42 +3545,143 @@ const TABS = [
   { value: "badges", label: "By badge" },
   { value: "lessons", label: "By lesson" }
 ];
+const SEARCH_PLACEHOLDER = "Search by student, pathway, badge, or lesson";
 const countFiles = (students) => students.reduce((acc, s) => {
   var _a;
   return acc + (((_a = s.submissions) == null ? void 0 : _a.length) || 0);
 }, 0);
+const matchesSearch = (student, term) => {
+  if (!term)
+    return true;
+  if (student.name.toLowerCase().includes(term))
+    return true;
+  return (student.submissions || []).some(
+    (sub) => {
+      var _a, _b, _c;
+      return ((_a = sub.badgeName) == null ? void 0 : _a.toLowerCase().includes(term)) || ((_b = sub.lessonName) == null ? void 0 : _b.toLowerCase().includes(term)) || ((_c = sub.pathwayName) == null ? void 0 : _c.toLowerCase().includes(term));
+    }
+  );
+};
 const GroupCard = (props) => {
   const [open, setOpen] = React.useState(false);
-  return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { onClick: () => setOpen(!open), className: "flex cursor-pointer items-center gap-3.5 p-4" }, /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, props.title), props.description && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs leading-relaxed text-slate-500" }, props.description)), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-mint-100 px-2.5 py-1 text-xs font-bold text-dark-blue-400" }, props.count), /* @__PURE__ */ React.createElement(IconChevronDown, { size: 15, stroke: 2.3, className: `shrink-0 text-slate-400 transition-transform ${open ? "rotate-180" : ""}` })), open && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 p-4" }, props.children));
+  return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm" }, /* @__PURE__ */ React.createElement("div", { onClick: () => setOpen(!open), className: "flex cursor-pointer items-center gap-3.5 p-4" }, /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, props.onTitleClick ? /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: (e) => {
+        e.stopPropagation();
+        props.onTitleClick();
+      },
+      className: "text-left text-sm font-extrabold text-sky-blue-400 hover:underline"
+    },
+    props.title
+  ) : /* @__PURE__ */ React.createElement("div", { className: "text-sm font-extrabold text-dark-blue-400" }, props.title), props.description && /* @__PURE__ */ React.createElement("div", { className: "mt-1 text-xs leading-relaxed text-slate-500" }, props.description)), /* @__PURE__ */ React.createElement("div", { className: "shrink-0 rounded-full bg-mint-100 px-2.5 py-1 text-xs font-bold text-dark-blue-400" }, props.count), /* @__PURE__ */ React.createElement(IconChevronDown, { size: 15, stroke: 2.3, className: `shrink-0 text-slate-400 transition-transform ${open ? "rotate-180" : ""}` })), open && /* @__PURE__ */ React.createElement("div", { className: "border-t border-slate-100 p-4" }, props.children));
 };
 const PathwayGroups = (props) => {
   const { byPathway } = useFilteredStudents(props.students);
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.pathways.map((p) => {
-    const filtered = byPathway(p.pathwayId, props.badges);
-    return /* @__PURE__ */ React.createElement(GroupCard, { key: p.pathwayId, title: p.title, description: p.description, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hidePathway: true, onReview: (item) => props.onReview(item, filtered, p.title) }));
-  }));
+  const term = props.search.trim().toLowerCase();
+  const groups = props.pathways.map((p) => {
+    const base = byPathway(p.pathwayId, props.badges);
+    const ownNameMatches = !term || p.title.toLowerCase().includes(term);
+    const filtered = ownNameMatches ? base : base.filter((s) => matchesSearch(s, term));
+    return { pathway: p, filtered };
+  }).filter((g) => !term || g.filtered.length > 0);
+  if (term && groups.length === 0) {
+    return /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-400" }, "No matching entries.");
+  }
+  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, groups.map(({ pathway: p, filtered }) => /* @__PURE__ */ React.createElement(
+    GroupCard,
+    {
+      key: p.pathwayId,
+      title: p.title,
+      description: p.description,
+      count: countFiles(filtered),
+      onTitleClick: props.onPathwayClick ? () => props.onPathwayClick(p.pathwayId) : void 0
+    },
+    /* @__PURE__ */ React.createElement(
+      Table,
+      {
+        loading: props.loading,
+        items: filtered,
+        hidePathway: true,
+        onReview: (item) => props.onReview(item, filtered, p.title),
+        onBadgeClick: props.onBadgeClick,
+        onLessonClick: props.onLessonClick
+      }
+    )
+  )));
 };
 const BadgeGroups = (props) => {
   const { byBadge } = useFilteredStudents(props.students);
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.badges.map((b) => {
-    const filtered = byBadge(b.badgeId);
+  const term = props.search.trim().toLowerCase();
+  const groups = props.badges.map((b) => {
+    const base = byBadge(b.badgeId);
+    const ownNameMatches = !term || b.displayName.toLowerCase().includes(term);
+    const filtered = ownNameMatches ? base : base.filter((s) => matchesSearch(s, term));
+    return { badge: b, filtered };
+  }).filter((g) => !term || g.filtered.length > 0);
+  if (term && groups.length === 0) {
+    return /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-400" }, "No matching entries.");
+  }
+  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, groups.map(({ badge: b, filtered }) => {
     const pathwayTitle = props.pathwayNameForBadge[b.badgeId];
-    return /* @__PURE__ */ React.createElement(GroupCard, { key: b.badgeId, title: b.displayName, description: pathwayTitle ? `${pathwayTitle} pathway` : void 0, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hideBadge: true, hidePathway: true, onReview: (item) => props.onReview(item, filtered, b.displayName) }));
+    return /* @__PURE__ */ React.createElement(
+      GroupCard,
+      {
+        key: b.badgeId,
+        title: b.displayName,
+        description: pathwayTitle ? `${pathwayTitle} pathway` : void 0,
+        count: countFiles(filtered),
+        onTitleClick: props.onBadgeClick ? () => props.onBadgeClick(b.badgeId) : void 0
+      },
+      /* @__PURE__ */ React.createElement(
+        Table,
+        {
+          loading: props.loading,
+          items: filtered,
+          hideBadge: true,
+          hidePathway: true,
+          onReview: (item) => props.onReview(item, filtered, b.displayName),
+          onLessonClick: props.onLessonClick
+        }
+      )
+    );
   }));
 };
 const LessonGroups = (props) => {
   const { byLesson } = useFilteredStudents(props.students);
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, props.lessons.map((l) => {
-    const filtered = byLesson(l.lessonName);
+  const term = props.search.trim().toLowerCase();
+  const groups = props.lessons.map((l) => {
+    const base = byLesson(l.lessonName);
+    const ownNameMatches = !term || l.lessonName.toLowerCase().includes(term);
+    const filtered = ownNameMatches ? base : base.filter((s) => matchesSearch(s, term));
+    return { lesson: l, filtered };
+  }).filter((g) => !term || g.filtered.length > 0);
+  if (term && groups.length === 0) {
+    return /* @__PURE__ */ React.createElement("p", { className: "text-sm text-slate-400" }, "No matching entries.");
+  }
+  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, groups.map(({ lesson: l, filtered }) => {
     const badge = props.badgeForLesson[l.lessonId];
     const pathwayTitle = badge ? props.pathwayNameForBadge[badge.badgeId] : void 0;
     const description = badge ? pathwayTitle ? `${badge.displayName} \xB7 ${pathwayTitle} pathway` : badge.displayName : void 0;
-    return /* @__PURE__ */ React.createElement(GroupCard, { key: l.lessonId, title: l.lessonName, description, count: countFiles(filtered) }, /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hideBadge: true, hideLesson: true, hidePathway: true, onReview: (item) => props.onReview(item, filtered, l.lessonName) }));
+    return /* @__PURE__ */ React.createElement(
+      GroupCard,
+      {
+        key: l.lessonId,
+        title: l.lessonName,
+        description,
+        count: countFiles(filtered),
+        onTitleClick: props.onLessonClick ? () => props.onLessonClick(l.lessonId) : void 0
+      },
+      /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: filtered, hideBadge: true, hideLesson: true, hidePathway: true, onReview: (item) => props.onReview(item, filtered, l.lessonName) })
+    );
   }));
 };
 const FileLocker = (props) => {
   const [tab, setTab] = React.useState("students");
   const [reviewing, setReviewing] = React.useState(null);
+  const [search, setSearch] = React.useState("");
+  const searchLower = search.trim().toLowerCase();
   const numberOfFiles = countFiles(props.students);
   const { thisWeek, thisMonth } = React.useMemo(() => {
     const now = new Date();
@@ -3602,6 +3712,17 @@ const FileLocker = (props) => {
     });
     return map;
   }, [props.badges, props.pathways]);
+  const pathwayIdForBadge = React.useMemo(() => {
+    const map = {};
+    (props.badges || []).forEach((b) => {
+      if (!Array.isArray(b.categories))
+        return;
+      const pathway = (props.pathways || []).find((p) => b.categories.some((c) => c.startsWith(p.pathwayId)));
+      if (pathway)
+        map[b.badgeId] = pathway.pathwayId;
+    });
+    return map;
+  }, [props.badges, props.pathways]);
   const badgeForLesson = React.useMemo(() => {
     const map = {};
     (props.badges || []).forEach((b) => {
@@ -3616,9 +3737,12 @@ const FileLocker = (props) => {
   }, [props.badges]);
   const enrichedStudents = React.useMemo(() => {
     return props.students.map((s) => __spreadProps(__spreadValues({}, s), {
-      submissions: (s.submissions || []).map((sub) => __spreadProps(__spreadValues({}, sub), { pathwayName: pathwayNameForBadge[sub.badgeId] || "" }))
+      submissions: (s.submissions || []).map((sub) => __spreadProps(__spreadValues({}, sub), {
+        pathwayName: pathwayNameForBadge[sub.badgeId] || "",
+        pathwayId: pathwayIdForBadge[sub.badgeId]
+      }))
     }));
-  }, [props.students, pathwayNameForBadge]);
+  }, [props.students, pathwayNameForBadge, pathwayIdForBadge]);
   const { byPathway } = useFilteredStudents(enrichedStudents);
   const mostActivePathway = React.useMemo(() => {
     return (props.pathways || []).reduce((best, p) => {
@@ -3626,6 +3750,10 @@ const FileLocker = (props) => {
       return count > 0 && (!best || count > best.count) ? { title: p.title, count } : best;
     }, null);
   }, [props.pathways, props.badges, byPathway]);
+  const searchedStudents = React.useMemo(
+    () => searchLower ? enrichedStudents.filter((s) => matchesSearch(s, searchLower)) : enrichedStudents,
+    [enrichedStudents, searchLower]
+  );
   const onReview = (item, list, context) => setReviewing({ student: item, list, context });
   const onNav = (dir) => {
     if (!reviewing)
@@ -3643,7 +3771,10 @@ const FileLocker = (props) => {
         student: reviewing.student,
         context: reviewing.context,
         onBack: () => setReviewing(null),
-        onNav
+        onNav,
+        onBadgeClick: props.onBadgeClick,
+        onLessonClick: props.onLessonClick,
+        onPathwayClick: props.onPathwayClick
       }
     );
   }
@@ -3670,7 +3801,66 @@ const FileLocker = (props) => {
       className: `rounded-lg px-4 py-2 text-xs font-bold ${tab === t.value ? "bg-sky-blue-400/20 text-dark-blue-400" : "text-slate-400 hover:text-slate-600"}`
     },
     t.label
-  ))), !props.trial && tab === "students" && /* @__PURE__ */ React.createElement(Table, { loading: props.loading, items: enrichedStudents, onReview: (item) => onReview(item, enrichedStudents) }), !props.trial && tab === "pathways" && /* @__PURE__ */ React.createElement(PathwayGroups, { students: enrichedStudents, loading: props.loading, pathways: props.pathways || [], badges: props.badges || [], onReview }), !props.trial && tab === "badges" && /* @__PURE__ */ React.createElement(BadgeGroups, { students: enrichedStudents, loading: props.loading, badges: props.badges || [], pathwayNameForBadge, onReview }), !props.trial && tab === "lessons" && /* @__PURE__ */ React.createElement(LessonGroups, { students: enrichedStudents, loading: props.loading, lessons: props.lessons, badgeForLesson, pathwayNameForBadge, onReview }));
+  ))), !props.trial && /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2.5 rounded-xl border border-slate-200 bg-white px-4 py-3 shadow-sm" }, /* @__PURE__ */ React.createElement(IconSearch, { size: 15, stroke: 1.75, className: "text-slate-400" }), /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      value: search,
+      onChange: (e) => setSearch(e.target.value),
+      placeholder: SEARCH_PLACEHOLDER,
+      className: "flex-1 border-none bg-transparent text-sm text-dark-blue-400 outline-none placeholder:text-slate-400"
+    }
+  )), !props.trial && tab === "students" && /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      loading: props.loading,
+      items: searchedStudents,
+      onReview: (item) => onReview(item, searchedStudents),
+      onBadgeClick: props.onBadgeClick,
+      onLessonClick: props.onLessonClick,
+      onPathwayClick: props.onPathwayClick
+    }
+  ), !props.trial && tab === "pathways" && /* @__PURE__ */ React.createElement(
+    PathwayGroups,
+    {
+      students: enrichedStudents,
+      loading: props.loading,
+      search,
+      pathways: props.pathways || [],
+      badges: props.badges || [],
+      onReview,
+      onBadgeClick: props.onBadgeClick,
+      onLessonClick: props.onLessonClick,
+      onPathwayClick: props.onPathwayClick
+    }
+  ), !props.trial && tab === "badges" && /* @__PURE__ */ React.createElement(
+    BadgeGroups,
+    {
+      students: enrichedStudents,
+      loading: props.loading,
+      search,
+      badges: props.badges || [],
+      pathwayNameForBadge,
+      onReview,
+      onBadgeClick: props.onBadgeClick,
+      onLessonClick: props.onLessonClick,
+      onPathwayClick: props.onPathwayClick
+    }
+  ), !props.trial && tab === "lessons" && /* @__PURE__ */ React.createElement(
+    LessonGroups,
+    {
+      students: enrichedStudents,
+      loading: props.loading,
+      search,
+      lessons: props.lessons,
+      badgeForLesson,
+      pathwayNameForBadge,
+      onReview,
+      onBadgeClick: props.onBadgeClick,
+      onLessonClick: props.onLessonClick,
+      onPathwayClick: props.onPathwayClick
+    }
+  ));
 };
 
 export { AdminProvider, App, Badge, Badges, Class, Classes, Dashboard, FileLocker, GettingStarted, Home, Lesson, Lessons, Navbar, Organization, Pathway, Pathways, People, StartAnonymousLesson, Student, SwitchAccount, TrialHome, TrialRegistration };