Ensure frontend urls are composed correctly

Author: CarsonF

src/core/config/config.service.ts

@@ -149,7 +149,7 @@ export const makeConfig = (env: EnvironmentService) =>
       .string('DEFAULT_TIMEZONE')
       .optional('America/Chicago');
 
-    frontendUrl = env.string('FRONTEND_URL').optional('http://localhost:3001');
+    frontendUrl = env.url('FRONTEND_URL').optional('http://localhost:3001');
 
     neo4j = (() => {
       const driverConfig: Neo4JDriverConfig = {};

src/core/email/templates/frontend-url.tsx

@@ -1,15 +1,16 @@
 import { createContext, type ReactElement, useContext } from 'react';
 import { ServerException } from '~/common/exceptions';
 
-const FrontendUrlContext = createContext<string | undefined>(undefined);
+const FrontendUrlContext = createContext<Readonly<URL> | undefined>(undefined);
 
 export const useFrontendUrl = (path: string) => {
   const base = useContext(FrontendUrlContext);
   if (!base) {
     throw new ServerException('Frontend url has not been provided');
   }
-  return base + path;
+  path = path.startsWith('/') ? path.slice(1) : path;
+  return new URL(path, base).toString();
 };
 
-export const FrontendUrlWrapper = (url: string) => (el: ReactElement) =>
+export const FrontendUrlWrapper = (url: Readonly<URL>) => (el: ReactElement) =>
   <FrontendUrlContext.Provider value={url}>{el}</FrontendUrlContext.Provider>;