Convert shared utils modules to TypeScript (#22665)

GitOrigin-RevId: de40a0aaba35336ec59499a047356b0b9d161b38

services/web/frontend/js/shared/utils/colors.ts

@@ -5,7 +5,7 @@ const OWN_HUE = 200 // We will always appear as this color to ourselves
 const OWN_HUE_BLOCKED_SIZE = 20 // no other user should have a HUE in this range
 const TOTAL_HUES = 360 // actually 361, but 360 for legacy reasons
 
-export function getHueForUserId(userId, currentUserId) {
+export function getHueForUserId(userId: string, currentUserId: string) {
   if (userId == null || userId === 'anonymous-user') {
     return ANONYMOUS_HUE
   }
@@ -29,7 +29,7 @@ export function getHueForUserId(userId, currentUserId) {
   return hue
 }
 
-function getHueForId(id) {
+function getHueForId(id: string) {
   const hash = generateMD5Hash(id)
   const hue =
     parseInt(hash.toString().slice(0, 8), 16) %

services/web/frontend/js/shared/utils/formatDate.ts

@@ -1,6 +1,6 @@
 import moment from 'moment'
 
-export function formatUtcDate(date) {
+export function formatUtcDate(date: moment.MomentInput) {
   if (date) {
     return moment(date).utc().format('D MMM YYYY, HH:mm:ss') + ' UTC'
   } else {

services/web/frontend/js/shared/utils/url-helper.ts

@@ -1,5 +1,8 @@
-export function buildUrlWithDetachRole(mode) {
-  const url = new URL(window.location)
+export function buildUrlWithDetachRole(mode: string | null) {
+  return cleanURL(new URL(window.location.href), mode)
+}
+
+export function cleanURL(url: URL, mode: string | null) {
   let cleanPathname = url.pathname
     .replace(/\/(detached|detacher)\/?$/, '')
     .replace(/\/$/, '')

services/web/test/frontend/shared/utils/colors.test.js

@@ -1,6 +1,6 @@
 import { expect } from 'chai'
 
-import { getHueForUserId } from '../../../../frontend/js/shared/utils/colors'
+import { getHueForUserId } from '@/shared/utils/colors'
 
 describe('colors', function () {
   const currentUser = '5bf7dab7a18b0b7a1cf6738c'

services/web/test/frontend/shared/utils/url-helper.test.js

@@ -1,34 +1,26 @@
 import { expect } from 'chai'
-import sinon from 'sinon'
-import { buildUrlWithDetachRole } from '../../../../frontend/js/shared/utils/url-helper'
+import { cleanURL } from '@/shared/utils/url-helper'
 
 describe('url-helper', function () {
-  let locationStub
-  describe('buildUrlWithDetachRole', function () {
-    beforeEach(function () {
-      locationStub = sinon.stub(window, 'location')
-    })
-
-    afterEach(function () {
-      locationStub.restore()
-    })
-
+  describe('cleanURL', function () {
     describe('without mode', function () {
       it('removes trailing slash', function () {
-        locationStub.value('https://www.ovelreaf.com/project/1abc/')
-        expect(buildUrlWithDetachRole().href).to.equal(
+        const url = new URL('https://www.ovelreaf.com/project/1abc/')
+        expect(cleanURL(url).href).to.equal(
           'https://www.ovelreaf.com/project/1abc'
         )
       })
 
-      it('clears the mode from the current URL', function () {
-        locationStub.value('https://www.ovelreaf.com/project/2abc/detached')
-        expect(buildUrlWithDetachRole().href).to.equal(
+      it('clears the mode from the detached URL', function () {
+        const url = new URL('https://www.ovelreaf.com/project/2abc/detached')
+        expect(cleanURL(url).href).to.equal(
           'https://www.ovelreaf.com/project/2abc'
         )
+      })
 
-        locationStub.value('https://www.ovelreaf.com/project/2abc/detacher/')
-        expect(buildUrlWithDetachRole().href).to.equal(
+      it('clears the mode from the detacher URL', function () {
+        const url = new URL('https://www.ovelreaf.com/project/2abc/detacher/')
+        expect(cleanURL(url).href).to.equal(
           'https://www.ovelreaf.com/project/2abc'
         )
       })
@@ -36,15 +28,15 @@ describe('url-helper', function () {
 
     describe('with mode', function () {
       it('handles with trailing slash', function () {
-        locationStub.value('https://www.ovelreaf.com/project/3abc/')
-        expect(buildUrlWithDetachRole('detacher').href).to.equal(
+        const url = new URL('https://www.ovelreaf.com/project/3abc/')
+        expect(cleanURL(url, 'detacher').href).to.equal(
           'https://www.ovelreaf.com/project/3abc/detacher'
         )
       })
 
       it('handles without trailing slash', function () {
-        locationStub.value('https://www.ovelreaf.com/project/4abc')
-        expect(buildUrlWithDetachRole('detached').href).to.equal(
+        const url = new URL('https://www.ovelreaf.com/project/4abc')
+        expect(cleanURL(url, 'detached').href).to.equal(
           'https://www.ovelreaf.com/project/4abc/detached'
         )
       })