more updates

.vscode/settings.json

@@ -1,5 +1,5 @@
 {
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
   "tailwindCSS.classAttributes": ["className"],
   "tailwindCSS.classFunctions": ["cx", "cva", "clsx", "classMerge", "twMerge"],
   "tailwindCSS.lint.cssConflict": "ignore",
@@ -8,5 +8,4 @@
     "clsx",
     "tailwind-merge"
   ]
-
 }

common/config/environment.js → common/config/environment.ts

@@ -1,7 +1,7 @@
 /*
  * This file should only contain environment variables that are non-secret.
  */
-const isProduction = process.env.PRODUCTION_DEPLOYMENT === 'true';
+export const isProduction = process.env.PRODUCTION_DEPLOYMENT === 'true';
 
 // These are all exposed by the client, so there's no way to protect them anyways.
 export const clientTokens = isProduction

common/constants/partners.js → common/constants/partners.ts

@@ -137,4 +137,4 @@ const partners = [
   { name: 'Airbnb', logoSource: airbnb.src, url: 'https://airbnb.com', type: PARTNER_TYPES.KIND },
 ];
 
-export default sortBy(partners, 'name');
+export const partnersSortedByName = sortBy(partners, 'name');

common/constants/unitsOfTime.js → common/constants/unitsOfTime.ts

@@ -1,4 +1,6 @@
-// In seconds
+/** In seconds */
 export const ONE_DAY = 86400;
+/** In seconds */
 export const ONE_WEEK = 604800;
+/** In seconds */
 export const TWO_WEEKS = 1209600;

common/constants/urls.ts

@@ -0,0 +1,6 @@
+export const s3hostName = 'operation-code-assets.s3.us-east-2.amazonaws.com';
+export const s3 = `https://${s3hostName}/`;
+export const leadershipCircleLink =
+  'https://secure.lglforms.com/form_engine/s/L428AQ2rrsFJQyy5Fbglvg';
+export const codeOfConduct = `https://github.com/OperationCode/operationcode_docs/blob/master/community/code_of_conduct.md`;
+export const slackGuidelines = `https://github.com/OperationCode/START_HERE/blob/master/community_guidelines.md`;

common/utils/api-utils.ts

@@ -2,7 +2,6 @@ import type { AxiosError, AxiosInstance, AxiosRequestConfig } from 'axios';
 import axios from 'axios';
 import { networkErrorMessages } from 'common/constants/messages';
 import { apiUrl, resourcesAPIURL } from 'common/config/environment';
-import { setAuthorizationHeader } from 'common/utils/cookie-utils';
 
 const baseAxiosConfig = {
   baseURL: apiUrl,
@@ -37,17 +36,13 @@ const getRequestAbortionPieces = () => {
 
 export const get = async (
   path: string,
-  {
-    token,
-    parameters,
-  }: { token?: string; parameters?: Record<string, AxiosRequestConfig['params']> } = {},
+  { parameters }: { parameters?: Record<string, AxiosRequestConfig['params']> } = {},
   axiosClient = OperationCodeAPI,
 ) => {
   const { abort, connectionTimeout } = getRequestAbortionPieces();
 
   return axiosClient
     .get(path, {
-      headers: setAuthorizationHeader(token),
       cancelToken: abort.token,
       params: parameters,
     })
@@ -61,17 +56,11 @@ export const get = async (
     });
 };
 
-export const post = async (
-  path: string,
-  body: object,
-  { token }: { token?: string } = {},
-  axiosClient: AxiosInstance = axios,
-) => {
+export const post = async (path: string, body: object, axiosClient: AxiosInstance = axios) => {
   const { abort, connectionTimeout } = getRequestAbortionPieces();
 
   return axiosClient
     .post(path, body, {
-      headers: setAuthorizationHeader(token),
       cancelToken: abort.token,
     })
     .then(response => {
@@ -84,17 +73,11 @@ export const post = async (
     });
 };
 
-export const patch = async (
-  path: string,
-  body: object,
-  { token }: { token?: string } = {},
-  axiosClient: AxiosInstance = axios,
-) => {
+export const patch = async (path: string, body: object, axiosClient: AxiosInstance = axios) => {
   const { abort, connectionTimeout } = getRequestAbortionPieces();
 
   return axiosClient
     .patch(path, body, {
-      headers: setAuthorizationHeader(token),
       cancelToken: abort.token,
     })
     .then(response => {
@@ -107,17 +90,11 @@ export const patch = async (
     });
 };
 
-export const put = async (
-  path: string,
-  body: object,
-  { token }: { token?: string } = {},
-  axiosClient: AxiosInstance = axios,
-) => {
+export const put = async (path: string, body: object, axiosClient: AxiosInstance = axios) => {
   const { abort, connectionTimeout } = getRequestAbortionPieces();
 
   return axiosClient
     .put(path, body, {
-      headers: setAuthorizationHeader(token),
       cancelToken: abort.token,
     })
     .then(response => {

common/utils/thirdParty/gtag.js → common/utils/thirdParty/gtag.ts

@@ -1,27 +1,38 @@
 import snakeCase from 'lodash/snakeCase';
-import { clientTokens } from 'common/config/environment';
+import { clientTokens, isProduction } from 'common/config/environment';
+
+declare global {
+  interface Window {
+    gtag?: (
+      command: 'config' | 'event',
+      targetId: string,
+      config?: Record<string, unknown>,
+    ) => void;
+  }
+}
 
 // TODO: Leverage prod-build-time-only env vars instead NODE_ENV for prod check
-const isProduction = process.env.NODE_ENV === 'production';
 const isDevelopment = process.env.NODE_ENV === 'development';
 
+interface LogParams {
+  methodName: string;
+  [key: string]: unknown;
+}
+
 /**
  * @description dev-only logging of gtag methods
- * @param {{ methodName: string }} { methodName, ...rest }
  */
-const log = ({ methodName, ...rest }) => {
+const log = ({ methodName, ...rest }: LogParams): void => {
   if (isDevelopment) {
     console.log(`gtag.${methodName}\n`, rest); // eslint-disable-line no-console
   }
 };
 
 /**
  * @description Log a pageview with gtag
- * @param {string} url
- * @param {boolean?} isModalView
  * @see https://developers.google.com/analytics/devguides/collection/gtagjs/pages
  */
-const pageView = (url, isModalView = false) => {
+const pageView = (url: string, isModalView = false): void => {
   log({ methodName: 'pageview', url, isModalView });
 
   if (isProduction && !!window && !!window.gtag) {
@@ -31,16 +42,21 @@ const pageView = (url, isModalView = false) => {
   }
 };
 
+interface EventParams {
+  action: string;
+  /** Callback function to execute after the event */
+  callback?: () => void;
+  category: string;
+  /** Optional label for the event */
+  label?: string;
+  /** Optional numeric value for the event */
+  value?: number;
+  /** Additional event parameters */
+  otherEventParameters?: Record<string, unknown>;
+}
+
 /**
  * @description Log an event with gtag
- * @param {{
- *  action: string,
- *  callback?: () => void,
- *  category: string,
- *  label?: string,
- *  otherEventParameters?: object,
- *  value?: number,
- * }}
  * @see https://developers.google.com/analytics/devguides/collection/gtagjs/events
  */
 const event = ({
@@ -50,7 +66,7 @@ const event = ({
   label = undefined,
   value = undefined,
   otherEventParameters = {}, // https://developers.google.com/gtagjs/reference/parameter
-}) => {
+}: EventParams): void => {
   if (!action || !category) {
     throw new Error('Google Events must be called with at least an action and category.');
   }
@@ -76,11 +92,17 @@ const event = ({
   }
 };
 
+interface ConversionEventParams {
+  /** Google Ads conversion ID */
+  adId: string;
+  /** Category for the conversion event */
+  category?: string;
+}
+
 /**
  * @description Log a conversion event with gtag (connected to Google Ads ID of a conversion)
- * @param {{ adId: string, category?: string }} { adId, category = 'engagement' }
  */
-const conversionEvent = ({ adId, category = 'engagement' }) => {
+const conversionEvent = ({ adId, category = 'engagement' }: ConversionEventParams): void => {
   log({ methodName: 'adEvent', adId, category });
 
   if (isProduction) {
@@ -94,23 +116,19 @@ const conversionEvent = ({ adId, category = 'engagement' }) => {
 
 /**
  * @description Log a link click which takes users away from our site
- * @param {string} label describe where the user is going
- * @param {string} url
  */
-const outboundLink = (label, url) => {
+const outboundLink = (label: string, url: string): void => {
   event({
     action: `To: ${label}`,
     category: 'Outbound',
     label: `URL: ${url}`,
-    value: url,
   });
 };
 
 /**
  * @description Log a modal view as if it were a gtag page view event
- * @param {string} modalName
  */
-const modalView = modalName => {
+const modalView = (modalName: string): void => {
   const url = `/modal/${snakeCase(modalName.toLowerCase())}`;
 
   const isModalView = true;