Add Optimiser Unit Tests

[leslieyip02]

Context

Closes #4092.

Legacy Issues

Closes #4095.
Closes #4102.

Implementation

• Move types into types folder
• Move util functions into utils folder + unit tests
• Refactor OptimiserForm code
• UI unit tests

Notes

Replaced uniqueKey with lessonKey

Previously, we had:

• uniqueKey => {moduleCode}-{lessonType}
• displayText => {moduleCode} {lessonType}
• lessonKey => {moduleCode}|{lessonType}

I replaced uniqueKey because I think the deduplication makes the code a bit easier to follow.

useOptimiserForm custom hook

We had a lot of useState calls in OptimiserContent, and they were being passed to OptimiserForm as well. I think having a custom hook makes it easier to pass around, and allowed to pass props down to individual form fields, e.g.:

const OptimiserLessonOptionSelect: React.FC<Props> = ({ lessonOptions, optimiserFormFields }) => {
  const { liveLessonOptions, setLiveLessonOptions } = optimiserFormFields;

  const toggleLiveLessonOption = useCallback(...);

  ...
}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
nusmods-export	Ready	Preview	Comment	Oct 18, 2025 3:54pm
nusmods-website	Ready	Preview	Comment	Oct 18, 2025 3:54pm

💡 Enable Vercel Agent with $100 free credit for automated AI reviews

[vercel]

@leslieyip02 is attempting to deploy a commit to the modsbot's projects Team on Vercel.

A member of the Team first needs to authorize it.

[codecov]

Codecov Report

❌ Patch coverage is 73.83178% with 56 lines in your changes missing coverage. Please review.
✅ Project coverage is 55.13%. Comparing base (988c6fd) to head (a1de01a).
⚠️ Report is 147 commits behind head on master.

Files with missing lines	Patch %	Lines
.../optimiser/OptimiserContainer/OptimiserContent.tsx	0.00%	46 Missing ⚠️
...timiserForm/OptimiserMaxConsecutiveHoursSelect.tsx	0.00%	6 Missing ⚠️
...rc/views/optimiser/OptimiserForm/OptimiserForm.tsx	0.00%	2 Missing ⚠️
...s/optimiser/OptimiserForm/OptimiserFormTooltip.tsx	0.00%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #4094      +/-   ##
==========================================
+ Coverage   54.52%   55.13%   +0.60%     
==========================================
  Files         274      297      +23     
  Lines        6076     6724     +648     
  Branches     1455     1617     +162     
==========================================
+ Hits         3313     3707     +394     
- Misses       2763     3017     +254     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[jloh02]

LGTM good refactor and tests

[jloh02]

Changes look good but i'm not sure if it's a refactor or latest merge changes. The tooltip (i) is broken and there are font changes (Time dropdown text is significantly larger). Not sure if these are intended. Just merged master in to this and hopefully some of these are fixed. If not, let's try to keep the fonts more uniform

[jloh02]

Tooltips still broken :(

[thejus03]

1. Not sure if this was intended but first select input looks too large.
2. The second statement is wrong/copy of the first statement.

[thejus03]

also very minor UI nitpick 😅:

the padding for the border bottom seems to be too thin. Something similar to the border bottom in timetable page would look nice!

[leslieyip02]

Tooltips still broken :(

The weird thing is that if you navigate to another page and then come back to the optimiser, the tooltips suddenly start working.

Update:

Fixed by importing Tooltip directly instead of using this async version:

[leslieyip02]

1. Not sure if this was intended but first select input looks too large.

@thejus03 I standardized the dropdown sizes so that the dropdowns look more uniform. However, if we add more dropdowns in the future, we can always customize their widths.

[ZhangYiJiang]

That's okay but you might consider using a proper checkbox instead https://getbootstrap.com/docs/4.6/components/forms/#custom-forms

[ravern]

Can I check if the design of the components should be changing? Since this is posed as a refactor rather than a design update.

The following screenshots were taken on Safari.

On the branch preview:

On production:

[leslieyip02]

The UI changes were made to address @ZhangYiJiang's comments on accessibility. The free days select should be OK, but I think I'll push a commit to make the dropdown fit in better with the rest of the form (I hadn't checked Safari, but it looks a bit jarring).

Update:

I've updated the dropdown to use form-control to be more in line with the other dropdowns.

Firefox	Safari