[7408] Typescript: API Modules - Utils

[n-lark]

Description

See #7408 (comment)

Related Issue(s)

Resolves #7408

Checklist

• I have read the contribution guidelines
• Suitable unit/system level tests have been added and they pass
• Documentation has been updated
  • Upgrade instructions
  • Configuration details
  • Concepts
• Changes flowforge.yml?
  • Issue/PR raised on FlowFuse/helm to update ConfigMap Template
  • Issue/PR raised on FlowFuse/CloudProject to update values for Staging/Production
• Link to Changelog Entry PR, or note why one is not needed.

Labels

• Includes a DB migration? -> add the area:migration label

[cstns]

the utils directory should also be repurposed to composables as that's the vue way of tackling helpers

[n-lark]

the utils directory should also be repurposed to composables as that's the vue way of tackling helpers

@cstns I do think that is out of scope for this work since we are just converting utils to typescript. Would you like me to make a separate ticket for that?

[cstns]

Yes please, that's what I meant. Excuse my bluntness

[n-lark]

Follow up here: Repurpose src/utils into composables #7437

[andypalmi]

This looks good, and I like that the .js to .ts switch didn't require changing any of the files that import these utils. I ran the frontend tests locally and all 517 pass, and the converted files type-check cleanly.

One thing I noticed is more about the TypeScript migration overall than this PR specifically: nothing in CI actually type-checks our .ts files yet. The lint script only looks at .js and .vue files, and there's no tsc/vue-tsc script in package.json. The build (webpack) compiles the .ts files but doesn't fail on type errors, so the types we're adding aren't really being checked anywhere. For example, there's already a type error in MqttExpertTopicHelper.ts that no check is catching today.

Would it be worth adding a vue-tsc --noEmit step as part of this migration work, even if we don't make it blocking at first? Otherwise we're adding types without anything verifying them. I'm happy to open a separate issue for it so this PR can stay focused.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 76.88%. Comparing base (a5aebfe) to head (a8ecdff).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #7409   +/-   ##
=======================================
  Coverage   76.88%   76.88%           
=======================================
  Files         410      410           
  Lines       20939    20939           
  Branches     5098     5098           
=======================================
  Hits        16099    16099           
  Misses       4840     4840           

Flag	Coverage Δ
backend	76.88% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 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.

[n-lark]

Hey @andypalmi solid point - I created a follow up here for that Typescript: API Modules > Enforce TypeScript checks in CI #7552

Rest of feedback has also been addressed thanks!

[andypalmi]

Looks good! Happy to approve