add school year and security fix

2026-07-06 00:55:02 -04:00
parent 8cacd0874f
commit b74ddca8b1
27 changed files with 1258 additions and 39 deletions
@@ -0,0 +1,53 @@
+import { useId } from 'react'
+import { useSchoolYear } from '../../context/SchoolYearContext'
+import { isCurrentSchoolYear } from '../../lib/schoolYearSelection'
+import { SchoolYearStatusBadge } from './SchoolYearStatusBadge'
+
+export function SchoolYearSelector({ compact = false }: { compact?: boolean }) {
+  const {
+    schoolYears,
+    selectedSchoolYear,
+    isLoadingSchoolYears,
+    schoolYearError,
+    setSelectedSchoolYearId,
+  } = useSchoolYear()
+  const selectId = useId()
+
+  if (schoolYears.length === 0 && !isLoadingSchoolYears) {
+    return schoolYearError ? (
+      <span className="badge text-bg-warning" title={schoolYearError}>
+        School years unavailable
+      </span>
+    ) : null
+  }
+
+  return (
+    <div className={`school-year-selector d-flex align-items-center gap-2 ${compact ? 'school-year-selector--compact' : ''}`}>
+      <label className="form-label mb-0 small text-nowrap" htmlFor={selectId}>
+        School Year
+      </label>
+      <select
+        id={selectId}
+        className="form-select form-select-sm"
+        value={selectedSchoolYear?.id ?? ''}
+        disabled={isLoadingSchoolYears || schoolYears.length === 0}
+        onChange={(event) => {
+          const id = Number(event.target.value)
+          setSelectedSchoolYearId(Number.isFinite(id) && id > 0 ? id : null)
+        }}
+      >
+        {isLoadingSchoolYears && schoolYears.length === 0 ? (
+          <option value="">Loading…</option>
+        ) : null}
+        {schoolYears.map((year) => (
+          <option key={year.id} value={year.id}>
+            {year.name}
+            {isCurrentSchoolYear(year) ? ' Current' : ''}
+            {year.status && !isCurrentSchoolYear(year) ? ` ${year.status}` : ''}
+          </option>
+        ))}
+      </select>
+      {selectedSchoolYear ? <SchoolYearStatusBadge status={selectedSchoolYear.status} /> : null}
+    </div>
+  )
+}