[Class stats] manage visibility button add to all relevant places, tweak warning

This commit is contained in:
joonas-a
2026-09-22 15:50:46 +03:00
parent e0e47554a5
commit 6f404658d1
7 changed files with 33 additions and 9 deletions
@@ -9,13 +9,24 @@ import { DegreeCoursesTab } from '@/pages/StudyProgramme/DegreeCoursesTab'
import { VisibilityIcon } from '@/theme'
import { ManageCoursesShownInfo } from '@/pages/StudyProgramme/DegreeCoursesTab/InfoBox'
export const FilterDegreeCoursesModal = ({ degreeProgramme }: { degreeProgramme: string }) => {
const defaultText = 'Manage course visibility'
const defaultIcon = <VisibilityIcon />
export const FilterDegreeCoursesModal = ({
degreeProgramme,
text,
icon,
}: {
degreeProgramme: string
text?: string
icon?: React.ReactNode
}) => {
const [modalOpen, setModalOpen] = useState(false)
return (
<>
<Button onClick={() => setModalOpen(true)} startIcon={<VisibilityIcon />} variant="outlined">
Manage course visibility
<Button onClick={() => setModalOpen(true)} startIcon={icon ?? defaultIcon} variant="outlined">
{text ?? defaultText}
</Button>
<Dialog maxWidth="md" onClose={() => setModalOpen(false)} open={modalOpen}>
<DialogTitle>Degree programme settings</DialogTitle>
@@ -38,7 +38,9 @@ export const PopulationCourses = ({
return (
<>
<Stack direction="row" spacing={2} sx={{ my: 1, justifyContent: 'space-between' }}>
{query.programme && !onlyIamRights ? <FilterDegreeCoursesModal degreeProgramme={query.programme} /> : null}
{query.programme && !onlyIamRights ? (
<FilterDegreeCoursesModal degreeProgramme={query.programme} text="Manage course / module visibility" />
) : null}
<InfoBox content={tooltipText} />
</Stack>
<SegmentDimmer isLoading={isLoading} />
@@ -13,6 +13,7 @@ import { CopyStudentNumbersHeader } from '@/components/OodiTable/common/CopyStud
import { OodiTableExcelExport } from '@/components/OodiTable/excelExport'
import type { FormattedModules, ModuleTabStudent } from '@/components/PopulationComponents/Students/Table/ModulesTab'
import { CheckIcon, CropSquareIcon } from '@/theme'
import { FilterDegreeCoursesModal } from '@/components/PopulationComponents/PopulationCourses/FilterDegreeCoursesModal'
const getModuleIfExists = (student: ModuleTabStudent, moduleCode: string) =>
student.studyModulesInHOPS.find(studyModule => studyModule.code === moduleCode) ?? null
@@ -22,9 +23,11 @@ const ooditableColumnHelper = createColumnHelper<ModuleTabStudent>()
export const ModulesTab = ({
formattedModules,
formattedStudents,
programme,
}: {
formattedModules: FormattedModules
formattedStudents: ModuleTabStudent[]
programme: string
}) => {
const { getTextIn } = useLanguage()
const { visible: namesVisible } = useStudentNameVisibility()
@@ -189,6 +192,7 @@ export const ModulesTab = ({
toolbarContent={
<>
<OodiTableExcelExport data={exportData} exportColumnKeys={accessorKeys} />
<FilterDegreeCoursesModal degreeProgramme={programme} text="Manage module visibility" />
<StudentNameVisibilityToggle />
</>
}
@@ -90,11 +90,13 @@ export const ModulesTabContainer = ({
students,
courses,
idToGroupIdMap,
programme,
}: {
curriculum: ExtendedCurriculumDetails | null | undefined
students: Student[]
courses: FilteredCourse[]
idToGroupIdMap: Record<string, string>
programme: string
}) => {
const curriculumModules = useMemo(
() => (curriculum ? [...curriculum.defaultProgrammeModules, ...curriculum.secondProgrammeModules] : []),
@@ -119,5 +121,5 @@ export const ModulesTabContainer = ({
[students, degreeProgrammeCodes, idToGroupIdMap, groupIdToCode]
)
return <ModulesTab formattedModules={formattedModules} formattedStudents={formattedStudents} />
return <ModulesTab formattedModules={formattedModules} formattedStudents={formattedStudents} programme={programme} />
}
@@ -20,7 +20,7 @@ import { DateFormat } from '@/constants/date'
import { ExtendedCurriculumDetails } from '@/hooks/useCurriculums'
import { useSemesters } from '@/hooks/useSemesters'
import { useGetProgressCriteriaQuery } from '@/redux/progressCriteria'
import { CheckIcon, CloseIcon, RemoveIcon, SwapHorizIcon } from '@/theme'
import { CheckIcon, CloseIcon, EditIcon, RemoveIcon, SwapHorizIcon } from '@/theme'
import { isMedicalProgramme } from '@/util/studyProgramme'
import { formatDate } from '@/util/timeAndDate'
import {
@@ -34,6 +34,7 @@ import {
import { StudentCourse } from '@oodikone/shared/types/studentData'
import { keyBy, range } from '@oodikone/shared/util'
import '@/components/PopulationComponents/Students/Table/ProgressTab/index.css'
import { FilterDegreeCoursesModal } from '@/components/PopulationComponents/PopulationCourses/FilterDegreeCoursesModal'
dayjsExtend(isBetween)
dayjsExtend(isSameOrBefore)
@@ -614,6 +615,7 @@ export const ProgressTable = ({
toolbarContent={
<>
<OodiTableExcelExport data={excelData} exportColumnKeys={accessorKeys} />
<FilterDegreeCoursesModal degreeProgramme={programme} text="Modify criteria" icon={<EditIcon />} />
<StudentNameVisibilityToggle />
</>
}
@@ -104,7 +104,7 @@ export const PopulationStudents = ({
curriculum={curriculum} // TODO: add guard for missing curriculum (it should never be missing)
idToGroupIdMap={idToGroupIdMap ?? {}}
students={filteredStudents}
programme={programme ?? ''}
programme={programme}
/>
),
Modules: (
@@ -113,6 +113,7 @@ export const PopulationStudents = ({
curriculum={curriculum}
idToGroupIdMap={idToGroupIdMap ?? {}}
students={filteredStudents}
programme={programme}
/>
),
Tags: <TagsTab combinedProgramme={combinedProgramme} programme={programme} students={filteredStudents} />,
@@ -3,9 +3,11 @@ import { useLanguage } from '@/components/LanguagePicker/useLanguage'
const textContent = {
fi: `Nämä asetukset eivät ole henkilökohtaisia.
Esim. kurssin tai moduulin piilottaminen piilottaa sen myös muilta Oodikoneen käyttäjiltä.`,
Esim. kurssin tai moduulin piilottaminen piilottaa sen myös muilta Oodikoneen käyttäjiltä.
Muutetut asetukset astuvat voimaan sivun uudelleenlatauksen jälkeen.`,
en: `These settings are non-personal.
Example: hiding a course or a module will also hide it from other Oodikone users.`,
Example: hiding a course or a module will also hide it from other Oodikone users.
Changed settings will require a page reload to take effect.`,
}
export const ManageCoursesShownInfo = () => {