Merge pull request #4671 from UniversityOfHelsinkiCS/graduation-times…

…-percentages Hide percentages for bachelor + master and master study rights
UniversityOfHelsinkiCS · Nov 5, 2024 · 98bcf78 · 98bcf78
2 parents 388a605 + fc42613
commit 98bcf78
Show file tree

Hide file tree

Showing 15 changed files with 251 additions and 143 deletions.
diff --git a/cypress/e2e/Faculty_statistics.js b/cypress/e2e/Faculty_statistics.js
@@ -234,7 +234,7 @@ describe('Faculty overview', () => {
 
       cy.get('[data-cy="Section-bachelor"]').within(() => {
         cy.get('div[class="faculty-graph"]')
-        cy.contains('24 graduated (64.9 % of class)').trigger('mouseover')
+        cy.contains('24 graduated').trigger('mouseover')
         cy.contains('From class of 2020 - 2021, 24/37 students have graduated')
       })
 

diff --git a/services/frontend/src/common/index.js b/services/frontend/src/common/index.js
@@ -438,3 +438,12 @@ export const isDefaultServiceProvider = () => {
 }
 
 export const formatContent = content => content.replace(/\n +/g, '\n')
+
+export const getCalendarYears = years => {
+  return years.reduce((all, year) => {
+    if (year === 'Total') {
+      return all
+    }
+    return all.concat(Number(year.slice(0, 4)))
+  }, [])
+}
diff --git a/...end/src/components/FacultyStatistics/FacultyProgrammeOverview/FacultyStudentDataTable.jsx b/...end/src/components/FacultyStatistics/FacultyProgrammeOverview/FacultyStudentDataTable.jsx
@@ -1,6 +1,7 @@
 import { Fragment, useState } from 'react'
 import { Button, Icon, Label, Popup, Table } from 'semantic-ui-react'
 
+import { getCalendarYears } from '@/common'
 import { useLanguage } from '@/components/LanguagePicker/useLanguage'
 import { PopulationLink } from '@/components/StudyProgramme/StudyTrackOverview/PopulationLink'
 import { Toggle } from '@/components/StudyProgramme/Toggle'
@@ -105,12 +106,6 @@ export const FacultyStudentDataTable = ({
     arrayToModify[yearIndex] = !yearsVisible[yearIndex]
     setVisible(arrayToModify)
   }
-
-  const calendarYears = years.reduce((all, year) => {
-    if (year === 'Total') return all
-    return all.concat(Number(year.slice(0, 4)))
-  }, [])
-
   return (
     <div className="datatable">
       <Toggle
@@ -214,9 +209,9 @@ export const FacultyStudentDataTable = ({
                           {requiredRights.programmeRights?.includes(programmeNames[programme].code) ||
                             (requiredRights.fullAccessToStudentData && (
                               <PopulationLink
-                                studyprogramme={programmeNames[programme].code}
+                                studyProgramme={programmeNames[programme].code}
                                 year={year}
-                                years={calendarYears}
+                                years={getCalendarYears(years)}
                               />
                             ))}
                         </Table.Cell>

diff --git a/services/frontend/src/components/FacultyStatistics/TimesAndPaths/GraduationTimes.jsx b/services/frontend/src/components/FacultyStatistics/TimesAndPaths/GraduationTimes.jsx
@@ -17,6 +17,7 @@ const MedianDisplay = ({
   mode,
   programmeData,
   programmeNames,
+  title,
   year,
   yearLabel,
 }) => {
@@ -46,6 +47,7 @@ const MedianDisplay = ({
           handleClick={handleClick}
           mode={mode}
           programmeNames={programmeNames}
+          title={title}
           yearLabel={yearLabel}
         />
         {!programmeData || !(year in levelProgrammeData) ? (
@@ -63,6 +65,7 @@ const MedianDisplay = ({
             level={level}
             mode={mode}
             programmeNames={programmeNames}
+            title={title}
             year={year}
             yearLabel={yearLabel}
           />
@@ -163,6 +166,7 @@ export const GraduationTimes = ({
           mode={mode}
           programmeData={programmeData}
           programmeNames={programmeNames}
+          title={title}
           year={year}
           yearLabel={yearLabel}
         />

diff --git a/services/frontend/src/components/FacultyStatistics/TimesAndPaths/MedianBarChart.jsx b/services/frontend/src/components/FacultyStatistics/TimesAndPaths/MedianBarChart.jsx
@@ -19,6 +19,7 @@ export const MedianBarChart = ({
   level,
   mode,
   programmeNames,
+  title,
   year,
   yearLabel,
 }) => {
@@ -56,7 +57,7 @@ export const MedianBarChart = ({
   }
 
   const getDataLabel = (amount, category) => {
-    if (yearLabel === 'Start year') {
+    if (yearLabel === 'Start year' && title === 'Bachelor study right') {
       return `${amount} graduated (${getPercentage(amount, category)} % of class)`
     }
     return `${amount} graduated`
@@ -203,7 +204,9 @@ export const MedianBarChart = ({
     },
   }
 
-  if (!facultyGraph) config.title.text = `Year ${year} by ${yearLabel.toLowerCase()}`
+  if (!facultyGraph) {
+    config.title.text = `Year ${year} by ${yearLabel.toLowerCase()}`
+  }
 
   return (
     <div className={`${facultyGraph ? 'faculty' : 'programmes'}-graph`}>

diff --git a/...nents/FacultyStatistics/facultyHelpers.js → ...nents/FacultyStatistics/facultyHelpers.ts b/...nents/FacultyStatistics/facultyHelpers.js → ...nents/FacultyStatistics/facultyHelpers.ts
@@ -18,9 +18,9 @@ const regexValuesAll = [
   /^Y/,
   /\d$/,
   /^\d.*e$/,
-]
+] as const
 
-const testKey = value => {
+const testKey = (value: string) => {
   for (let i = 0; i < regexValuesAll.length; i++) {
     if (regexValuesAll[i].test(value)) {
       return i
@@ -29,7 +29,7 @@ const testKey = value => {
   return 6
 }
 
-export const sortProgrammeKeys = (programmeKeys, faculty) => {
+export const sortProgrammeKeys = (programmeKeys: string[][], faculty: string) => {
   try {
     return programmeKeys.sort((a, b) => {
       if (a[1].includes(faculty) && !b[1].includes(faculty)) return -1
@@ -38,30 +38,32 @@ export const sortProgrammeKeys = (programmeKeys, faculty) => {
       if (!a[1].includes(faculty) && b[1].startsWith('T') && !a[1].includes('T')) return 1
       if (a[1].startsWith('LIS') && !b[1].includes(faculty) && !b[1].includes('LIS')) return -1
       if (!a[1].includes(faculty) && b[1].startsWith('LIS') && !a[1].includes('LIS')) return 1
-      if (testKey(a[1]) - testKey(b[1]) === 0) {
-        return a[0].localeCompare(b[0])
-      }
+      if (testKey(a[1]) - testKey(b[1]) === 0) return a[0].localeCompare(b[0])
       return testKey(a[1]) - testKey(b[1])
     })
   } catch (error) {
     return programmeKeys
   }
 }
 
-const isBetween = (number, lowerLimit, upperLimit) => {
+const isBetween = (number: number, lowerLimit: number, upperLimit: number) => {
   return (lowerLimit === undefined || number >= lowerLimit) && (upperLimit === undefined || number < upperLimit)
 }
 
 export const calculateStats = (
-  creditCounts,
-  maximumAmountOfCredits,
-  minimumAmountOfCredits = 0,
-  numberOfCreditCategories = 7
+  creditCounts: Record<string, number[]>,
+  maximumAmountOfCredits: number,
+  minimumAmountOfCredits: number = 0,
+  numberOfCreditCategories: number = 7
 ) => {
-  const tableStats = []
-  if (creditCounts === undefined) return null
+  const tableStats: Array<Array<number | string>> = []
+  if (creditCounts === undefined) {
+    return null
+  }
 
-  if (Object.keys(creditCounts).length === 0) return null
+  if (Object.keys(creditCounts).length === 0) {
+    return null
+  }
 
   const limits = getCreditCategories(
     true,
@@ -87,24 +89,25 @@ export const calculateStats = (
     }
   })
 
-  const totalCounts = ['Total']
+  const totalCounts: Array<number | string> = ['Total']
   for (let i = 1; i < tableStats[0].length; i++) {
     let columnSum = 0
     for (let j = 0; j < tableStats.length; j++) {
-      columnSum += tableStats[j][i]
+      columnSum += tableStats[j][i] as number
     }
     totalCounts.push(columnSum)
   }
   tableStats.push(totalCounts)
 
   // Calculate statistics for the bar chart (i.e., transpose the tableStats as rows are now columns and vice versa)
-  const chartStats = []
+  const chartStats: Array<{ data: number[]; name: string }> = []
   for (let i = 2; i < tableStats[0].length; i++) {
-    const column = []
+    const column: number[] = []
     for (let j = tableStats.length - 1; j >= 0; j--) {
-      column.push(tableStats[j][i])
+      column.push(tableStats[j][i] as number)
     }
     chartStats.push({ name: tableTitles[i].replace('<', 'Less than').replace('≥', 'At least'), data: column })
   }
+
   return { tableStats, chartStats, tableTitles }
 }
diff --git a/...nd/src/components/SegmentDimmer/index.jsx → ...nd/src/components/SegmentDimmer/index.tsx b/...nd/src/components/SegmentDimmer/index.jsx → ...nd/src/components/SegmentDimmer/index.tsx
@@ -1,6 +1,10 @@
 import { Dimmer, Loader } from 'semantic-ui-react'
 
-export const SegmentDimmer = ({ isLoading = false }) => (
+interface SegmentDimmerProps {
+  isLoading?: boolean
+}
+
+export const SegmentDimmer = ({ isLoading = false }: SegmentDimmerProps) => (
   <Dimmer active={isLoading} inverted>
     <Loader>Loading</Loader>
   </Dimmer>

diff --git a/...Programme/StudyTrackOverview/BarChart.jsx → ...Programme/StudyTrackOverview/BarChart.tsx b/...Programme/StudyTrackOverview/BarChart.jsx → ...Programme/StudyTrackOverview/BarChart.tsx
@@ -9,8 +9,19 @@ exporting(ReactHighcharts.Highcharts)
 exportData(ReactHighcharts.Highcharts)
 accessibility(ReactHighcharts.Highcharts)
 
-export const BarChart = ({ data, track }) => {
-  if (!data || !data.creditGraphStats || !data.creditGraphStats[track]) return null
+interface BarChartProps {
+  data: {
+    creditGraphStats: Record<string, { name: string; data: number[] }[]>
+    years: string[]
+  }
+  track: string
+}
+
+export const BarChart = ({ data, track }: BarChartProps) => {
+  if (!data || !data.creditGraphStats || !data.creditGraphStats[track]) {
+    return null
+  }
+
   const correctData = data.creditGraphStats[track]
   const colors = generateGradientColors(correctData.length)
   const dataWithColors = Object.values(correctData).map((series, index) => ({ ...series, color: colors[index] }))

diff --git a/...mme/StudyTrackOverview/BasicDataTable.jsx → ...mme/StudyTrackOverview/BasicDataTable.tsx b/...mme/StudyTrackOverview/BasicDataTable.jsx → ...mme/StudyTrackOverview/BasicDataTable.tsx
@@ -1,14 +1,20 @@
 import { Table } from 'semantic-ui-react'
 
-export const BasicDataTable = ({ data, titles, track }) => {
+interface BasicDataTableProps {
+  data: Record<string, Array<Array<string | number>>>
+  titles: string[]
+  track: string
+}
+
+export const BasicDataTable = ({ data, titles, track }: BasicDataTableProps) => {
   if (!data || !data[track]?.length || !titles) {
     return null
   }
 
   const sortedData = data[track].toSorted((a, b) => {
     if (a[0] === 'Total') return 1
     if (b[0] === 'Total') return -1
-    return parseInt(b[0].split(' - ')[0], 10) - parseInt(a[0].split(' - ')[0], 10)
+    return parseInt(String(b[0]).split(' - ')[0], 10) - parseInt(String(a[0]).split(' - ')[0], 10)
   })
 
   return (
@@ -23,11 +29,11 @@ export const BasicDataTable = ({ data, titles, track }) => {
         </Table.Row>
       </Table.Header>
       <Table.Body>
-        {sortedData.map(array => (
-          <Table.Row key={array[0]}>
-            {array.map((value, index) => (
+        {sortedData.map(row => (
+          <Table.Row key={row[0]}>
+            {row.map((value, index) => (
               <Table.Cell
-                className={array[0] === 'Total' ? 'total-row-cell' : ''}
+                className={row[0] === 'Total' ? 'total-row-cell' : ''}
                 // eslint-disable-next-line react/no-array-index-key
                 key={`${index}-${value}`}
                 textAlign={index === 0 ? 'center' : 'right'}

diff --git a/services/frontend/src/components/StudyProgramme/StudyTrackOverview/PopulationLink.jsx b/services/frontend/src/components/StudyProgramme/StudyTrackOverview/PopulationLink.jsx