translate JavaScript sources to TypeScript

[stklcode]

Modernize the frontend sources and use TypeScript instead of plain JavaScript. We gain some type safety and dev experience from that.

The dashboard and evaluation has become quite long. Split the different concerns into modules and import them. JS output is bundled by esbuild, so it should not make any difference to the user.

Keep the tracking snippet as is, because this one targets maximum compatibility and simply minifying ES5 code does the job pretty well.

[2ndkauboy]

I compared the generated bundles (with the help from Claude) from this branch against develop function by function (unminified esbuild bundles of both, paired by name with a rename map for renderYearlyTable → tables.renderYearly and friends).

Nothing was dropped, size is flat (+18 bytes gzipped for dashboard), and tsc, eslint and the test suite all pass. Almost every difference is expected: threading fmt through instead of module-level Intl instances, URLSearchParams → plain records, createElement( 'TD' ) → 'td', added ?. guards, and the deliberate refactors in 98f1540 / e49ddce / b5d2dce.

Two things stood out.

1. CSV escaping regression in addExportButton()

js/dashboard/tables.ts:376

`"${ col.innerText.replace( '"', '""' ) }"`

This was replaceAll before. With a string first argument, replace only rewrites the first occurrence, so a cell containing more than one " now produces malformed CSV.

The other two replaceAll → replace swaps in the same function are safe: replace( /\s+/g, '_' ) still has the g flag, and replace( ':', '-' ) only ever affects the first colon, which substring( 0, 16 ) cuts off anyway.

2. js/settings.ts fixes a pre-existing bug — worth calling out

The old code did const button = this; inside an arrow function, so button was document rather than the button element. The reset button was therefore never disabled and never showed “Resetting…”. The TypeScript version uses resetButton directly, which fixes it.

Not a problem — just flagging it so it reads as an intentional fix rather than incidental refactoring noise.

[stklcode]

js/dashboard/tables.ts:376

"${ col.innerText.replace( '"', '""' ) }"
This was replaceAll before. With a string first argument, replace only rewrites the first occurrence, so a cell containing more than one " now produces malformed CSV.

Good catch.

replaceAll() is an ES2021 feature. My migration initially targeted ES2017, then ES2019 (for flatMap()). IMHO we can raise it to ES2021 - we used the features since 2.0.0 anyway.

Fixed that.
If there are objections against that, we could migrate to .replace(/"/g, '""') instead.

---

2. js/settings.ts fixes a pre-existing bug — worth calling out

Extracted that change into a separate commit before the TS migration (b98a691) that references the breaking commit.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
1 Accepted issue

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud