diff --git a/dashboard/react-table.d.ts b/dashboard/react-table.d.ts
index 88519f8a6f..b7a10b4af4 100644
--- a/dashboard/react-table.d.ts
+++ b/dashboard/react-table.d.ts
@@ -1,121 +1,71 @@
 import {
-  UseColumnOrderInstanceProps,
-  UseColumnOrderState,
-  UseExpandedHooks,
-  UseExpandedInstanceProps,
-  UseExpandedOptions,
-  UseExpandedRowProps,
-  UseExpandedState,
-  UseFiltersColumnOptions,
-  UseFiltersColumnProps,
-  UseFiltersInstanceProps,
-  UseFiltersOptions,
-  UseFiltersState,
-  UseGlobalFiltersColumnOptions,
-  UseGlobalFiltersInstanceProps,
-  UseGlobalFiltersOptions,
-  UseGlobalFiltersState,
-  UseGroupByCellProps,
-  UseGroupByColumnOptions,
-  UseGroupByColumnProps,
-  UseGroupByHooks,
-  UseGroupByInstanceProps,
-  UseGroupByOptions,
-  UseGroupByRowProps,
-  UseGroupByState,
-  UsePaginationInstanceProps,
-  UsePaginationOptions,
-  UsePaginationState,
-  UseResizeColumnsColumnOptions,
-  UseResizeColumnsColumnProps,
-  UseResizeColumnsOptions,
-  UseResizeColumnsState,
-  UseRowSelectHooks,
-  UseRowSelectInstanceProps,
-  UseRowSelectOptions,
-  UseRowSelectRowProps,
-  UseRowSelectState,
-  UseRowStateCellProps,
-  UseRowStateInstanceProps,
-  UseRowStateOptions,
-  UseRowStateRowProps,
-  UseRowStateState,
-  UseSortByColumnOptions,
-  UseSortByColumnProps,
-  UseSortByHooks,
-  UseSortByInstanceProps,
-  UseSortByOptions,
-  UseSortByState,
+  type UseColumnOrderInstanceProps,
+  type UseColumnOrderState,
+  type UseExpandedHooks,
+  type UseExpandedInstanceProps,
+  type UseExpandedOptions,
+  type UseExpandedRowProps,
+  type UseExpandedState,
+  type UseFiltersColumnOptions,
+  type UseFiltersColumnProps,
+  type UseFiltersInstanceProps,
+  type UseFiltersOptions,
+  type UseFiltersState,
+  type UseGlobalFiltersColumnOptions,
+  type UseGlobalFiltersInstanceProps,
+  type UseGlobalFiltersOptions,
+  type UseGlobalFiltersState,
+  type UseGroupByCellProps,
+  type UseGroupByColumnOptions,
+  type UseGroupByColumnProps,
+  type UseGroupByHooks,
+  type UseGroupByInstanceProps,
+  type UseGroupByOptions,
+  type UseGroupByRowProps,
+  type UseGroupByState,
+  type UsePaginationInstanceProps,
+  type UsePaginationOptions,
+  type UsePaginationState,
+  type UseResizeColumnsColumnOptions,
+  type UseResizeColumnsColumnProps,
+  type UseResizeColumnsOptions,
+  type UseResizeColumnsState,
+  type UseRowSelectHooks,
+  type UseRowSelectInstanceProps,
+  type UseRowSelectOptions,
+  type UseRowSelectRowProps,
+  type UseRowSelectState,
+  type UseRowStateCellProps,
+  type UseRowStateInstanceProps,
+  type UseRowStateOptions,
+  type UseRowStateRowProps,
+  type UseRowStateState,
+  type UseSortByColumnOptions,
+  type UseSortByColumnProps,
+  type UseSortByHooks,
+  type UseSortByInstanceProps,
+  type UseSortByOptions,
+  type UseSortByState,
 } from "react-table";
 
 declare module "react-table" {
   // take this file as-is, or comment out the sections that don't apply to your plugin configuration
 
-  export interface TableOptions<
+  export type TableOptions<
     D extends object = {}
-  > extends UseExpandedOptions<D>,
-      UseFiltersOptions<D>,
-      UseGlobalFiltersOptions<D>,
-      UseGroupByOptions<D>,
-      UsePaginationOptions<D>,
-      UseResizeColumnsOptions<D>,
-      UseRowSelectOptions<D>,
-      UseRowStateOptions<D>,
-      UseSortByOptions<D>,
-      // note that having Record here allows you to add anything to the options, this matches the spirit of the
-      // underlying js library, but might be cleaner if it's replaced by a more specific type that matches your
-      // feature set, this is a safe default.
-      Record<string, any> {}
+  > = {} & UseExpandedOptions<D> & UseFiltersOptions<D> & UseGlobalFiltersOptions<D> & UseGroupByOptions<D> & UsePaginationOptions<D> & UseResizeColumnsOptions<D> & UseRowSelectOptions<D> & UseRowStateOptions<D> & UseSortByOptions<D> & Record<string, any>
 
-  export interface Hooks<D extends object = {}>
-    extends UseExpandedHooks<D>,
-      UseGroupByHooks<D>,
-      UseRowSelectHooks<D>,
-      UseSortByHooks<D> {}
+  export type Hooks<D extends object = {}> = {} & UseExpandedHooks<D> & UseGroupByHooks<D> & UseRowSelectHooks<D> & UseSortByHooks<D>
 
-  export interface TableInstance<D extends object = {}>
-    extends UseColumnOrderInstanceProps<D>,
-      UseExpandedInstanceProps<D>,
-      UseFiltersInstanceProps<D>,
-      UseGlobalFiltersInstanceProps<D>,
-      UseGroupByInstanceProps<D>,
-      UsePaginationInstanceProps<D>,
-      UseRowSelectInstanceProps<D>,
-      UseRowStateInstanceProps<D>,
-      UseSortByInstanceProps<D> {}
+  export type TableInstance<D extends object = {}> = {} & UseColumnOrderInstanceProps<D> & UseExpandedInstanceProps<D> & UseFiltersInstanceProps<D> & UseGlobalFiltersInstanceProps<D> & UseGroupByInstanceProps<D> & UsePaginationInstanceProps<D> & UseRowSelectInstanceProps<D> & UseRowStateInstanceProps<D> & UseSortByInstanceProps<D>
 
-  export interface TableState<D extends object = {}>
-    extends UseColumnOrderState<D>,
-      UseExpandedState<D>,
-      UseFiltersState<D>,
-      UseGlobalFiltersState<D>,
-      UseGroupByState<D>,
-      UsePaginationState<D>,
-      UseResizeColumnsState<D>,
-      UseRowSelectState<D>,
-      UseRowStateState<D>,
-      UseSortByState<D> {}
+  export type TableState<D extends object = {}> = {} & UseColumnOrderState<D> & UseExpandedState<D> & UseFiltersState<D> & UseGlobalFiltersState<D> & UseGroupByState<D> & UsePaginationState<D> & UseResizeColumnsState<D> & UseRowSelectState<D> & UseRowStateState<D> & UseSortByState<D>
 
-  export interface ColumnInterface<D extends object = {}>
-    extends UseFiltersColumnOptions<D>,
-      UseGlobalFiltersColumnOptions<D>,
-      UseGroupByColumnOptions<D>,
-      UseResizeColumnsColumnOptions<D>,
-      UseSortByColumnOptions<D> {}
+  export type ColumnInterface<D extends object = {}> = {} & UseFiltersColumnOptions<D> & UseGlobalFiltersColumnOptions<D> & UseGroupByColumnOptions<D> & UseResizeColumnsColumnOptions<D> & UseSortByColumnOptions<D>
 
-  export interface ColumnInstance<D extends object = {}>
-    extends UseFiltersColumnProps<D>,
-      UseGroupByColumnProps<D>,
-      UseResizeColumnsColumnProps<D>,
-      UseSortByColumnProps<D> {}
+  export type ColumnInstance<D extends object = {}> = {} & UseFiltersColumnProps<D> & UseGroupByColumnProps<D> & UseResizeColumnsColumnProps<D> & UseSortByColumnProps<D>
 
-  export interface Cell<D extends object = {}, V = any>
-    extends UseGroupByCellProps<D>,
-      UseRowStateCellProps<D> {}
+  export type Cell<D extends object = {}, V = any> = {} & UseGroupByCellProps<D> & UseRowStateCellProps<D>
 
-  export interface Row<D extends object = {}>
-    extends UseExpandedRowProps<D>,
-      UseGroupByRowProps<D>,
-      UseRowSelectRowProps<D>,
-      UseRowStateRowProps<D> {}
+  export type Row<D extends object = {}> = {} & UseExpandedRowProps<D> & UseGroupByRowProps<D> & UseRowSelectRowProps<D> & UseRowStateRowProps<D>
 }
diff --git a/dashboard/src/assets/GoogleIcon.tsx b/dashboard/src/assets/GoogleIcon.tsx
index 8f11dfd65c..eeb377c7c5 100644
--- a/dashboard/src/assets/GoogleIcon.tsx
+++ b/dashboard/src/assets/GoogleIcon.tsx
@@ -65,9 +65,9 @@ export default class GHIcon extends Component<PropsType, StateType> {
         <g
           id="Google-Button"
           stroke="none"
-          stroke-width="1"
+          strokeWidth="1"
           fill="none"
-          fill-rule="evenodd"
+          fillRule="evenodd"
         >
           <g id="9-PATCH" transform="translate(-608.000000, -160.000000)"></g>
           <g
@@ -80,7 +80,7 @@ export default class GHIcon extends Component<PropsType, StateType> {
               filter="url(#filter-1)"
             >
               <g id="button-bg">
-                <use fill="#FFFFFF" fill-rule="evenodd"></use>
+                <use fill="#FFFFFF" fillRule="evenodd"></use>
                 <use fill="none"></use>
                 <use fill="none"></use>
                 <use fill="none"></use>
diff --git a/dashboard/src/components/AzureCredentialForm.tsx b/dashboard/src/components/AzureCredentialForm.tsx
index ac57e29a07..1333c04291 100644
--- a/dashboard/src/components/AzureCredentialForm.tsx
+++ b/dashboard/src/components/AzureCredentialForm.tsx
@@ -106,7 +106,7 @@ const AzureCredentialForm: React.FC<Props> = ({ goBack, proceed }) => {
                 Follow our <Link to="https://docs.porter.run/provision/provisioning-on-azure" target="_blank">documentation</Link> to create your service principal and prepare your subscription for use with Porter.
               </Text>
               <Spacer y={1} />
-              <Button onClick={() => setCurrentStep(1)}>
+              <Button onClick={() => { setCurrentStep(1); }}>
                 Continue
               </Button>
             </>,
@@ -162,7 +162,7 @@ const AzureCredentialForm: React.FC<Props> = ({ goBack, proceed }) => {
                 />
               <Spacer y={1} />
               <Container row>
-                  <Button onClick={() => setCurrentStep(0)} color="#222222">Back</Button>
+                  <Button onClick={() => { setCurrentStep(0); }} color="#222222">Back</Button>
                   <Spacer inline x={0.5} />
                   <Button
                     onClick={saveCredentials}
diff --git a/dashboard/src/components/Breadcrumb.tsx b/dashboard/src/components/Breadcrumb.tsx
index 76bb547547..8dd2224074 100644
--- a/dashboard/src/components/Breadcrumb.tsx
+++ b/dashboard/src/components/Breadcrumb.tsx
@@ -5,7 +5,7 @@ import styled from "styled-components";
 
 type Props = {
   currentStep: string;
-  steps: { value: string; label: string }[];
+  steps: Array<{ value: string; label: string }>;
   onClickStep?: (step: string) => void;
 };
 
@@ -17,7 +17,7 @@ const Breadcrumb: React.FC<Props> = ({ currentStep, steps, onClickStep }) => {
           <Fragment key={i}>
             <Crumb
               bold={currentStep === step.value}
-              onClick={() => onClickStep && onClickStep(step.value)}
+              onClick={() => { onClickStep && onClickStep(step.value); }}
             >
               {step.label}
             </Crumb>
diff --git a/dashboard/src/components/Button.tsx b/dashboard/src/components/Button.tsx
index 152d9929d1..66ffccf072 100644
--- a/dashboard/src/components/Button.tsx
+++ b/dashboard/src/components/Button.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
   disabled?: boolean;
   children: React.ReactNode;
   onClick: () => void;
diff --git a/dashboard/src/components/CopyToClipboard.tsx b/dashboard/src/components/CopyToClipboard.tsx
index e48e00d4b6..b14174cb91 100644
--- a/dashboard/src/components/CopyToClipboard.tsx
+++ b/dashboard/src/components/CopyToClipboard.tsx
@@ -1,6 +1,6 @@
 // import ClipboardJS from "clipboard";
 import ClipboardJS from "clipboard";
-import React, { Component, RefObject } from "react";
+import React, { Component, type RefObject } from "react";
 import Tooltip from "@material-ui/core/Tooltip";
 import styled from "styled-components";
 
@@ -72,7 +72,7 @@ export default class CopyToClipboard extends Component<PropsType, StateType> {
   }
 
   componentWillUnmount() {
-    if (this.state.clipboard && this.state.clipboard.destroy) {
+    if (this.state.clipboard?.destroy) {
       this.state.clipboard.destroy();
     }
   }
diff --git a/dashboard/src/components/CredentialsForm.tsx b/dashboard/src/components/CredentialsForm.tsx
index 2c1adabcf9..62ff298d7c 100644
--- a/dashboard/src/components/CredentialsForm.tsx
+++ b/dashboard/src/components/CredentialsForm.tsx
@@ -131,7 +131,7 @@ const CredentialsForm: React.FC<Props> = ({
           <Br height="34px" />
           <SaveButton
             disabled={!selectedCredentials && true}
-            onClick={() => proceed(selectedCredentials.aws_arn)}
+            onClick={() => { proceed(selectedCredentials.aws_arn); }}
             clearPosition
             text="Continue"
           />
@@ -143,7 +143,7 @@ const CredentialsForm: React.FC<Props> = ({
         <StyledForm>
           {
             awsCredentials.length > 0 && (
-              <CloseButton onClick={() => setShowCreateForm(false)}>
+              <CloseButton onClick={() => { setShowCreateForm(false); }}>
                 <i className="material-icons">close</i>
               </CloseButton>
             )
@@ -151,7 +151,7 @@ const CredentialsForm: React.FC<Props> = ({
           <InputRow
             type="string"
             value={awsAccessKeyID}
-            setValue={(e: string) => setAWSAccessKeyID(e)}
+            setValue={(e: string) => { setAWSAccessKeyID(e); }}
             label="👤 AWS access ID"
             placeholder="ex: AKIAIOSFODNN7EXAMPLE"
             isRequired
diff --git a/dashboard/src/components/DynamicLink.tsx b/dashboard/src/components/DynamicLink.tsx
index 52367b846b..269a4df3ac 100644
--- a/dashboard/src/components/DynamicLink.tsx
+++ b/dashboard/src/components/DynamicLink.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { Link, LinkProps } from "react-router-dom";
+import { Link, type LinkProps } from "react-router-dom";
 
 const DynamicLink: React.FC<LinkProps> = ({ to, children, hasunderline, ...props }) => {
   // It is a simple element with nothing to link to
diff --git a/dashboard/src/components/ExpandableResource.tsx b/dashboard/src/components/ExpandableResource.tsx
index d57fe2ab42..d46c9bd6d2 100644
--- a/dashboard/src/components/ExpandableResource.tsx
+++ b/dashboard/src/components/ExpandableResource.tsx
@@ -20,12 +20,12 @@ const ExpandableResource: React.FC<Props> = (props) => {
   const { currentCluster, currentProject } = useContext(Context);
 
   const onSave = () => {
-    let projID = currentProject.id;
-    let clusterID = currentCluster.id;
-    let config = button.actions[0].delete.context.config;
+    const projID = currentProject.id;
+    const clusterID = currentCluster.id;
+    const config = button.actions[0].delete.context.config;
 
     // TODO: construct the endpoint scope, right now we're just using release scope
-    let uri = `/api/projects/${projID}/clusters/${clusterID}/namespaces/${resource.metadata.namespace}${button.actions[0].delete.relative_uri}`;
+    const uri = `/api/projects/${projID}/clusters/${clusterID}/namespaces/${resource.metadata.namespace}${button.actions[0].delete.relative_uri}`;
 
     // compute the endpoint using button and target context
     baseApi<
@@ -49,7 +49,7 @@ const ExpandableResource: React.FC<Props> = (props) => {
       {}
     )
       .then((res) => {})
-      .catch((err) => console.log(err));
+      .catch((err) => { console.log(err); });
   };
 
   return (
diff --git a/dashboard/src/components/GCPCredentialsForm.tsx b/dashboard/src/components/GCPCredentialsForm.tsx
index e6d5aea850..81952ddd42 100644
--- a/dashboard/src/components/GCPCredentialsForm.tsx
+++ b/dashboard/src/components/GCPCredentialsForm.tsx
@@ -41,7 +41,7 @@ const GCPCredentialsForm: React.FC<Props> = ({ goBack, proceed }) => {
     gcpIntegration()
 
   }, [detected])
-  interface FailureState {
+  type FailureState = {
     condition: boolean;
     errorMessage: string;
   }
@@ -167,7 +167,7 @@ const GCPCredentialsForm: React.FC<Props> = ({ goBack, proceed }) => {
             <Text size={16}>Upload service account credentials</Text>
             <Spacer y={1} />
             <UploadArea
-              setValue={(x: string) => handleLoadJSON(x)}
+              setValue={(x: string) => { handleLoadJSON(x); }}
               label="🔒 GCP Key Data (JSON)"
               placeholder="Drag a GCP Service Account JSON here, or click to browse."
               width="100%"
diff --git a/dashboard/src/components/GCPProvisionerSettings.tsx b/dashboard/src/components/GCPProvisionerSettings.tsx
index e1c0d72082..e32a21d51a 100644
--- a/dashboard/src/components/GCPProvisionerSettings.tsx
+++ b/dashboard/src/components/GCPProvisionerSettings.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState, useContext } from "react";
 import styled from "styled-components";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import { OFState } from "main/home/onboarding/state";
 import api from "shared/api";
@@ -23,7 +23,7 @@ import {
   GKEPreflightValues,
   PreflightCheckRequest
 } from "@porter-dev/api-contracts";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 import Button from "./porter/Button";
 import Error from "./porter/Error";
 import Spacer from "./porter/Spacer";
@@ -214,7 +214,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
         {
           < Heading >
             <ExpandHeader
-              onClick={() => setIsExpanded(!isExpanded)}
+              onClick={() => { setIsExpanded(!isExpanded); }}
               isExpanded={isExpanded}
             >
               <i className="material-icons">arrow_drop_down</i>
@@ -254,7 +254,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
                 type="string"
                 disabled={isReadOnly}
                 value={clusterNetworking.cidrRange}
-                setValue={(x: string) => setClusterNetworking(new GKENetwork({ ...clusterNetworking, cidrRange: x }))}
+                setValue={(x: string) => { setClusterNetworking(new GKENetwork({ ...clusterNetworking, cidrRange: x })); }}
                 label="VPC CIDR range"
                 placeholder="ex: 10.78.0.0/16"
               />
@@ -277,7 +277,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
                   type="string"
                   disabled={isReadOnly}
                   value={clusterNetworking.controlPlaneCidr}
-                  setValue={(x: string) => setClusterNetworking(new GKENetwork({ ...clusterNetworking, controlPlaneCidr: x }))}
+                  setValue={(x: string) => { setClusterNetworking(new GKENetwork({ ...clusterNetworking, controlPlaneCidr: x })); }}
                   label="Control Plane CIDR range"
                   placeholder="ex: 10.78.0.0/16"
                 />
@@ -286,7 +286,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
                   type="string"
                   disabled={isReadOnly}
                   value={clusterNetworking.podCidr}
-                  setValue={(x: string) => setClusterNetworking(new GKENetwork({ ...clusterNetworking, podCidr: x }))}
+                  setValue={(x: string) => { setClusterNetworking(new GKENetwork({ ...clusterNetworking, podCidr: x })); }}
                   label="Pod CIDR range"
                   placeholder="ex: 10.78.0.0/16"
                 />
@@ -295,7 +295,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
                   type="string"
                   disabled={isReadOnly}
                   value={clusterNetworking.serviceCidr}
-                  setValue={(x: string) => setClusterNetworking(new GKENetwork({ ...clusterNetworking, serviceCidr: x }))}
+                  setValue={(x: string) => { setClusterNetworking(new GKENetwork({ ...clusterNetworking, serviceCidr: x })); }}
                   label="Service CIDR range"
                   placeholder="ex: 10.78.0.0/16"
                 />
@@ -342,7 +342,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
         nodePoolType: GKENodePoolType.GKE_NODE_POOL_TYPE_SYSTEM
       }),
       new GKENodePool({
-        instanceType: instanceType,
+        instanceType,
         minInstances: 1, // TODO: make these customizable before merging
         maxInstances: 10, // TODO: make these customizable before merging
         nodePoolType: GKENodePoolType.GKE_NODE_POOL_TYPE_APPLICATION
@@ -369,9 +369,9 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
         kindValues: {
           case: "gkeKind",
           value: new GKE({
-            clusterName: clusterName,
+            clusterName,
             clusterVersion: clusterVersion || clusterVersionOptions[0].value,
-            region: region,
+            region,
             network: new GKENetwork({
               cidrRange: clusterNetworking.cidrRange,
               controlPlaneCidr: clusterNetworking.controlPlaneCidr,
@@ -416,7 +416,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
     const data = createClusterObj();
 
     if (props.clusterId) {
-      data["cluster"]["clusterId"] = props.clusterId;
+      data.cluster.clusterId = props.clusterId;
     }
 
     try {
@@ -554,7 +554,7 @@ const GCPProvisionerSettings: React.FC<Props> = (props) => {
       // Check if any of the preflight checks has a message
       let hasMessage = false;
       let errors = "Preflight Checks Failed : ";
-      for (let check in preflightDataResp?.data?.Msg.preflight_checks) {
+      for (const check in preflightDataResp?.data?.Msg.preflight_checks) {
         if (preflightDataResp?.data?.Msg.preflight_checks[check]?.message) {
           hasMessage = true;
           errors = errors + check + ", "
diff --git a/dashboard/src/components/LogQueryModeSelectionToggle.tsx b/dashboard/src/components/LogQueryModeSelectionToggle.tsx
index 4d82cfd6db..2455c47f40 100644
--- a/dashboard/src/components/LogQueryModeSelectionToggle.tsx
+++ b/dashboard/src/components/LogQueryModeSelectionToggle.tsx
@@ -4,7 +4,7 @@ import time from "assets/time.svg";
 import React from "react";
 import styled from "styled-components";
 
-interface LogQueryModeSelectionToggleProps {
+type LogQueryModeSelectionToggleProps = {
   selectedDate?: Date;
   setSelectedDate: (date?: Date) => void;
 }
@@ -32,7 +32,7 @@ const LogQueryModeSelectionToggle = (
         </ToggleOption>
         <ToggleOption
           nudgeLeft
-          onClick={() => props.setSelectedDate(dayjs().toDate())}
+          onClick={() => { props.setSelectedDate(dayjs().toDate()); }}
           selected={!!props.selectedDate}
         >
           <TimeIcon src={time} selected={!!props.selectedDate} />
diff --git a/dashboard/src/components/MultiSaveButton.tsx b/dashboard/src/components/MultiSaveButton.tsx
index 9e4442920d..1290701db3 100644
--- a/dashboard/src/components/MultiSaveButton.tsx
+++ b/dashboard/src/components/MultiSaveButton.tsx
@@ -82,12 +82,12 @@ const MultiSaveButton: React.FC<Props> = (props) => {
     if (isDropdownExpanded) {
       return (
         <>
-          <DropdownOverlay onClick={() => setIsDropdownExpanded(false)} />
+          <DropdownOverlay onClick={() => { setIsDropdownExpanded(false); }} />
           <OptionWrapper
             expandTo={props.expandTo || "right"}
             dropdownWidth="400px"
             dropdownMaxHeight="300px"
-            onClick={() => setIsDropdownExpanded(false)}
+            onClick={() => { setIsDropdownExpanded(false); }}
           >
             {renderOptionList()}
           </OptionWrapper>
@@ -102,7 +102,7 @@ const MultiSaveButton: React.FC<Props> = (props) => {
         <Option
           key={i}
           selected={option.text === originalArray[currOptionIndex]?.text}
-          onClick={() => setCurrOptionIndex(i)}
+          onClick={() => { setCurrOptionIndex(i); }}
           lastItem={i === originalArray.length - 1}
         >
           {option.text}
@@ -133,7 +133,7 @@ const MultiSaveButton: React.FC<Props> = (props) => {
         <DropdownButton
           disabled={props.disabled}
           color={props.color || "#5561C0"}
-          onClick={() => setIsDropdownExpanded(!isDropdownExpanded)}
+          onClick={() => { setIsDropdownExpanded(!isDropdownExpanded); }}
         >
           <i className="material-icons expand-icon">
             {isDropdownExpanded ? "expand_less" : "expand_more"}
diff --git a/dashboard/src/components/OldPlaceholder.tsx b/dashboard/src/components/OldPlaceholder.tsx
index 512816db93..985d731cd0 100644
--- a/dashboard/src/components/OldPlaceholder.tsx
+++ b/dashboard/src/components/OldPlaceholder.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
   height?: string;
   minHeight?: string;
   children: React.ReactNode;
diff --git a/dashboard/src/components/OldTable.tsx b/dashboard/src/components/OldTable.tsx
index 934d100c37..04faa835e4 100644
--- a/dashboard/src/components/OldTable.tsx
+++ b/dashboard/src/components/OldTable.tsx
@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from "react";
 import styled from "styled-components";
 import {
-  Column,
-  Row,
+  type Column,
+  type Row,
   useGlobalFilter,
   usePagination,
   useTable,
@@ -51,7 +51,7 @@ const GlobalFilter: React.FunctionComponent<any> = ({
 };
 
 export type TableProps = {
-  columns: Column<any>[];
+  columns: Array<Column<any>>;
   data: any[];
   onRowClick?: (row: Row) => void;
   isLoading: boolean;
@@ -158,7 +158,7 @@ const Table: React.FC<TableProps> = ({
               disableHover={disableHover}
               {...row.getRowProps()}
               enablePointer={!!onRowClick}
-              onClick={() => onRowClick && onRowClick(row)}
+              onClick={() => { onRowClick && onRowClick(row); }}
               selected={false}
             >
               {/* TODO: This is actually broken, not sure why but we need the width to be properly setted, this is a temporary solution */}
@@ -247,7 +247,7 @@ const Table: React.FC<TableProps> = ({
               {"<"}
             </PaginationAction>
             <PageCounter>
-              {currentPageIndex + 1} of {pageCount ? pageCount : pageCount + 1}
+              {currentPageIndex + 1} of {pageCount || pageCount + 1}
             </PageCounter>
             <PaginationAction disabled={!canNextPage} onClick={() => {
               nextPage();
diff --git a/dashboard/src/components/Placeholder.tsx b/dashboard/src/components/Placeholder.tsx
index b89bb7af8e..a54754a5ea 100644
--- a/dashboard/src/components/Placeholder.tsx
+++ b/dashboard/src/components/Placeholder.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
   height?: string;
   minHeight?: string;
   children: React.ReactNode;
diff --git a/dashboard/src/components/ProvisionerStatus.tsx b/dashboard/src/components/ProvisionerStatus.tsx
index bb8bd1dacf..8ad10ed4ca 100644
--- a/dashboard/src/components/ProvisionerStatus.tsx
+++ b/dashboard/src/components/ProvisionerStatus.tsx
@@ -3,13 +3,13 @@ import { integrationList } from "shared/common";
 import styled, { keyframes } from "styled-components";
 import { readableDate } from "shared/string_utils";
 import {
-  Infrastructure,
+  type Infrastructure,
   KindMap,
-  Operation,
-  OperationStatus,
-  OperationType,
-  TFResourceState,
-  TFState,
+  type Operation,
+  type OperationStatus,
+  type OperationType,
+  type TFResourceState,
+  type TFState,
 } from "shared/types";
 import api from "shared/api";
 import Placeholder from "./OldPlaceholder";
@@ -27,7 +27,7 @@ type Props = {
   set_max_width?: boolean;
 };
 
-const nameMap: { [key: string]: string } = {
+const nameMap: Record<string, string> = {
   eks: "Elastic Kubernetes Service (EKS)",
   ecr: "Elastic Container Registry (ECR)",
   doks: "DigitalOcean Kubernetes Service (DOKS)",
@@ -132,7 +132,7 @@ const V1InfraObject: React.FC<V1InfraObjectProps> = ({
   };
 
   const renderErrorSection = () => {
-    let errors: string[] = [];
+    const errors: string[] = [];
     if (infra.status == "destroyed" || infra.status == "deleted") {
       errors.push("This infrastructure was destroyed.");
     }
@@ -154,7 +154,7 @@ const V1InfraObject: React.FC<V1InfraObjectProps> = ({
 
   const renderExpandedContents = () => {
     if (isExpanded) {
-      let errors: string[] = [];
+      const errors: string[] = [];
 
       if (infra.status == "destroyed" || infra.status == "deleted") {
         errors.push("This infrastructure was destroyed.");
@@ -260,7 +260,7 @@ const V2InfraObject: React.FC<V2InfraObjectProps> = ({
         "<token>",
         {},
         {
-          project_id: project_id,
+          project_id,
           infra_id: infra.id,
         }
       )
@@ -281,12 +281,12 @@ const V2InfraObject: React.FC<V2InfraObjectProps> = ({
         "<token>",
         {},
         {
-          project_id: project_id,
+          project_id,
           infra_id: infra.id,
         }
       )
       .then(({ data }) => {
-        let infra = data as Infrastructure;
+        const infra = data as Infrastructure;
 
         if (completed && infra.latest_operation) {
           if (errored) {
@@ -428,7 +428,7 @@ export const OperationDetails: React.FunctionComponent<OperationDetailsProps> =
   const { newWebsocket, openWebsocket, closeWebsocket } = useWebsockets();
 
   const parseOperationWebsocketEvent = (evt: MessageEvent) => {
-    let { status, resource_id, error } = JSON.parse(evt.data);
+    const { status, resource_id, error } = JSON.parse(evt.data);
 
     if (status == "OPERATION_COMPLETED") {
       // if the operation is completed, call the completed handler
@@ -436,7 +436,7 @@ export const OperationDetails: React.FunctionComponent<OperationDetailsProps> =
     } else if (status && resource_id) {
       // if the status and resource_id are defined, add this to the infra state
       setInfraState((curr) => {
-        let currCopy: TFState = {
+        const currCopy: TFState = {
           last_updated: curr.last_updated,
           operation_id: curr.operation_id,
           status: curr.status,
@@ -449,8 +449,8 @@ export const OperationDetails: React.FunctionComponent<OperationDetailsProps> =
         } else {
           currCopy.resources[resource_id] = {
             id: resource_id,
-            status: status,
-            error: error,
+            status,
+            error,
           };
         }
 
@@ -460,7 +460,7 @@ export const OperationDetails: React.FunctionComponent<OperationDetailsProps> =
   };
 
   const setupOperationWebsocket = (websocketID: string) => {
-    let apiPath = `/api/projects/${currentProject.id}/infras/${infra.id}/operations/${infra.latest_operation.id}/state`;
+    const apiPath = `/api/projects/${currentProject.id}/infras/${infra.id}/operations/${infra.latest_operation.id}/state`;
 
     const wsConfig = {
       onopen: () => {
diff --git a/dashboard/src/components/RadioSelector.tsx b/dashboard/src/components/RadioSelector.tsx
index f076820c07..9aa16f1ca7 100644
--- a/dashboard/src/components/RadioSelector.tsx
+++ b/dashboard/src/components/RadioSelector.tsx
@@ -4,7 +4,7 @@ import styled from "styled-components";
 type PropsType = {
   selected: string;
   setSelected: (x: string) => void;
-  options: { value: string; label: string }[];
+  options: Array<{ value: string; label: string }>;
 };
 
 type StateType = {};
@@ -15,11 +15,11 @@ export default class RadioSelector extends Component<PropsType, StateType> {
       <StyledRadioSelector>
         {this.props.options.map(
           (option: { label: string; value: string }, i: number) => {
-            let selected = option.value === this.props.selected;
+            const selected = option.value === this.props.selected;
             return (
               <RadioRow
                 key={option.value}
-                onClick={() => this.props.setSelected(option.value)}
+                onClick={() => { this.props.setSelected(option.value); }}
               >
                 <Indicator selected={selected}>
                   {selected && <Circle />}
diff --git a/dashboard/src/components/ResourceTab.tsx b/dashboard/src/components/ResourceTab.tsx
index 6043db62a7..e68f71707d 100644
--- a/dashboard/src/components/ResourceTab.tsx
+++ b/dashboard/src/components/ResourceTab.tsx
@@ -59,7 +59,7 @@ export default class ResourceTab extends Component<PropsType, StateType> {
   };
 
   getStatusText = () => {
-    let { status } = this.props;
+    const { status } = this.props;
     if (status.available && status.total) {
       return `${status.available}/${status.total}`;
     } else if (status.label) {
@@ -68,7 +68,7 @@ export default class ResourceTab extends Component<PropsType, StateType> {
   };
 
   renderStatus = () => {
-    let { status } = this.props;
+    const { status } = this.props;
     if (status) {
       return (
         <Status>
@@ -87,7 +87,7 @@ export default class ResourceTab extends Component<PropsType, StateType> {
   };
 
   render() {
-    let {
+    const {
       label,
       name,
       children,
@@ -100,7 +100,7 @@ export default class ResourceTab extends Component<PropsType, StateType> {
     return (
       <StyledResourceTab
         isLast={isLast}
-        onClick={() => handleClick && handleClick()}
+        onClick={() => { handleClick && handleClick(); }}
         roundAllCorners={roundAllCorners}
       >
         <ResourceHeader
diff --git a/dashboard/src/components/SearchBar.tsx b/dashboard/src/components/SearchBar.tsx
index 1bccd3861d..4dcfed92df 100644
--- a/dashboard/src/components/SearchBar.tsx
+++ b/dashboard/src/components/SearchBar.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState } from "react";
 import Button from "./Button";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
   setSearchFilter: (x: string) => void;
   disabled: boolean;
   prompt?: string;
@@ -47,7 +47,7 @@ const SearchBar: React.FC<Props> = ({
       </SearchBarWrapper>
       <ButtonWrapper disabled={disabled}>
         <Button
-          onClick={() => setSearchFilter(searchInput)}
+          onClick={() => { setSearchFilter(searchInput); }}
           disabled={disabled}
         >
           Search
diff --git a/dashboard/src/components/Selector.tsx b/dashboard/src/components/Selector.tsx
index 2fd6fb887f..8170174016 100644
--- a/dashboard/src/components/Selector.tsx
+++ b/dashboard/src/components/Selector.tsx
@@ -6,7 +6,7 @@ import Loading from "./Loading";
 export type SelectorPropsType<T> = {
   activeValue: T;
   refreshOptions?: () => void;
-  options: { value: T; label: string; icon?: any }[];
+  options: Array<{ value: T; label: string; icon?: any }>;
   addButton?: boolean;
   setActiveValue: (x: T) => void;
   width: string;
@@ -46,11 +46,9 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
 
   handleClickOutside = (event: any) => {
     if (
-      this.wrapperRef &&
-      this.wrapperRef.current &&
+      this.wrapperRef?.current &&
       !this.wrapperRef.current.contains(event.target) &&
-      this.parentRef &&
-      this.parentRef.current &&
+      this.parentRef?.current &&
       !this.parentRef.current.contains(event.target)
     ) {
       this.setState({ expanded: false });
@@ -63,7 +61,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
   };
 
   renderOptionList = () => {
-    let { options, activeValue } = this.props;
+    const { options, activeValue } = this.props;
     return options.map(
       (option: { value: string; label: string; icon?: any }, i: number) => {
         return (
@@ -71,7 +69,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
             key={i}
             height={this.props.height}
             selected={option.value === activeValue}
-            onClick={() => this.handleOptionClick(option)}
+            onClick={() => { this.handleOptionClick(option); }}
             lastItem={i === options.length - 1}
           >
             {option.icon && (
@@ -119,7 +117,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
                 : this.props.width
             }
             dropdownMaxHeight={this.props.dropdownMaxHeight}
-            onClick={() => this.setState({ expanded: false })}
+            onClick={() => { this.setState({ expanded: false }); }}
           >
             {this.renderDropdownLabel()}
             {this.renderOptionList()}
@@ -132,7 +130,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
   };
 
   getLabel = (value: string): any => {
-    let tgt = this.props.options.find(
+    const tgt = this.props.options.find(
       (element: { value: string; label: string }) => element.value === value
     );
     if (tgt) {
@@ -141,7 +139,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
   };
 
   renderIcon = () => {
-    var icon;
+    let icon;
     this.props.options.forEach((option: any) => {
       if (option.icon && option.value === this.props.activeValue) {
         icon = option.icon;
@@ -159,7 +157,7 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
   };
 
   render() {
-    let { activeValue, isLoading } = this.props;
+    const { activeValue, isLoading } = this.props;
 
     return (
       <StyledSelector width={this.props.width}>
@@ -177,8 +175,8 @@ export default class Selector<T> extends Component<SelectorPropsType<T>, StateTy
           expanded={this.state.expanded}
           width={this.props.width}
           height={this.props.height}
-          onMouseEnter={() => this.setState({ showTooltip: true })}
-          onMouseLeave={() => this.setState({ showTooltip: false })}
+          onMouseEnter={() => { this.setState({ showTooltip: true }); }}
+          onMouseLeave={() => { this.setState({ showTooltip: false }); }}
         >
           {isLoading ?
             <Loading />
diff --git a/dashboard/src/components/TitleSection.tsx b/dashboard/src/components/TitleSection.tsx
index fbaa52f4cc..bc0c8f382f 100644
--- a/dashboard/src/components/TitleSection.tsx
+++ b/dashboard/src/components/TitleSection.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
   children: React.ReactNode;
   icon?: any;
   iconWidth?: string;
diff --git a/dashboard/src/components/date-time-picker/DateTimePicker.tsx b/dashboard/src/components/date-time-picker/DateTimePicker.tsx
index fc54ace931..7c217a41b9 100644
--- a/dashboard/src/components/date-time-picker/DateTimePicker.tsx
+++ b/dashboard/src/components/date-time-picker/DateTimePicker.tsx
@@ -21,7 +21,7 @@ const DateTimePicker: React.FC<Props> = ({ startDate, setStartDate }) => {
   maxTimeMinDay.setHours(23, 59, 0, 0);
 
   const availableDates = [];
-  let currentDate = new Date(minDate);
+  const currentDate = new Date(minDate);
   while (currentDate <= maxDate) {
     availableDates.push(new Date(currentDate));
     currentDate.setTime(currentDate.getTime() + 24 * 60 * 60 * 1000);
diff --git a/dashboard/src/components/form-components/CheckboxList.tsx b/dashboard/src/components/form-components/CheckboxList.tsx
index 349222d004..0c78900ee9 100644
--- a/dashboard/src/components/form-components/CheckboxList.tsx
+++ b/dashboard/src/components/form-components/CheckboxList.tsx
@@ -3,13 +3,13 @@ import styled from "styled-components";
 
 type PropsType = {
   label?: string;
-  options: { disabled?: boolean; value: string; label: string }[];
-  selected: { value: string; label: string }[];
-  setSelected: (x: { value: string; label: string }[]) => void;
+  options: Array<{ disabled?: boolean; value: string; label: string }>;
+  selected: Array<{ value: string; label: string }>;
+  setSelected: (x: Array<{ value: string; label: string }>) => void;
 };
 
 const CheckboxList = ({ label, options, selected, setSelected }: PropsType) => {
-  let onSelectOption = (option: { value: string; label: string }) => {
+  const onSelectOption = (option: { value: string; label: string }) => {
     const tmp = [...selected];
     if (!tmp.includes(option)) {
       setSelected([...tmp, option]);
@@ -26,7 +26,7 @@ const CheckboxList = ({ label, options, selected, setSelected }: PropsType) => {
         return (
           <CheckboxOption
             isLast={i === options.length - 1}
-            onClick={() => onSelectOption(option)}
+            onClick={() => { onSelectOption(option); }}
             key={i}
           >
             <Checkbox checked={selected.includes(option)}>
diff --git a/dashboard/src/components/form-components/Heading.tsx b/dashboard/src/components/form-components/Heading.tsx
index 892a2a8f95..add0c97f67 100644
--- a/dashboard/src/components/form-components/Heading.tsx
+++ b/dashboard/src/components/form-components/Heading.tsx
@@ -10,7 +10,7 @@ export default function Heading(props: {
     <StyledHeading isAtTop={props.isAtTop}>
       {props.children}
       {props.docs && (
-        <a href={props.docs} target="_blank">
+        <a href={props.docs} target="_blank" rel="noreferrer">
           <i className="material-icons">help_outline</i>
         </a>
       )}
diff --git a/dashboard/src/components/form-components/Helper.tsx b/dashboard/src/components/form-components/Helper.tsx
index 268f7587ec..c493dad35c 100644
--- a/dashboard/src/components/form-components/Helper.tsx
+++ b/dashboard/src/components/form-components/Helper.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import styled from "styled-components";
 
 export const Helper = styled.div<{ color?: string }>`
-  color: ${({ color }) => (color ? color : "#aaaabb")};
+  color: ${({ color }) => (color || "#aaaabb")};
   line-height: 1.6em;
   font-size: 13px;
   margin-bottom: 20px;
diff --git a/dashboard/src/components/form-components/InputRow.tsx b/dashboard/src/components/form-components/InputRow.tsx
index f4c8ffeb24..67e75d132b 100644
--- a/dashboard/src/components/form-components/InputRow.tsx
+++ b/dashboard/src/components/form-components/InputRow.tsx
@@ -1,4 +1,4 @@
-import React, { ChangeEvent, Component } from "react";
+import React, { type ChangeEvent, Component } from "react";
 import Tooltip from "@material-ui/core/Tooltip";
 import styled from "styled-components";
 
@@ -36,7 +36,7 @@ export default class InputRow extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { label, value, type, unit, placeholder, width, info } = this.props;
+    const { label, value, type, unit, placeholder, width, info } = this.props;
     return (
       <StyledInputRow className={this.props.className}>
         {(label || info) && (
@@ -69,7 +69,7 @@ export default class InputRow extends Component<PropsType, StateType> {
         <InputWrapper hasError={this.props.hasError} width={width}>
           <Input
             readOnly={this.state.readOnly}
-            onFocus={() => this.setState({ readOnly: false })}
+            onFocus={() => { this.setState({ readOnly: false }); }}
             disabled={this.props.disabled}
             placeholder={placeholder}
             width={width}
diff --git a/dashboard/src/components/form-components/KeyValueArray.tsx b/dashboard/src/components/form-components/KeyValueArray.tsx
index c90dd902f7..43453218b1 100644
--- a/dashboard/src/components/form-components/KeyValueArray.tsx
+++ b/dashboard/src/components/form-components/KeyValueArray.tsx
@@ -40,7 +40,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
   };
 
   componentDidMount() {
-    let arr = [] as any[];
+    const arr = [] as any[];
     if (this.props.values) {
       Object.keys(this.props.values).forEach((key: string, i: number) => {
         arr.push({ key, value: this.props.values[key] });
@@ -50,7 +50,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
   }
 
   valuesToObject = () => {
-    let obj = {} as any;
+    const obj = {} as any;
     const rg = /(?:^|[^\\])(\\n)/g;
     const fixNewlines = (s: string) => {
       while (rg.test(s)) {
@@ -87,7 +87,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
             this.state.values.splice(i, 1);
             this.setState({ values: this.state.values });
 
-            let obj = this.valuesToObject();
+            const obj = this.valuesToObject();
             this.props.setValues(obj);
           }}
         >
@@ -129,7 +129,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
                   this.state.values[i].key = e.target.value;
                   this.setState({ values: this.state.values });
 
-                  let obj = this.valuesToObject();
+                  const obj = this.valuesToObject();
                   this.props.setValues(obj);
                 }}
                 disabled={
@@ -156,7 +156,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
                     this.state.values[i].value = e.target.value;
                     this.setState({ values: this.state.values });
 
-                    let obj = this.valuesToObject();
+                    const obj = this.valuesToObject();
                     this.props.setValues(obj);
                   }}
                   disabled={
@@ -179,7 +179,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
     if (this.state.showEnvModal) {
       return (
         <Modal
-          onRequestClose={() => this.setState({ showEnvModal: false })}
+          onRequestClose={() => { this.setState({ showEnvModal: false }); }}
           width="765px"
           height="542px"
         >
@@ -187,7 +187,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
             existingValues={this.props.values}
             namespace={this.props.externalValues?.namespace}
             clusterId={this.props.externalValues?.clusterId}
-            closeModal={() => this.setState({ showEnvModal: false })}
+            closeModal={() => { this.setState({ showEnvModal: false }); }}
             setValues={(values) => {
               const newValues = { ...this.props.values, ...values };
               this.props.setValues(newValues);
@@ -204,13 +204,13 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
     if (this.state.showEditorModal) {
       return (
         <Modal
-          onRequestClose={() => this.setState({ showEditorModal: false })}
+          onRequestClose={() => { this.setState({ showEditorModal: false }); }}
           width="60%"
           height="80%"
         >
           <EnvEditorModal
-            closeModal={() => this.setState({ showEditorModal: false })}
-            setEnvVariables={(envFile: string) => this.readFile(envFile)}
+            closeModal={() => { this.setState({ showEditorModal: false }); }}
+            setEnvVariables={(envFile: string) => { this.readFile(envFile); }}
           />
         </Modal>
       );
@@ -218,14 +218,14 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
   };
 
   readFile = (env: string) => {
-    let envObj = dotenv_parse(env);
+    const envObj = dotenv_parse(env);
     let push = true;
 
-    for (let key in envObj) {
-      for (var i = 0; i < this.state.values.length; i++) {
-        let existingKey = this.state.values[i]["key"];
+    for (const key in envObj) {
+      for (let i = 0; i < this.state.values.length; i++) {
+        const existingKey = this.state.values[i].key;
         if (key === existingKey) {
-          this.state.values[i]["value"] = envObj[key];
+          this.state.values[i].value = envObj[key];
           push = false;
         }
       }
@@ -236,7 +236,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
     }
 
     this.setState({ values: this.state.values }, () => {
-      let obj = this.valuesToObject();
+      const obj = this.valuesToObject();
       this.props.setValues(obj);
     });
   };
@@ -263,7 +263,7 @@ export default class KeyValueArray extends Component<PropsType, StateType> {
               {this.props.externalValues?.namespace && this.props.envLoader && (
                 <LoadButton
                   onClick={() =>
-                    this.setState({ showEnvModal: !this.state.showEnvModal })
+                    { this.setState({ showEnvModal: !this.state.showEnvModal }); }
                   }
                 >
                   <img src={sliders} /> Load from Env Group
diff --git a/dashboard/src/components/form-components/SelectRow.tsx b/dashboard/src/components/form-components/SelectRow.tsx
index b6eef06ac8..bd75bd1630 100644
--- a/dashboard/src/components/form-components/SelectRow.tsx
+++ b/dashboard/src/components/form-components/SelectRow.tsx
@@ -1,13 +1,13 @@
 import React, { Component } from "react";
 import styled from "styled-components";
 
-import Selector, { SelectorPropsType } from "../Selector";
+import Selector, { type SelectorPropsType } from "../Selector";
 
 type PropsType<T> = {
   label: string;
   value: T;
   setActiveValue: (x: T) => void;
-  options: { value: T; label: string }[];
+  options: Array<{ value: T; label: string }>;
   displayFlex?: boolean;
   dropdownLabel?: string;
   width?: string;
@@ -25,7 +25,7 @@ export default function SelectRow<T>(props: PropsType<T>) {
       <Wrapper>
         <Label displayFlex={props.displayFlex}>{props.label}</Label>
         {props.doc ? (
-          <a href={props.doc} target="_blank">
+          <a href={props.doc} target="_blank" rel="noreferrer">
             <i className="material-icons">help_outline</i>
           </a>
         ) : null}
diff --git a/dashboard/src/components/form-components/TextArea.tsx b/dashboard/src/components/form-components/TextArea.tsx
index 0d3cf1cde9..6bedffc18a 100644
--- a/dashboard/src/components/form-components/TextArea.tsx
+++ b/dashboard/src/components/form-components/TextArea.tsx
@@ -18,7 +18,7 @@ export default class TextArea extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { label, value, placeholder, width } = this.props;
+    const { label, value, placeholder, width } = this.props;
     return (
       <StyledTextArea>
         <Label>{label}</Label>
diff --git a/dashboard/src/components/form-components/UploadArea.tsx b/dashboard/src/components/form-components/UploadArea.tsx
index 387b9c5593..6b7cf977c1 100644
--- a/dashboard/src/components/form-components/UploadArea.tsx
+++ b/dashboard/src/components/form-components/UploadArea.tsx
@@ -19,6 +19,7 @@ export default class UploadArea extends Component<PropsType, StateType> {
   state = {
     fileName: "",
   };
+
   handleChange = (e: any) => {
     this.props.setValue(e.target.value);
   };
@@ -26,7 +27,7 @@ export default class UploadArea extends Component<PropsType, StateType> {
   readFile = (file: File) => {
     const reader = new FileReader();
     reader.onload = async (e) => {
-      let text = e.target?.result as string;
+      const text = e.target?.result as string;
       this.props.setValue(text);
     };
     reader.readAsText(file, "UTF-8");
diff --git a/dashboard/src/components/image-selector/ImageList.tsx b/dashboard/src/components/image-selector/ImageList.tsx
index 83f1b470c6..f751db7ef8 100644
--- a/dashboard/src/components/image-selector/ImageList.tsx
+++ b/dashboard/src/components/image-selector/ImageList.tsx
@@ -4,7 +4,7 @@ import styled from "styled-components";
 import api from "shared/api";
 import { integrationList } from "shared/common";
 import { Context } from "shared/Context";
-import { ImageType } from "shared/types";
+import { type ImageType } from "shared/types";
 
 import Loading from "../Loading";
 import TagList from "./TagList";
@@ -51,14 +51,14 @@ export default class ImageList extends Component<PropsType, StateType> {
   // TODO: Try to unhook before unmount
   componentDidMount() {
     const { currentProject, setCurrentError } = this.context;
-    let images = [] as ImageType[];
-    let errors = [] as number[];
+    const images = [] as ImageType[];
+    const errors = [] as number[];
 
     if (!this.props.registry) {
       api
         .getProjectRegistries("<token>", {}, { id: currentProject?.id })
         .then((res) => {
-          let registries = res.data;
+          const registries = res.data;
           if (registries.length === 0) {
             this.setState({ loading: false });
           }
@@ -81,7 +81,7 @@ export default class ImageList extends Component<PropsType, StateType> {
                       a.name > b.name ? 1 : -1
                     );
                     // Loop over found image repositories
-                    let newImg = res.data.map((img: any) => {
+                    const newImg = res.data.map((img: any) => {
                       if (this.props.selectedImageUrl === img.uri) {
                         this.props.setClickedImage({
                           kind: registry.service,
@@ -103,12 +103,10 @@ export default class ImageList extends Component<PropsType, StateType> {
                   .catch((err) => errors.push(1))
                   .finally(() => {
                     if (i == registries.length - 1) {
-                      let error =
+                      const error =
                         errors.reduce((a, b) => {
                           return a + b;
-                        }) == registries.length
-                          ? true
-                          : false;
+                        }) == registries.length;
 
                       this.setState({
                         images,
@@ -143,7 +141,7 @@ export default class ImageList extends Component<PropsType, StateType> {
         .then((res) => {
           res.data.sort((a: any, b: any) => (a.name > b.name ? 1 : -1));
           // Loop over found image repositories
-          let newImg = res.data.map((img: any) => {
+          const newImg = res.data.map((img: any) => {
             if (this.props.selectedImageUrl === img.uri) {
               this.props.setClickedImage({
                 kind: this.props.registry.service,
@@ -168,16 +166,16 @@ export default class ImageList extends Component<PropsType, StateType> {
           });
         })
         .catch((err) =>
-          this.setState({
+          { this.setState({
             loading: false,
             error: true,
-          })
+          }); }
         );
     }
   }
 
   renderImageList = () => {
-    let { images, loading, error } = this.state;
+    const { images, loading, error } = this.state;
 
     if (loading) {
       return (
@@ -193,9 +191,9 @@ export default class ImageList extends Component<PropsType, StateType> {
 
     return images.map((image: ImageType, i: number) => {
       let icon =
-        integrationList[image.kind] && integrationList[image.kind].icon;
+        integrationList[image.kind]?.icon;
       if (!icon) {
-        icon = integrationList["dockerhub"].icon;
+        icon = integrationList.dockerhub.icon;
       }
       return (
         <ImageItem
@@ -215,7 +213,7 @@ export default class ImageList extends Component<PropsType, StateType> {
   };
 
   renderBackButton = () => {
-    let { setSelectedImageUrl, clickedImage, disableImageSelect } = this.props;
+    const { setSelectedImageUrl, clickedImage, disableImageSelect } = this.props;
     if (clickedImage && !disableImageSelect) {
       return (
         <BackButton
@@ -233,7 +231,7 @@ export default class ImageList extends Component<PropsType, StateType> {
   };
 
   renderExpanded = () => {
-    let { selectedTag, selectedImageUrl, setSelectedTag } = this.props;
+    const { selectedTag, selectedImageUrl, setSelectedTag } = this.props;
 
     if (this.props.readOnly && this.props.clickedImage) {
       return (
diff --git a/dashboard/src/components/image-selector/ImageSelector.tsx b/dashboard/src/components/image-selector/ImageSelector.tsx
index 64ce28ee9b..b3ad0b83fd 100644
--- a/dashboard/src/components/image-selector/ImageSelector.tsx
+++ b/dashboard/src/components/image-selector/ImageSelector.tsx
@@ -5,7 +5,7 @@ import edit from "assets/edit.svg";
 
 import { integrationList } from "shared/common";
 import { Context } from "shared/Context";
-import { ImageType } from "shared/types";
+import { type ImageType } from "shared/types";
 
 import Loading from "../Loading";
 import ImageList from "./ImageList";
@@ -50,7 +50,7 @@ export default class ImageSelector extends Component<PropsType, StateType> {
   };
 
   renderImageList = () => {
-    let { images, loading, error } = this.state;
+    const { images, loading, error } = this.state;
 
     if (loading) {
       return (
@@ -66,9 +66,9 @@ export default class ImageSelector extends Component<PropsType, StateType> {
 
     return images.map((image: ImageType, i: number) => {
       let icon =
-        integrationList[image.kind] && integrationList[image.kind].icon;
+        integrationList[image.kind]?.icon;
       if (!icon) {
-        icon = integrationList["dockerhub"].icon;
+        icon = integrationList.dockerhub.icon;
       }
       return (
         <ImageItem
@@ -88,16 +88,15 @@ export default class ImageSelector extends Component<PropsType, StateType> {
   };
 
   renderSelected = () => {
-    let { selectedImageUrl, setSelectedImageUrl } = this.props;
-    let { clickedImage } = this.state;
+    const { selectedImageUrl, setSelectedImageUrl } = this.props;
+    const { clickedImage } = this.state;
     let icon = info;
     if (clickedImage) {
       icon = clickedImage.kind;
       icon =
-        integrationList[clickedImage.kind] &&
-        integrationList[clickedImage.kind].icon;
+        integrationList[clickedImage.kind]?.icon;
       if (!icon) {
-        icon = integrationList["dockerhub"].icon;
+        icon = integrationList.dockerhub.icon;
       }
     } else if (selectedImageUrl && selectedImageUrl !== "") {
       icon = edit;
@@ -151,7 +150,7 @@ export default class ImageSelector extends Component<PropsType, StateType> {
             setSelectedImageUrl={this.props.setSelectedImageUrl}
             setSelectedTag={this.props.setSelectedTag}
             setClickedImage={(x: ImageType) =>
-              this.setState({ clickedImage: x })
+              { this.setState({ clickedImage: x }); }
             }
             readOnly
           />
@@ -184,7 +183,7 @@ export default class ImageSelector extends Component<PropsType, StateType> {
             setSelectedImageUrl={this.props.setSelectedImageUrl}
             setSelectedTag={this.props.setSelectedTag}
             setClickedImage={(x: ImageType) =>
-              this.setState({ clickedImage: x })
+              { this.setState({ clickedImage: x }); }
             }
           />
         ) : null}
diff --git a/dashboard/src/components/image-selector/TagList.tsx b/dashboard/src/components/image-selector/TagList.tsx
index d82bbbd316..649ece9ae4 100644
--- a/dashboard/src/components/image-selector/TagList.tsx
+++ b/dashboard/src/components/image-selector/TagList.tsx
@@ -8,7 +8,7 @@ import { Context } from "shared/Context";
 
 import Loading from "../Loading";
 
-var ecrRepoRegex = /(^[a-zA-Z0-9][a-zA-Z0-9-_]*)\.dkr\.ecr(\-fips)?\.([a-zA-Z0-9][a-zA-Z0-9-_]*)\.amazonaws\.com(\.cn)?/gim;
+const ecrRepoRegex = /(^[a-zA-Z0-9][a-zA-Z0-9-_]*)\.dkr\.ecr(\-fips)?\.([a-zA-Z0-9][a-zA-Z0-9-_]*)\.amazonaws\.com(\.cn)?/gim;
 
 type PropsType =
   | {
@@ -45,7 +45,7 @@ export default class TagList extends Component<PropsType, StateType> {
     this.setState({ loading: true });
     const { currentProject } = this.context;
 
-    let splits = this.props.selectedImageUrl.split("/");
+    const splits = this.props.selectedImageUrl.split("/");
     let repoName: string;
 
     if (this.props.selectedImageUrl.includes("pkg.dev")) {
@@ -54,7 +54,7 @@ export default class TagList extends Component<PropsType, StateType> {
       repoName = splits[splits.length - 1];
     }
 
-    let matches = this.props.selectedImageUrl.match(ecrRepoRegex);
+    const matches = this.props.selectedImageUrl.match(ecrRepoRegex);
 
     if (matches) {
       repoName = this.props.selectedImageUrl.split(/\/(.+)/)[1];
@@ -75,8 +75,8 @@ export default class TagList extends Component<PropsType, StateType> {
         // Sort if timestamp is available
         if (res.data.length > 0 && res.data[0].pushed_at) {
           tags = tags.sort((a: any, b: any) => {
-            let d1 = new Date(a.pushed_at);
-            let d2 = new Date(b.pushed_at);
+            const d1 = new Date(a.pushed_at);
+            const d2 = new Date(b.pushed_at);
             return d2.getTime() - d1.getTime();
           });
         }
@@ -99,13 +99,13 @@ export default class TagList extends Component<PropsType, StateType> {
   }
 
   setTag = (tag: string) => {
-    let { selectedTag, setSelectedTag } = this.props;
+    const { selectedTag, setSelectedTag } = this.props;
     setSelectedTag(tag);
     this.setState({ currentTag: tag });
   };
 
   renderTagList = () => {
-    let { tags, loading, error } = this.state;
+    const { tags, loading, error } = this.state;
     if (loading) {
       return (
         <LoadingWrapper>
@@ -124,7 +124,7 @@ export default class TagList extends Component<PropsType, StateType> {
           key={i}
           isSelected={tag === this.state.currentTag}
           lastItem={i === tags.length - 1}
-          onClick={() => this.setTag(tag)}
+          onClick={() => { this.setTag(tag); }}
         >
           <img src={tag_icon} />
           {tag}
diff --git a/dashboard/src/components/porter-form/FormDebugger.tsx b/dashboard/src/components/porter-form/FormDebugger.tsx
index bc14eb7be4..5b1b069bf1 100644
--- a/dashboard/src/components/porter-form/FormDebugger.tsx
+++ b/dashboard/src/components/porter-form/FormDebugger.tsx
@@ -11,7 +11,7 @@ import "ace-builds/src-noconflict/mode-text";
 
 import Heading from "../form-components/Heading";
 import Helper from "../form-components/Helper";
-import { ChartType } from "shared/types";
+import { type ChartType } from "shared/types";
 
 type PropsType = {
   goBack: () => void;
@@ -78,7 +78,7 @@ export default class FormDebugger extends Component<PropsType, StateType> {
             mode="yaml"
             value={this.state.rawYaml}
             theme="porter"
-            onChange={(e: string) => this.setState({ rawYaml: e })}
+            onChange={(e: string) => { this.setState({ rawYaml: e }); }}
             name="codeEditor"
             editorProps={{ $blockScrolling: true }}
             height="450px"
@@ -99,30 +99,30 @@ export default class FormDebugger extends Component<PropsType, StateType> {
           label="Show form state debugger"
           checked={this.state.showStateDebugger}
           toggle={() =>
-            this.setState({ showStateDebugger: !this.state.showStateDebugger })
+            { this.setState({ showStateDebugger: !this.state.showStateDebugger }); }
           }
         />
         <CheckboxRow
           label="Read-only"
           checked={this.state.isReadOnly}
           toggle={() =>
-            this.setState({
+            { this.setState({
               isReadOnly: !this.state.isReadOnly,
-            })
+            }); }
           }
         />
         <CheckboxRow
           label="Include non-form dummy tabs"
           checked={this.state.showBonusTabs}
           toggle={() =>
-            this.setState({ showBonusTabs: !this.state.showBonusTabs })
+            { this.setState({ showBonusTabs: !this.state.showBonusTabs }); }
           }
         />
         <CheckboxRow
           label="checkbox_a"
           checked={this.state.checkbox_a}
           toggle={() =>
-            this.setState({
+            { this.setState({
               checkbox_a: !this.state.checkbox_a,
 
               // Override the form value for checkbox_a
@@ -132,14 +132,14 @@ export default class FormDebugger extends Component<PropsType, StateType> {
                   value: !this.state.checkbox_a,
                 },
               },
-            })
+            }); }
           }
         />
         <InputRow
           type="string"
           value={this.state.input_a}
           setValue={(x: string) =>
-            this.setState({
+            { this.setState({
               input_a: x,
 
               // Override the form value for input_a
@@ -149,7 +149,7 @@ export default class FormDebugger extends Component<PropsType, StateType> {
                   value: x,
                 },
               },
-            })
+            }); }
           }
           label={"input_a"}
           placeholder="ex: override text"
diff --git a/dashboard/src/components/porter-form/PorterForm.tsx b/dashboard/src/components/porter-form/PorterForm.tsx
index ad84869a2a..62d4f98bfc 100644
--- a/dashboard/src/components/porter-form/PorterForm.tsx
+++ b/dashboard/src/components/porter-form/PorterForm.tsx
@@ -1,22 +1,22 @@
 import React, { useContext } from "react";
 import {
-  ArrayInputField,
-  CheckboxField,
-  CronField,
-  FormField,
-  InjectedProps,
-  InputField,
-  KeyValueArrayField,
-  ResourceListField,
-  Section,
-  SelectField,
-  ServiceIPListField,
-  TextAreaField,
-  UrlLinkField,
-  DictionaryField,
-  DictionaryArrayField,
+  type ArrayInputField,
+  type CheckboxField,
+  type CronField,
+  type FormField,
+  type InjectedProps,
+  type InputField,
+  type KeyValueArrayField,
+  type ResourceListField,
+  type Section,
+  type SelectField,
+  type ServiceIPListField,
+  type TextAreaField,
+  type UrlLinkField,
+  type DictionaryField,
+  type DictionaryArrayField,
 } from "./types";
-import TabRegion, { TabOption } from "../TabRegion";
+import TabRegion, { type TabOption } from "../TabRegion";
 import Heading from "../form-components/Heading";
 import Helper from "../form-components/Helper";
 import Input from "./field-components/Input";
@@ -37,7 +37,7 @@ import Button from "components/porter/Button";
 import DictionaryArray from "./field-components/DictionaryArray";
 import Dictionary from "./field-components/Dictionary";
 
-interface Props {
+type Props = {
   leftTabOptions?: TabOption[];
   rightTabOptions?: TabOption[];
   renderTabContents?: (
@@ -135,7 +135,7 @@ const PorterForm: React.FC<Props> = (props) => {
   };
 
   const getTabOptions = (): TabOption[] => {
-    let options = (props.leftTabOptions || [])
+    const options = (props.leftTabOptions || [])
       .concat(
         formData?.tabs?.map((tab) => {
           if (props.isLaunch && tab?.settings?.omitFromLaunch) {
diff --git a/dashboard/src/components/porter-form/PorterFormContextProvider.tsx b/dashboard/src/components/porter-form/PorterFormContextProvider.tsx
index 438cdea3b8..c70000dc3d 100644
--- a/dashboard/src/components/porter-form/PorterFormContextProvider.tsx
+++ b/dashboard/src/components/porter-form/PorterFormContextProvider.tsx
@@ -1,19 +1,19 @@
 import React, { createContext, useContext, useReducer } from "react";
 import {
-  GetFinalVariablesFunction,
-  GetMetadataFunction,
-  PorterFormAction,
-  PorterFormData,
-  PorterFormState,
-  PorterFormValidationInfo,
-  PorterFormVariableList,
+  type GetFinalVariablesFunction,
+  type GetMetadataFunction,
+  type PorterFormAction,
+  type PorterFormData,
+  type PorterFormState,
+  type PorterFormValidationInfo,
+  type PorterFormVariableList,
 } from "./types";
 import {
-  ShowIf,
-  ShowIfAnd,
-  ShowIfIs,
-  ShowIfNot,
-  ShowIfOr,
+  type ShowIf,
+  type ShowIfAnd,
+  type ShowIfIs,
+  type ShowIfNot,
+  type ShowIfOr,
 } from "../../shared/types";
 import { getFinalVariablesForStringInput } from "./field-components/Input";
 import {
@@ -25,7 +25,7 @@ import { getFinalVariablesForArrayInput } from "./field-components/ArrayInput";
 import { getFinalVariablesForCheckbox } from "./field-components/Checkbox";
 import { getFinalVariablesForSelect } from "./field-components/Select";
 
-export interface BaseProps {
+export type BaseProps = {
   rawFormData: PorterFormData;
   initialVariables?: PorterFormVariableList;
   overrideVariables?: PorterFormVariableList;
@@ -34,22 +34,22 @@ export interface BaseProps {
   doDebug?: boolean;
 }
 
-export interface PropsWithMetadata extends BaseProps {
+export type PropsWithMetadata = {
   onSubmit: (
     data: { vars: PorterFormVariableList; metadata: PorterFormVariableList },
     cb?: () => void
   ) => void;
   includeMetadata: true;
-}
+} & BaseProps
 
-export interface PropsWithoutMetadata extends BaseProps {
+export type PropsWithoutMetadata = {
   onSubmit: (vars: PorterFormVariableList, cb?: () => void) => void;
   includeMetadata: false;
-}
+} & BaseProps
 
 export type Props = PropsWithMetadata | PropsWithoutMetadata;
 
-interface ContextProps {
+type ContextProps = {
   formData: PorterFormData;
   formState: PorterFormState;
   onSubmit: (cb?: () => void) => void;
@@ -192,7 +192,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
             return;
           if (
             field.required &&
-            (field.settings?.default || (field.value && field.value[0]))
+            (field.settings?.default || (field.value?.[0]))
           ) {
             ret[`${i}-${j}-${k}`] = {
               validated: true,
@@ -221,7 +221,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
     if (!vals) {
       return false;
     }
-    if (typeof vals == "string") {
+    if (typeof vals === "string") {
       return !!variables[vals];
     }
     if ((vals as ShowIfIs).is) {
@@ -532,7 +532,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
   return (
     <Provider
       value={{
-        formData: formData,
+        formData,
         formState: state,
         dispatchAction: dispatch,
         isReadOnly: props.isReadOnly,
diff --git a/dashboard/src/components/porter-form/PorterFormWrapper.tsx b/dashboard/src/components/porter-form/PorterFormWrapper.tsx
index f097ccb967..8d146d59b8 100644
--- a/dashboard/src/components/porter-form/PorterFormWrapper.tsx
+++ b/dashboard/src/components/porter-form/PorterFormWrapper.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 
 import PorterForm from "./PorterForm";
-import { InjectedProps, PorterFormData } from "./types";
+import { type InjectedProps, type PorterFormData } from "./types";
 import { PorterFormContextProvider } from "./PorterFormContextProvider";
 import _ from "lodash";
 
@@ -11,8 +11,8 @@ type PropsType = {
   isReadOnly?: boolean;
   onSubmit?: (values: any, cb?: () => void) => void;
   renderTabContents?: (currentTab: string, submitValues?: any) => any;
-  leftTabOptions?: { value: string; label: string }[];
-  rightTabOptions?: { value: string; label: string }[];
+  leftTabOptions?: Array<{ value: string; label: string }>;
+  rightTabOptions?: Array<{ value: string; label: string }>;
   saveButtonText?: string;
   isInModal?: boolean;
   color?: string;
diff --git a/dashboard/src/components/porter-form/field-components/ArrayInput.tsx b/dashboard/src/components/porter-form/field-components/ArrayInput.tsx
index 01da488714..b360c3ead1 100644
--- a/dashboard/src/components/porter-form/field-components/ArrayInput.tsx
+++ b/dashboard/src/components/porter-form/field-components/ArrayInput.tsx
@@ -1,9 +1,9 @@
 import React from "react";
 import styled from "styled-components";
 import {
-  ArrayInputField,
-  ArrayInputFieldState,
-  GetFinalVariablesFunction,
+  type ArrayInputField,
+  type ArrayInputFieldState,
+  type GetFinalVariablesFunction,
 } from "../types";
 import useFormField from "../hooks/useFormField";
 import { hasSetValue } from "../utils";
diff --git a/dashboard/src/components/porter-form/field-components/Checkbox.tsx b/dashboard/src/components/porter-form/field-components/Checkbox.tsx
index 248c542c77..af3a6d8bb4 100644
--- a/dashboard/src/components/porter-form/field-components/Checkbox.tsx
+++ b/dashboard/src/components/porter-form/field-components/Checkbox.tsx
@@ -1,15 +1,15 @@
 import React from "react";
 import {
-  CheckboxField,
-  CheckboxFieldState,
-  GetFinalVariablesFunction,
+  type CheckboxField,
+  type CheckboxFieldState,
+  type GetFinalVariablesFunction,
 } from "../types";
 import CheckboxRow from "../../form-components/CheckboxRow";
 import useFormField from "../hooks/useFormField";
 
-interface Props extends CheckboxField {
+type Props = {
   id: string;
-}
+} & CheckboxField
 
 const Checkbox: React.FC<Props> = ({
   id,
diff --git a/dashboard/src/components/porter-form/field-components/CronInput.tsx b/dashboard/src/components/porter-form/field-components/CronInput.tsx
index 98b27ee13c..74021c3a15 100644
--- a/dashboard/src/components/porter-form/field-components/CronInput.tsx
+++ b/dashboard/src/components/porter-form/field-components/CronInput.tsx
@@ -1,7 +1,7 @@
 import InputRow from "components/form-components/InputRow";
 import React from "react";
 import useFormField from "../hooks/useFormField";
-import { CronField } from "../types";
+import { type CronField } from "../types";
 import { hasSetValue } from "../utils";
 import { isValidCron } from "cron-validator";
 import CronParser from "cronstrue";
diff --git a/dashboard/src/components/porter-form/field-components/Dictionary.tsx b/dashboard/src/components/porter-form/field-components/Dictionary.tsx
index ef19b6074e..6cda208728 100644
--- a/dashboard/src/components/porter-form/field-components/Dictionary.tsx
+++ b/dashboard/src/components/porter-form/field-components/Dictionary.tsx
@@ -2,9 +2,9 @@ import React, { useEffect } from "react";
 import InputRow from "../../form-components/InputRow";
 import useFormField from "../hooks/useFormField";
 import {
-  GetFinalVariablesFunction,
-  DictionaryField,
-  DictionaryFieldState,
+  type GetFinalVariablesFunction,
+  type DictionaryField,
+  type DictionaryFieldState,
 } from "../types";
 import DictionaryEditor from "components/porter/DictionaryEditor";
 import { hasSetValue } from "../utils";
@@ -28,7 +28,7 @@ const Dictionary: React.FC<DictionaryField> = (props) => {
 
   return (
     <DictionaryEditor
-      value={props?.value && props.value[0]}
+      value={props?.value?.[0]}
       onChange={(x: any) => {
         setVars((vars) => {
           return {
diff --git a/dashboard/src/components/porter-form/field-components/DictionaryArray.tsx b/dashboard/src/components/porter-form/field-components/DictionaryArray.tsx
index b79827e509..9f788ae98e 100644
--- a/dashboard/src/components/porter-form/field-components/DictionaryArray.tsx
+++ b/dashboard/src/components/porter-form/field-components/DictionaryArray.tsx
@@ -1,9 +1,9 @@
 import React from "react";
 import styled from "styled-components";
 import {
-  DictionaryArrayField,
-  DictionaryArrayFieldState,
-  GetFinalVariablesFunction,
+  type DictionaryArrayField,
+  type DictionaryArrayFieldState,
+  type GetFinalVariablesFunction,
 } from "../types";
 import useFormField from "../hooks/useFormField";
 import { hasSetValue } from "../utils";
diff --git a/dashboard/src/components/porter-form/field-components/Input.tsx b/dashboard/src/components/porter-form/field-components/Input.tsx
index ad443dba62..77b6438bc8 100644
--- a/dashboard/src/components/porter-form/field-components/Input.tsx
+++ b/dashboard/src/components/porter-form/field-components/Input.tsx
@@ -2,9 +2,9 @@ import React from "react";
 import InputRow from "../../form-components/InputRow";
 import useFormField from "../hooks/useFormField";
 import {
-  GetFinalVariablesFunction,
-  InputField,
-  StringInputFieldState,
+  type GetFinalVariablesFunction,
+  type InputField,
+  type StringInputFieldState,
 } from "../types";
 import { hasSetValue } from "../utils";
 
diff --git a/dashboard/src/components/porter-form/field-components/KeyValueArray.tsx b/dashboard/src/components/porter-form/field-components/KeyValueArray.tsx
index df94432e3b..91201f6633 100644
--- a/dashboard/src/components/porter-form/field-components/KeyValueArray.tsx
+++ b/dashboard/src/components/porter-form/field-components/KeyValueArray.tsx
@@ -1,11 +1,11 @@
 import React, { useContext, useEffect, useState } from "react";
 import {
-  GetFinalVariablesFunction,
-  GetMetadataFunction,
-  KeyValueArrayField,
-  KeyValueArrayFieldState,
-  PartialEnvGroup,
-  PopulatedEnvGroup,
+  type GetFinalVariablesFunction,
+  type GetMetadataFunction,
+  type KeyValueArrayField,
+  type KeyValueArrayFieldState,
+  type PartialEnvGroup,
+  type PopulatedEnvGroup,
 } from "../types";
 import sliders from "../../../assets/sliders.svg";
 import upload from "../../../assets/upload.svg";
@@ -23,9 +23,9 @@ import api from "shared/api";
 import { Context } from "shared/Context";
 import { dotenv_parse } from "shared/string_utils";
 
-interface Props extends KeyValueArrayField {
+type Props = {
   id: string;
-}
+} & KeyValueArrayField
 
 const KeyValueArray: React.FC<Props> = (props) => {
   const { state, setState, variables } = useFormField<KeyValueArrayFieldState>(
@@ -134,14 +134,14 @@ const KeyValueArray: React.FC<Props> = (props) => {
   };
 
   const readFile = (env: string) => {
-    let envObj = parseEnv(env, null);
+    const envObj = parseEnv(env, null);
     let push = true;
 
-    for (let key in envObj) {
-      for (var i = 0; i < state.values.length; i++) {
-        let existingKey = state.values[i]["key"];
+    for (const key in envObj) {
+      for (let i = 0; i < state.values.length; i++) {
+        const existingKey = state.values[i].key;
         if (key === existingKey) {
-          state.values[i]["value"] = envObj[key];
+          state.values[i].value = envObj[key];
           push = false;
         }
       }
@@ -161,20 +161,20 @@ const KeyValueArray: React.FC<Props> = (props) => {
       return (
         <Modal
           onRequestClose={() =>
-            setState(() => {
+            { setState(() => {
               return { showEditorModal: false };
-            })
+            }); }
           }
           width="60%"
           height="80%"
         >
           <EnvEditorModal
             closeModal={() =>
-              setState(() => {
+              { setState(() => {
                 return { showEditorModal: false };
-              })
+              }); }
             }
-            setEnvVariables={(envFile: string) => readFile(envFile)}
+            setEnvVariables={(envFile: string) => { readFile(envFile); }}
           />
         </Modal>
       );
@@ -182,9 +182,9 @@ const KeyValueArray: React.FC<Props> = (props) => {
   };
 
   const getProcessedValues = (
-    objectArray: { key: string; value: string }[]
+    objectArray: Array<{ key: string; value: string }>
   ): any => {
-    let obj = {} as any;
+    const obj = {} as any;
     objectArray?.forEach(({ key, value }) => {
       obj[key] = value;
     });
@@ -196,9 +196,9 @@ const KeyValueArray: React.FC<Props> = (props) => {
       return (
         <Modal
           onRequestClose={() =>
-            setState(() => {
+            { setState(() => {
               return { showEnvModal: false };
-            })
+            }); }
           }
           width="800px"
           height="542px"
@@ -211,11 +211,11 @@ const KeyValueArray: React.FC<Props> = (props) => {
             namespace={variables.namespace}
             clusterId={variables.clusterId}
             closeModal={() =>
-              setState(() => {
+              { setState(() => {
                 return {
                   showEnvModal: false,
                 };
-              })
+              }); }
             }
             setSyncedEnvGroups={(value) => {
               setState((prev) => {
@@ -227,10 +227,10 @@ const KeyValueArray: React.FC<Props> = (props) => {
             setValues={(values) => {
               setState((prev) => {
                 // Transform array to object similar on what we receive from setValues
-                const prevValues = prev.values.reduce((acc, currentValue) => {
+                const prevValues = prev.values.reduce<Record<string, string>>((acc, currentValue) => {
                   acc[currentValue.key] = currentValue.value;
                   return acc;
-                }, {} as Record<string, string>);
+                }, {});
 
                 // Deconstruct the two records/objects inside one to merge their values (this will override the old duped vars too)
                 // and convert the new object back to an array usable for the component
@@ -414,11 +414,11 @@ const KeyValueArray: React.FC<Props> = (props) => {
             {variables.namespace && props.envLoader && (
               <LoadButton
                 onClick={() =>
-                  setState((prev) => {
+                  { setState((prev) => {
                     return {
                       showEnvModal: !prev.showEnvModal,
                     };
-                  })
+                  }); }
                 }
               >
                 <img src={sliders} /> Load from Env Group
@@ -499,7 +499,7 @@ export const getFinalVariablesForKeyValueArray: GetFinalVariablesFunction = (
   };
 
   if (props.variable.includes("env")) {
-    let obj = {
+    const obj = {
       normal: {},
     } as any;
 
@@ -537,7 +537,7 @@ export const getFinalVariablesForKeyValueArray: GetFinalVariablesFunction = (
       [variable]: obj,
     };
   } else {
-    let obj = {} as any;
+    const obj = {} as any;
 
     state.values.forEach((entry: any, i: number) => {
       if (isNumber(entry.value)) {
@@ -552,12 +552,10 @@ export const getFinalVariablesForKeyValueArray: GetFinalVariablesFunction = (
   }
 };
 
-type KeyValueArrayMetadata = {
-  [variable: string]: {
-    added: { name: string }[];
-    deleted: { name: string }[];
-  };
-};
+type KeyValueArrayMetadata = Record<string, {
+    added: Array<{ name: string }>;
+    deleted: Array<{ name: string }>;
+  }>;
 
 export const getMetadata: GetMetadataFunction<KeyValueArrayMetadata> = (
   vars,
@@ -571,11 +569,11 @@ export const getMetadata: GetMetadataFunction<KeyValueArrayMetadata> = (
     };
   }
 
-  const originalSyncedEnvGroups: { name: string }[] =
+  const originalSyncedEnvGroups: Array<{ name: string }> =
     props.value[0]?.synced || [];
   const currSynced = state?.synced_env_groups || [];
 
-  let obj: KeyValueArrayMetadata[""] = {
+  const obj: KeyValueArrayMetadata[""] = {
     added: [],
     deleted: [],
   };
@@ -614,10 +612,10 @@ const ExpandableEnvGroup: React.FC<{
             </EventInformation>
           </ContentContainer>
           <ActionContainer>
-            <ActionButton onClick={() => onDelete()}>
+            <ActionButton onClick={() => { onDelete(); }}>
               <span className="material-icons">delete</span>
             </ActionButton>
-            <ActionButton onClick={() => setIsExpanded((prev) => !prev)}>
+            <ActionButton onClick={() => { setIsExpanded((prev) => !prev); }}>
               <i className="material-icons">
                 {isExpanded ? "arrow_drop_up" : "arrow_drop_down"}
               </i>
diff --git a/dashboard/src/components/porter-form/field-components/MultiSelect.tsx b/dashboard/src/components/porter-form/field-components/MultiSelect.tsx
index 20fe38aff8..bfd64f5292 100644
--- a/dashboard/src/components/porter-form/field-components/MultiSelect.tsx
+++ b/dashboard/src/components/porter-form/field-components/MultiSelect.tsx
@@ -4,12 +4,12 @@ import styled from "styled-components";
 type PropsType = {};
 
 type StateType = {
-  options: { label: string; value: string }[];
+  options: Array<{ label: string; value: string }>;
 };
 
 export default class MultiSelect extends Component<PropsType, StateType> {
   state = {
-    options: [] as { label: string; value: string }[],
+    options: [] as Array<{ label: string; value: string }>,
   };
 
   renderOptions = () => {};
diff --git a/dashboard/src/components/porter-form/field-components/ResourceList.tsx b/dashboard/src/components/porter-form/field-components/ResourceList.tsx
index cc542e99c9..8c9019ba10 100644
--- a/dashboard/src/components/porter-form/field-components/ResourceList.tsx
+++ b/dashboard/src/components/porter-form/field-components/ResourceList.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useContext, useState } from "react";
-import { ResourceListField } from "../types";
+import { type ResourceListField } from "../types";
 import { Context } from "shared/Context";
 import { useWebsockets } from "shared/hooks/useWebsockets";
 import ExpandableResource from "../../ExpandableResource";
@@ -34,18 +34,18 @@ const ResourceList: React.FC<ResourceListField> = (props) => {
       return () => { };
     }
 
-    let { group, version, resource } = props.context.config;
+    const { group, version, resource } = props.context.config;
     let apiEndpoint = `/api/projects/${currentProject.id}/clusters/${currentCluster.id}/namespaces/${formState?.variables?.namespace}/releases/${formState?.variables?.currentChart?.name}/0/form_stream?`;
     apiEndpoint += `resource=${resource}&group=${group}&version=${version}`;
 
     const wsConfig = {
       onmessage(evt: MessageEvent) {
-        let { data, kind } = JSON.parse(evt.data);
+        const { data, kind } = JSON.parse(evt.data);
 
         // parse for name and label, which uniquely identify a resource
-        for (let [key] of Object.entries(data)) {
+        for (const [key] of Object.entries(data)) {
           // check the name and label in the value
-          let { name, label } = data[key][0];
+          const { name, label } = data[key][0];
 
           // attempt to find a corresponding name and label in the current array
           let foundMatch = false;
@@ -98,8 +98,7 @@ const ResourceList: React.FC<ResourceListField> = (props) => {
             <ExpandableResource
               key={i}
               button={
-                props?.settings?.options &&
-                props?.settings?.options["resource-button"]
+                props?.settings?.options?.["resource-button"]
               }
               resource={resource}
               isLast={i === resourceList.length - 1}
diff --git a/dashboard/src/components/porter-form/field-components/Select.tsx b/dashboard/src/components/porter-form/field-components/Select.tsx
index 4cb436ca28..1a38f83705 100644
--- a/dashboard/src/components/porter-form/field-components/Select.tsx
+++ b/dashboard/src/components/porter-form/field-components/Select.tsx
@@ -1,8 +1,8 @@
 import React, { useContext } from "react";
 import {
-  GetFinalVariablesFunction,
-  SelectField,
-  SelectFieldState,
+  type GetFinalVariablesFunction,
+  type SelectField,
+  type SelectFieldState,
 } from "../types";
 import Selector from "../../Selector";
 import styled from "styled-components";
diff --git a/dashboard/src/components/porter-form/field-components/ServiceIPList.tsx b/dashboard/src/components/porter-form/field-components/ServiceIPList.tsx
index 98b6142cf5..3b390e254d 100644
--- a/dashboard/src/components/porter-form/field-components/ServiceIPList.tsx
+++ b/dashboard/src/components/porter-form/field-components/ServiceIPList.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { ServiceIPListField } from "../types";
+import { type ServiceIPListField } from "../types";
 import ServiceRow from "./ServiceRow";
 import styled from "styled-components";
 
diff --git a/dashboard/src/components/porter-form/field-components/ServiceRow.tsx b/dashboard/src/components/porter-form/field-components/ServiceRow.tsx
index 1cd9451e58..096a62ab07 100644
--- a/dashboard/src/components/porter-form/field-components/ServiceRow.tsx
+++ b/dashboard/src/components/porter-form/field-components/ServiceRow.tsx
@@ -20,7 +20,7 @@ const getIcon = (type: string) => {
   if (hardcodedIcons[type]) {
     return hardcodedIcons[type];
   }
-  return hardcodedIcons["web"];
+  return hardcodedIcons.web;
 }
 
 export default class ServiceRow extends Component<PropsType, StateType> {
diff --git a/dashboard/src/components/porter-form/field-components/TextAreaInput.tsx b/dashboard/src/components/porter-form/field-components/TextAreaInput.tsx
index 81abde558b..a7f69368be 100644
--- a/dashboard/src/components/porter-form/field-components/TextAreaInput.tsx
+++ b/dashboard/src/components/porter-form/field-components/TextAreaInput.tsx
@@ -2,7 +2,7 @@ import { Tooltip } from "@material-ui/core";
 import React from "react";
 import styled from "styled-components";
 import useFormField from "../hooks/useFormField";
-import { StringInputFieldState, TextAreaField } from "../types";
+import { type StringInputFieldState, type TextAreaField } from "../types";
 import { hasSetValue } from "../utils";
 
 const TextAreaInput: React.FC<TextAreaField> = (props) => {
diff --git a/dashboard/src/components/porter-form/field-components/UrlLink.tsx b/dashboard/src/components/porter-form/field-components/UrlLink.tsx
index 6923a3de95..534f4495af 100644
--- a/dashboard/src/components/porter-form/field-components/UrlLink.tsx
+++ b/dashboard/src/components/porter-form/field-components/UrlLink.tsx
@@ -1,7 +1,7 @@
 import { get } from "lodash";
 import React from "react";
 import styled from "styled-components";
-import { UrlLinkField } from "../types";
+import { type UrlLinkField } from "../types";
 import { hasSetValue } from "../utils";
 
 const populate = (str: string, obj: unknown) => {
@@ -49,7 +49,7 @@ const UrlLink = (props: UrlLinkField) => {
     <>
       <Label>{label}</Label>
       <StyledServiceRow>
-        <a href={populatedUrl} target="_blank">
+        <a href={populatedUrl} target="_blank" rel="noreferrer">
           <i className="material-icons-outlined">link</i>
           {populatedUrl}
         </a>
diff --git a/dashboard/src/components/porter-form/field-components/VeleroForm.tsx b/dashboard/src/components/porter-form/field-components/VeleroForm.tsx
index 352ce29b85..f58cbf8fcd 100644
--- a/dashboard/src/components/porter-form/field-components/VeleroForm.tsx
+++ b/dashboard/src/components/porter-form/field-components/VeleroForm.tsx
@@ -36,7 +36,7 @@ export default class VeleroForm extends Component<PropsType, StateType> {
           type="text"
           width="300px"
           value={this.state.name}
-          setValue={(x: string) => this.setState({ name: x })}
+          setValue={(x: string) => { this.setState({ name: x }); }}
           label="Name"
         />
         <MultiSelect />
diff --git a/dashboard/src/components/porter-form/hooks/useFormField.tsx b/dashboard/src/components/porter-form/hooks/useFormField.tsx
index 27ab8b509d..2ebc1bcf04 100644
--- a/dashboard/src/components/porter-form/hooks/useFormField.tsx
+++ b/dashboard/src/components/porter-form/hooks/useFormField.tsx
@@ -1,15 +1,15 @@
 import { useContext, useEffect } from "react";
 import { PorterFormContext } from "../PorterFormContextProvider";
 import {
-  PorterFormFieldFieldState,
-  PorterFormFieldValidationState,
-  PorterFormVariableList,
+  type PorterFormFieldFieldState,
+  type PorterFormFieldValidationState,
+  type PorterFormVariableList,
 } from "../types";
 
-interface FormFieldData<T> {
+type FormFieldData<T> = {
   state: T;
   variables: PorterFormVariableList;
-  validation: { [key: string]: PorterFormFieldValidationState };
+  validation: Record<string, PorterFormFieldValidationState>;
   setState: (setFunc: (prev: T) => Partial<T>) => void;
   setVars: (
     setFunc: (vars: PorterFormVariableList) => PorterFormVariableList
@@ -21,7 +21,7 @@ interface FormFieldData<T> {
   ) => void;
 }
 
-interface Options<T> {
+type Options<T> = {
   initState?: T | (() => T);
   initValidation?: Partial<PorterFormFieldValidationState>;
   initVars?: PorterFormVariableList;
diff --git a/dashboard/src/components/porter-form/utils.ts b/dashboard/src/components/porter-form/utils.ts
index 998227d448..2355ed5699 100644
--- a/dashboard/src/components/porter-form/utils.ts
+++ b/dashboard/src/components/porter-form/utils.ts
@@ -1,20 +1,20 @@
 import { merge, unionBy } from "lodash";
 import { KeyValueType } from "main/home/cluster-dashboard/env-groups/EnvGroupArray";
-import { GenericInputField } from "./types";
+import { type GenericInputField } from "./types";
 
 export const hasSetValue = (field: GenericInputField) => {
   return field.value && field.value.length != 0 && field.value[0] != null;
 };
 
 export const fillWithDeletedVariables = (
-  originalValues: {
+  originalValues: Array<{
     key: string;
     value: string;
-  }[],
-  newValues: {
+  }>,
+  newValues: Array<{
     key: string;
     value: string;
-  }[]
+  }>
 ) => {
   const filledArray = originalValues.map((originalVal) => {
     const foundNewValue = newValues.find(
diff --git a/dashboard/src/components/porter/ExpandableSection.tsx b/dashboard/src/components/porter/ExpandableSection.tsx
index 83c1c862b1..f587a657c0 100644
--- a/dashboard/src/components/porter/ExpandableSection.tsx
+++ b/dashboard/src/components/porter/ExpandableSection.tsx
@@ -44,7 +44,7 @@ const ExpandableSection: React.FC<Props> = ({
           {copy ?
             (
               <CopyWrapper>
-                <ExpandButton onClick={() => setIsExpanded(!isExpanded)}>
+                <ExpandButton onClick={() => { setIsExpanded(!isExpanded); }}>
                   {isExpanded ? collapseText : expandText}
                 </ExpandButton>
                 <CopyToClipboard
@@ -59,7 +59,7 @@ const ExpandableSection: React.FC<Props> = ({
               </CopyWrapper>
             ) :
             (
-              <ExpandButton onClick={() => setIsExpanded(!isExpanded)}>
+              <ExpandButton onClick={() => { setIsExpanded(!isExpanded); }}>
                 {isExpanded ? collapseText : expandText}
               </ExpandButton>
             )
@@ -68,7 +68,7 @@ const ExpandableSection: React.FC<Props> = ({
       ) : (
         <HeaderRow
           isExpanded={isExpanded}
-          onClick={() => setIsExpanded(!isExpanded)}
+          onClick={() => { setIsExpanded(!isExpanded); }}
           color={color}
         >
           {!noWrapper && <i className="material-icons">arrow_drop_down</i>}
diff --git a/dashboard/src/components/porter/Filter.tsx b/dashboard/src/components/porter/Filter.tsx
index 33f20647fd..d31ac55af0 100644
--- a/dashboard/src/components/porter/Filter.tsx
+++ b/dashboard/src/components/porter/Filter.tsx
@@ -4,7 +4,7 @@ import Select from "./Select";
 import Spacer from "./Spacer";
 
 import filter from "assets/filter.svg";
-import { GenericFilter, FilterName } from "main/home/app-dashboard/expanded-app/logs/types";
+import { type GenericFilter, type FilterName } from "main/home/app-dashboard/expanded-app/logs/types";
 
 type Props = {
   filters: GenericFilter[];
@@ -19,9 +19,9 @@ const Filter: React.FC<Props> = ({
 
   const filterLabelString = useMemo(() => {
     let filterString = "";
-    const serviceName = selectedFilterValues["service_name"];
-    const podName = selectedFilterValues["pod_name"];
-    const revision = selectedFilterValues["revision"];
+    const serviceName = selectedFilterValues.service_name;
+    const podName = selectedFilterValues.pod_name;
+    const revision = selectedFilterValues.revision;
 
     if (serviceName && serviceName !== "all") {
       filterString += serviceName;
@@ -39,7 +39,7 @@ const Filter: React.FC<Props> = ({
 
   return (
     <Relative>
-      <StyledFilter onClick={() => setIsExpanded(!isExpanded)}>
+      <StyledFilter onClick={() => { setIsExpanded(!isExpanded); }}>
         <img src={filter} />
         Filter
         {filterLabelString !== "" && (
@@ -50,7 +50,7 @@ const Filter: React.FC<Props> = ({
           </>
         )}
       </StyledFilter>
-      <CloseOverlay onClick={() => setIsExpanded(false)} isExpanded={isExpanded} />
+      <CloseOverlay onClick={() => { setIsExpanded(false); }} isExpanded={isExpanded} />
       <Dropdown isExpanded={isExpanded}>
         {filters.map((filter: GenericFilter, i: number) => {
           return (
diff --git a/dashboard/src/components/porter/InputSlider.tsx b/dashboard/src/components/porter/InputSlider.tsx
index 90576530a5..9f6a290f0e 100644
--- a/dashboard/src/components/porter/InputSlider.tsx
+++ b/dashboard/src/components/porter/InputSlider.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import Slider, { Mark } from '@material-ui/core/Slider';
+import Slider, { type Mark } from '@material-ui/core/Slider';
 import Tooltip from '@material-ui/core/Tooltip';
 import Typography from '@material-ui/core/Typography';
 import styled from 'styled-components';
@@ -66,9 +66,9 @@ const InputSlider: React.FC<InputSliderProps> = ({
       label: max.toString(),
     },
   ];
-  var isExceedingLimit = false;
-  var displayOptimalText = false;
-  //Optimal Marks only give useful information to user if they are using more than 2 nodes
+  let isExceedingLimit = false;
+  let displayOptimalText = false;
+  // Optimal Marks only give useful information to user if they are using more than 2 nodes
   // if (optimal != 0 && nodeCount && nodeCount > 2) {
   //   marks.push({
   //     value: optimal,
@@ -162,7 +162,7 @@ const InputSlider: React.FC<InputSliderProps> = ({
                 valueLabelDisplay={smartLimit && Number(value) > smartLimit ? "off" : "auto"}
                 disabled={disabled}
                 marks={marks}
-                step={(step ? step : 1)}
+                step={(step || 1)}
                 style={{
                   color: disabled ? "gray" : color,
                 }}
@@ -251,7 +251,7 @@ const MaxedOutToolTip = withStyles(theme => ({
 
 const StyledSlider = withStyles({
   root: {
-    height: '8px', //height of the track
+    height: '8px', // height of the track
   },
   mark: {
     backgroundColor: '#fff',  // mark color
diff --git a/dashboard/src/components/porter/Pagination.tsx b/dashboard/src/components/porter/Pagination.tsx
index 991d169e3e..1ccb967ece 100644
--- a/dashboard/src/components/porter/Pagination.tsx
+++ b/dashboard/src/components/porter/Pagination.tsx
@@ -21,7 +21,7 @@ const Pagination: React.FC<Props> = ({
       <Text color="helper">Viewing page {page} out of {totalPages}</Text>
       <Container row>
         <Button 
-          onClick={() => setPage(page - 1)} 
+          onClick={() => { setPage(page - 1); }} 
           disabled={page === 1}
           height="20px"
           color="fg"
@@ -31,7 +31,7 @@ const Pagination: React.FC<Props> = ({
         </Button>
         <Spacer inline x={0.5} />
         <Button 
-          onClick={() => setPage(page + 1)}
+          onClick={() => { setPage(page + 1); }}
           disabled={page === totalPages}
           height="20px"
           color="fg"
diff --git a/dashboard/src/components/porter/SearchBar.tsx b/dashboard/src/components/porter/SearchBar.tsx
index b4dfb3f757..5ba98dddba 100644
--- a/dashboard/src/components/porter/SearchBar.tsx
+++ b/dashboard/src/components/porter/SearchBar.tsx
@@ -56,7 +56,7 @@ const SearchBar: React.FC<Props> = ({
         <Icon src={search} />
         <Input
           value={value}
-          onChange={e => setValue(e.target.value)}
+          onChange={e => { setValue(e.target.value); }}
           placeholder={placeholder}
           type={type || "text"}
           autoFocus={autoFocus}
diff --git a/dashboard/src/components/repo-selector/ActionConfEditor.tsx b/dashboard/src/components/repo-selector/ActionConfEditor.tsx
index 2e32105881..3000080a15 100644
--- a/dashboard/src/components/repo-selector/ActionConfEditor.tsx
+++ b/dashboard/src/components/repo-selector/ActionConfEditor.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "styled-components";
 
-import { ActionConfigType } from "shared/types";
+import { type ActionConfigType } from "shared/types";
 
 import RepoList from "./RepoList";
 import BranchList from "./BranchList";
@@ -43,7 +43,7 @@ const ActionConfEditor: React.FC<Props> = (props) => {
       <ExpandedWrapperAlt>
         <RepoList
           actionConfig={actionConfig}
-          setActionConfig={(x: ActionConfigType) => setActionConfig(x)}
+          setActionConfig={(x: ActionConfigType) => { setActionConfig(x); }}
           readOnly={false}
         />
       </ExpandedWrapperAlt>
@@ -54,7 +54,7 @@ const ActionConfEditor: React.FC<Props> = (props) => {
         <ExpandedWrapperAlt>
           <BranchList
             actionConfig={actionConfig}
-            setBranch={(branch: string) => setBranch(branch)}
+            setBranch={(branch: string) => { setBranch(branch); }}
           />
         </ExpandedWrapperAlt>
         <Br />
@@ -89,10 +89,10 @@ const ActionConfEditor: React.FC<Props> = (props) => {
           procfilePath={props.procfilePath}
           folderPath={props.folderPath}
           setActionConfig={setActionConfig}
-          setDockerfilePath={(x: string) => props.setDockerfilePath(x)}
-          setProcfilePath={(x: string) => props.setProcfilePath(x)}
-          setProcfileProcess={(x: string) => props.setProcfileProcess(x)}
-          setFolderPath={(x: string) => props.setFolderPath(x)}
+          setDockerfilePath={(x: string) => { props.setDockerfilePath(x); }}
+          setProcfilePath={(x: string) => { props.setProcfilePath(x); }}
+          setProcfileProcess={(x: string) => { props.setProcfileProcess(x); }}
+          setFolderPath={(x: string) => { props.setFolderPath(x); }}
         />
         <Br />
         <BackButton
diff --git a/dashboard/src/components/repo-selector/ActionDetails.tsx b/dashboard/src/components/repo-selector/ActionDetails.tsx
index 2294f64a93..bfb31cc1f0 100644
--- a/dashboard/src/components/repo-selector/ActionDetails.tsx
+++ b/dashboard/src/components/repo-selector/ActionDetails.tsx
@@ -5,7 +5,7 @@ import { integrationList } from "shared/common";
 import { Context } from "shared/Context";
 import api from "shared/api";
 import Loading from "components/Loading";
-import { ActionConfigType } from "../../shared/types";
+import { type ActionConfigType } from "../../shared/types";
 import InputRow from "../form-components/InputRow";
 import Heading from "components/form-components/Heading";
 import { BuildpackSelection } from "./BuildpackSelection";
@@ -59,7 +59,7 @@ const ActionDetails: React.FC<PropsType> = (props) => {
           setSelectedRegistry(res.data[0]);
         }
       })
-      .catch((err: any) => console.log(err));
+      .catch((err: any) => { console.log(err); });
   }, [currentProject]);
 
   const renderIntegrationList = () => {
@@ -73,11 +73,10 @@ const ActionDetails: React.FC<PropsType> = (props) => {
 
     return registries.map((registry: any, i: number) => {
       let icon =
-        integrationList[registry?.service] &&
         integrationList[registry?.service]?.icon;
 
       if (!icon) {
-        icon = integrationList["dockerhub"]?.icon;
+        icon = integrationList.dockerhub?.icon;
       }
 
       return (
@@ -85,7 +84,7 @@ const ActionDetails: React.FC<PropsType> = (props) => {
           key={i}
           isSelected={selectedRegistry && registry.id === selectedRegistry?.id}
           lastItem={i === registries?.length - 1}
-          onClick={() => setSelectedRegistry(registry)}
+          onClick={() => { setSelectedRegistry(registry); }}
         >
           <img src={icon && icon} />
           {registry.url}
@@ -96,7 +95,7 @@ const ActionDetails: React.FC<PropsType> = (props) => {
 
   const renderRegistrySection = () => {
     if (!registries || registries.length === 0 || registries.length === 1) {
-      return;
+      
     } else {
       return (
         <>
@@ -143,9 +142,9 @@ const ActionDetails: React.FC<PropsType> = (props) => {
         type="text"
         width="100%"
         setValue={(value) =>
-          typeof value === "string" && dockerfilePath
+          { typeof value === "string" && dockerfilePath
             ? setFolderPath(value)
-            : typeof value === "string" && setProcfilePath(value)
+            : typeof value === "string" && setProcfilePath(value); }
         }
         value={
           dockerfilePath
@@ -163,7 +162,7 @@ const ActionDetails: React.FC<PropsType> = (props) => {
         <>
           <Heading>
             <ExpandHeader
-              onClick={() => setShowBuildpacksConfig((prev) => !prev)}
+              onClick={() => { setShowBuildpacksConfig((prev) => !prev); }}
               isExpanded={showBuildpacksConfig}
             >
               Buildpacks settings
diff --git a/dashboard/src/components/repo-selector/BranchList.tsx b/dashboard/src/components/repo-selector/BranchList.tsx
index 0c94af2192..8d63fdd5e4 100644
--- a/dashboard/src/components/repo-selector/BranchList.tsx
+++ b/dashboard/src/components/repo-selector/BranchList.tsx
@@ -4,7 +4,7 @@ import branch_icon from "assets/branch.png";
 
 import api from "../../shared/api";
 import { Context } from "../../shared/Context";
-import { ActionConfigType } from "../../shared/types";
+import { type ActionConfigType } from "../../shared/types";
 
 import Loading from "../Loading";
 import SearchBar from "../SearchBar";
@@ -100,7 +100,7 @@ const BranchList: React.FC<Props> = ({
       return <LoadingWrapper>Error loading branches</LoadingWrapper>;
     }
 
-    let results =
+    const results =
       searchFilter != null
         ? branches
             .filter((branch) => {
@@ -125,7 +125,7 @@ const BranchList: React.FC<Props> = ({
         <BranchName
           key={i}
           lastItem={i === branches.length - 1}
-          onClick={() => setBranch(branch)}
+          onClick={() => { setBranch(branch); }}
         >
           <img src={branch_icon} alt={"branch icon"} />
           {branch}
diff --git a/dashboard/src/components/repo-selector/BuildpackSelection.tsx b/dashboard/src/components/repo-selector/BuildpackSelection.tsx
index 57c0a02081..44c6346baa 100644
--- a/dashboard/src/components/repo-selector/BuildpackSelection.tsx
+++ b/dashboard/src/components/repo-selector/BuildpackSelection.tsx
@@ -6,7 +6,7 @@ import Loading from "components/Loading";
 import React, { useContext, useEffect, useMemo, useState } from "react";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { ActionConfigType } from "shared/types";
+import { type ActionConfigType } from "shared/types";
 import styled, { keyframes } from "styled-components";
 
 const DEFAULT_BUILDER_NAME = "heroku";
@@ -16,17 +16,13 @@ const DEFAULT_HEROKU_STACK = "heroku/buildpacks:20";
 type BuildConfig = {
   builder: string;
   buildpacks: string[];
-  config: null | {
-    [key: string]: string;
-  };
+  config: null | Record<string, string>;
 };
 
 type Buildpack = {
   name: string;
   buildpack: string;
-  config: {
-    [key: string]: string;
-  };
+  config: Record<string, string>;
 };
 
 type DetectedBuildpack = {
@@ -59,7 +55,7 @@ export const BuildpackSelection: React.FC<{
   );
 
   useEffect(() => {
-    let buildConfig: BuildConfig = {} as BuildConfig;
+    const buildConfig: BuildConfig = {} as BuildConfig;
     buildConfig.builder = selectedStack;
     buildConfig.buildpacks = selectedBuildpacks?.map((buildpack) => {
       return buildpack.buildpack;
@@ -69,13 +65,13 @@ export const BuildpackSelection: React.FC<{
     }
   }, [selectedBuilder, selectedStack, selectedBuildpacks]);
 
-  const detectBuildpack = () => {
+  const detectBuildpack = async () => {
     if (actionConfig.kind === "gitlab") {
-      return api.detectGitlabBuildpack<DetectBuildpackResponse>(
+      return await api.detectGitlabBuildpack<DetectBuildpackResponse>(
         "<token>",
         {
           repo_path: actionConfig.git_repo,
-          branch: branch,
+          branch,
           dir: folderPath || ".",
         },
         {
@@ -85,7 +81,7 @@ export const BuildpackSelection: React.FC<{
       );
     }
 
-    return api.detectBuildpack<DetectBuildpackResponse>(
+    return await api.detectBuildpack<DetectBuildpackResponse>(
       "<token>",
       {
         dir: folderPath || ".",
@@ -96,7 +92,7 @@ export const BuildpackSelection: React.FC<{
         kind: "github",
         owner: actionConfig.git_repo.split("/")[0],
         name: actionConfig.git_repo.split("/")[1],
-        branch: branch,
+        branch,
       }
     );
   };
@@ -219,14 +215,14 @@ export const BuildpackSelection: React.FC<{
           <ActionContainer>
             {action === "add" && (
               <ActionButton
-                onClick={() => handleAddBuildpack(buildpack.buildpack)}
+                onClick={() => { handleAddBuildpack(buildpack.buildpack); }}
               >
                 <span className="material-icons-outlined">add</span>
               </ActionButton>
             )}
             {action === "remove" && (
               <ActionButton
-                onClick={() => handleRemoveBuildpack(buildpack.buildpack)}
+                onClick={() => { handleRemoveBuildpack(buildpack.buildpack); }}
               >
                 <span className="material-icons">delete</span>
               </ActionButton>
@@ -297,7 +293,7 @@ export const BuildpackSelection: React.FC<{
           value={selectedBuilder}
           width="100%"
           options={builderOptions}
-          setActiveValue={(option) => handleSelectBuilder(option)}
+          setActiveValue={(option) => { handleSelectBuilder(option); }}
           label="Select a builder"
         />
 
@@ -305,7 +301,7 @@ export const BuildpackSelection: React.FC<{
           value={selectedStack}
           width="100%"
           options={stackOptions}
-          setActiveValue={(option) => setSelectedStack(option)}
+          setActiveValue={(option) => { setSelectedStack(option); }}
           label="Select your stack"
         />
         <Helper>
@@ -367,7 +363,7 @@ export const AddCustomBuildpackForm: React.FC<{
         </EventInformation>
       </ContentContainer>
       <ActionContainer>
-        <ActionButton onClick={() => handleAddCustomBuildpack()}>
+        <ActionButton onClick={() => { handleAddCustomBuildpack(); }}>
           <span className="material-icons-outlined">add</span>
         </ActionButton>
       </ActionContainer>
diff --git a/dashboard/src/components/repo-selector/ContentsList.tsx b/dashboard/src/components/repo-selector/ContentsList.tsx
index d685e979ca..ddc7486625 100644
--- a/dashboard/src/components/repo-selector/ContentsList.tsx
+++ b/dashboard/src/components/repo-selector/ContentsList.tsx
@@ -7,11 +7,11 @@ import close from "assets/close.png";
 
 import api from "../../shared/api";
 import { Context } from "../../shared/Context";
-import { ActionConfigType, FileType } from "../../shared/types";
+import { type ActionConfigType, type FileType } from "../../shared/types";
 
 import Loading from "../Loading";
 
-interface AutoBuildpack {
+type AutoBuildpack = {
   name?: string;
   valid: boolean;
 }
@@ -60,20 +60,20 @@ export default class ContentsList extends Component<PropsType, StateType> {
   }
 
   setSubdirectory = (x: string) => {
-    this.setState({ currentDir: x }, () => this.updateContents());
+    this.setState({ currentDir: x }, () => { this.updateContents(); });
   };
 
-  fetchContents = () => {
-    let { currentProject } = this.context;
+  fetchContents = async () => {
+    const { currentProject } = this.context;
     const { actionConfig, branch } = this.props;
 
     if (actionConfig.kind === "gitlab") {
-      return api
+      return await api
         .getGitlabFolderContent(
           "<token>",
           {
             repo_path: actionConfig.git_repo,
-            branch: branch,
+            branch,
             dir: this.state.currentDir || "./",
           },
           {
@@ -92,7 +92,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
           };
         });
     }
-    return api.getBranchContents(
+    return await api.getBranchContents(
       "<token>",
       { dir: this.state.currentDir || "./" },
       {
@@ -101,17 +101,17 @@ export default class ContentsList extends Component<PropsType, StateType> {
         kind: "github",
         owner: actionConfig.git_repo.split("/")[0],
         name: actionConfig.git_repo.split("/")[1],
-        branch: branch,
+        branch,
       }
     );
   };
 
-  detectBuildpacks = () => {
-    let { currentProject } = this.context;
-    let { actionConfig, branch } = this.props;
+  detectBuildpacks = async () => {
+    const { currentProject } = this.context;
+    const { actionConfig, branch } = this.props;
 
     if (actionConfig.kind === "github") {
-      return api.detectBuildpack(
+      return await api.detectBuildpack(
         "<token>",
         {
           dir: this.state.currentDir || ".",
@@ -122,16 +122,16 @@ export default class ContentsList extends Component<PropsType, StateType> {
           kind: "github",
           owner: actionConfig.git_repo.split("/")[0],
           name: actionConfig.git_repo.split("/")[1],
-          branch: branch,
+          branch,
         }
       );
     }
 
-    return api.detectGitlabBuildpack(
+    return await api.detectGitlabBuildpack(
       "<token>",
       {
         repo_path: actionConfig.git_repo,
-        branch: branch,
+        branch,
         dir: this.state.currentDir || ".",
       },
       {
@@ -141,11 +141,11 @@ export default class ContentsList extends Component<PropsType, StateType> {
     );
   };
 
-  fetchProcfileContent = (procfilePath: string) => {
-    let { currentProject } = this.context;
-    let { actionConfig, branch } = this.props;
+  fetchProcfileContent = async (procfilePath: string) => {
+    const { currentProject } = this.context;
+    const { actionConfig, branch } = this.props;
     if (actionConfig.kind === "github") {
-      return api.getProcfileContents(
+      return await api.getProcfileContents(
         "<token>",
         {
           path: procfilePath,
@@ -156,16 +156,16 @@ export default class ContentsList extends Component<PropsType, StateType> {
           kind: "github",
           owner: actionConfig.git_repo.split("/")[0],
           name: actionConfig.git_repo.split("/")[1],
-          branch: branch,
+          branch,
         }
       );
     }
 
-    return api.getGitlabProcfileContents(
+    return await api.getGitlabProcfileContents(
       "<token>",
       {
         repo_path: actionConfig.git_repo,
-        branch: branch,
+        branch,
         path: procfilePath,
       },
       {
@@ -179,8 +179,8 @@ export default class ContentsList extends Component<PropsType, StateType> {
     // Get branch contents
     this.fetchContents()
       .then((res) => {
-        let files = [] as FileType[];
-        let folders = [] as FileType[];
+        const files = [] as FileType[];
+        const folders = [] as FileType[];
         res.data.map((x: FileType, i: number) => {
           x.type === "dir" ? folders.push(x) : files.push(x);
         });
@@ -191,7 +191,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
         files.sort((a: FileType, b: FileType) => {
           return a.path < b.path ? 1 : 0;
         });
-        let contents = folders.concat(files);
+        const contents = folders.concat(files);
 
         this.setState({ contents, loading: false, error: false });
       })
@@ -216,7 +216,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
         });
       });
 
-    let ppath =
+    const ppath =
       this.props.procfilePath ||
       `${this.state.currentDir ? this.state.currentDir : "."}/Procfile`;
     this.fetchProcfileContent(ppath)
@@ -229,7 +229,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
   };
 
   renderContentList = () => {
-    let { contents, loading, error } = this.state;
+    const { contents, loading, error } = this.state;
     if (loading) {
       return (
         <LoadingWrapper>
@@ -240,15 +240,15 @@ export default class ContentsList extends Component<PropsType, StateType> {
       return <LoadingWrapper>Error loading repo contents.</LoadingWrapper>;
     }
     return contents.map((item: FileType, i: number) => {
-      let splits = item.path.split("/");
-      let fileName = splits[splits.length - 1];
+      const splits = item.path.split("/");
+      const fileName = splits[splits.length - 1];
       if (item.type === "dir") {
         return (
           <Item
             key={i}
             isSelected={item.path === this.state.currentDir}
             lastItem={i === contents.length - 1}
-            onClick={() => this.setSubdirectory(item.path)}
+            onClick={() => { this.setSubdirectory(item.path); }}
           >
             <img src={folder} />
             {fileName}
@@ -262,7 +262,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
             key={i}
             lastItem={i === contents.length - 1}
             isADocker
-            onClick={() => this.props.setDockerfilePath(item.path)}
+            onClick={() => { this.props.setDockerfilePath(item.path); }}
           >
             <img src={file} />
             {fileName}
@@ -281,7 +281,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
 
   renderJumpToParent = () => {
     if (this.state.currentDir !== "") {
-      let splits = this.state.currentDir.split("/");
+      const splits = this.state.currentDir.split("/");
       let subdir = "";
       if (splits.length !== 1) {
         subdir = this.state.currentDir.replace(splits[splits.length - 1], "");
@@ -291,7 +291,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
       }
 
       return (
-        <Item lastItem={false} onClick={() => this.setSubdirectory(subdir)}>
+        <Item lastItem={false} onClick={() => { this.setSubdirectory(subdir); }}>
           <BackLabel>..</BackLabel>
         </Item>
       );
@@ -314,10 +314,10 @@ export default class ContentsList extends Component<PropsType, StateType> {
       return;
     }
 
-    let dockerfiles = [] as string[];
+    const dockerfiles = [] as string[];
     this.state.contents.forEach((item: FileType, i: number) => {
-      let splits = item.path.split("/");
-      let fileName = splits[splits.length - 1];
+      const splits = item.path.split("/");
+      const fileName = splits[splits.length - 1];
       if (fileName.includes("Dockerfile")) {
         dockerfiles.push(fileName);
       }
@@ -338,7 +338,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
 
   renderOverlay = () => {
     if (this.props.procfilePath) {
-      let processes = this.state.processes
+      const processes = this.state.processes
         ? Object.keys(this.state.processes)
         : [];
       if (this.state.processes == null) {
@@ -361,17 +361,17 @@ export default class ContentsList extends Component<PropsType, StateType> {
         <Overlay>
           <BgOverlay
             onClick={() =>
-              this.setState({ dockerfiles: [] }, () => {
+              { this.setState({ dockerfiles: [] }, () => {
                 this.props.setFolderPath("");
                 this.props.setProcfilePath("");
-              })
+              }); }
             }
           />
           <CloseButton
             onClick={() =>
-              this.setState({ dockerfiles: [] }, () => {
+              { this.setState({ dockerfiles: [] }, () => {
                 this.props.setProcfilePath("");
-              })
+              }); }
             }
           >
             <CloseButtonImg src={close} />
@@ -408,8 +408,8 @@ export default class ContentsList extends Component<PropsType, StateType> {
     if (this.state.dockerfiles.length > 0 && !this.props.dockerfilePath) {
       return (
         <Overlay>
-          <BgOverlay onClick={() => this.setState({ dockerfiles: [] })} />
-          <CloseButton onClick={() => this.setState({ dockerfiles: [] })}>
+          <BgOverlay onClick={() => { this.setState({ dockerfiles: [] }); }} />
+          <CloseButton onClick={() => { this.setState({ dockerfiles: [] }); }}>
             <CloseButtonImg src={close} />
           </CloseButton>
           <Label>
@@ -422,9 +422,9 @@ export default class ContentsList extends Component<PropsType, StateType> {
                 <Row
                   key={i}
                   onClick={() =>
-                    this.props.setDockerfilePath(
+                    { this.props.setDockerfilePath(
                       `${this.state.currentDir || "."}/${dockerfile}`
-                    )
+                    ); }
                   }
                   isLast={this.state.dockerfiles.length - 1 === i}
                 >
@@ -457,10 +457,10 @@ export default class ContentsList extends Component<PropsType, StateType> {
     ) {
       return (
         <Overlay>
-          <BgOverlay onClick={() => this.props.setDockerfilePath("")} />
+          <BgOverlay onClick={() => { this.props.setDockerfilePath(""); }} />
           <CloseButton
             onClick={() =>
-              this.props.setFolderPath(this.state.currentDir || "./")
+              { this.props.setFolderPath(this.state.currentDir || "./"); }
             }
           >
             <CloseButtonImg src={close} />
@@ -480,7 +480,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
             </ConfirmButton>
             <ConfirmButton
               onClick={() =>
-                this.props.setFolderPath(this.state.currentDir || "./")
+                { this.props.setFolderPath(this.state.currentDir || "./"); }
               }
             >
               No
@@ -501,7 +501,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
               <b>{this.state.autoBuildpack.name}</b> buildpack was{" "}
               <a
                 href="https://docs.porter.run/deploying-applications/deploying-from-github/selecting-application-and-build-method#customizing-buildpacks"
-                target="_blank"
+                target="_blank" rel="noreferrer"
               >
                 detected automatically
               </a>
diff --git a/dashboard/src/components/repo-selector/RepoList.tsx b/dashboard/src/components/repo-selector/RepoList.tsx
index cd20eee088..1d235c159f 100644
--- a/dashboard/src/components/repo-selector/RepoList.tsx
+++ b/dashboard/src/components/repo-selector/RepoList.tsx
@@ -3,7 +3,7 @@ import styled from "styled-components";
 import github from "assets/github-white.png";
 
 import api from "shared/api";
-import { ActionConfigType, RepoType } from "shared/types";
+import { type ActionConfigType, type RepoType } from "shared/types";
 import { Context } from "shared/Context";
 
 import Loading from "../Loading";
@@ -106,7 +106,7 @@ const RepoList: React.FC<Props> = ({
   const loadGithubRepos = async (repoId: number) => {
     try {
       const res = await api.getGitRepoList<
-        { FullName: string; Kind: "github" }[]
+        Array<{ FullName: string; Kind: "github" }>
       >("<token>", {}, { project_id: currentProject.id, git_repo_id: repoId });
 
       const repos = res.data.map((repo) => ({ ...repo, GHRepoID: repoId }));
@@ -132,11 +132,11 @@ const RepoList: React.FC<Props> = ({
     } catch (error) { }
   };
 
-  const loadRepos = (provider: any) => {
+  const loadRepos = async (provider: any) => {
     if (provider.provider === "github") {
-      return loadGithubRepos(provider.installation_id);
+      return await loadGithubRepos(provider.installation_id);
     } else {
-      return loadGitlabRepos(provider.integration_id);
+      return await loadGitlabRepos(provider.integration_id);
     }
   };
 
@@ -240,7 +240,7 @@ const RepoList: React.FC<Props> = ({
     }
 
     // show 10 most recently used repos if user hasn't searched anything yet
-    let results =
+    const results =
       searchFilter != null
         ? repos
           .filter((repo: RepoType) => {
@@ -271,7 +271,7 @@ const RepoList: React.FC<Props> = ({
             key={i}
             isSelected={repo.FullName === selectedRepo}
             lastItem={i === repos.length - 1}
-            onClick={() => setRepo(repo)}
+            onClick={() => { setRepo(repo); }}
             readOnly={readOnly}
             disabled={shouldDisable}
           >
@@ -417,7 +417,7 @@ const ProviderSelector = (props: {
         <ProviderSelectorStyles.Icon className={icon} />
 
         <ProviderSelectorStyles.Button
-          onClick={() => setIsOpen((prev) => !prev)}
+          onClick={() => { setIsOpen((prev) => !prev); }}
         >
           {currentValue?.name || currentValue?.instance_url}
         </ProviderSelectorStyles.Button>
diff --git a/dashboard/src/main/CurrentError.tsx b/dashboard/src/main/CurrentError.tsx
index 51e859a0e3..df9df052df 100644
--- a/dashboard/src/main/CurrentError.tsx
+++ b/dashboard/src/main/CurrentError.tsx
@@ -42,7 +42,7 @@ export default class CurrentError extends Component<PropsType, StateType> {
         return (
           <StyledCurrentError>
             <ErrorText>Error: {currentError}</ErrorText>
-            <ExpandButton onClick={() => this.setState({ expanded: true })}>
+            <ExpandButton onClick={() => { this.setState({ expanded: true }); }}>
               <i className="material-icons">launch</i>
             </ExpandButton>
             <CloseButton
@@ -65,7 +65,7 @@ export default class CurrentError extends Component<PropsType, StateType> {
           <ExpandedError>
             Porter encountered an error. Full error log:
             <CodeBlock>{currentError}</CodeBlock>
-            <ExpandButtonAlt onClick={() => this.setState({ expanded: false })}>
+            <ExpandButtonAlt onClick={() => { this.setState({ expanded: false }); }}>
               <i className="material-icons">remove</i>
             </ExpandButtonAlt>
             <CloseButtonAlt
diff --git a/dashboard/src/main/auth/ResetPasswordFinalize.tsx b/dashboard/src/main/auth/ResetPasswordFinalize.tsx
index 2965f72b5a..32b8e93b5b 100644
--- a/dashboard/src/main/auth/ResetPasswordFinalize.tsx
+++ b/dashboard/src/main/auth/ResetPasswordFinalize.tsx
@@ -1,4 +1,4 @@
-import React, { ChangeEvent, Component } from "react";
+import React, { type ChangeEvent, Component } from "react";
 import styled from "styled-components";
 import logo from "assets/logo.png";
 
@@ -36,11 +36,11 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   };
 
   componentDidMount() {
-    let urlParams = new URLSearchParams(window.location.search);
+    const urlParams = new URLSearchParams(window.location.search);
 
-    let emailFromParam = urlParams.get("email");
-    let tokenFromParams = urlParams.get("token");
-    let tokenIDFromParams = urlParams.get("token_id");
+    const emailFromParam = urlParams.get("email");
+    const tokenFromParams = urlParams.get("token");
+    const tokenIDFromParams = urlParams.get("token_id");
 
     api
       .createPasswordResetVerify(
@@ -55,7 +55,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
       .then(() => {
         this.setState({ loading: false });
       })
-      .catch((err) => this.setState({ loading: false, tokenError: true }));
+      .catch((err) => { this.setState({ loading: false, tokenError: true }); });
 
     document.addEventListener("keydown", this.handleKeyDown);
 
@@ -71,7 +71,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   }
 
   renderPasswordError = () => {
-    let { passwordError } = this.state;
+    const { passwordError } = this.state;
     if (passwordError) {
       return (
         <ErrorHelper>
@@ -83,16 +83,16 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   };
 
   handleResetPasswordFinalize = (): void => {
-    let { email, token, token_id, password } = this.state;
+    const { email, token, token_id, password } = this.state;
 
     // Call reset password
     api
       .createPasswordResetFinalize(
         "",
         {
-          email: email,
-          token: token,
-          token_id: token_id,
+          email,
+          token,
+          token_id,
           new_password: password,
         },
         {}
@@ -105,11 +105,11 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
           window.location.href = "/login";
         }, 2000);
       })
-      .catch((err) => this.setState({ tokenError: true }));
+      .catch((err) => { this.setState({ tokenError: true }); });
   };
 
   render() {
-    let {
+    const {
       password,
       passwordError,
       submitted,
@@ -125,10 +125,10 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
             placeholder="Password"
             value={password}
             onChange={(e: ChangeEvent<HTMLInputElement>) =>
-              this.setState({
+              { this.setState({
                 password: e.target.value,
                 passwordError: false,
-              })
+              }); }
             }
             valid={!passwordError}
           />
diff --git a/dashboard/src/main/auth/ResetPasswordInit.tsx b/dashboard/src/main/auth/ResetPasswordInit.tsx
index 7927ad618d..de6f584b16 100644
--- a/dashboard/src/main/auth/ResetPasswordInit.tsx
+++ b/dashboard/src/main/auth/ResetPasswordInit.tsx
@@ -1,4 +1,4 @@
-import React, { ChangeEvent, Component } from "react";
+import React, { type ChangeEvent, Component } from "react";
 import styled from "styled-components";
 import logo from "assets/logo.png";
 
@@ -34,7 +34,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   }
 
   renderEmailError = () => {
-    let { emailError } = this.state;
+    const { emailError } = this.state;
     if (emailError) {
       return (
         <ErrorHelper>
@@ -46,7 +46,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   };
 
   handleResetPasswordInit = (): void => {
-    let { email } = this.state;
+    const { email } = this.state;
 
     // Check for valid input
     if (!emailRegex.test(email)) {
@@ -57,7 +57,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
         .createPasswordReset(
           "",
           {
-            email: email,
+            email,
           },
           {}
         )
@@ -69,7 +69,7 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { email, emailError, submitted } = this.state;
+    const { email, emailError, submitted } = this.state;
 
     let formSection = (
       <div>
@@ -79,10 +79,10 @@ export default class ResetPasswordInit extends Component<PropsType, StateType> {
             placeholder="Email"
             value={email}
             onChange={(e: ChangeEvent<HTMLInputElement>) =>
-              this.setState({
+              { this.setState({
                 email: e.target.value,
                 emailError: false,
-              })
+              }); }
             }
             valid={!emailError}
           />
diff --git a/dashboard/src/main/home/ModalHandler.tsx b/dashboard/src/main/home/ModalHandler.tsx
index 85217b0f3f..52e49a5f48 100644
--- a/dashboard/src/main/home/ModalHandler.tsx
+++ b/dashboard/src/main/home/ModalHandler.tsx
@@ -15,7 +15,7 @@ import RedirectToOnboardingModal from "./modals/RedirectToOnboardingModal";
 
 import UsageWarningModal from "./modals/UsageWarningModal";
 import api from "shared/api";
-import { AxiosError } from "axios";
+import { type AxiosError } from "axios";
 import SkipOnboardingModal from "./modals/SkipProvisioningModal";
 import ConnectToDatabaseInstructionsModal from "./modals/ConnectToDatabaseInstructionsModal";
 
@@ -101,7 +101,7 @@ const ModalHandler: React.FC<{
 
       {modal === "ClusterInstructionsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="650px"
           title="Connecting to an Existing Cluster"
@@ -114,19 +114,19 @@ const ModalHandler: React.FC<{
       {isAuth("cluster", "", ["get", "delete"]) &&
         modal === "UpdateClusterModal" && (
           <Modal
-            onRequestClose={() => setCurrentModal(null, null)}
+            onRequestClose={() => { setCurrentModal(null, null); }}
             width="600px"
             height="275px"
             title="Delete cluster"
           >
             <UpdateClusterModal
-              setRefreshClusters={(x: boolean) => setRefreshClusters(x)}
+              setRefreshClusters={(x: boolean) => { setRefreshClusters(x); }}
             />
           </Modal>
         )}
       {modal === "IntegrationsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="380px"
           title="Add a New Integration"
@@ -136,7 +136,7 @@ const ModalHandler: React.FC<{
       )}
       {modal === "IntegrationsInstructionsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="650px"
           title="Connecting to an Image Registry"
@@ -147,7 +147,7 @@ const ModalHandler: React.FC<{
       {isAuth("namespace", "", ["get", "create"]) &&
         modal === "NamespaceModal" && (
           <Modal
-            onRequestClose={() => setCurrentModal(null, null)}
+            onRequestClose={() => { setCurrentModal(null, null); }}
             width="600px"
             height="220px"
             title="Add namespace"
@@ -158,7 +158,7 @@ const ModalHandler: React.FC<{
       {isAuth("namespace", "", ["get", "delete"]) &&
         modal === "DeleteNamespaceModal" && (
           <Modal
-            onRequestClose={() => setCurrentModal(null, null)}
+            onRequestClose={() => { setCurrentModal(null, null); }}
             width="700px"
             height="280px"
             title="Delete Namespace"
@@ -169,7 +169,7 @@ const ModalHandler: React.FC<{
 
       {modal === "EditInviteOrCollaboratorModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="600px"
           height="250px"
         >
@@ -178,7 +178,7 @@ const ModalHandler: React.FC<{
       )}
       {modal === "AccountSettingsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="480px"
           title="Account Settings"
@@ -189,7 +189,7 @@ const ModalHandler: React.FC<{
 
       {modal === "PreviewEnvSettingsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="440px"
           title="Preview Environment Settings"
@@ -200,7 +200,7 @@ const ModalHandler: React.FC<{
 
       {modal === "UsageWarningModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="760px"
           height="530px"
           title="Usage Warning"
@@ -211,7 +211,7 @@ const ModalHandler: React.FC<{
 
       {modal === "SkipOnboardingModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="600px"
           height="240px"
           title="Would you like to skip project setup?"
@@ -221,7 +221,7 @@ const ModalHandler: React.FC<{
       )}
       {modal === "ConnectToDatabaseInstructionsModal" && (
         <Modal
-          onRequestClose={() => setCurrentModal(null, null)}
+          onRequestClose={() => { setCurrentModal(null, null); }}
           width="600px"
           height="350px"
           title="Connecting to the Database"
diff --git a/dashboard/src/main/home/NoClusterPlaceholder.tsx b/dashboard/src/main/home/NoClusterPlaceholder.tsx
index 9226889b9a..4381896f67 100644
--- a/dashboard/src/main/home/NoClusterPlaceholder.tsx
+++ b/dashboard/src/main/home/NoClusterPlaceholder.tsx
@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import styled from "styled-components";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import { pushFiltered } from "shared/routing";
 
@@ -14,7 +14,7 @@ class NoClusterPlaceholder extends Component<PropsType, StateType> {
   state = {};
 
   render() {
-    let { setCurrentModal, currentProject } = this.context;
+    const { setCurrentModal, currentProject } = this.context;
 
     return (
       <StyledNoClusterPlaceholder>
@@ -33,9 +33,9 @@ class NoClusterPlaceholder extends Component<PropsType, StateType> {
         2.{" "}
         <A
           onClick={() =>
-            pushFiltered(this.props, "/dashboard", ["project_id"], {
+            { pushFiltered(this.props, "/dashboard", ["project_id"], {
               tab: "create-cluster",
-            })
+            }); }
           }
         >
           Create a new cluster
diff --git a/dashboard/src/main/home/add-on-dashboard/ConfigureTemplate.tsx b/dashboard/src/main/home/add-on-dashboard/ConfigureTemplate.tsx
index c76e79de63..d18a093528 100644
--- a/dashboard/src/main/home/add-on-dashboard/ConfigureTemplate.tsx
+++ b/dashboard/src/main/home/add-on-dashboard/ConfigureTemplate.tsx
@@ -18,7 +18,7 @@ import PorterFormWrapper from "components/porter-form/PorterFormWrapper";
 import Placeholder from "components/Placeholder";
 import Button from "components/porter/Button";
 import { generateSlug } from "random-word-slugs";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import Error from "components/porter/Error";
 
 type Props = RouteComponentProps & {
@@ -71,8 +71,8 @@ const ConfigureTemplate: React.FC<Props> = ({
   const deployAddOn = async (wildcard?: any) => {
     setButtonStatus("loading");
     
-    let values: any = {};
-    for (let key in wildcard) {
+    const values: any = {};
+    for (const key in wildcard) {
       _.set(values, key, wildcard[key]);
     }
     api
@@ -81,7 +81,7 @@ const ConfigureTemplate: React.FC<Props> = ({
         {
           template_name: currentTemplate.name,
           template_version: "latest",
-          values: values,
+          values,
           name,
         },
         {
@@ -95,21 +95,21 @@ const ConfigureTemplate: React.FC<Props> = ({
         window.analytics?.track("Deployed Add-on", {
           name: currentTemplate.name,
           namespace: "default",
-          values: values,
+          values,
         });
         waitForHelmRelease();
       })
       .catch((err) => {
-        let parsedErr = err?.response?.data?.error;
+        const parsedErr = err?.response?.data?.error;
         err = parsedErr || err.message || JSON.stringify(err);
         setButtonStatus(err);
         window.analytics?.track("Failed to Deploy Add-on", {
           name: currentTemplate.name,
           namespace: "default",
-          values: values,
+          values,
           error: err,
         });
-        return;
+        
       });
   };
 
diff --git a/dashboard/src/main/home/add-on-dashboard/ExpandedTemplate.tsx b/dashboard/src/main/home/add-on-dashboard/ExpandedTemplate.tsx
index 35c2b22d79..d0b7310fd3 100644
--- a/dashboard/src/main/home/add-on-dashboard/ExpandedTemplate.tsx
+++ b/dashboard/src/main/home/add-on-dashboard/ExpandedTemplate.tsx
@@ -33,7 +33,7 @@ const ExpandedTemplate: React.FC<Props> = ({
   const [keywords, setKeywords] = useState<any[]>([]);
   const getTemplateInfo = async () => {
     setIsLoading(true);
-    let params = {
+    const params = {
       repo_url: capabilities?.default_addon_helm_repo_url,
     };
 
@@ -43,8 +43,8 @@ const ExpandedTemplate: React.FC<Props> = ({
       version: currentTemplate.currentVersion,
     })
       .then((res) => {
-        let { form, values, markdown, metadata } = res.data;
-        let keywords = metadata.keywords;
+        const { form, values, markdown, metadata } = res.data;
+        const keywords = metadata.keywords;
         setForm(form);
         setValues(values);
         setMarkdown(markdown);
@@ -89,7 +89,7 @@ const ExpandedTemplate: React.FC<Props> = ({
 
         </Container>
 
-        <Button onClick={() => proceed(form)}>
+        <Button onClick={() => { proceed(form); }}>
           <AddI className="material-icons">add</AddI>
           Deploy add-on
         </Button>
diff --git a/dashboard/src/main/home/app-dashboard/app-view/tabs/Webhooks.tsx b/dashboard/src/main/home/app-dashboard/app-view/tabs/Webhooks.tsx
index 1557b9209d..900965744d 100644
--- a/dashboard/src/main/home/app-dashboard/app-view/tabs/Webhooks.tsx
+++ b/dashboard/src/main/home/app-dashboard/app-view/tabs/Webhooks.tsx
@@ -10,7 +10,7 @@ import Spacer from "components/porter/Spacer";
 import Text from "components/porter/Text";
 
 import api from "shared/api";
-import { AppEventWebhook } from "shared/types";
+import { type AppEventWebhook } from "shared/types";
 import { url } from "inspector";
 
 type Webhook = {
@@ -52,9 +52,9 @@ const Webhooks: React.FC<Props> = ({
       "<token>",
       {},
       { 
-        projectId: projectId,
-        deploymentTargetId: deploymentTargetId,
-        appName: appName,
+        projectId,
+        deploymentTargetId,
+        appName,
        },
     )
     .then(({ data:  { app_event_webhooks } }) =>  {
@@ -90,9 +90,9 @@ const Webhooks: React.FC<Props> = ({
       })
       },
       { 
-        projectId: projectId,
-        deploymentTargetId: deploymentTargetId,
-        appName: appName,
+        projectId,
+        deploymentTargetId,
+        appName,
        },
     )
     .then(() => {
diff --git a/dashboard/src/main/home/app-dashboard/build-settings/BranchSelector.tsx b/dashboard/src/main/home/app-dashboard/build-settings/BranchSelector.tsx
index 26d023a628..130fc92ce9 100644
--- a/dashboard/src/main/home/app-dashboard/build-settings/BranchSelector.tsx
+++ b/dashboard/src/main/home/app-dashboard/build-settings/BranchSelector.tsx
@@ -72,7 +72,7 @@ const BranchSelector: React.FC<Props> = ({
       return <LoadingWrapper>Error loading branches</LoadingWrapper>;
     }
 
-    let results =
+    const results =
       searchFilter != null
         ? branches
           .filter((branch) => {
@@ -97,7 +97,7 @@ const BranchSelector: React.FC<Props> = ({
         <BranchName
           key={i}
           lastItem={i === branches.length - 1}
-          onClick={() => setBranch(branch)}
+          onClick={() => { setBranch(branch); }}
         >
           <img src={branch_icon} alt={"branch icon"} />
           {branch}
diff --git a/dashboard/src/main/home/app-dashboard/build-settings/ProviderSelector.tsx b/dashboard/src/main/home/app-dashboard/build-settings/ProviderSelector.tsx
index 79a362d7ca..9b42751b07 100644
--- a/dashboard/src/main/home/app-dashboard/build-settings/ProviderSelector.tsx
+++ b/dashboard/src/main/home/app-dashboard/build-settings/ProviderSelector.tsx
@@ -3,7 +3,7 @@ import React, { useRef, useState } from "react";
 import { useOutsideAlerter } from "shared/hooks/useOutsideAlerter";
 import styled from "styled-components";
 
-interface Props {
+type Props = {
     values: any[];
     currentValue: any;
     onChange: (provider: any) => void;
@@ -34,7 +34,7 @@ const ProviderSelector: React.FC<Props> = ({
                 <ProviderSelectorStyles.Icon className={icon} />
 
                 <ProviderSelectorStyles.Button
-                    onClick={() => setIsOpen((prev) => !prev)}
+                    onClick={() => { setIsOpen((prev) => !prev); }}
                 >
                     {currentValue?.name || currentValue?.instance_url}
                 </ProviderSelectorStyles.Button>
diff --git a/dashboard/src/main/home/app-dashboard/build-settings/RepositorySelector.tsx b/dashboard/src/main/home/app-dashboard/build-settings/RepositorySelector.tsx
index e2e568ed0f..0a955d7cfb 100644
--- a/dashboard/src/main/home/app-dashboard/build-settings/RepositorySelector.tsx
+++ b/dashboard/src/main/home/app-dashboard/build-settings/RepositorySelector.tsx
@@ -3,14 +3,14 @@ import styled from "styled-components";
 import github from "assets/github-white.png";
 
 import api from "shared/api";
-import { RepoType } from "shared/types";
+import { type RepoType } from "shared/types";
 import { Context } from "shared/Context";
 
 import DynamicLink from "components/DynamicLink";
 import Loading from "components/Loading";
 import SearchBar from "components/SearchBar";
 import ProviderSelector from "./ProviderSelector";
-import { PorterApp } from "../types/porterApp";
+import { type PorterApp } from "../types/porterApp";
 
 type Props = {
   readOnly: boolean;
@@ -89,7 +89,7 @@ const RepositorySelector: React.FC<Props> = ({
   const loadGithubRepos = async (repoId: number) => {
     try {
       const res = await api.getGitRepoList<
-        { FullName: string; Kind: "github" }[]
+        Array<{ FullName: string; Kind: "github" }>
       >("<token>", {}, { project_id: currentProject.id, git_repo_id: repoId });
 
       const repos = res.data.map((repo) => ({ ...repo, GHRepoID: repoId }));
@@ -97,8 +97,8 @@ const RepositorySelector: React.FC<Props> = ({
     } catch (error) { }
   };
 
-  const loadRepos = (provider: any) => {
-    return loadGithubRepos(provider.installation_id);
+  const loadRepos = async (provider: any) => {
+    return await loadGithubRepos(provider.installation_id);
   };
 
   useEffect(() => {
@@ -169,7 +169,7 @@ const RepositorySelector: React.FC<Props> = ({
     }
 
     // show 10 most recently used repos if user hasn't searched anything yet
-    let results =
+    const results =
       searchFilter != null
         ? repos
           .filter((repo: RepoType) => {
@@ -197,7 +197,7 @@ const RepositorySelector: React.FC<Props> = ({
             key={i}
             isSelected={repo.FullName === git_repo_name}
             lastItem={i === repos.length - 1}
-            onClick={() => setRepo(repo)}
+            onClick={() => { setRepo(repo); }}
             readOnly={readOnly}
             disabled={false}
           >
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/DeleteApplicationModal.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/DeleteApplicationModal.tsx
index 44d628d02a..95104b50c6 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/DeleteApplicationModal.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/DeleteApplicationModal.tsx
@@ -35,7 +35,7 @@ const GithubActionModal: React.FC<Props> = ({
         <Spacer y={0.5} />
         <Checkbox
           checked={deleteGithubWorkflow}
-          toggleChecked={() => setDeleteGithubWorkflow(!deleteGithubWorkflow)}
+          toggleChecked={() => { setDeleteGithubWorkflow(!deleteGithubWorkflow); }}
         >
           <Text color="helper">
             Upon deletion, open a PR to remove this application's associated CI
@@ -57,7 +57,7 @@ const GithubActionModal: React.FC<Props> = ({
       <Spacer y={0.5} />
       {renderDeleteGithubWorkflowText()}
       <Button
-        onClick={() => deleteApplication(deleteGithubWorkflow)}
+        onClick={() => { deleteApplication(deleteGithubWorkflow); }}
         color="#b91133"
         status={loading ? "loading" : ""}
         loadingText="Deleting..."
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/GHABanner.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/GHABanner.tsx
index c64c3d5f2a..4f79269af9 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/GHABanner.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/GHABanner.tsx
@@ -39,7 +39,7 @@ const GHABanner: React.FC<Props> = ({
             <Banner
               type="warning"
               suffix={
-                <RefreshButton onClick={() => window.location.reload()}>
+                <RefreshButton onClick={() => { window.location.reload(); }}>
                   <img src={refresh} /> Refresh
                 </RefreshButton>
               }
@@ -58,7 +58,7 @@ const GHABanner: React.FC<Props> = ({
             <Banner
               type="warning"
               suffix={
-                <RefreshButton onClick={() => window.location.reload()}>
+                <RefreshButton onClick={() => { window.location.reload(); }}>
                   <img src={refresh} /> Refresh
                 </RefreshButton>
               }
@@ -66,7 +66,7 @@ const GHABanner: React.FC<Props> = ({
               Your application will not be available until you add the Porter workflow to your branch.
               <Spacer inline width="5px" />
               <Link
-                onClick={() => setShowGHAModal(true)}
+                onClick={() => { setShowGHAModal(true); }}
                 target="_blank"
                 hasunderline
               >
@@ -78,7 +78,7 @@ const GHABanner: React.FC<Props> = ({
       </StyledGHABanner>
       {showGHAModal && (
         <GithubActionModal
-          closeModal={() => setShowGHAModal(false)}
+          closeModal={() => { setShowGHAModal(false); }}
           githubAppInstallationID={gitRepoId}
           githubRepoOwner={repoName.split("/")[0]}
           githubRepoName={repoName.split("/")[1]}
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/AreaChart.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/AreaChart.tsx
index f5476b663d..2c8d7b37d1 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/AreaChart.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/AreaChart.tsx
@@ -14,11 +14,11 @@ import { localPoint } from "@visx/event";
 import { LinearGradient } from "@visx/gradient";
 import { bisector, extent, max } from "d3-array";
 import { timeFormat } from "d3-time-format";
-import { NormalizedMetricsData } from "../../../cluster-dashboard/expanded-chart/metrics/types";
+import { type NormalizedMetricsData } from "../../../cluster-dashboard/expanded-chart/metrics/types";
 import { AggregatedDataColors } from "../../../cluster-dashboard/expanded-chart/metrics/utils";
 import { ColorTheme } from "./utils";
 
-var globalData: NormalizedMetricsData[];
+let globalData: NormalizedMetricsData[];
 
 // util
 const formatDate = timeFormat("%H:%M:%S %b %d, '%y");
@@ -27,7 +27,7 @@ const hourFormat = timeFormat("%H:%M");
 const dayFormat = timeFormat("%b %d");
 
 // map resolutions to formats
-const formats: { [range: string]: (date: Date) => string } = {
+const formats: Record<string, (date: Date) => string> = {
     "1H": hourFormat,
     "6H": hourFormat,
     "1D": hourFormat,
@@ -122,8 +122,8 @@ const AreaChart: React.FunctionComponent<AreaProps> = ({
     );
 
     const getAggregatedDataTooltip = (x0: Date) => {
-        let aggregatedTooltipData: Record<string, NormalizedMetricsData> = {};
-        for (let [key, values] of Object.entries(aggregatedData)) {
+        const aggregatedTooltipData: Record<string, NormalizedMetricsData> = {};
+        for (const [key, values] of Object.entries(aggregatedData)) {
             const index = bisectDate(values, x0, 1);
             const d0 = values[index - 1];
             const d1 = values[index];
@@ -198,9 +198,9 @@ const AreaChart: React.FunctionComponent<AreaProps> = ({
             const container: SVGSVGElement = svgContainer.current;
 
             let point = container.createSVGPoint();
-            // @ts-ignore
+            // @ts-expect-error
             point.x = (event as any)?.clientX || 0;
-            // @ts-ignore
+            // @ts-expect-error
             point.y = (event as any)?.clientY || 0;
             point = point?.matrixTransform(container.getScreenCTM().inverse());
 
@@ -364,7 +364,7 @@ const AreaChart: React.FunctionComponent<AreaProps> = ({
                     onTouchStart={handleTooltip}
                     onTouchMove={handleTooltip}
                     onMouseMove={handleTooltip}
-                    onMouseLeave={() => hideTooltip()}
+                    onMouseLeave={() => { hideTooltip(); }}
                 />
                 {tooltipData && (
                     <g>
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/MetricsChart.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/MetricsChart.tsx
index 8e196815c4..9a81034cd4 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/MetricsChart.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/MetricsChart.tsx
@@ -7,7 +7,7 @@ import StatusCodeDataLegend from "./StatusCodeDataLegend";
 import AreaChart from "./AreaChart";
 import StackedAreaChart from "./StackedAreaChart";
 import Loading from "components/Loading";
-import { AggregatedMetric, Metric, NginxStatusMetric, isNginxMetric } from "./types";
+import { type AggregatedMetric, type Metric, type NginxStatusMetric, isNginxMetric } from "./types";
 
 type PropsType = {
     metric: Metric;
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StackedAreaChart.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StackedAreaChart.tsx
index 41f323eb9d..3600fb2a9d 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StackedAreaChart.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StackedAreaChart.tsx
@@ -11,9 +11,9 @@ import { timeFormat } from "d3-time-format";
 
 import { ColorTheme } from "./utils";
 import { default as areaTheme } from "./themes/area";
-import { NormalizedNginxStatusMetricsData } from "../../../cluster-dashboard/expanded-chart/metrics/types";
+import { type NormalizedNginxStatusMetricsData } from "../../../cluster-dashboard/expanded-chart/metrics/types";
 
-var globalData: NormalizedNginxStatusMetricsData[];
+let globalData: NormalizedNginxStatusMetricsData[];
 
 // util
 const formatDate = timeFormat("%H:%M:%S %b %d, '%y");
@@ -25,7 +25,7 @@ const dateScaleConfig = { type: 'point' } as const;
 const yScaleConfig = { type: 'linear' } as const;
 
 // map resolutions to formats
-const formats: { [range: string]: (date: Date) => string } = {
+const formats: Record<string, (date: Date) => string> = {
     "1H": hourFormat,
     "6H": hourFormat,
     "1D": hourFormat,
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StatusCodeDataLegend.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StatusCodeDataLegend.tsx
index 27db9957a1..45adfc4fd0 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StatusCodeDataLegend.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/StatusCodeDataLegend.tsx
@@ -3,7 +3,7 @@ import styled from "styled-components";
 import chroma from "chroma-js";
 import { StatusCodeDataColors } from "./utils";
 
-interface StatusCodeDataLegendProps {}
+type StatusCodeDataLegendProps = {}
 
 const StatusCodeDataLegend = ({ }: StatusCodeDataLegendProps) => {
   const statusCodes = ["1xx", "2xx", "3xx", "4xx", "5xx"];
diff --git a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/themes/area.tsx b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/themes/area.tsx
index 255828609b..f7d8ae28af 100644
--- a/dashboard/src/main/home/app-dashboard/expanded-app/metrics/themes/area.tsx
+++ b/dashboard/src/main/home/app-dashboard/expanded-app/metrics/themes/area.tsx
@@ -1,6 +1,6 @@
 import { buildChartTheme, grayColors } from '@visx/xychart';
 
-let chart = buildChartTheme({
+const chart = buildChartTheme({
     backgroundColor: '#222',
     colors: [
         "#4B4F7C", // gray (1xx)
diff --git a/dashboard/src/main/home/app-dashboard/types/buildpack.ts b/dashboard/src/main/home/app-dashboard/types/buildpack.ts
index 198c436a7b..d9327ff85f 100644
--- a/dashboard/src/main/home/app-dashboard/types/buildpack.ts
+++ b/dashboard/src/main/home/app-dashboard/types/buildpack.ts
@@ -27,7 +27,7 @@ export const DEFAULT_BUILDER_NAME = "heroku";
 export const DEFAULT_PAKETO_STACK = "paketobuildpacks/builder-jammy-full:latest";
 export const DEFAULT_HEROKU_STACK = "heroku/buildpacks:20";
 
-export const BUILDPACK_TO_NAME: { [key: string]: string } = {
+export const BUILDPACK_TO_NAME: Record<string, string> = {
   "heroku/nodejs": "NodeJS",
   "heroku/python": "Python",
   "heroku/java": "Java",
diff --git a/dashboard/src/main/home/app-dashboard/types/porterApp.ts b/dashboard/src/main/home/app-dashboard/types/porterApp.ts
index ae3d8c9052..b210ab32e5 100644
--- a/dashboard/src/main/home/app-dashboard/types/porterApp.ts
+++ b/dashboard/src/main/home/app-dashboard/types/porterApp.ts
@@ -1,4 +1,4 @@
-export interface PorterApp {
+export type PorterApp = {
     name: string;
     git_branch: string;
     git_repo_id: number;
diff --git a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/AddCustomBuildpack.tsx b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/AddCustomBuildpack.tsx
index a1afdaec13..3e28966e9e 100644
--- a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/AddCustomBuildpack.tsx
+++ b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/AddCustomBuildpack.tsx
@@ -1,5 +1,5 @@
 import InputRow from "components/form-components/InputRow";
-import { Buildpack } from "main/home/app-dashboard/types/buildpack";
+import { type Buildpack } from "main/home/app-dashboard/types/buildpack";
 import React, { useState } from "react";
 import styled, { keyframes } from "styled-components";
 
@@ -56,7 +56,7 @@ const AddCustomBuildpack: React.FC<{
         </EventInformation>
       </ContentContainer>
       <ActionContainer>
-        <ActionButton onClick={() => handleAddCustomBuildpack()} type="button">
+        <ActionButton onClick={() => { handleAddCustomBuildpack(); }} type="button">
           <span className="material-icons-outlined">add</span>
         </ActionButton>
       </ActionContainer>
diff --git a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackCard.tsx b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackCard.tsx
index 5dd33205a8..a12c7602cc 100644
--- a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackCard.tsx
+++ b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackCard.tsx
@@ -2,9 +2,9 @@ import React, { useMemo } from "react";
 import { DeviconsNameList } from "assets/devicons-name-list";
 import styled, { keyframes } from "styled-components";
 import { Draggable } from "react-beautiful-dnd";
-import { Buildpack } from "main/home/app-dashboard/types/buildpack";
+import { type Buildpack } from "main/home/app-dashboard/types/buildpack";
 
-interface Props {
+type Props = {
   buildpack: Buildpack;
   action: "add" | "remove";
   onClickFn: (buildpack: string) => void;
@@ -59,7 +59,7 @@ const BuildpackCard: React.FC<Props> = ({
             </EventInformation>
           </ContentContainer>
           <ActionContainer>
-            <ActionButton onClick={() => onClickFn(buildpack.buildpack)}>
+            <ActionButton onClick={() => { onClickFn(buildpack.buildpack); }}>
               <span className="material-icons">
                 {action === "remove" ? "delete" : "add"}
               </span>
@@ -77,7 +77,7 @@ const BuildpackCard: React.FC<Props> = ({
         </EventInformation>
       </ContentContainer>
       <ActionContainer>
-        <ActionButton onClick={() => onClickFn(buildpack.buildpack)}>
+        <ActionButton onClick={() => { onClickFn(buildpack.buildpack); }}>
           <span className="material-icons">
             {action === "remove" ? "delete" : "add"}
           </span>
diff --git a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackConfigurationModal.tsx b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackConfigurationModal.tsx
index cd7e1a9466..42eaeaeea2 100644
--- a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackConfigurationModal.tsx
+++ b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackConfigurationModal.tsx
@@ -6,10 +6,10 @@ import AddCustomBuildpackComponent from "./AddCustomBuildpack";
 import Button from "components/porter/Button";
 import Modal from "components/porter/Modal";
 import styled from "styled-components";
-import { Buildpack } from "main/home/app-dashboard/types/buildpack";
+import { type Buildpack } from "main/home/app-dashboard/types/buildpack";
 import {  useFieldArray, useFormContext } from "react-hook-form";
-import { PorterAppFormData } from "lib/porter-apps";
-import { BuildOptions } from "lib/porter-apps/build";
+import { type PorterAppFormData } from "lib/porter-apps";
+import { type BuildOptions } from "lib/porter-apps/build";
 
 type Props = {
   build: BuildOptions & {
diff --git a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackList.tsx b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackList.tsx
index 213534d9a1..5bcf01a258 100644
--- a/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackList.tsx
+++ b/dashboard/src/main/home/app-dashboard/validate-apply/build-settings/buildpacks/BuildpackList.tsx
@@ -5,13 +5,13 @@ import Text from "components/porter/Text";
 import Loading from "components/Loading";
 import Error from "components/porter/Error";
 import { Droppable, DragDropContext } from "react-beautiful-dnd";
-import { Buildpack } from "main/home/app-dashboard/types/buildpack";
+import { type Buildpack } from "main/home/app-dashboard/types/buildpack";
 import { useFieldArray, useFormContext } from "react-hook-form";
-import { PorterAppFormData } from "lib/porter-apps";
-import { BuildOptions } from "lib/porter-apps/build";
+import { type PorterAppFormData } from "lib/porter-apps";
+import { type BuildOptions } from "lib/porter-apps/build";
 import Container from "components/porter/Container";
 
-interface Props {
+type Props = {
   build: BuildOptions & {
     method: "pack";
   };
diff --git a/dashboard/src/main/home/app-dashboard/validate-apply/helm/HelmOverrides.tsx b/dashboard/src/main/home/app-dashboard/validate-apply/helm/HelmOverrides.tsx
index 40edbabbe7..decf21564e 100644
--- a/dashboard/src/main/home/app-dashboard/validate-apply/helm/HelmOverrides.tsx
+++ b/dashboard/src/main/home/app-dashboard/validate-apply/helm/HelmOverrides.tsx
@@ -6,7 +6,7 @@ import YamlEditor from "components/YamlEditor";
 import Spacer from "components/porter/Spacer";
 import Text from "components/porter/Text";
 import {useFormContext} from "react-hook-form";
-import {PorterAppFormData} from "lib/porter-apps";
+import {type PorterAppFormData} from "lib/porter-apps";
 
 type PropsType = {
   projectId: number;
diff --git a/dashboard/src/main/home/cluster-dashboard/DashboardRouter.tsx b/dashboard/src/main/home/cluster-dashboard/DashboardRouter.tsx
index d9958ea8bb..74d22e5a1a 100644
--- a/dashboard/src/main/home/cluster-dashboard/DashboardRouter.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/DashboardRouter.tsx
@@ -1,16 +1,16 @@
 import React, { useState, useContext, useEffect } from "react";
 import styled from "styled-components";
 import loadable from "@loadable/component";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import { Route, Switch } from "react-router-dom";
 
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { WithAuthProps, withAuth } from "shared/auth/AuthorizationHoc";
-import { ClusterType } from "shared/types";
+import { type WithAuthProps, withAuth } from "shared/auth/AuthorizationHoc";
+import { type ClusterType } from "shared/types";
 import {
   getQueryParam,
-  PorterUrl,
+  type PorterUrl,
   pushQueryParams,
 } from "shared/routing";
 
@@ -24,16 +24,16 @@ import ExpandedEnvGroupDashboard from "./env-groups/ExpandedEnvGroupDashboard";
 import EnvGroupDashboard from "./env-groups/EnvGroupDashboard";
 
 const LazyPreviewEnvironmentsRoutes = loadable(
-  // @ts-ignore
-  () => import("./preview-environments/routes.tsx"),
+  // @ts-expect-error
+  async () => await import("./preview-environments/routes.tsx"),
   {
     fallback: <Loading />,
   }
 );
 
 const LazyStackRoutes = loadable(
-  // @ts-ignore
-  () => import("./stacks/routes.tsx"),
+  // @ts-expect-error
+  async () => await import("./stacks/routes.tsx"),
   {
     fallback: <Loading />,
   }
@@ -84,7 +84,7 @@ const DashboardRouter: React.FC<Props> = ({
   // Reset namespace filter and close expanded chart on cluster change
   useEffect(() => {
     let namespace = "default";
-    let localStorageNamespace = localStorage.getItem(
+    const localStorageNamespace = localStorage.getItem(
       `${currentProject.id}-${currentCluster.id}-namespace`
     );
     if (localStorageNamespace) {
diff --git a/dashboard/src/main/home/cluster-dashboard/NamespaceSelector.tsx b/dashboard/src/main/home/cluster-dashboard/NamespaceSelector.tsx
index 233b11c707..c2765076dd 100644
--- a/dashboard/src/main/home/cluster-dashboard/NamespaceSelector.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/NamespaceSelector.tsx
@@ -14,7 +14,7 @@ type Props = {
 };
 
 type StateType = {
-  namespaceOptions: { label: string; value: string }[];
+  namespaceOptions: Array<{ label: string; value: string }>;
 };
 
 // TODO: fix update to unmounted component
@@ -23,12 +23,12 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
   namespace,
 }) => {
   const context = useContext(Context);
-  let _isMounted = true;
+  const _isMounted = true;
   const [namespaceOptions, setNamespaceOptions] = useState<
-    {
+    Array<{
       label: string;
       value: string;
-    }[]
+    }>
   >([]);
   const [defaultNamespace, setDefaultNamespace] = useState<string>(
     localStorage.getItem(
@@ -37,7 +37,7 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
   );
 
   const updateOptions = () => {
-    let { currentCluster, currentProject } = context;
+    const { currentCluster, currentProject } = context;
 
     api
       .getNamespaces(
@@ -50,13 +50,13 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
       )
       .then((res) => {
         if (_isMounted) {
-          let namespaceOptions: { label: string; value: string }[] = [
+          const namespaceOptions: Array<{ label: string; value: string }> = [
             // { label: "All", value: "ALL" },
           ];
 
           // Set namespace from URL if specified
-          let queryString = window.location.search;
-          let urlParams = new URLSearchParams(queryString);
+          const queryString = window.location.search;
+          const urlParams = new URLSearchParams(queryString);
           let urlNamespace = urlParams.get("namespace");
           if (urlNamespace === "ALL") {
             urlNamespace = "ALL";
@@ -105,8 +105,8 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
   };
 
   useEffect(() => {
-    let urlParams = new URLSearchParams(window.location.search);
-    let urlNamespace = urlParams.get("namespace");
+    const urlParams = new URLSearchParams(window.location.search);
+    const urlNamespace = urlParams.get("namespace");
     if (
       urlNamespace === "" ||
       defaultNamespace === "" ||
diff --git a/dashboard/src/main/home/cluster-dashboard/SortSelector.tsx b/dashboard/src/main/home/cluster-dashboard/SortSelector.tsx
index 1d630bfbb5..ec6c7f103d 100644
--- a/dashboard/src/main/home/cluster-dashboard/SortSelector.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/SortSelector.tsx
@@ -13,7 +13,7 @@ type PropsType = {
 };
 
 type StateType = {
-  sortOptions: { label: string; value: string }[];
+  sortOptions: Array<{ label: string; value: string }>;
 };
 
 // TODO: fix update to unmounted component
@@ -24,7 +24,7 @@ export default class SortSelector extends Component<PropsType, StateType> {
       { label: "Oldest", value: "Oldest" },
       { label: "Alphabetical", value: "Alphabetical" },
       { label: "Next Run", value: "Next Run" },
-    ] as { label: string; value: string }[],
+    ] as Array<{ label: string; value: string }>,
   };
 
   getSortOptions() {
@@ -49,7 +49,7 @@ export default class SortSelector extends Component<PropsType, StateType> {
       <StyledSortSelector>
         <RadioFilter
           selected={this.props.sortType}
-          setSelected={(sortType: any) => this.props.setSortType(sortType)}
+          setSelected={(sortType: any) => { this.props.setSortType(sortType); }}
           options={this.getSortOptions()}
           name="Sort"
           icon={sort}
diff --git a/dashboard/src/main/home/cluster-dashboard/TagFilter.tsx b/dashboard/src/main/home/cluster-dashboard/TagFilter.tsx
index 6033a69dfa..7cbe50dc3a 100644
--- a/dashboard/src/main/home/cluster-dashboard/TagFilter.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/TagFilter.tsx
@@ -40,7 +40,7 @@ const TagFilter = ({ onSelect }: { onSelect: (tag: any) => void }) => {
           label: tag.name,
         }))
       )}
-      setSelected={(newVal: any) => setSelectedTag(newVal)}
+      setSelected={(newVal: any) => { setSelectedTag(newVal); }}
       name="Tag"
       icon={tag}
     />
diff --git a/dashboard/src/main/home/cluster-dashboard/apps/AppDashboard.tsx b/dashboard/src/main/home/cluster-dashboard/apps/AppDashboard.tsx
index 78f6cf41cc..ea6aee36de 100644
--- a/dashboard/src/main/home/cluster-dashboard/apps/AppDashboard.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/apps/AppDashboard.tsx
@@ -1,16 +1,16 @@
 import React, { useContext, useState, useEffect } from "react";
 import styled from "styled-components";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import web from "assets/web.png";
 
 import { Context } from "shared/Context";
 import { JobStatusType } from "shared/types";
-import { withAuth, WithAuthProps } from "shared/auth/AuthorizationHoc";
+import { withAuth, type WithAuthProps } from "shared/auth/AuthorizationHoc";
 import {
   pushQueryParams,
   pushFiltered,
-  PorterUrl,
+  type PorterUrl,
 } from "shared/routing";
 
 import { NamespaceSelector } from "../NamespaceSelector";
diff --git a/dashboard/src/main/home/cluster-dashboard/chart/Chart.tsx b/dashboard/src/main/home/cluster-dashboard/chart/Chart.tsx
index bdbc6e4d3d..e11abb6d72 100644
--- a/dashboard/src/main/home/cluster-dashboard/chart/Chart.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/chart/Chart.tsx
@@ -9,9 +9,9 @@ import styled from "styled-components";
 import { useHistory, useLocation, useRouteMatch } from "react-router";
 
 import {
-  ChartType,
+  type ChartType,
   JobStatusType,
-  JobStatusWithTimeType,
+  type JobStatusWithTimeType,
   StorageType,
 } from "shared/types";
 import { Context } from "shared/Context";
@@ -100,7 +100,7 @@ const Chart: React.FunctionComponent<Props> = ({
   }, [chart]);
 
   const filteredControllers = useMemo(() => {
-    let tmpControllers: any = {};
+    const tmpControllers: any = {};
     chartControllers.forEach((uid: any) => {
       if (!controllers[uid]) {
         return;
@@ -117,10 +117,10 @@ const Chart: React.FunctionComponent<Props> = ({
     });
   }
 
-  // @ts-ignore
+  // @ts-expect-error
   const rtf = new Intl.DateTimeFormat("en", {
     localeMatcher: "best fit", // other values: "lookup"
-    // @ts-ignore
+    // @ts-expect-error
     dateStyle: "full",
     timeStyle: "long",
   });
@@ -136,7 +136,7 @@ const Chart: React.FunctionComponent<Props> = ({
       }/${chart.name}`;
 
     const newParams = {
-      // @ts-ignore
+      // @ts-expect-error
       project_id: params.project_id,
       closeChartRedirectUrl,
     };
diff --git a/dashboard/src/main/home/cluster-dashboard/chart/ChartList.tsx b/dashboard/src/main/home/cluster-dashboard/chart/ChartList.tsx
index bdfb256e01..deedf60238 100644
--- a/dashboard/src/main/home/cluster-dashboard/chart/ChartList.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/chart/ChartList.tsx
@@ -5,13 +5,13 @@ import _ from "lodash";
 import { Context } from "shared/Context";
 import api from "shared/api";
 import {
-  ChartType,
-  ClusterType,
+  type ChartType,
+  type ClusterType,
   JobStatusType,
-  JobStatusWithTimeType,
+  type JobStatusWithTimeType,
   StorageType,
 } from "shared/types";
-import { PorterUrl } from "shared/routing";
+import { type PorterUrl } from "shared/routing";
 
 import Chart from "./Chart";
 import Loading from "components/Loading";
@@ -33,9 +33,9 @@ type Props = {
   noPlaceholder?: boolean;
 };
 
-interface JobStatusWithTimeAndVersion extends JobStatusWithTimeType {
+type JobStatusWithTimeAndVersion = {
   resource_version: number;
-}
+} & JobStatusWithTimeType
 
 const ChartList: React.FunctionComponent<Props> = ({
   lastRunStatus,
@@ -92,7 +92,7 @@ const ChartList: React.FunctionComponent<Props> = ({
         {
           id: currentProject.id,
           cluster_id: currentCluster.id,
-          namespace: namespace,
+          namespace,
         }
       );
       const charts = res.data || [];
@@ -120,7 +120,7 @@ const ChartList: React.FunctionComponent<Props> = ({
         console.log(`connected to websocket: ${websocketID}`);
       },
       onmessage: (evt: MessageEvent) => {
-        let event = JSON.parse(evt.data);
+        const event = JSON.parse(evt.data);
         const newChart: ChartType = event.Object;
         const isSameChart = (chart: ChartType) =>
           getChartKey(chart.name, chart.namespace) ===
@@ -168,7 +168,7 @@ const ChartList: React.FunctionComponent<Props> = ({
   };
 
   const setupControllerWebsocket = (kind: string) => {
-    let { currentCluster, currentProject } = context;
+    const { currentCluster, currentProject } = context;
     const apiPath = `/api/projects/${currentProject.id}/clusters/${currentCluster.id}/${kind}/status`;
 
     const wsConfig = {
@@ -176,8 +176,8 @@ const ChartList: React.FunctionComponent<Props> = ({
         console.log(`connected to websocket: ${kind}`);
       },
       onmessage: (evt: MessageEvent) => {
-        let event = JSON.parse(evt.data);
-        let object = event?.Object;
+        const event = JSON.parse(evt.data);
+        const object = event?.Object;
 
         if (!object?.metadata?.kind) {
           return;
@@ -205,12 +205,12 @@ const ChartList: React.FunctionComponent<Props> = ({
   };
 
   const setupControllerWebsockets = (controllers: string[]) => {
-    controllers.map((kind) => setupControllerWebsocket(kind));
+    controllers.map((kind) => { setupControllerWebsocket(kind); });
   };
 
   const setupJobWebsocket = (websocketID: string) => {
     const kind = "job";
-    let { currentCluster, currentProject } = context;
+    const { currentCluster, currentProject } = context;
     const apiPath = `/api/projects/${currentProject.id}/clusters/${currentCluster.id}/${kind}/status`;
 
     const wsConfig = {
@@ -218,13 +218,13 @@ const ChartList: React.FunctionComponent<Props> = ({
         console.log(`connected to websocket: ${websocketID}`);
       },
       onmessage: (evt: MessageEvent) => {
-        let event = JSON.parse(evt.data);
+        const event = JSON.parse(evt.data);
 
         if (event.event_type === "DELETE") {
           return;
         }
 
-        let object = event.Object;
+        const object = event.Object;
 
         if (_.get(object.metadata, ["annotations", "helm.sh/hook"])) {
           return;
@@ -297,7 +297,7 @@ const ChartList: React.FunctionComponent<Props> = ({
     setupJobWebsocket(jobWebsocketID);
 
     return () => {
-      controllers.map((controller) => closeWebsocket(controller));
+      controllers.map((controller) => { closeWebsocket(controller); });
       closeWebsocket(jobWebsocketID);
     };
   }, [context.currentCluster]);
diff --git a/dashboard/src/main/home/cluster-dashboard/chart/JobRunTable.tsx b/dashboard/src/main/home/cluster-dashboard/chart/JobRunTable.tsx
index 9a0cca191e..bf912de391 100644
--- a/dashboard/src/main/home/cluster-dashboard/chart/JobRunTable.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/chart/JobRunTable.tsx
@@ -2,10 +2,10 @@ import DynamicLink from "components/DynamicLink";
 import Loading from "components/Loading";
 import Table from "components/OldTable";
 import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
-import { CellProps, Column, Row } from "react-table";
+import { type CellProps, type Column, Row } from "react-table";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { NewWebsocketOptions, useWebsockets } from "shared/hooks/useWebsockets";
+import { type NewWebsocketOptions, useWebsockets } from "shared/hooks/useWebsockets";
 import { useRouting } from "shared/routing";
 import { relativeDate, timeFrom } from "shared/string_utils";
 import styled from "styled-components";
@@ -97,7 +97,7 @@ const JobRunTable: React.FC<Props> = ({
     };
   }, []);
 
-  const columns = useMemo<Column<JobRun>[]>(
+  const columns = useMemo<Array<Column<JobRun>>>(
     () => [
       {
         Header: "Namespace / Name",
@@ -278,7 +278,7 @@ const JobRunTable: React.FC<Props> = ({
     return (
       <ErrorWrapper>
         Couldn't retrieve jobs, please try again.{" "}
-        <RetryButton onClick={() => getJobRuns()}>Retry</RetryButton>
+        <RetryButton onClick={() => { getJobRuns(); }}>Retry</RetryButton>
       </ErrorWrapper>
     );
   }
@@ -381,14 +381,14 @@ type JobRun = {
       "helm.sh/revision": string;
       "meta.helm.sh/release-name": string;
     };
-    ownerReferences: {
+    ownerReferences: Array<{
       apiVersion: string;
       kind: string;
       name: string;
       uid: string;
       controller: boolean;
       blockOwnerDeletion: boolean;
-    }[];
+    }>;
     managedFields: unknown[];
   };
   spec: {
@@ -414,11 +414,11 @@ type JobRun = {
         };
       };
       spec: {
-        containers: {
+        containers: Array<{
           name: string;
           image: string;
           command: string[];
-          env?: {
+          env?: Array<{
             [key: string]: unknown;
             name: string;
             value?: string;
@@ -426,7 +426,7 @@ type JobRun = {
               secretKeyRef?: { name: string; key: string };
               configMapKeyRef?: { name: string; key: string };
             };
-          }[];
+          }>;
           resources: {
             [key: string]: unknown;
             limits: { [key: string]: unknown; memory: string };
@@ -435,7 +435,7 @@ type JobRun = {
           terminationMessagePath: string;
           terminationMessagePolicy: string;
           imagePullPolicy: string;
-        }[];
+        }>;
 
         restartPolicy: string;
         terminationGracePeriodSeconds: number;
@@ -443,25 +443,25 @@ type JobRun = {
         shareProcessNamespace: boolean;
         securityContext: unknown;
         schedulerName: string;
-        tolerations: {
+        tolerations: Array<{
           [key: string]: unknown;
           key: string;
           operator: string;
           value: string;
           effect: string;
-        }[];
+        }>;
       };
     };
   };
   status: {
     [key: string]: unknown;
-    conditions: {
+    conditions: Array<{
       [key: string]: unknown;
       type: string;
       status: string;
       lastProbeTime: string;
       lastTransitionTime: string;
-    }[];
+    }>;
     startTime: string;
     completionTime: string | undefined | null;
     succeeded?: number;
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettings.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettings.tsx
index 884682f3c5..55224e7930 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettings.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettings.tsx
@@ -8,8 +8,8 @@ import api from "shared/api";
 import CheckboxRow from "components/form-components/CheckboxRow";
 import Loading from "components/Loading";
 import CopyToClipboard from "components/CopyToClipboard";
-import { DetailedIngressError } from "shared/types";
-import { RouteComponentProps } from "react-router";
+import { type DetailedIngressError } from "shared/types";
+import { type RouteComponentProps } from "react-router";
 import {stringifiedDNSRecordType} from "utils/ip";
 
 type Props = RouteComponentProps & {
@@ -47,7 +47,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
   );
   const [previewEnvsLoading, setPreviewEnvsLoading] = useState(false);
 
-  let rotateCredentials = () => {
+  const rotateCredentials = () => {
     api
       .overwriteAWSIntegration(
         "<token>",
@@ -69,7 +69,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       });
   };
 
-  let updateClusterName = () => {
+  const updateClusterName = () => {
     api
       .updateCluster(
         "<token>",
@@ -90,7 +90,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       });
   };
 
-  let updateAgentIntegrationEnabled = () => {
+  const updateAgentIntegrationEnabled = () => {
     setAgentLoading(true);
 
     api
@@ -113,7 +113,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       });
   };
 
-  let updatePreviewEnvironmentsEnabled = () => {
+  const updatePreviewEnvironmentsEnabled = () => {
     setPreviewEnvsLoading(true);
 
     api
@@ -185,7 +185,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
           <InputRow
             type="text"
             value={accessKeyId}
-            setValue={(x: string) => setAccessKeyId(x)}
+            setValue={(x: string) => { setAccessKeyId(x); }}
             label="👤 AWS Access ID"
             placeholder="ex: AKIAIOSFODNN7EXAMPLE"
             width="100%"
@@ -194,7 +194,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
           <InputRow
             type="password"
             value={secretKey}
-            setValue={(x: string) => setSecretKey(x)}
+            setValue={(x: string) => { setSecretKey(x); }}
             label="🔒 AWS Secret Key"
             placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
             width="100%"
@@ -212,7 +212,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
           <Helper>
             Rotate the credentials that Porter uses to connect to the cluster.
           </Helper>
-          <Button color="#616FEEcc" onClick={() => setStartRotateCreds(true)}>
+          <Button color="#616FEEcc" onClick={() => { setStartRotateCreds(true); }}>
             Rotate credentials
           </Button>
         </div>
@@ -220,13 +220,13 @@ const ClusterSettings: React.FC<Props> = (props) => {
     }
   }
 
-  let overrideAWSClusterNameSection =
+  const overrideAWSClusterNameSection =
     currentCluster?.aws_integration_id &&
       currentCluster?.aws_integration_id != 0 ? (
       <InputRow
         type="text"
         value={newAWSClusterID}
-        setValue={(x: string) => setNewAWSClusterID(x)}
+        setValue={(x: string) => { setNewAWSClusterID(x); }}
         label="AWS Cluster ID"
         placeholder="ex: my-awesome-cluster"
         width="100%"
@@ -240,7 +240,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       <InputRow
         type="text"
         value={newClusterName}
-        setValue={(x: string) => setNewClusterName(x)}
+        setValue={(x: string) => { setNewClusterName(x); }}
         label="Cluster Name"
         placeholder="ex: my-awesome-cluster"
         width="100%"
@@ -252,7 +252,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       </Button>
     </div>
   );
-  let configureUrl = (
+  const configureUrl = (
     ingressIp: string | undefined,
     ingressError: DetailedIngressError
   ) => {
@@ -293,7 +293,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
       <Heading>Enable agent</Heading>
       <CheckboxRow
         label={"Allow the Porter agent to be installed on the cluster"}
-        toggle={() => setEnableAgent(!enableAgent)}
+        toggle={() => { setEnableAgent(!enableAgent); }}
         checked={enableAgent}
       />
       <Button color="#616FEEcc" onClick={updateAgentIntegrationEnabled}>
@@ -317,7 +317,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
           <Heading>Enable preview environments</Heading>
           <CheckboxRow
             label={"Create preview environments on this cluster"}
-            toggle={() => setEnablePreviewEnvs(!enablePreviewEnvs)}
+            toggle={() => { setEnablePreviewEnvs(!enablePreviewEnvs); }}
             checked={enablePreviewEnvs}
           />
           <Button color="#616FEEcc" onClick={updatePreviewEnvironmentsEnabled}>
@@ -367,7 +367,7 @@ const ClusterSettings: React.FC<Props> = (props) => {
               : currentCluster.status == "UPDATING"
           }
           color="#b91133"
-          onClick={() => setCurrentModal("UpdateClusterModal")}
+          onClick={() => { setCurrentModal("UpdateClusterModal"); }}
         >
           Delete cluster
         </Button>
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettingsModal.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettingsModal.tsx
index 70a532c479..dcbde463e2 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettingsModal.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/ClusterSettingsModal.tsx
@@ -50,7 +50,7 @@ const ClusterSettingsModal: React.FC<Props> = ({
     <Modal
       width="600px"
       height="auto"
-      onRequestClose={() => setCurrentModal(null, null)}
+      onRequestClose={() => { setCurrentModal(null, null); }}
       title="Cluster name"
     >
       <Spacer height="15px" />
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/Metrics.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/Metrics.tsx
index 6ca17c6cf2..4da1931913 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/Metrics.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/Metrics.tsx
@@ -9,9 +9,9 @@ import Placeholder from "components/OldPlaceholder";
 import ParentSize from "@visx/responsive/lib/components/ParentSize";
 import AreaChart from "../expanded-chart/metrics/AreaChart";
 import {
-  AvailableMetrics,
-  GenericMetricResponse,
-  NormalizedMetricsData,
+  type AvailableMetrics,
+  type GenericMetricResponse,
+  type NormalizedMetricsData,
 } from "../expanded-chart/metrics/types";
 import SelectRow from "../../../../components/form-components/SelectRow";
 import { MetricNormalizer } from "../expanded-chart/metrics/MetricNormalizer";
@@ -130,13 +130,13 @@ const Metrics: React.FC = () => {
     if (showMetricsSettings) {
       return (
         <>
-          <DropdownOverlay onClick={() => setShowMetricsSettings(false)} />
+          <DropdownOverlay onClick={() => { setShowMetricsSettings(false); }} />
           <DropdownAlt dropdownWidth="330px" dropdownMaxHeight="300px">
             <Label>Additional Settings</Label>
             <SelectRow
               label="Target Ingress"
               value={selectedIngress}
-              setActiveValue={(x: any) => setSelectedIngress(x)}
+              setActiveValue={(x: any) => { setSelectedIngress(x); }}
               options={ingressOptions}
               width="100%"
             />
@@ -174,11 +174,11 @@ const Metrics: React.FC = () => {
     if (dropdownExpanded) {
       return (
         <>
-          <DropdownOverlay onClick={() => setDropdownExpanded(false)} />
+          <DropdownOverlay onClick={() => { setDropdownExpanded(false); }} />
           <Dropdown
             dropdownWidth="230px"
             dropdownMaxHeight="200px"
-            onClick={() => setDropdownExpanded(false)}
+            onClick={() => { setDropdownExpanded(false); }}
           >
             {renderOptionList()}
           </Dropdown>
@@ -209,8 +209,8 @@ const Metrics: React.FC = () => {
 
   const getMetrics = async () => {
     try {
-      let shouldsum = true;
-      let namespace = "default";
+      const shouldsum = true;
+      const namespace = "default";
 
       // calculate start and end range
       const d = new Date();
@@ -315,14 +315,14 @@ const Metrics: React.FC = () => {
       <Header>
         <Flex>
           <MetricSelector
-            onClick={() => setDropdownExpanded(!dropdownExpanded)}
+            onClick={() => { setDropdownExpanded(!dropdownExpanded); }}
           >
             <MetricsLabel>{selectedMetricLabel}</MetricsLabel>
             <i className="material-icons">arrow_drop_down</i>
             {renderDropdown()}
           </MetricSelector>
           <Relative>
-            <IconWrapper onClick={() => setShowMetricsSettings(true)}>
+            <IconWrapper onClick={() => { setShowMetricsSettings(true); }}>
               <SettingsIcon src={settings} />
             </IconWrapper>
             {renderMetricsSettings()}
@@ -342,7 +342,7 @@ const Metrics: React.FC = () => {
               { value: "1M", label: "1M" },
             ]}
             currentTab={selectedRange}
-            setCurrentTab={(x: string) => setSelectedRange(x)}
+            setCurrentTab={(x: string) => { setSelectedRange(x); }}
           />
         </RangeWrapper>
       </Header>
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/NamespaceList.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/NamespaceList.tsx
index efa74b436c..80b5ae8fac 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/NamespaceList.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/NamespaceList.tsx
@@ -1,7 +1,7 @@
 import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
 import styled from "styled-components";
 import { Context } from "shared/Context";
-import { ClusterType, ProjectType } from "shared/types";
+import { type ClusterType, type ProjectType } from "shared/types";
 import { pushFiltered } from "shared/routing";
 import { useHistory, useLocation } from "react-router";
 import useAuth from "shared/auth/useAuth";
@@ -15,7 +15,7 @@ const useWebsocket = (
   const wsRef = useRef<WebSocket | undefined>(undefined);
 
   useEffect(() => {
-    let protocol = window.location.protocol == "https:" ? "wss" : "ws";
+    const protocol = window.location.protocol == "https:" ? "wss" : "ws";
     wsRef.current = new WebSocket(
       `${protocol}://${window.location.host}/api/projects/${currentProject.id}/clusters/${currentCluster.id}/namespace/status`
     );
@@ -121,12 +121,12 @@ export const NamespaceList: React.FunctionComponent = () => {
         {isAuthorized("namespace", "", ["get", "create"]) && (
           <Button
             onClick={() =>
-              setCurrentModal(
+              { setCurrentModal(
                 "NamespaceModal",
                 namespaces.map((namespace) => ({
                   value: namespace.metadata.name,
                 }))
-              )
+              ); }
             }
           >
             <i className="material-icons">add</i> Add namespace
@@ -139,10 +139,10 @@ export const NamespaceList: React.FunctionComponent = () => {
             <StyledCard
               key={namespace?.metadata?.name}
               onClick={() =>
-                pushFiltered({ location, history }, `/applications`, [], {
+                { pushFiltered({ location, history }, `/applications`, [], {
                   cluster: currentCluster.name,
                   namespace: namespace.metadata.name,
-                })
+                }); }
               }
             >
               <ContentContainer>
@@ -159,7 +159,7 @@ export const NamespaceList: React.FunctionComponent = () => {
                     expandIcon="more_vert"
                     shrinkIcon="more_vert"
                   >
-                    <OptionsDropdown.Option onClick={() => onDelete(namespace)}>
+                    <OptionsDropdown.Option onClick={() => { onDelete(namespace); }}>
                       <i className="material-icons-outlined">delete</i>
                       <span>Delete</span>
                     </OptionsDropdown.Option>
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/NodeList.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/NodeList.tsx
index 10a47d25e4..ee56c6847e 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/NodeList.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/NodeList.tsx
@@ -1,7 +1,7 @@
 import React, { useContext, useEffect, useMemo, useState } from "react";
 
 import Table from "components/OldTable";
-import { Column } from "react-table";
+import { type Column } from "react-table";
 import styled from "styled-components";
 import api from "shared/api";
 import { Context } from "shared/Context";
@@ -15,7 +15,7 @@ const NodeList: React.FC = () => {
   const history = useHistory();
   const location = useLocation();
 
-  const columns = useMemo<Column<any>[]>(
+  const columns = useMemo<Array<Column<any>>>(
     () => [
       {
         Header: "Node Name",
@@ -59,7 +59,7 @@ const NodeList: React.FC = () => {
       `${Number(number).toFixed(2)}%`;
 
     const getMachineType = (labels: any) => {
-      return (labels && labels["node.kubernetes.io/instance-type"]) || "N/A";
+      return (labels?.["node.kubernetes.io/instance-type"]) || "N/A";
     };
 
     return nodeList
@@ -113,7 +113,7 @@ const NodeList: React.FC = () => {
       .catch(() => {
         console.log({ error: true });
       })
-      .finally(() => setLoading(false));
+      .finally(() => { setLoading(false); });
   }, [context, setNodeList]);
 
   const handleOnRowClick = (row: any) => {
diff --git a/dashboard/src/main/home/cluster-dashboard/dashboard/ProvisionerStatus.tsx b/dashboard/src/main/home/cluster-dashboard/dashboard/ProvisionerStatus.tsx
index 4b7b131ded..9dc4be5a9f 100644
--- a/dashboard/src/main/home/cluster-dashboard/dashboard/ProvisionerStatus.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/dashboard/ProvisionerStatus.tsx
@@ -76,7 +76,7 @@ const ProvisionerStatus: React.FC<Props> = ( props ) => {
       PROVISIONING_STATUS_POLL_INTERVAL
     );
     pollProvisioningAndClusterStatus();
-    return () => clearInterval(intervalId);
+    return () => { clearInterval(intervalId); };
   }, []);
 
   useEffect(() => {
diff --git a/dashboard/src/main/home/cluster-dashboard/env-groups/EnvGroupList.tsx b/dashboard/src/main/home/cluster-dashboard/env-groups/EnvGroupList.tsx
index 7fc32f4259..e915596262 100644
--- a/dashboard/src/main/home/cluster-dashboard/env-groups/EnvGroupList.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/env-groups/EnvGroupList.tsx
@@ -3,12 +3,12 @@ import styled from "styled-components";
 
 import { Context } from "shared/Context";
 import api from "shared/api";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 
 import EnvGroup from "./EnvGroup";
 import Loading from "components/Loading";
 import { getQueryParam, pushQueryParams } from "shared/routing";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import Placeholder from "components/Placeholder";
 
@@ -35,7 +35,7 @@ const EnvGroupList: React.FunctionComponent<Props> = (props) => {
   const [hasError, setHasError] = useState<boolean>(false);
 
   const updateEnvGroups = async () => {
-    let { currentProject, currentCluster } = context;
+    const { currentProject, currentCluster } = context;
     try {
       let envGroups: any[] = []
       if (currentProject?.simplified_view_enabled) {
@@ -58,7 +58,7 @@ const EnvGroupList: React.FunctionComponent<Props> = (props) => {
             {},
             {
               id: currentProject.id,
-              namespace: namespace,
+              namespace,
               cluster_id: currentCluster.id,
             }
           )
@@ -66,7 +66,7 @@ const EnvGroupList: React.FunctionComponent<Props> = (props) => {
             return res.data;
           });
       }
-      let sortedGroups = envGroups;
+      const sortedGroups = envGroups;
       if (sortedGroups) {
         switch (sortType) {
           case "Oldest":
diff --git a/dashboard/src/main/home/cluster-dashboard/env-groups/ExpandedEnvGroupDashboard.tsx b/dashboard/src/main/home/cluster-dashboard/env-groups/ExpandedEnvGroupDashboard.tsx
index 2034628077..2792159bed 100644
--- a/dashboard/src/main/home/cluster-dashboard/env-groups/ExpandedEnvGroupDashboard.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/env-groups/ExpandedEnvGroupDashboard.tsx
@@ -4,12 +4,12 @@ import styled from "styled-components";
 import sliders from "assets/sliders.svg";
 
 import { Context } from "shared/Context";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 
 import ExpandedEnvGroup from "./ExpandedEnvGroup";
-import { RouteComponentProps, useParams, withRouter } from "react-router";
+import { type RouteComponentProps, useParams, withRouter } from "react-router";
 import { getQueryParam, pushQueryParams } from "shared/routing";
-import { withAuth, WithAuthProps } from "shared/auth/AuthorizationHoc";
+import { withAuth, type WithAuthProps } from "shared/auth/AuthorizationHoc";
 import { useQuery } from "@tanstack/react-query";
 import api from "shared/api";
 import Loading from "components/Loading";
@@ -111,7 +111,7 @@ const EnvGroupDashboard = (props: PropsType) => {
         namespace={(currentProject?.simplified_view_enabled && currentProject?.capi_provisioner_enabled) ? "porter-env-group" : expandedEnvGroup?.namespace ?? namespace}
         currentCluster={props.currentCluster}
         envGroup={expandedEnvGroup}
-        closeExpanded={() => props.history.push("/env-groups")}
+        closeExpanded={() => { props.history.push("/env-groups"); }}
       />
     );
   };
diff --git a/dashboard/src/main/home/cluster-dashboard/expanded-chart/CanonicalName.tsx b/dashboard/src/main/home/cluster-dashboard/expanded-chart/CanonicalName.tsx
index 1b96fa3cd2..dc0fafc1cb 100644
--- a/dashboard/src/main/home/cluster-dashboard/expanded-chart/CanonicalName.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/expanded-chart/CanonicalName.tsx
@@ -5,7 +5,7 @@ import SaveButton from "components/SaveButton";
 import api from "shared/api";
 import Color from "color";
 import { Context } from "shared/Context";
-import { ChartType } from "shared/types";
+import { type ChartType } from "shared/types";
 import { isAlphanumeric } from "shared/common";
 
 type Props = {
@@ -85,7 +85,7 @@ const CanonicalName = ({ onSave, release }: Props) => {
       <InputRow
         type="text"
         value={canonicalName}
-        setValue={(x: string) => setCanonicalName(x)}
+        setValue={(x: string) => { setCanonicalName(x); }}
         placeholder="ex: my-app"
         isRequired={true}
         width={"100%"}
@@ -101,7 +101,7 @@ const CanonicalName = ({ onSave, release }: Props) => {
           disabled={shouldDisableSave}
           statusPosition="right"
           text="Save changes"
-          onClick={() => handleSave()}
+          onClick={async () => { await handleSave(); }}
           status={buttonStatus}
         ></SaveButton>
       </Flex>
diff --git a/dashboard/src/main/home/cluster-dashboard/expanded-chart/DeploymentType.tsx b/dashboard/src/main/home/cluster-dashboard/expanded-chart/DeploymentType.tsx
index 57e030c8cf..94d7a38c97 100644
--- a/dashboard/src/main/home/cluster-dashboard/expanded-chart/DeploymentType.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/expanded-chart/DeploymentType.tsx
@@ -2,7 +2,7 @@ import React, { useState } from "react";
 import styled from "styled-components";
 
 import { integrationList } from "shared/common";
-import { ChartType } from "shared/types";
+import { type ChartType } from "shared/types";
 
 type Props = {
   currentChart: ChartType;
diff --git a/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChart.tsx b/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChart.tsx
index 6f429941df..6ca5542451 100644
--- a/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChart.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChart.tsx
@@ -5,7 +5,7 @@ import _, { cloneDeep } from "lodash";
 import loadingSrc from "assets/loading.gif";
 import leftArrow from "assets/left-arrow.svg";
 
-import { ChartType, ClusterType, ResourceType } from "shared/types";
+import { type ChartType, type ClusterType, type ResourceType } from "shared/types";
 import { Context } from "shared/Context";
 import api from "shared/api";
 import StatusIndicator from "components/StatusIndicator";
@@ -14,7 +14,7 @@ import RevisionSection from "./RevisionSection";
 import ValuesYaml from "./ValuesYaml";
 import GraphSection from "./GraphSection";
 import MetricsSection from "./metrics/MetricsSection";
-import LogsSection, { InitLogData } from "./logs-section/LogsSection";
+import LogsSection, { type InitLogData } from "./logs-section/LogsSection";
 import ListSection from "./ListSection";
 import StatusSection from "./status/StatusSection";
 import SettingsSection from "./SettingsSection";
@@ -147,7 +147,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
 
     setCurrentChart(updatedChart);
 
-    updateComponents(updatedChart).finally(() => setIsLoadingChartData(false));
+    updateComponents(updatedChart).finally(() => { setIsLoadingChartData(false); });
   };
 
   const getControllers = async (chart: ChartType) => {
@@ -176,7 +176,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
         }));
       });
 
-      return;
+      
     } catch (error) {
       if (typeof error !== "string") {
         setCurrentError(JSON.stringify(error));
@@ -275,8 +275,8 @@ const ExpandedChart: React.FC<Props> = (props) => {
     const addedEnvGroups = syncedEnvGroups?.added || [];
 
     const addApplicationToEnvGroupPromises = addedEnvGroups.map(
-      (envGroup: any) => {
-        return api.addApplicationToEnvGroup(
+      async (envGroup: any) => {
+        return await api.addApplicationToEnvGroup(
           "<token>",
           {
             name: envGroup?.name,
@@ -300,8 +300,8 @@ const ExpandedChart: React.FC<Props> = (props) => {
     }
 
     const removeApplicationToEnvGroupPromises = deletedEnvGroups.map(
-      (envGroup: any) => {
-        return api.removeApplicationFromEnvGroup(
+      async (envGroup: any) => {
+        return await api.removeApplicationFromEnvGroup(
           "<token>",
           {
             name: envGroup?.name,
@@ -368,7 +368,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
         error: err,
       });
 
-      return;
+      
     }
   };
 
@@ -389,7 +389,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
           "<token>",
           {
             values: valuesYaml,
-            version: version,
+            version,
             latest_revision: currentChart.version,
           },
           {
@@ -472,8 +472,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
                   <Spinner src={loadingSrc} /> This application is currently
                   being deployed
                 </Header>
-                {props.currentChart.git_action_config &&
-                  props.currentChart.git_action_config.gitlab_integration_id ? (
+                {props.currentChart.git_action_config?.gitlab_integration_id ? (
                   <>
                     Navigate to the{" "}
                     <A
@@ -503,7 +502,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
           return (
             <StatusSection
               currentChart={chart}
-              setFullScreenLogs={() => setFullScreenLogs(true)}
+              setFullScreenLogs={() => { setFullScreenLogs(true); }}
             />
           );
         }
@@ -511,13 +510,13 @@ const ExpandedChart: React.FC<Props> = (props) => {
         return (
           <SettingsSection
             currentChart={chart}
-            refreshChart={() => getChartData(currentChart)}
+            refreshChart={async () => { await getChartData(currentChart); }}
             setShowDeleteOverlay={(x: boolean) => {
               if (x) {
                 setCurrentOverlay({
                   message: `Are you sure you want to delete ${currentChart.name}?`,
                   onYes: handleUninstallChart,
-                  onNo: () => setCurrentOverlay(null),
+                  onNo: () => { setCurrentOverlay(null); },
                 });
               } else {
                 setCurrentOverlay(null);
@@ -548,7 +547,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
         return (
           <ValuesYaml
             currentChart={chart}
-            refreshChart={() => getChartData(currentChart)}
+            refreshChart={async () => { await getChartData(currentChart); }}
             disabled={!isAuthorized("application", "", ["get", "update"])}
           />
         );
@@ -627,7 +626,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
 
   const setRevision = (chart: ChartType, isCurrent?: boolean) => {
     // if we've set the revision, we also override the revision in log data
-    let newLogData = logData;
+    const newLogData = logData;
 
     newLogData.revision = `${chart.version}`;
 
@@ -647,7 +646,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
       return (
         <Url>
           <i className="material-icons">link</i>
-          <a href={url} target="_blank">
+          <a href={url} target="_blank" rel="noreferrer">
             {url}
           </a>
         </Url>
@@ -692,8 +691,8 @@ const ExpandedChart: React.FC<Props> = (props) => {
     setCurrentOverlay(null);
     const syncedEnvGroups = currentChart.config?.container?.env?.synced || [];
     const removeApplicationToEnvGroupPromises = syncedEnvGroups.map(
-      (envGroup: any) => {
-        return api.removeApplicationFromEnvGroup(
+      async (envGroup: any) => {
+        return await api.removeApplicationFromEnvGroup(
           "<token>",
           {
             name: envGroup?.name,
@@ -847,7 +846,6 @@ const ExpandedChart: React.FC<Props> = (props) => {
       (c) =>
         c.Kind === "Ingress" ||
         (c.Kind === "Gateway" &&
-          c.RawYAML?.apiVersion &&
           c.RawYAML?.apiVersion?.startsWith("networking.istio.io"))
     );
 
@@ -870,7 +868,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
         if (!isSubscribed) {
           return;
         }
-        if (res.data?.spec?.rules && res.data?.spec?.rules[0]?.host) {
+        if (res.data?.spec?.rules?.[0]?.host) {
           setUrl(`https://${res.data?.spec?.rules[0]?.host}`);
           return;
         }
@@ -883,12 +881,10 @@ const ExpandedChart: React.FC<Props> = (props) => {
         }
 
         if (
-          res.data?.spec?.servers &&
-          res.data?.spec?.servers[0]?.hosts &&
-          res.data?.spec?.servers[0]?.hosts[0]
+          res.data?.spec?.servers?.[0]?.hosts?.[0]
         ) {
           setUrl(`http://${res.data?.spec?.servers[0]?.hosts[0]}`);
-          return;
+          
         }
       })
       .catch(console.log);
@@ -902,7 +898,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
         <StatusSection
           fullscreen={true}
           currentChart={currentChart}
-          setFullScreenLogs={() => setFullScreenLogs(false)}
+          setFullScreenLogs={() => { setFullScreenLogs(false); }}
         />
       ) : (
         <>
@@ -990,10 +986,10 @@ const ExpandedChart: React.FC<Props> = (props) => {
                       setShowRevisions(!showRevisions);
                     }}
                     chart={currentChart}
-                    refreshChart={() => getChartData(currentChart)}
+                    refreshChart={async () => { await getChartData(currentChart); }}
                     setRevision={setRevision}
                     forceRefreshRevisions={forceRefreshRevisions}
-                    refreshRevisionsOff={() => setForceRefreshRevisions(false)}
+                    refreshRevisionsOff={() => { setForceRefreshRevisions(false); }}
                     shouldUpdate={
                       currentChart.latest_version &&
                       currentChart.latest_version !==
diff --git a/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChartWrapper.tsx b/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChartWrapper.tsx
index ddbfa084f9..a801d1953e 100644
--- a/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChartWrapper.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChartWrapper.tsx
@@ -1,11 +1,11 @@
 import React, { Component } from "react";
 import styled from "styled-components";
 import { Context } from "shared/Context";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import {
-  ChartType,
-  ChartTypeWithExtendedConfig,
+  type ChartType,
+  type ChartTypeWithExtendedConfig,
   StorageType,
 } from "shared/types";
 import api from "shared/api";
@@ -36,9 +36,9 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
 
   // Retrieve full chart data (includes form and values)
   getChartData = () => {
-    let { match } = this.props;
-    let { namespace, chartName } = match.params as any;
-    let { currentProject, currentCluster } = this.context;
+    const { match } = this.props;
+    const { namespace, chartName } = match.params as any;
+    const { currentProject, currentCluster } = this.context;
     if (currentProject && currentCluster) {
       api
         .getChart<ChartTypeWithExtendedConfig>(
@@ -46,7 +46,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
           {},
           {
             id: currentProject.id,
-            namespace: namespace,
+            namespace,
             cluster_id: currentCluster.id,
             name: chartName,
             revision: 0,
@@ -56,7 +56,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
           const chart = res.data;
           this.setState({ currentChart: res.data, loading: false });
           const isJob = res.data.form?.name?.toLowerCase() === "job";
-          let route = `${isJob ? "/jobs" : "/applications"}/${
+          const route = `${isJob ? "/jobs" : "/applications"}/${
             currentCluster.name
           }/${chart.namespace}/${chart.name}`;
 
@@ -73,7 +73,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
               "project_id",
               "closeChartRedirectUrl",
             ]);
-            return;
+            
           }
         })
         .catch((err) => {
@@ -90,9 +90,9 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
   }
 
   render() {
-    let { setSidebar, location, match } = this.props;
-    let { baseRoute, namespace } = match.params as any;
-    let { loading, currentChart } = this.state;
+    const { setSidebar, location, match } = this.props;
+    const { baseRoute, namespace } = match.params as any;
+    const { loading, currentChart } = this.state;
 
     if (loading) {
       return (
@@ -107,7 +107,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
           currentChart={currentChart}
           currentCluster={this.context.currentCluster}
           closeChart={() => {
-            let urlParams = new URLSearchParams(window.location.search);
+            const urlParams = new URLSearchParams(window.location.search);
 
             if (urlParams.get("closeChartRedirectUrl")) {
               this.props.history.push(urlParams.get("closeChartRedirectUrl"));
@@ -116,7 +116,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
 
             pushFiltered(this.props, "/jobs", ["project_id"], {
               cluster: this.context.currentCluster.name,
-              namespace: namespace,
+              namespace,
             });
           }}
           setSidebar={setSidebar}
@@ -130,7 +130,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
           currentChart={currentChart}
           currentCluster={this.context.currentCluster}
           closeChart={() => {
-            let urlParams = new URLSearchParams(window.location.search);
+            const urlParams = new URLSearchParams(window.location.search);
 
             if (urlParams.get("closeChartRedirectUrl")) {
               this.props.history.push(urlParams.get("closeChartRedirectUrl"));
@@ -139,7 +139,7 @@ class ExpandedChartWrapper extends Component<PropsType, StateType> {
 
             pushFiltered(this.props, "/applications", ["project_id"], {
               cluster: this.context.currentCluster.name,
-              namespace: namespace,
+              namespace,
             });
           }}
           setSidebar={setSidebar}
diff --git a/dashboard/src/main/home/cluster-dashboard/expanded-chart/metrics/AggregatedDataLegend.tsx b/dashboard/src/main/home/cluster-dashboard/expanded-chart/metrics/AggregatedDataLegend.tsx
index 23f85c18cf..e802add3c3 100644
--- a/dashboard/src/main/home/cluster-dashboard/expanded-chart/metrics/AggregatedDataLegend.tsx
+++ b/dashboard/src/main/home/cluster-dashboard/expanded-chart/metrics/AggregatedDataLegend.tsx
@@ -2,10 +2,10 @@ import React from "react";
 import * as stats from "simple-statistics";
 import styled from "styled-components";
 import chroma from "chroma-js";
-import { NormalizedMetricsData } from "./types";
+import { type NormalizedMetricsData } from "./types";
 import { AggregatedDataColors } from "./utils";
 
-interface AggregatedDataLegendProps {
+type AggregatedDataLegendProps = {
   data: NormalizedMetricsData[];
   hideAvg: boolean;
 }
diff --git a/dashboard/src/main/home/cluster-dashboard/stacks/types.ts b/dashboard/src/main/home/cluster-dashboard/stacks/types.ts
index 2947ab1d7a..d90839ee70 100644
--- a/dashboard/src/main/home/cluster-dashboard/stacks/types.ts
+++ b/dashboard/src/main/home/cluster-dashboard/stacks/types.ts
@@ -1,14 +1,14 @@
 export type CreateStackBody = {
   name: string;
-  app_resources: {
+  app_resources: Array<{
     name: string;
     source_config_name: string;
     template_name: string;
     template_version: string;
     template_repo_url?: string;
     values: unknown;
-  }[];
-  source_configs: {
+  }>;
+  source_configs: Array<{
     display_name: string;
     name: string;
     image_repo_uri: string;
@@ -20,18 +20,14 @@ export type CreateStackBody = {
       buildpack?: unknown;
       dockerfile?: unknown;
     };
-  }[];
+  }>;
 
-  env_groups: {
+  env_groups: Array<{
     name: string;
-    variables: {
-      [key: string]: string;
-    };
-    secret_variables: {
-      [key: string]: string;
-    };
+    variables: Record<string, string>;
+    secret_variables: Record<string, string>;
     linked_applications: string[];
-  }[];
+  }>;
 };
 
 export type CreateStackResponse = Stack;
diff --git a/dashboard/src/main/home/dashboard/ClusterPlaceholder.tsx b/dashboard/src/main/home/dashboard/ClusterPlaceholder.tsx
index 02755e264e..7778d791ec 100644
--- a/dashboard/src/main/home/dashboard/ClusterPlaceholder.tsx
+++ b/dashboard/src/main/home/dashboard/ClusterPlaceholder.tsx
@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import styled from "styled-components";
 
 import { Context } from "shared/Context";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 
 import ClusterList from "./OldClusterList";
 import Loading from "components/Loading";
diff --git a/dashboard/src/main/home/dashboard/ClusterSection.tsx b/dashboard/src/main/home/dashboard/ClusterSection.tsx
index ea55de005e..3305fc2e1a 100644
--- a/dashboard/src/main/home/dashboard/ClusterSection.tsx
+++ b/dashboard/src/main/home/dashboard/ClusterSection.tsx
@@ -20,7 +20,7 @@ const ClusterSection = (props: Props) => {
   if (currentStep === "cloud") {
     return (
       <>
-        <TitleSection handleNavBack={() => setCurrentStep("")}>
+        <TitleSection handleNavBack={() => { setCurrentStep(""); }}>
           <Title>
             <ClusterIcon>
               <svg
@@ -94,7 +94,7 @@ const ClusterSection = (props: Props) => {
   return (
     <>
       {(usage?.current.cluster > 1 || !currentCluster) && (
-        <Button onClick={() => setCurrentStep("cloud")}>
+        <Button onClick={() => { setCurrentStep("cloud"); }}>
           <i className="material-icons">add</i> Create a cluster
         </Button>
       )}
diff --git a/dashboard/src/main/home/dashboard/OldClusterList.tsx b/dashboard/src/main/home/dashboard/OldClusterList.tsx
index 878999a109..5749f4e7e8 100644
--- a/dashboard/src/main/home/dashboard/OldClusterList.tsx
+++ b/dashboard/src/main/home/dashboard/OldClusterList.tsx
@@ -3,11 +3,11 @@ import styled from "styled-components";
 
 import { Context } from "shared/Context";
 import api from "shared/api";
-import { ClusterType, DetailedClusterType } from "shared/types";
+import { type ClusterType, type DetailedClusterType } from "shared/types";
 import Helper from "components/form-components/Helper";
 import { pushFiltered } from "shared/routing";
 
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import Modal from "../modals/Modal";
 import Heading from "components/form-components/Heading";
@@ -155,7 +155,7 @@ class Templates extends Component<PropsType, StateType> {
       <>
         {clusterError && (
           <Modal
-            onRequestClose={() => this.setState({ showErrorModal: undefined })}
+            onRequestClose={() => { this.setState({ showErrorModal: undefined }); }}
             width="665px"
             height="min-content"
           >
diff --git a/dashboard/src/main/home/integrations/GitlabIntegrationList.tsx b/dashboard/src/main/home/integrations/GitlabIntegrationList.tsx
index 17b560f880..65304dd9a5 100644
--- a/dashboard/src/main/home/integrations/GitlabIntegrationList.tsx
+++ b/dashboard/src/main/home/integrations/GitlabIntegrationList.tsx
@@ -6,7 +6,7 @@ import api from "../../../shared/api";
 import { integrationList } from "shared/common";
 import DynamicLink from "components/DynamicLink";
 
-interface Props {
+type Props = {
   gitlabData: any[];
   updateIntegrationList: () => void;
 }
@@ -58,11 +58,11 @@ const GitlabIntegrationList: React.FC<Props> = (props) => {
         message={`Are you sure you want to delete the GitLab integration for instance ${currentState.deleteName}?`}
         onYes={handleDeleteIntegration}
         onNo={() =>
-          setCurrentState({
+          { setCurrentState({
             isDelete: false,
             deleteName: "",
             deleteID: 0,
-          })
+          }); }
         }
       />
       <StyledIntegrationList>
diff --git a/dashboard/src/main/home/integrations/IntegrationCategories.tsx b/dashboard/src/main/home/integrations/IntegrationCategories.tsx
index c5c291b9fd..1875b7c875 100644
--- a/dashboard/src/main/home/integrations/IntegrationCategories.tsx
+++ b/dashboard/src/main/home/integrations/IntegrationCategories.tsx
@@ -3,7 +3,7 @@ import styled from "styled-components";
 
 import { Context } from "shared/Context";
 import { integrationList } from "shared/common";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import IntegrationList from "./IntegrationList";
 import DopplerIntegrationList from "./DopplerIntegrationList";
 import api from "shared/api";
@@ -49,10 +49,10 @@ const IntegrationCategories: React.FC<Props> = (props) => {
           .getProjectRegistries("<token>", {}, { id: currentProject.id })
           .then((res) => {
             // Sort res.data into service type and sort each service's registry alphabetically
-            let grouped: any = {};
+            const grouped: any = {};
             let final: any = [];
             for (let i = 0; i < res.data.length; i++) {
-              let p = res.data[i].service;
+              const p = res.data[i].service;
               if (!grouped[p]) {
                 grouped[p] = [];
               }
@@ -63,8 +63,8 @@ const IntegrationCategories: React.FC<Props> = (props) => {
                 val.sort((a: any, b: any) => (a.name > b.name ? 1 : -1))
               );
             });
-            let newCurrentOptions = [] as string[];
-            let newCurrentTitles = [] as string[];
+            const newCurrentOptions = [] as string[];
+            const newCurrentTitles = [] as string[];
             final.forEach((integration: any, i: number) => {
               newCurrentOptions.push(integration.service);
               newCurrentTitles.push(integration.name);
@@ -111,18 +111,17 @@ const IntegrationCategories: React.FC<Props> = (props) => {
 
   const { category: currentCategory } = props;
   const icon =
-    integrationList[currentCategory] && integrationList[currentCategory].icon;
+    integrationList[currentCategory]?.icon;
   const label =
-    integrationList[currentCategory] && integrationList[currentCategory].label;
+    integrationList[currentCategory]?.label;
   const buttonText =
-    integrationList[currentCategory] &&
-    integrationList[currentCategory].buttonText;
+    integrationList[currentCategory]?.buttonText;
 
   return (
     <>
       <BreadcrumbRow>
         <Breadcrumb
-          onClick={() => pushFiltered(props, "/integrations", ["project_id"])}
+          onClick={() => { pushFiltered(props, "/integrations", ["project_id"]); }}
         >
           <ArrowIcon src={leftArrow} />
           <Wrap>Back</Wrap>
@@ -169,7 +168,7 @@ const IntegrationCategories: React.FC<Props> = (props) => {
         <GitlabIntegrationList
           gitlabData={gitlabData}
           updateIntegrationList={() =>
-            getIntegrationsForCategory(props.category)
+            { getIntegrationsForCategory(props.category); }
           }
         />
       ) : props.category === "slack" ? (
@@ -185,7 +184,7 @@ const IntegrationCategories: React.FC<Props> = (props) => {
           titles={currentTitles}
           itemIdentifier={currentIntegrationData}
           updateIntegrationList={() =>
-            getIntegrationsForCategory(props.category)
+            { getIntegrationsForCategory(props.category); }
           }
         />
       )}
diff --git a/dashboard/src/main/home/integrations/IntegrationList.tsx b/dashboard/src/main/home/integrations/IntegrationList.tsx
index 25398f71fb..29f7d84c8d 100644
--- a/dashboard/src/main/home/integrations/IntegrationList.tsx
+++ b/dashboard/src/main/home/integrations/IntegrationList.tsx
@@ -1,4 +1,4 @@
-import React, { Component, MouseEvent } from "react";
+import React, { Component, type MouseEvent } from "react";
 import styled from "styled-components";
 
 import { Context } from "shared/Context";
@@ -55,7 +55,7 @@ export default class IntegrationList extends Component<PropsType, StateType> {
     if (event) {
       event.stopPropagation();
     }
-    let x = this.state.displayExpanded;
+    const x = this.state.displayExpanded;
     x[index] = !x[index];
     this.setState({ displayExpanded: x });
   };
@@ -73,7 +73,7 @@ export default class IntegrationList extends Component<PropsType, StateType> {
   };
 
   handleDeleteIntegration = () => {
-    let { currentProject } = this.context;
+    const { currentProject } = this.context;
 
     if (this.props.currentCategory === "registry") {
       api
@@ -96,15 +96,15 @@ export default class IntegrationList extends Component<PropsType, StateType> {
   };
 
   handleParent = (event: any, integration: string) =>
-    this.props.setCurrent && this.props.setCurrent(integration);
+    { this.props.setCurrent && this.props.setCurrent(integration); };
 
   renderContents = () => {
-    let { integrations, titles, setCurrent, isCategory } = this.props;
+    const { integrations, titles, setCurrent, isCategory } = this.props;
 
     if (titles && titles.length > 0) {
       return integrations.map((integration: string, i: number) => {
-        let label = titles[i];
-        let item_id =
+        const label = titles[i];
+        const item_id =
           this.props.itemIdentifier[i].id || this.props.itemIdentifier[i];
 
         return (
@@ -115,23 +115,23 @@ export default class IntegrationList extends Component<PropsType, StateType> {
             key={i}
             itemId={this.props.itemIdentifier[i]}
             label={label}
-            toggleCollapse={(e: MouseEvent) => this.toggleDisplay(e, i)}
-            triggerDelete={(e: MouseEvent) => this.triggerDelete(e, i, item_id)}
+            toggleCollapse={(e: MouseEvent) => { this.toggleDisplay(e, i); }}
+            triggerDelete={(e: MouseEvent) => { this.triggerDelete(e, i, item_id); }}
           />
         );
       });
     } else if (integrations && integrations.length > 0) {
       return integrations.map((integration: string, i: number) => {
-        let icon =
-          integrationList[integration] && integrationList[integration].icon;
-        let label =
-          integrationList[integration] && integrationList[integration].label;
-        let disabled = integration === "kubernetes";
+        const icon =
+          integrationList[integration]?.icon;
+        const label =
+          integrationList[integration]?.label;
+        const disabled = integration === "kubernetes";
         return (
           <Integration
             key={i}
             onClick={() =>
-              disabled ? null : setCurrent && setCurrent(integration)
+              { disabled ? null : setCurrent && setCurrent(integration); }
             }
             disabled={disabled}
           >
@@ -154,7 +154,7 @@ export default class IntegrationList extends Component<PropsType, StateType> {
   collapseAllButton = () => (
     <Button
       onClick={() =>
-        this.allCollapsed() ? this.expandAll() : this.collapseAll()
+        { this.allCollapsed() ? this.expandAll() : this.collapseAll(); }
       }
     >
       {this.allCollapsed() ? (
@@ -180,7 +180,7 @@ export default class IntegrationList extends Component<PropsType, StateType> {
               : "Github integration"
           } with name ${this.state.deleteName}?`}
           onYes={this.handleDeleteIntegration}
-          onNo={() => this.setState({ isDelete: false })}
+          onNo={() => { this.setState({ isDelete: false }); }}
         />
         {this.renderContents()}
       </StyledIntegrationList>
diff --git a/dashboard/src/main/home/integrations/IntegrationRow.tsx b/dashboard/src/main/home/integrations/IntegrationRow.tsx
index b0b8feb94e..aad050bac4 100644
--- a/dashboard/src/main/home/integrations/IntegrationRow.tsx
+++ b/dashboard/src/main/home/integrations/IntegrationRow.tsx
@@ -1,9 +1,9 @@
 import styled from "styled-components";
-import React, { Component, MouseEvent, MouseEventHandler } from "react";
+import React, { Component, type MouseEvent, type MouseEventHandler } from "react";
 
 import ImageList from "components/image-selector/ImageList";
 import RepoList from "components/repo-selector/RepoList";
-import { ActionConfigType } from "shared/types";
+import { type ActionConfigType } from "shared/types";
 import { integrationList } from "shared/common";
 
 import CreateIntegrationForm from "./create-integration/CreateIntegrationForm";
@@ -46,16 +46,14 @@ export default class IntegrationRow extends Component<PropsType, StateType> {
 
   render = () => {
     const icon =
-      integrationList[this.props.integration] &&
-      integrationList[this.props.integration].icon;
+      integrationList[this.props.integration]?.icon;
     const subtitle =
-      integrationList[this.props.integration] &&
-      integrationList[this.props.integration].label;
+      integrationList[this.props.integration]?.label;
     return (
       <Integration disabled={false}>
         <MainRow onClick={this.props.toggleCollapse} disabled={false}>
           <Flex>
-            <Icon src={icon ? icon : "https://avatars2.githubusercontent.com/u/52505464?s=400&u=da920f994c67665c7ad6c606a5286557d4f8555f&v=4"} />
+            <Icon src={icon || "https://avatars2.githubusercontent.com/u/52505464?s=400&u=da920f994c67665c7ad6c606a5286557d4f8555f&v=4"} />
             <Description>
               <Label>{this.props.label}</Label>
               <Subtitle>{subtitle}</Subtitle>
diff --git a/dashboard/src/main/home/integrations/create-integration/DockerHubForm.tsx b/dashboard/src/main/home/integrations/create-integration/DockerHubForm.tsx
index 4b89a5ef06..bd2594dd7f 100644
--- a/dashboard/src/main/home/integrations/create-integration/DockerHubForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/DockerHubForm.tsx
@@ -24,7 +24,7 @@ export default class DockerHubForm extends Component<PropsType, StateType> {
   };
 
   isDisabled = (): boolean => {
-    let {
+    const {
       registryURL,
       dockerEmail,
       dockerUsername,
@@ -52,7 +52,7 @@ export default class DockerHubForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.registryURL}
-            setValue={(x: string) => this.setState({ registryURL: x })}
+            setValue={(x: string) => { this.setState({ registryURL: x }); }}
             label="📦 Registry URL"
             placeholder="ex: index.docker.io"
             width="100%"
@@ -60,7 +60,7 @@ export default class DockerHubForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.dockerEmail}
-            setValue={(x: string) => this.setState({ dockerEmail: x })}
+            setValue={(x: string) => { this.setState({ dockerEmail: x }); }}
             label="✉️ Docker Email"
             placeholder="ex: captain@ahab.com"
             width="100%"
@@ -68,7 +68,7 @@ export default class DockerHubForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.dockerUsername}
-            setValue={(x: string) => this.setState({ dockerUsername: x })}
+            setValue={(x: string) => { this.setState({ dockerUsername: x }); }}
             label="👤 Docker Username"
             placeholder="ex: whale_watcher_2000"
             width="100%"
@@ -76,7 +76,7 @@ export default class DockerHubForm extends Component<PropsType, StateType> {
           <InputRow
             type="password"
             value={this.state.dockerPassword}
-            setValue={(x: string) => this.setState({ dockerPassword: x })}
+            setValue={(x: string) => { this.setState({ dockerPassword: x }); }}
             label="🔒 Docker Password"
             placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
             width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/ECRForm.tsx b/dashboard/src/main/home/integrations/create-integration/ECRForm.tsx
index 283724845d..6ba0e5eb4a 100644
--- a/dashboard/src/main/home/integrations/create-integration/ECRForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/ECRForm.tsx
@@ -29,7 +29,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
   };
 
   isDisabled = (): boolean => {
-    let { awsRegion, awsAccessId, awsSecretKey, credentialsName } = this.state;
+    const { awsRegion, awsAccessId, awsSecretKey, credentialsName } = this.state;
     if (
       awsRegion === "" ||
       awsAccessId === "" ||
@@ -41,11 +41,11 @@ export default class ECRForm extends Component<PropsType, StateType> {
     return false;
   };
 
-  catchErr = (err: any) => console.log(err);
+  catchErr = (err: any) => { console.log(err); };
 
   handleSubmit = () => {
-    let { awsRegion, awsAccessId, awsSecretKey, credentialsName } = this.state;
-    let { currentProject } = this.context;
+    const { awsRegion, awsAccessId, awsSecretKey, credentialsName } = this.state;
+    const { currentProject } = this.context;
 
     api
       .createAWSIntegration(
@@ -57,8 +57,8 @@ export default class ECRForm extends Component<PropsType, StateType> {
         },
         { id: currentProject.id }
       )
-      .then((res) =>
-        api.connectECRRegistry(
+      .then(async (res) =>
+        await api.connectECRRegistry(
           "<token>",
           {
             name: credentialsName,
@@ -67,7 +67,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
           { id: currentProject.id }
         )
       )
-      .then(() => this.props.closeForm())
+      .then(() => { this.props.closeForm(); })
       .catch(this.catchErr);
   };
 
@@ -82,7 +82,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.credentialsName}
-            setValue={(x: string) => this.setState({ credentialsName: x })}
+            setValue={(x: string) => { this.setState({ credentialsName: x }); }}
             label="🏷️ Registry Name"
             placeholder="ex: paper-straw"
             width="100%"
@@ -92,7 +92,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.awsRegion}
-            setValue={(x: string) => this.setState({ awsRegion: x })}
+            setValue={(x: string) => { this.setState({ awsRegion: x }); }}
             label="📍 AWS region"
             placeholder="ex: mars-north-12"
             width="100%"
@@ -100,7 +100,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.awsAccessId}
-            setValue={(x: string) => this.setState({ awsAccessId: x })}
+            setValue={(x: string) => { this.setState({ awsAccessId: x }); }}
             label="👤 AWS access ID"
             placeholder="ex: AKIAIOSFODNN7EXAMPLE"
             width="100%"
@@ -108,7 +108,7 @@ export default class ECRForm extends Component<PropsType, StateType> {
           <InputRow
             type="password"
             value={this.state.awsSecretKey}
-            setValue={(x: string) => this.setState({ awsSecretKey: x })}
+            setValue={(x: string) => { this.setState({ awsSecretKey: x }); }}
             label="🔒 AWS secret key"
             placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
             width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/EKSForm.tsx b/dashboard/src/main/home/integrations/create-integration/EKSForm.tsx
index 294716480a..9b313e2c4f 100644
--- a/dashboard/src/main/home/integrations/create-integration/EKSForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/EKSForm.tsx
@@ -29,7 +29,7 @@ export default class EKSForm extends Component<PropsType, StateType> {
   };
 
   isDisabled = (): boolean => {
-    let {
+    const {
       clusterName,
       clusterEndpoint,
       clusterCA,
@@ -61,7 +61,7 @@ export default class EKSForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.clusterName}
-            setValue={(x: string) => this.setState({ clusterName: x })}
+            setValue={(x: string) => { this.setState({ clusterName: x }); }}
             label="🏷️ Cluster Name"
             placeholder="ex: briny-pagelet"
             width="100%"
@@ -69,14 +69,14 @@ export default class EKSForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.clusterEndpoint}
-            setValue={(x: string) => this.setState({ clusterEndpoint: x })}
+            setValue={(x: string) => { this.setState({ clusterEndpoint: x }); }}
             label="🌐 Cluster Endpoint"
             placeholder="ex: 00.00.000.00"
             width="100%"
           />
           <TextArea
             value={this.state.clusterCA}
-            setValue={(x: string) => this.setState({ clusterCA: x })}
+            setValue={(x: string) => { this.setState({ clusterCA: x }); }}
             label="🔏 Cluster Certificate"
             placeholder="(Paste your certificate here)"
             width="100%"
@@ -87,7 +87,7 @@ export default class EKSForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.awsAccessId}
-            setValue={(x: string) => this.setState({ awsAccessId: x })}
+            setValue={(x: string) => { this.setState({ awsAccessId: x }); }}
             label="👤 AWS Access ID"
             placeholder="ex: AKIAIOSFODNN7EXAMPLE"
             width="100%"
@@ -95,7 +95,7 @@ export default class EKSForm extends Component<PropsType, StateType> {
           <InputRow
             type="password"
             value={this.state.awsSecretKey}
-            setValue={(x: string) => this.setState({ awsSecretKey: x })}
+            setValue={(x: string) => { this.setState({ awsSecretKey: x }); }}
             label="🔒 AWS Secret Key"
             placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
             width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/GARForm.tsx b/dashboard/src/main/home/integrations/create-integration/GARForm.tsx
index a3e559d10d..e73313d5c5 100644
--- a/dashboard/src/main/home/integrations/create-integration/GARForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/GARForm.tsx
@@ -115,7 +115,7 @@ const GARForm = (props: { closeForm: () => void }) => {
           type="text"
           value={credentialsName}
           setValue={(credentialsName: string) =>
-            setCredentialsName(credentialsName)
+            { setCredentialsName(credentialsName); }
           }
           isRequired={true}
           label="🏷️ Registry name"
@@ -125,7 +125,7 @@ const GARForm = (props: { closeForm: () => void }) => {
         <Heading>GCP settings</Heading>
         <Helper>Service account credentials for GCP permissions.</Helper>
         <UploadArea
-          setValue={(x: any) => setServiceAccountKey(x)}
+          setValue={(x: any) => { setServiceAccountKey(x); }}
           label="🔒 GCP key data (JSON)"
           placeholder="Choose a file or drag it here."
           width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/GCRForm.tsx b/dashboard/src/main/home/integrations/create-integration/GCRForm.tsx
index b95aab334f..754a0a2655 100644
--- a/dashboard/src/main/home/integrations/create-integration/GCRForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/GCRForm.tsx
@@ -30,17 +30,17 @@ export default class GCRForm extends Component<PropsType, StateType> {
   };
 
   isDisabled = (): boolean => {
-    let { serviceAccountKey, credentialsName } = this.state;
+    const { serviceAccountKey, credentialsName } = this.state;
     if (serviceAccountKey === "" || credentialsName === "") {
       return true;
     }
     return false;
   };
 
-  catchError = (err: any) => console.log(err);
+  catchError = (err: any) => { console.log(err); };
 
   handleSubmit = () => {
-    let { currentProject } = this.context;
+    const { currentProject } = this.context;
 
     api
       .createGCPIntegration(
@@ -53,8 +53,8 @@ export default class GCRForm extends Component<PropsType, StateType> {
           project_id: currentProject.id,
         }
       )
-      .then((res) =>
-        api.connectGCRRegistry(
+      .then(async (res) =>
+        await api.connectGCRRegistry(
           "<token>",
           {
             name: this.state.credentialsName,
@@ -84,7 +84,7 @@ export default class GCRForm extends Component<PropsType, StateType> {
             type="text"
             value={this.state.credentialsName}
             setValue={(credentialsName: string) =>
-              this.setState({ credentialsName })
+              { this.setState({ credentialsName }); }
             }
             isRequired={true}
             label="🏷️ Registry name"
@@ -94,7 +94,7 @@ export default class GCRForm extends Component<PropsType, StateType> {
           <Heading>GCP settings</Heading>
           <Helper>Service account credentials for GCP permissions.</Helper>
           <UploadArea
-            setValue={(x: any) => this.setState({ serviceAccountKey: x })}
+            setValue={(x: any) => { this.setState({ serviceAccountKey: x }); }}
             label="🔒 GCP key data (JSON)"
             placeholder="Choose a file or drag it here."
             width="100%"
@@ -109,7 +109,7 @@ export default class GCRForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.url}
-            setValue={(url: string) => this.setState({ url })}
+            setValue={(url: string) => { this.setState({ url }); }}
             label="🔗 GCR URL"
             placeholder="ex: gcr.io/skynet-dev-172969"
             width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/GKEForm.tsx b/dashboard/src/main/home/integrations/create-integration/GKEForm.tsx
index c315431c44..140d5c4b4d 100644
--- a/dashboard/src/main/home/integrations/create-integration/GKEForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/GKEForm.tsx
@@ -27,7 +27,7 @@ export default class GKEForm extends Component<PropsType, StateType> {
   };
 
   isDisabled = (): boolean => {
-    let {
+    const {
       clusterName,
       clusterEndpoint,
       clusterCA,
@@ -83,7 +83,7 @@ export default class GKEForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.clusterName}
-            setValue={(x: string) => this.setState({ clusterName: x })}
+            setValue={(x: string) => { this.setState({ clusterName: x }); }}
             label="🏷️ Cluster Name"
             placeholder="ex: briny-pagelet"
             width="100%"
@@ -91,14 +91,14 @@ export default class GKEForm extends Component<PropsType, StateType> {
           <InputRow
             type="text"
             value={this.state.clusterEndpoint}
-            setValue={(x: string) => this.setState({ clusterEndpoint: x })}
+            setValue={(x: string) => { this.setState({ clusterEndpoint: x }); }}
             label="🌐 Cluster Endpoint"
             placeholder="ex: 00.00.000.00"
             width="100%"
           />
           <TextArea
             value={this.state.clusterCA}
-            setValue={(x: string) => this.setState({ clusterCA: x })}
+            setValue={(x: string) => { this.setState({ clusterCA: x }); }}
             label="🔏 Cluster Certificate"
             placeholder="(Paste your certificate here)"
             width="100%"
@@ -108,7 +108,7 @@ export default class GKEForm extends Component<PropsType, StateType> {
           <Helper>Service account credentials for GCP permissions.</Helper>
           <TextArea
             value={this.state.serviceAccountKey}
-            setValue={(x: string) => this.setState({ serviceAccountKey: x })}
+            setValue={(x: string) => { this.setState({ serviceAccountKey: x }); }}
             label="🔑 Service Account Key (JSON)"
             placeholder="(Paste your JSON service account key here)"
             width="100%"
diff --git a/dashboard/src/main/home/integrations/create-integration/GitlabForm.tsx b/dashboard/src/main/home/integrations/create-integration/GitlabForm.tsx
index 3b92968f2b..dd9bf445b9 100644
--- a/dashboard/src/main/home/integrations/create-integration/GitlabForm.tsx
+++ b/dashboard/src/main/home/integrations/create-integration/GitlabForm.tsx
@@ -45,7 +45,7 @@ const GitlabForm: React.FC<Props> = () => {
       return;
     }
 
-    if (!clientId || !clientId.trim().length) {
+    if (!clientId?.trim().length) {
       setError({
         message: "Invalid Client ID",
         input: "client_id",
@@ -53,7 +53,7 @@ const GitlabForm: React.FC<Props> = () => {
       return;
     }
 
-    if (!clientSecret || !clientSecret.trim().length) {
+    if (!clientSecret?.trim().length) {
       setError({
         message: "Invalid Client Secret",
         input: "client_secret",
@@ -97,7 +97,7 @@ const GitlabForm: React.FC<Props> = () => {
             type="string"
             label="Instance URL"
             value={instanceUrl}
-            setValue={(val: string) => setInstanceUrl(val)}
+            setValue={(val: string) => { setInstanceUrl(val); }}
             isRequired
             width="100%"
             hasError={error?.input === "instance_url"}
@@ -106,7 +106,7 @@ const GitlabForm: React.FC<Props> = () => {
             type="string"
             label="Client Application ID"
             value={clientId}
-            setValue={(val: string) => setClientId(val)}
+            setValue={(val: string) => { setClientId(val); }}
             isRequired
             width="100%"
             hasError={error?.input === "client_id"}
@@ -115,7 +115,7 @@ const GitlabForm: React.FC<Props> = () => {
             type="string"
             label="Client Secret"
             value={clientSecret}
-            setValue={(val: string) => setClientSecret(val)}
+            setValue={(val: string) => { setClientSecret(val); }}
             isRequired
             width="100%"
             hasError={error?.input === "client_secret"}
diff --git a/dashboard/src/main/home/launch/Launch.tsx b/dashboard/src/main/home/launch/Launch.tsx
index 3bbc881c28..56aa636de4 100644
--- a/dashboard/src/main/home/launch/Launch.tsx
+++ b/dashboard/src/main/home/launch/Launch.tsx
@@ -3,7 +3,7 @@ import styled from "styled-components";
 
 import { Context } from "shared/Context";
 import api from "shared/api";
-import { ChartTypeWithExtendedConfig, PorterTemplate, ClusterType } from "shared/types";
+import { type ChartTypeWithExtendedConfig, type PorterTemplate, type ClusterType } from "shared/types";
 
 import TabSelector from "components/TabSelector";
 import ExpandedTemplate from "./expanded-template/ExpandedTemplate";
@@ -15,7 +15,7 @@ import ClusterProvisioningPlaceholder from "components/ClusterProvisioningPlaceh
 import DashboardHeader from "../cluster-dashboard/DashboardHeader";
 
 import semver from "semver";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import { getQueryParam, getQueryParams, pushFiltered } from "shared/routing";
 import TemplateList from "./TemplateList";
 import { capitalize } from "lodash";
@@ -143,9 +143,9 @@ class Templates extends Component<PropsType, StateType> {
         console.error(err);
       });
 
-    let default_addon_helm_repo_url = this.context?.capabilities
+    const default_addon_helm_repo_url = this.context?.capabilities
       ?.default_addon_helm_repo_url;
-    let default_app_helm_repo_url = this.context?.capabilities
+    const default_app_helm_repo_url = this.context?.capabilities
       ?.default_app_helm_repo_url;
     try {
       const res = await api.getTemplates(
@@ -186,7 +186,7 @@ class Templates extends Component<PropsType, StateType> {
           project_id: this.context.currentProject.id,
         }
       );
-      let sortedVersionData = res.data.map((template: any) => {
+      const sortedVersionData = res.data.map((template: any) => {
         let versions = template.versions.reverse();
 
         versions = template.versions.sort(semver.rcompare);
@@ -242,7 +242,7 @@ class Templates extends Component<PropsType, StateType> {
           clonedChart,
         },
         () => {
-          let preferredOrder = ["web", "worker", "job"];
+          const preferredOrder = ["web", "worker", "job"];
           this.state.applicationTemplates.sort((a, b) => {
             return (
               preferredOrder.indexOf(a.name) - preferredOrder.indexOf(b.name)
@@ -266,7 +266,7 @@ class Templates extends Component<PropsType, StateType> {
         }
       );
 
-      let tabOptions = this.state.tabOptions.concat(
+      const tabOptions = this.state.tabOptions.concat(
         ...res.data.map((val: any) => {
           return {
             value: `${val.id}`,
@@ -302,7 +302,7 @@ class Templates extends Component<PropsType, StateType> {
     return !requiredParams.some((rp) => !qp.has(rp));
   };
 
-  getClonedRelease = () => {
+  getClonedRelease = async () => {
     const queryParams = getQueryParams(this.props);
 
     if (!this.areCloneQueryParamsValid()) {
@@ -313,7 +313,7 @@ class Templates extends Component<PropsType, StateType> {
       return;
     }
 
-    return api.getChart<ChartTypeWithExtendedConfig>(
+    return await api.getChart<ChartTypeWithExtendedConfig>(
       "<token>",
       {},
       {
@@ -366,7 +366,7 @@ class Templates extends Component<PropsType, StateType> {
         helm_repo_id={helm_repo_id}
         templates={templates}
         setCurrentTemplate={(template) =>
-          this.setState({ currentTemplate: template })
+          { this.setState({ currentTemplate: template }); }
         }
       />
     );
@@ -376,8 +376,8 @@ class Templates extends Component<PropsType, StateType> {
     if (this.state.currentTemplate) {
       return (
         <ExpandedTemplate
-          setForm={(x: any) => this.setState({ form: x })}
-          showLaunchFlow={() => this.setState({ isOnLaunchFlow: true })}
+          setForm={(x: any) => { this.setState({ form: x }); }}
+          showLaunchFlow={() => { this.setState({ isOnLaunchFlow: true }); }}
           currentTab={this.state.currentTab}
           currentTemplate={this.state.currentTemplate}
           setCurrentTemplate={(currentTemplate: PorterTemplate) => {
@@ -412,10 +412,10 @@ class Templates extends Component<PropsType, StateType> {
             options={this.state.tabOptions}
             currentTab={this.state.currentTab}
             setCurrentTab={(value: string) =>
-              this.setState({
+              { this.setState({
                 currentTab: value,
                 currentTemplate: null,
-              })
+              }); }
             }
           />
           {this.renderTabContents()}
@@ -469,7 +469,7 @@ class Templates extends Component<PropsType, StateType> {
           form={this.state.form}
           currentTab={this.state.currentTab}
           currentTemplate={this.state.currentTemplate}
-          hideLaunchFlow={() => this.setState({ isOnLaunchFlow: false })}
+          hideLaunchFlow={() => { this.setState({ isOnLaunchFlow: false }); }}
         />
       );
     }
diff --git a/dashboard/src/main/home/launch/TemplateList.tsx b/dashboard/src/main/home/launch/TemplateList.tsx
index bb7d070d78..0f2469a6a0 100644
--- a/dashboard/src/main/home/launch/TemplateList.tsx
+++ b/dashboard/src/main/home/launch/TemplateList.tsx
@@ -5,7 +5,7 @@ import styled from "styled-components";
 
 import Loading from "components/Loading";
 import { DISPLAY_TAGS_MAP, hardcodedIcons, hardcodedNames } from "shared/hardcodedNameDict";
-import { PorterTemplate } from "shared/types";
+import { type PorterTemplate } from "shared/types";
 import semver from "semver";
 
 import web from "assets/web.png";
@@ -43,7 +43,7 @@ const TemplateList: React.FC<Props> = ({
         {},
         {
           project_id: currentProject.id,
-          helm_repo_id: helm_repo_id,
+          helm_repo_id,
         }
       )
       .then(({ data }) => {
@@ -54,7 +54,7 @@ const TemplateList: React.FC<Props> = ({
           throw Error("Data is not an array");
         }
 
-        let sortedVersionData = data
+        const sortedVersionData = data
           .map((template: any) => {
             let versions = template.versions.reverse();
 
diff --git a/dashboard/src/main/home/launch/expanded-template/ExpandedTemplate.tsx b/dashboard/src/main/home/launch/expanded-template/ExpandedTemplate.tsx
index 270a6bbaf2..90a3e64a4a 100644
--- a/dashboard/src/main/home/launch/expanded-template/ExpandedTemplate.tsx
+++ b/dashboard/src/main/home/launch/expanded-template/ExpandedTemplate.tsx
@@ -1,7 +1,7 @@
 import React, { Component } from "react";
 import styled from "styled-components";
 
-import { PorterTemplate } from "shared/types";
+import { type PorterTemplate } from "shared/types";
 import api from "shared/api";
 
 import TemplateInfo from "./TemplateInfo";
@@ -60,8 +60,8 @@ export default class ExpandedTemplate extends Component<PropsType, StateType> {
           }
         )
         .then((res) => {
-          let { form, values, markdown, metadata } = res.data;
-          let keywords = metadata.keywords;
+          const { form, values, markdown, metadata } = res.data;
+          const keywords = metadata.keywords;
           this.props.setForm(form);
           this.setState({
             values,
@@ -71,9 +71,9 @@ export default class ExpandedTemplate extends Component<PropsType, StateType> {
             error: false,
           });
         })
-        .catch((err) => this.setState({ loading: false, error: true }));
+        .catch((err) => { this.setState({ loading: false, error: true }); });
     } else {
-      let params =
+      const params =
         this.props.currentTab == "porter"
           ? { repo_url: this.context.capabilities?.default_app_helm_repo_url }
           : {
@@ -87,8 +87,8 @@ export default class ExpandedTemplate extends Component<PropsType, StateType> {
           version: this.props.currentTemplate.currentVersion,
         })
         .then((res) => {
-          let { form, values, markdown, metadata } = res.data;
-          let keywords = metadata.keywords;
+          const { form, values, markdown, metadata } = res.data;
+          const keywords = metadata.keywords;
           this.props.setForm(form);
           this.setState({
             values,
@@ -98,7 +98,7 @@ export default class ExpandedTemplate extends Component<PropsType, StateType> {
             error: false,
           });
         })
-        .catch((err) => this.setState({ loading: false, error: true }));
+        .catch((err) => { this.setState({ loading: false, error: true }); });
     }
   };
 
@@ -128,7 +128,7 @@ export default class ExpandedTemplate extends Component<PropsType, StateType> {
           currentTemplate={this.props.currentTemplate}
           setCurrentTemplate={this.props.setCurrentTemplate}
           setCurrentVersion={(version) => {
-            let template = {
+            const template = {
               ...this.props.currentTemplate,
               currentVersion: version,
             };
diff --git a/dashboard/src/main/home/launch/expanded-template/TemplateInfo.tsx b/dashboard/src/main/home/launch/expanded-template/TemplateInfo.tsx
index 536ff7ce9a..7d9099301f 100644
--- a/dashboard/src/main/home/launch/expanded-template/TemplateInfo.tsx
+++ b/dashboard/src/main/home/launch/expanded-template/TemplateInfo.tsx
@@ -5,7 +5,7 @@ import Markdown from "markdown-to-jsx";
 
 import { Context } from "shared/Context";
 
-import { PorterTemplate } from "shared/types";
+import { type PorterTemplate } from "shared/types";
 import Helper from "components/form-components/Helper";
 import Selector from "components/Selector";
 
@@ -51,7 +51,7 @@ export default class TemplateInfo extends Component<PropsType, StateType> {
   };
 
   renderMarkdown = () => {
-    let { currentTemplate, markdown } = this.props;
+    const { currentTemplate, markdown } = this.props;
     if (markdown) {
       return <Markdown>{markdown}</Markdown>;
     }
@@ -71,7 +71,7 @@ export default class TemplateInfo extends Component<PropsType, StateType> {
   };
 
   renderBanner = () => {
-    let { currentCluster } = this.context;
+    const { currentCluster } = this.context;
     if (!currentCluster) {
       return (
         <>
@@ -122,15 +122,15 @@ export default class TemplateInfo extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { currentCluster } = this.context;
+    const { currentCluster } = this.context;
     let { name, icon, description } = this.props.currentTemplate;
-    let { currentTemplate } = this.props;
+    const { currentTemplate } = this.props;
 
     if (hardcodedNames[name]) {
       name = hardcodedNames[name];
     }
 
-    let versionOptions = this.props.currentTemplate.versions.map(
+    const versionOptions = this.props.currentTemplate.versions.map(
       (version: string) => {
         return {
           value: version,
@@ -145,7 +145,7 @@ export default class TemplateInfo extends Component<PropsType, StateType> {
           <Flex>
             <i
               className="material-icons"
-              onClick={() => this.props.setCurrentTemplate(null)}
+              onClick={() => { this.props.setCurrentTemplate(null); }}
             >
               keyboard_backspace
             </i>
@@ -158,7 +158,7 @@ export default class TemplateInfo extends Component<PropsType, StateType> {
             <Selector
               activeValue={this.props.currentTemplate.currentVersion}
               setActiveValue={(version) =>
-                this.props.setCurrentVersion(version)
+                { this.props.setCurrentVersion(version); }
               }
               options={versionOptions}
               dropdownLabel="Version"
diff --git a/dashboard/src/main/home/launch/launch-flow/LaunchFlow.tsx b/dashboard/src/main/home/launch/launch-flow/LaunchFlow.tsx
index 30d0451686..2171164894 100644
--- a/dashboard/src/main/home/launch/launch-flow/LaunchFlow.tsx
+++ b/dashboard/src/main/home/launch/launch-flow/LaunchFlow.tsx
@@ -2,7 +2,7 @@ import React, { useContext, useState } from "react";
 import styled from "styled-components";
 import _ from "lodash";
 import { generateSlug } from "random-word-slugs";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 import api from "shared/api";
 import { Context } from "shared/Context";
@@ -14,10 +14,10 @@ import SettingsPage from "./SettingsPage";
 import TitleSection from "components/TitleSection";
 
 import {
-  ActionConfigType,
-  ChartTypeWithExtendedConfig,
-  FullActionConfigType,
-  PorterTemplate,
+  type ActionConfigType,
+  type ChartTypeWithExtendedConfig,
+  type FullActionConfigType,
+  type PorterTemplate,
 } from "shared/types";
 
 type PropsType = RouteComponentProps & {
@@ -111,13 +111,13 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
   };
 
   const handleSubmitAddon = async (wildcard?: any) => {
-    let { currentCluster, currentProject, setCurrentError } = context;
+    const { currentCluster, currentProject, setCurrentError } = context;
     setSaveValuesStatus("loading");
 
     const name = templateName || generateRandomName();
 
-    let values: any = {};
-    for (let key in wildcard) {
+    const values: any = {};
+    for (const key in wildcard) {
       _.set(values, key, wildcard[key]);
     }
 
@@ -127,7 +127,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
         {
           template_name: props.currentTemplate.name,
           template_version: props.currentTemplate?.currentVersion || "latest",
-          values: values,
+          values,
           name,
         },
         {
@@ -143,11 +143,11 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
         window.analytics?.track("Deployed Add-on", {
           name: props.currentTemplate.name,
           namespace: selectedNamespace,
-          values: values,
+          values,
         });
       })
       .catch((err) => {
-        let parsedErr = err?.response?.data?.error;
+        const parsedErr = err?.response?.data?.error;
 
         err = parsedErr || err.message || JSON.stringify(err);
 
@@ -157,16 +157,16 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
         window.analytics?.track("Failed to Deploy Add-on", {
           name: props.currentTemplate.name,
           namespace: selectedNamespace,
-          values: values,
+          values,
           error: err,
         });
-        return;
+        
       });
 
     const synced = values?.container?.env?.synced || [];
 
-    const addApplicationToEnvGroupPromises = synced.map((envGroup: any) => {
-      return api.addApplicationToEnvGroup(
+    const addApplicationToEnvGroupPromises = synced.map(async (envGroup: any) => {
+      return await api.addApplicationToEnvGroup(
         "<token>",
         {
           name: envGroup?.name,
@@ -191,7 +191,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
     // props.setCurrentView('cluster-dashboard');
     setSaveValuesStatus("successful");
     // redirect to dashboard
-    let dst = props.currentTemplate.name === "job" ? "/jobs" : "/applications";
+    const dst = props.currentTemplate.name === "job" ? "/jobs" : "/applications";
     setTimeout(() => {
       pushFiltered(props, dst, ["project_id"], {
         cluster: currentCluster.name,
@@ -201,12 +201,12 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
   };
 
   const handleSubmit = async (rawValues: any) => {
-    let { currentCluster, currentProject, setCurrentError } = context;
+    const { currentCluster, currentProject, setCurrentError } = context;
     setSaveValuesStatus("loading");
 
     // Convert dotted keys to nested objects
-    let values: any = {};
-    for (let key in rawValues) {
+    const values: any = {};
+    for (const key in rawValues) {
       _.set(values, key, rawValues[key]);
     }
 
@@ -219,7 +219,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
     }
 
     if (url?.includes(":")) {
-      let splits = url.split(":");
+      const splits = url.split(":");
       url = splits[0];
       tag = splits[1];
     } else if (!tag) {
@@ -281,7 +281,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
       _.set(values, "paused", true);
     }
 
-    var external_domain: string;
+    let external_domain: string;
 
     const release_name = templateName || generateRandomName();
     // check if template is docker and create external domain if necessary
@@ -303,7 +303,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
               resolve(res?.data?.external_url);
             })
             .catch((err) => {
-              let parsedErr = err?.response?.data?.error;
+              const parsedErr = err?.response?.data?.error;
               err = parsedErr || err.message || JSON.stringify(err);
               setSaveValuesStatus(`Could not create subdomain: ${err}`);
 
@@ -331,7 +331,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
         "<token>",
         {
           image_url: url,
-          values: values,
+          values,
           template_name: props.currentTemplate.name.toLowerCase().trim(),
           template_version: props.currentTemplate?.currentVersion || "latest",
           name: release_name,
@@ -348,7 +348,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
       );
       // props.setCurrentView('cluster-dashboard');
     } catch (err) {
-      let parsedErr = err?.response?.data?.error;
+      const parsedErr = err?.response?.data?.error;
       err = parsedErr || err.message || JSON.stringify(err);
       setSaveValuesStatus(`Could not deploy template: ${err}`);
       setCurrentError(err);
@@ -358,7 +358,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
     setSaveValuesStatus("successful");
     // redirect to dashboard with namespace
     setTimeout(() => {
-      let dst =
+      const dst =
         props.currentTemplate.name === "job" ? "/jobs" : "/applications";
       pushFiltered(props, dst, ["project_id"], {
         cluster: currentCluster.name,
@@ -368,7 +368,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
   };
 
   const renderCurrentPage = () => {
-    let { form, currentTab } = props;
+    const { form, currentTab } = props;
     if (currentPage === "source" && form?.hasSource) {
       return (
         <SourcePage
@@ -425,14 +425,14 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
         setPage={setCurrentPage}
         form={form}
         valuesToOverride={valuesToOverride}
-        clearValuesToOverride={() => setValuesToOverride(null)}
+        clearValuesToOverride={() => { setValuesToOverride(null); }}
         fullActionConfig={fullActionConfig}
       />
     );
   };
 
   const renderIcon = () => {
-    let icon = props.currentTemplate?.icon;
+    const icon = props.currentTemplate?.icon;
     if (icon) {
       return <Icon src={icon} />;
     }
@@ -444,7 +444,7 @@ const LaunchFlow: React.FC<PropsType> = (props) => {
     );
   };
 
-  let { currentTab } = props;
+  const { currentTab } = props;
   let currentTemplateName = props.currentTemplate.name;
   if (hardcodedNames[currentTemplateName]) {
     currentTemplateName = hardcodedNames[currentTemplateName];
diff --git a/dashboard/src/main/home/launch/launch-flow/SettingsPage.tsx b/dashboard/src/main/home/launch/launch-flow/SettingsPage.tsx
index a03dc0f1a0..5d52ee9f41 100644
--- a/dashboard/src/main/home/launch/launch-flow/SettingsPage.tsx
+++ b/dashboard/src/main/home/launch/launch-flow/SettingsPage.tsx
@@ -4,7 +4,7 @@ import api from "shared/api";
 
 import { Context } from "shared/Context";
 
-import { ChoiceType, ClusterType, FullActionConfigType } from "shared/types";
+import { type ChoiceType, type ClusterType, type FullActionConfigType } from "shared/types";
 
 import { isAlphanumeric } from "shared/common";
 
@@ -14,7 +14,7 @@ import Helper from "components/form-components/Helper";
 import PorterFormWrapper from "components/porter-form/PorterFormWrapper";
 import Selector from "components/Selector";
 import Loading from "components/Loading";
-import { withAuth, WithAuthProps } from "shared/auth/AuthorizationHoc";
+import { withAuth, type WithAuthProps } from "shared/auth/AuthorizationHoc";
 import WorkflowPage from "./WorkflowPage";
 
 type PropsType = WithAuthProps & {
@@ -37,25 +37,25 @@ type PropsType = WithAuthProps & {
 type StateType = {
   tabOptions: ChoiceType[];
   currentTab: string;
-  clusterOptions: { label: string; value: string }[];
+  clusterOptions: Array<{ label: string; value: string }>;
   selectedCluster: string;
-  clusterMap: { [clusterId: string]: ClusterType };
-  namespaceOptions: { label: string; value: string }[];
+  clusterMap: Record<string, ClusterType>;
+  namespaceOptions: Array<{ label: string; value: string }>;
 };
 
 class SettingsPage extends Component<PropsType, StateType> {
   state = {
     tabOptions: [] as ChoiceType[],
     currentTab: "",
-    clusterOptions: [] as { label: string; value: string }[],
+    clusterOptions: [] as Array<{ label: string; value: string }>,
     selectedCluster: this.context.currentCluster.name,
-    clusterMap: {} as { [clusterId: string]: ClusterType },
-    namespaceOptions: [] as { label: string; value: string }[],
+    clusterMap: {} as Record<string, ClusterType>,
+    namespaceOptions: [] as Array<{ label: string; value: string }>,
   };
 
   componentDidMount() {
     // Retrieve tab options
-    let tabOptions = [] as ChoiceType[];
+    const tabOptions = [] as ChoiceType[];
     this.props.form?.tabs.map((tab: any, i: number) => {
       if (tab.context.type === "helm/values") {
         tabOptions.push({ value: tab.name, label: tab.label });
@@ -64,15 +64,15 @@ class SettingsPage extends Component<PropsType, StateType> {
 
     this.setState({
       tabOptions,
-      currentTab: tabOptions[0] && tabOptions[0]["value"],
+      currentTab: tabOptions[0] && tabOptions[0].value,
     });
 
     // TODO: query with selected filter once implemented
-    let { currentProject, currentCluster } = this.context;
+    const { currentProject, currentCluster } = this.context;
     api.getClusters("<token>", {}, { id: currentProject.id }).then((res) => {
       if (res.data) {
-        let clusterOptions: { label: string; value: string }[] = [];
-        let clusterMap: { [clusterId: string]: ClusterType } = {};
+        const clusterOptions: Array<{ label: string; value: string }> = [];
+        const clusterMap: Record<string, ClusterType> = {};
         res.data.forEach((cluster: ClusterType, i: number) => {
           clusterOptions.push({ label: cluster.vanity_name || cluster.name, value: cluster.name });
           clusterMap[cluster.name] = cluster;
@@ -87,7 +87,7 @@ class SettingsPage extends Component<PropsType, StateType> {
   }
 
   updateNamespaces = (id: number) => {
-    let { currentProject } = this.context;
+    const { currentProject } = this.context;
     api
       .getNamespaces(
         "<token>",
@@ -116,7 +116,7 @@ class SettingsPage extends Component<PropsType, StateType> {
   };
 
   renderSettingsRegion = () => {
-    let { saveValuesStatus, selectedNamespace, onSubmit } = this.props;
+    const { saveValuesStatus, selectedNamespace, onSubmit } = this.props;
 
     if (this.state.currentTab === "") {
       return (
@@ -126,7 +126,7 @@ class SettingsPage extends Component<PropsType, StateType> {
       );
     }
     if (this.state.tabOptions.length > 0) {
-      let {
+      const {
         form,
         valuesToOverride,
         clearValuesToOverride,
@@ -176,7 +176,7 @@ class SettingsPage extends Component<PropsType, StateType> {
           </Placeholder>
           <SaveButton
             text="Deploy"
-            onClick={() => onSubmit({})}
+            onClick={() => { onSubmit({}); }}
             status={saveValuesStatus}
             makeFlush={true}
           />
@@ -213,7 +213,7 @@ class SettingsPage extends Component<PropsType, StateType> {
   };
 
   renderHeaderSection = () => {
-    let {
+    const {
       hasSource,
       sourceType,
       templateName,
@@ -227,7 +227,7 @@ class SettingsPage extends Component<PropsType, StateType> {
 
     if (hasSource) {
       return (
-        <BackButton width="155px" onClick={() => setPage("source")}>
+        <BackButton width="155px" onClick={() => { setPage("source"); }}>
           <i className="material-icons">first_page</i>
           Source settings
         </BackButton>
@@ -238,10 +238,10 @@ class SettingsPage extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { selectedCluster } = this.state;
-    let { currentProject } = this.context;
+    const { selectedCluster } = this.state;
+    const { currentProject } = this.context;
 
-    let { selectedNamespace, setSelectedNamespace } = this.props;
+    const { selectedNamespace, setSelectedNamespace } = this.props;
 
     return (
       <PaddingWrapper>
diff --git a/dashboard/src/main/home/launch/launch-flow/SourcePage.tsx b/dashboard/src/main/home/launch/launch-flow/SourcePage.tsx
index 2e5182beaa..5f07531806 100644
--- a/dashboard/src/main/home/launch/launch-flow/SourcePage.tsx
+++ b/dashboard/src/main/home/launch/launch-flow/SourcePage.tsx
@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import styled from "styled-components";
 
 import { Context } from "shared/Context";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import close from "assets/close.png";
 import { isAlphanumeric } from "shared/common";
 import { pushFiltered } from "shared/routing";
@@ -12,7 +12,7 @@ import Helper from "components/form-components/Helper";
 import ImageSelector from "components/image-selector/ImageSelector";
 import ActionConfEditor from "components/repo-selector/ActionConfEditor";
 import SaveButton from "components/SaveButton";
-import { ActionConfigType } from "shared/types";
+import { type ActionConfigType } from "shared/types";
 
 type PropsType = RouteComponentProps & {
   templateName: string;
@@ -62,8 +62,8 @@ const defaultActionConfig: ActionConfigType = {
 
 class SourcePage extends Component<PropsType, StateType> {
   renderSourceSelector = () => {
-    let { capabilities, setCurrentModal } = this.context;
-    let { sourceType, setSourceType, hasSource } = this.props;
+    const { capabilities, setCurrentModal } = this.context;
+    const { sourceType, setSourceType, hasSource } = this.props;
     console.log("GitHub:", capabilities.github);
     console.log("GitLab:", capabilities.gitlab);
     console.log("hasSource:", hasSource);
@@ -73,7 +73,7 @@ class SourcePage extends Component<PropsType, StateType> {
         <BlockList>
           {(capabilities.github || capabilities.gitlab) &&
             hasSource !== "registry-only" && (
-              <Block onClick={() => setSourceType("repo")}>
+              <Block onClick={() => { setSourceType("repo"); }}>
                 <BlockIcon src="https://git-scm.com/images/logos/downloads/Git-Icon-1788C.png" />
                 <BlockTitle>Git repository</BlockTitle>
                 <BlockDescription>
@@ -82,7 +82,7 @@ class SourcePage extends Component<PropsType, StateType> {
               </Block>
             )}
           {hasSource !== "repo-only" && (
-            <Block onClick={() => setSourceType("registry")}>
+            <Block onClick={() => { setSourceType("registry"); }}>
               <BlockIcon src="https://cdn4.iconfinder.com/data/icons/logos-and-brands/512/97_Docker_logo_logos-512.png" />
               <BlockTitle>Docker registry</BlockTitle>
               <BlockDescription>
@@ -96,7 +96,7 @@ class SourcePage extends Component<PropsType, StateType> {
 
     // Display image selector
     if (sourceType === "registry") {
-      let { imageUrl, setImageUrl, imageTag, setImageTag } = this.props;
+      const { imageUrl, setImageUrl, imageTag, setImageTag } = this.props;
       return (
         <StyledSourceBox>
           <CloseButton
@@ -113,9 +113,9 @@ class SourcePage extends Component<PropsType, StateType> {
             template.
             <Highlight
               onClick={() =>
-                pushFiltered(this.props, "/integrations/registry", [
+                { pushFiltered(this.props, "/integrations/registry", [
                   "project_id",
-                ])
+                ]); }
               }
             >
               Manage Docker registries
@@ -136,7 +136,7 @@ class SourcePage extends Component<PropsType, StateType> {
     }
 
     // Display repo selector
-    let {
+    const {
       history,
       setValuesToOverride,
       setImageUrl,
@@ -226,13 +226,13 @@ class SourcePage extends Component<PropsType, StateType> {
   };
 
   checkSourceSelected = () => {
-    let { imageUrl, selectedRegistry } = this.props;
+    const { imageUrl, selectedRegistry } = this.props;
     return imageUrl || selectedRegistry;
   };
 
   // TODO: consolidate status w/ helper at button-level
   getButtonStatus = () => {
-    let { imageUrl, selectedRegistry, imageTag, templateName } = this.props;
+    const { imageUrl, selectedRegistry, imageTag, templateName } = this.props;
     if (!isAlphanumeric(templateName) && templateName !== "") {
       return "Name contains illegal characters";
     }
@@ -243,7 +243,7 @@ class SourcePage extends Component<PropsType, StateType> {
   };
 
   getButtonHelper = () => {
-    let { imageUrl, imageTag } = this.props;
+    const { imageUrl, imageTag } = this.props;
     if (imageUrl && !imageTag) {
       return 'Tag "latest" will be used by default';
     }
@@ -255,7 +255,7 @@ class SourcePage extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { templateName, setTemplateName } = this.props;
+    const { templateName, setTemplateName } = this.props;
 
     return (
       <StyledSourcePage>
diff --git a/dashboard/src/main/home/launch/launch-flow/WorkflowPage.tsx b/dashboard/src/main/home/launch/launch-flow/WorkflowPage.tsx
index fb2df1ce0f..6c1656a8c4 100644
--- a/dashboard/src/main/home/launch/launch-flow/WorkflowPage.tsx
+++ b/dashboard/src/main/home/launch/launch-flow/WorkflowPage.tsx
@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useState } from "react";
-import { FullActionConfigType } from "../../../../shared/types";
+import { type FullActionConfigType } from "../../../../shared/types";
 import api from "../../../../shared/api";
 import { Context } from "../../../../shared/Context";
 import styled from "styled-components";
@@ -46,8 +46,8 @@ const WorkflowPage: React.FC<PropsType> = (props) => {
           setIsLoading(false);
         }
       })
-      .catch((err) => setHasError(true))
-      .finally(() => setIsLoading(false));
+      .catch((err) => { setHasError(true); })
+      .finally(() => { setIsLoading(false); });
     return () => {
       isSubscribed = false;
     };
@@ -77,7 +77,7 @@ const WorkflowPage: React.FC<PropsType> = (props) => {
         To auto-deploy each time you push changes, Porter will write GitHub
         Secrets and this GitHub Actions workflow to your repository.
       </Helper>
-      <ExpandableButton onClick={() => setIsExpanded((prev) => !prev)}>
+      <ExpandableButton onClick={() => { setIsExpanded((prev) => !prev); }}>
         Show Porter workflow{" "}
         <i className="material-icons-outlined">
           {isExpanded ? "keyboard_arrow_up" : "keyboard_arrow_down"}
@@ -91,7 +91,7 @@ const WorkflowPage: React.FC<PropsType> = (props) => {
           guide:{" "}
           <a
             href="https://docs.porter.run/deploying-applications/deploying-from-github/customizing-github-workflow"
-            target="_blank"
+            target="_blank" rel="noreferrer"
           >
             CI/CD with GitHub Actions
           </a>
@@ -100,7 +100,7 @@ const WorkflowPage: React.FC<PropsType> = (props) => {
           The GitHub Action can be found at{" "}
           <a
             href="https://github.com/porter-dev/porter-update-action"
-            target="_blank"
+            target="_blank" rel="noreferrer"
           >
             porter-dev/porter-update-action
           </a>
diff --git a/dashboard/src/main/home/modals/AccountSettingsModal.tsx b/dashboard/src/main/home/modals/AccountSettingsModal.tsx
index bf700242a8..ce9bff6018 100644
--- a/dashboard/src/main/home/modals/AccountSettingsModal.tsx
+++ b/dashboard/src/main/home/modals/AccountSettingsModal.tsx
@@ -13,7 +13,7 @@ import TabSelector from "components/TabSelector";
 import Link from "components/porter/Link";
 import Spacer from "components/porter/Spacer";
 
-interface GithubAppAccessData {
+type GithubAppAccessData = {
   username?: string;
   accounts?: string[];
 }
@@ -46,7 +46,7 @@ const AccountSettingsModal = () => {
       <TabSelector
         options={tabOptions}
         currentTab={currentTab}
-        setCurrentTab={(value: string) => setCurrentTab(value)}
+        setCurrentTab={(value: string) => { setCurrentTab(value); }}
       />
 
       <Heading>
diff --git a/dashboard/src/main/home/modals/BillingModal.tsx b/dashboard/src/main/home/modals/BillingModal.tsx
index 0b7826942b..407740aa7f 100644
--- a/dashboard/src/main/home/modals/BillingModal.tsx
+++ b/dashboard/src/main/home/modals/BillingModal.tsx
@@ -83,10 +83,10 @@ const BillingModal = ({
                 <Text
                   style={{ cursor: "pointer" }}
                   onClick={() =>
-                    showIntercomWithMessage({
+                    { showIntercomWithMessage({
                       message: "I have already redeemed my startup deal.",
                       delaySeconds: 0,
-                    })
+                    }); }
                   }
                 >
                   Already redeemed your startup deal?
diff --git a/dashboard/src/main/home/modals/ClusterInstructionsModal.tsx b/dashboard/src/main/home/modals/ClusterInstructionsModal.tsx
index 1a211869ad..357edbfc13 100644
--- a/dashboard/src/main/home/modals/ClusterInstructionsModal.tsx
+++ b/dashboard/src/main/home/modals/ClusterInstructionsModal.tsx
@@ -66,19 +66,19 @@ export default class ClusterInstructionsModal extends Component<
           </Placeholder>
         );
       default:
-        return;
+        
     }
   };
 
   render() {
-    let { currentPage, currentTab } = this.state;
+    const { currentPage, currentTab } = this.state;
     return (
       <>
         <TabSelector
           options={tabOptions}
           currentTab={currentTab}
           setCurrentTab={(value: string) =>
-            this.setState({ currentTab: value })
+            { this.setState({ currentTab: value }); }
           }
         />
 
@@ -88,9 +88,9 @@ export default class ClusterInstructionsModal extends Component<
           <i
             className="material-icons"
             onClick={() =>
-              currentPage > 0
+              { currentPage > 0
                 ? this.setState({ currentPage: currentPage - 1 })
-                : null
+                : null; }
             }
           >
             arrow_back
@@ -98,9 +98,9 @@ export default class ClusterInstructionsModal extends Component<
           <i
             className="material-icons"
             onClick={() =>
-              currentPage < 1
+              { currentPage < 1
                 ? this.setState({ currentPage: currentPage + 1 })
-                : null
+                : null; }
             }
           >
             arrow_forward
diff --git a/dashboard/src/main/home/modals/DeleteNamespaceModal.tsx b/dashboard/src/main/home/modals/DeleteNamespaceModal.tsx
index 72a9474383..9837ebd64b 100644
--- a/dashboard/src/main/home/modals/DeleteNamespaceModal.tsx
+++ b/dashboard/src/main/home/modals/DeleteNamespaceModal.tsx
@@ -60,7 +60,7 @@ const DeleteNamespaceModal = () => {
         <InputRow
           type="string"
           value={namespaceNameForDelition}
-          setValue={(x: string) => setNamespaceNameForDelition(x)}
+          setValue={(x: string) => { setNamespaceNameForDelition(x); }}
           placeholder={currentModalData?.metadata?.name}
           width="480px"
         />
@@ -72,7 +72,7 @@ const DeleteNamespaceModal = () => {
       <SaveButton
         text="Delete Namespace"
         color="#e62659"
-        onClick={() => deleteNamespace()}
+        onClick={() => { deleteNamespace(); }}
         status={status}
       />
     </>
diff --git a/dashboard/src/main/home/modals/EditInviteOrCollaboratorModal.tsx b/dashboard/src/main/home/modals/EditInviteOrCollaboratorModal.tsx
index 6660f1668e..6763f53dc0 100644
--- a/dashboard/src/main/home/modals/EditInviteOrCollaboratorModal.tsx
+++ b/dashboard/src/main/home/modals/EditInviteOrCollaboratorModal.tsx
@@ -62,7 +62,7 @@ const EditCollaboratorModal = () => {
       );
       setStatus("successful");
       refetchCallerData().then(() => {
-        setTimeout(() => setCurrentModal(null, null), 500);
+        setTimeout(() => { setCurrentModal(null, null); }, 500);
       });
     } catch (error) {
       setStatus("error");
@@ -79,7 +79,7 @@ const EditCollaboratorModal = () => {
       );
       setStatus("successful");
       refetchCallerData().then(() => {
-        setTimeout(() => setCurrentModal(null, null), 500);
+        setTimeout(() => { setCurrentModal(null, null); }, 500);
       });
     } catch (error) {
       setStatus("error");
@@ -103,7 +103,7 @@ const EditCollaboratorModal = () => {
       <SaveButton
         text={`Update ${isInvite ? "invite" : "collaborator"}`}
         color="#616FEEcc"
-        onClick={() => handleUpdate()}
+        onClick={() => { handleUpdate(); }}
         status={status}
       />
     </>
diff --git a/dashboard/src/main/home/modals/EnvEditorModal.tsx b/dashboard/src/main/home/modals/EnvEditorModal.tsx
index 1ef236f5d2..76ab201eb9 100644
--- a/dashboard/src/main/home/modals/EnvEditorModal.tsx
+++ b/dashboard/src/main/home/modals/EnvEditorModal.tsx
@@ -62,7 +62,7 @@ export default class EnvEditorModal extends Component<PropsType, StateType> {
             mode="text"
             value={this.state.envFile}
             theme="porter"
-            onChange={(e: string) => this.onChange(e)}
+            onChange={(e: string) => { this.onChange(e); }}
             name="codeEditor"
             editorProps={{ $blockScrolling: true }}
             height="100%"
diff --git a/dashboard/src/main/home/modals/IntegrationsInstructionsModal.tsx b/dashboard/src/main/home/modals/IntegrationsInstructionsModal.tsx
index fb075beb19..9a13bc02f5 100644
--- a/dashboard/src/main/home/modals/IntegrationsInstructionsModal.tsx
+++ b/dashboard/src/main/home/modals/IntegrationsInstructionsModal.tsx
@@ -40,19 +40,19 @@ export default class ClusterInstructionsModal extends Component<
           </Placeholder>
         );
       default:
-        return;
+        
     }
   };
 
   render() {
-    let { currentPage, currentTab } = this.state;
+    const { currentPage, currentTab } = this.state;
     return (
       <>
         <TabSelector
           options={tabOptions}
           currentTab={currentTab}
           setCurrentTab={(value: string) =>
-            this.setState({ currentTab: value })
+            { this.setState({ currentTab: value }); }
           }
         />
 
diff --git a/dashboard/src/main/home/modals/LoadEnvGroupModal.tsx b/dashboard/src/main/home/modals/LoadEnvGroupModal.tsx
index f1a4d162aa..395b93c245 100644
--- a/dashboard/src/main/home/modals/LoadEnvGroupModal.tsx
+++ b/dashboard/src/main/home/modals/LoadEnvGroupModal.tsx
@@ -8,11 +8,11 @@ import { Context } from "shared/Context";
 
 import Loading from "components/Loading";
 import SaveButton from "components/SaveButton";
-import { KeyValue } from "components/form-components/KeyValueArray";
+import { type KeyValue } from "components/form-components/KeyValueArray";
 import CheckboxRow from "components/form-components/CheckboxRow";
 import {
-  PartialEnvGroup,
-  PopulatedEnvGroup,
+  type PartialEnvGroup,
+  type PopulatedEnvGroup,
 } from "components/porter-form/types";
 import Helper from "components/form-components/Helper";
 import DocsHelper from "components/DocsHelper";
@@ -83,8 +83,8 @@ export default class LoadEnvGroupModal extends Component<PropsType, StateType> {
       return;
     }
 
-    const populateEnvGroupsPromises = envGroups.map((envGroup) =>
-      api
+    const populateEnvGroupsPromises = envGroups.map(async (envGroup) =>
+      await api
         .getEnvGroup<PopulatedEnvGroup>(
           "<token>",
           {},
@@ -152,7 +152,7 @@ export default class LoadEnvGroupModal extends Component<PropsType, StateType> {
               key={i}
               isSelected={this.state.selectedEnvGroup === envGroup}
               lastItem={i === this.state.envGroups.length - 1}
-              onClick={() => this.setState({ selectedEnvGroup: envGroup })}
+              onClick={() => { this.setState({ selectedEnvGroup: envGroup }); }}
             >
               <img src={sliders} />
               {envGroup.name}
@@ -276,9 +276,9 @@ export default class LoadEnvGroupModal extends Component<PropsType, StateType> {
                   <CheckboxRow
                     checked={this.state.shouldSync}
                     toggle={() =>
-                      this.setState((prevState) => ({
+                      { this.setState((prevState) => ({
                         shouldSync: !prevState.shouldSync,
-                      }))
+                      })); }
                     }
                     label="Sync environment group"
                     disabled={this.state.selectedEnvGroup?.meta_version === 1}
diff --git a/dashboard/src/main/home/modals/Modal.tsx b/dashboard/src/main/home/modals/Modal.tsx
index 6cfaa5ad91..ea78342f07 100644
--- a/dashboard/src/main/home/modals/Modal.tsx
+++ b/dashboard/src/main/home/modals/Modal.tsx
@@ -30,8 +30,7 @@ export default class Modal extends Component<PropsType, StateType> {
   handleClickOutside = (event: any) => {
     if (
       this.props.onRequestClose &&
-      this.wrapperRef &&
-      this.wrapperRef.current &&
+      this.wrapperRef?.current &&
       !this.wrapperRef.current.contains(event.target)
     ) {
       this.props.onRequestClose();
@@ -39,7 +38,7 @@ export default class Modal extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { width, height } = this.props;
+    const { width, height } = this.props;
     return (
       <PortalModal>
         <Overlay>
diff --git a/dashboard/src/main/home/modals/NamespaceModal.tsx b/dashboard/src/main/home/modals/NamespaceModal.tsx
index 057b9322ae..31fa8b063e 100644
--- a/dashboard/src/main/home/modals/NamespaceModal.tsx
+++ b/dashboard/src/main/home/modals/NamespaceModal.tsx
@@ -91,7 +91,7 @@ export default class NamespaceModal extends Component<PropsType, StateType> {
             type="string"
             value={this.state.namespaceName}
             setValue={(x: string) =>
-              this.setState({ namespaceName: x, status: null })
+              { this.setState({ namespaceName: x, status: null }); }
             }
             placeholder="ex: porter-workers"
             width="480px"
@@ -101,7 +101,7 @@ export default class NamespaceModal extends Component<PropsType, StateType> {
         <SaveButton
           text="Create Namespace"
           color="#616FEEcc"
-          onClick={() => this.createNamespace()}
+          onClick={() => { this.createNamespace(); }}
           status={this.state.status}
         />
       </>
diff --git a/dashboard/src/main/home/modals/PreviewEnvSettingsModal.tsx b/dashboard/src/main/home/modals/PreviewEnvSettingsModal.tsx
index bb28a26233..c93a63dc70 100644
--- a/dashboard/src/main/home/modals/PreviewEnvSettingsModal.tsx
+++ b/dashboard/src/main/home/modals/PreviewEnvSettingsModal.tsx
@@ -10,8 +10,8 @@ import Heading from "components/form-components/Heading";
 import Helper from "components/form-components/Helper";
 import ConfirmOverlay from "../../../components/ConfirmOverlay";
 
-interface Environment {
-  id: Number;
+type Environment = {
+  id: number;
   project_id: number;
   cluster_id: number;
   git_installation_id: number;
@@ -86,7 +86,7 @@ const PreviewEnvSettingsModal = () => {
         message={`Are you sure you want to disable preview environments in 
           ${selectedEnvironment?.git_repo_owner}/${selectedEnvironment?.git_repo_name}?`}
         onYes={handleDelete}
-        onNo={() => setSelectedEnvironment(null)}
+        onNo={() => { setSelectedEnvironment(null); }}
       />
       <Heading>
         <GitIcon src={github} /> Github
diff --git a/dashboard/src/main/home/modals/RedirectToOnboardingModal.tsx b/dashboard/src/main/home/modals/RedirectToOnboardingModal.tsx
index 82c16d5ea8..2b2e961efb 100644
--- a/dashboard/src/main/home/modals/RedirectToOnboardingModal.tsx
+++ b/dashboard/src/main/home/modals/RedirectToOnboardingModal.tsx
@@ -19,7 +19,7 @@ const RedirectToOnboardingModal = () => {
       <ContinueButton
         as={Link}
         to="/onboarding"
-        onClick={() => setCurrentModal(null, null)}
+        onClick={() => { setCurrentModal(null, null); }}
       >
         <i className="material-icons">east</i>
         Continue Setup
diff --git a/dashboard/src/main/home/modals/UpgradeChartModal.tsx b/dashboard/src/main/home/modals/UpgradeChartModal.tsx
index 29577d2983..985a390bdb 100644
--- a/dashboard/src/main/home/modals/UpgradeChartModal.tsx
+++ b/dashboard/src/main/home/modals/UpgradeChartModal.tsx
@@ -4,7 +4,7 @@ import close from "assets/close.png";
 import api from "shared/api";
 
 import { Context } from "shared/Context";
-import { ChartType } from "shared/types";
+import { type ChartType } from "shared/types";
 
 import Loading from "components/Loading";
 
@@ -29,7 +29,7 @@ export default class UpgradeChartModal extends Component<PropsType, StateType> {
   componentDidMount() {
     // get the chart update notes from the api
     let repoURL = this.context.capabilities.default_addon_helm_repo_url;
-    let chartName = this.props.currentChart.chart.metadata.name
+    const chartName = this.props.currentChart.chart.metadata.name
       .toLowerCase()
       .trim();
 
@@ -62,7 +62,7 @@ No upgrade notes available. This update should be backwards-compatible.
           return;
         }
 
-        let noteArr = res.data.upgrade_notes.map((note: any) => {
+        const noteArr = res.data.upgrade_notes.map((note: any) => {
           return `
 ## Version ${note.previous} -> ${note.target}
 ${note.note}
diff --git a/dashboard/src/main/home/modals/UsageWarningModal.tsx b/dashboard/src/main/home/modals/UsageWarningModal.tsx
index 4578f6665c..b190f56a74 100644
--- a/dashboard/src/main/home/modals/UsageWarningModal.tsx
+++ b/dashboard/src/main/home/modals/UsageWarningModal.tsx
@@ -4,14 +4,12 @@ import styled from "styled-components";
 import Banner from "components/porter/Banner";
 
 import { Context } from "shared/Context";
-import { Usage, UsageData } from "shared/types";
+import { type Usage, type UsageData } from "shared/types";
 import { Link } from "react-router-dom";
 
 type UsageKeys = keyof Usage;
 
-const ReadableNameMap: {
-  [key: string]: string;
-} = {
+const ReadableNameMap: Record<string, string> = {
   resource_cpu: "CPU Usage",
   resource_memory: "Memory Usage",
   clusters: "Clusters",
@@ -47,7 +45,7 @@ const getRemainingDays = (date: string) => {
   const end = new Date(date);
   end.setDate(end.getDate() + 7);
 
-  let distance = end.getTime() - start.getTime();
+  const distance = end.getTime() - start.getTime();
 
   if (distance < 0) {
     return;
@@ -106,7 +104,7 @@ const UpgradeChartModal: React.FC<{}> = () => {
       </Helper>
       <Helper>
         Have a question about billing? Email us at{" "}
-        <a target="_blank" href="mailto:contact@porter.run">
+        <a target="_blank" href="mailto:contact@porter.run" rel="noreferrer">
           contact@porter.run
         </a>
         .
@@ -117,7 +115,7 @@ const UpgradeChartModal: React.FC<{}> = () => {
           pathname: "/project-settings",
           search: "?selected_tab=billing",
         }}
-        onClick={() => setCurrentModal(null, null)}
+        onClick={() => { setCurrentModal(null, null); }}
       >
         Take me to billing
       </Button>
diff --git a/dashboard/src/main/home/navbar/Help.tsx b/dashboard/src/main/home/navbar/Help.tsx
index 633c13bb4e..6ba58ea2ac 100644
--- a/dashboard/src/main/home/navbar/Help.tsx
+++ b/dashboard/src/main/home/navbar/Help.tsx
@@ -15,7 +15,7 @@ const Help: React.FC<HelpProps> = () => {
       return (
         <>
           <CloseOverlay
-            onClick={() => setShowHelpDropdown(false)}
+            onClick={() => { setShowHelpDropdown(false); }}
           />
           <Dropdown dropdownWidth="155px" dropdownMaxHeight="300px">
             <Option
@@ -41,8 +41,8 @@ const Help: React.FC<HelpProps> = () => {
   };
 
   return (
-    <FeedbackButton selected={showHelpDropdown === true}>
-      <Flex onClick={() => setShowHelpDropdown(!showHelpDropdown)}>
+    <FeedbackButton selected={showHelpDropdown}>
+      <Flex onClick={() => { setShowHelpDropdown(!showHelpDropdown); }}>
         <i className="material-icons-outlined">help_outline</i>
         Help
       </Flex>
diff --git a/dashboard/src/main/home/new-project/NewProject.tsx b/dashboard/src/main/home/new-project/NewProject.tsx
index b3f70450e3..090e952215 100644
--- a/dashboard/src/main/home/new-project/NewProject.tsx
+++ b/dashboard/src/main/home/new-project/NewProject.tsx
@@ -17,7 +17,7 @@ import Helper from "components/form-components/Helper";
 import TitleSection from "components/TitleSection";
 import WelcomeForm from "./WelcomeForm";
 import { trackCreateNewProject } from "shared/anayltics";
-import { ProjectListType } from "shared/types";
+import { type ProjectListType } from "shared/types";
 
 type ValidationError = {
   hasError: boolean;
diff --git a/dashboard/src/main/home/onboarding/Routes.tsx b/dashboard/src/main/home/onboarding/Routes.tsx
index 3b5d4aa06a..f92e4d444d 100644
--- a/dashboard/src/main/home/onboarding/Routes.tsx
+++ b/dashboard/src/main/home/onboarding/Routes.tsx
@@ -20,7 +20,7 @@ export const Routes = () => {
         <Switch>
           <Route path={`/onboarding/source/${currentProject}`}>
             <ConnectSource
-              onSuccess={(data) => OFState.actions.nextStep("continue", data)}
+              onSuccess={(data) => { OFState.actions.nextStep("continue", data); }}
             />
           </Route>
           <Route path={["/onboarding/registry/:step?"]}>
diff --git a/dashboard/src/main/home/onboarding/components/ProviderSelector.tsx b/dashboard/src/main/home/onboarding/components/ProviderSelector.tsx
index 9af8be2fbb..0d0eb662e4 100644
--- a/dashboard/src/main/home/onboarding/components/ProviderSelector.tsx
+++ b/dashboard/src/main/home/onboarding/components/ProviderSelector.tsx
@@ -1,18 +1,18 @@
 import React, { useMemo, useRef, useState } from "react";
 import { integrationList } from "shared/common";
 import styled from "styled-components";
-import { SupportedProviders } from "../types";
+import { type SupportedProviders } from "../types";
 import Selector from "components/Selector";
 
 export type ProviderSelectorProps = {
   selectProvider: (
     provider: SupportedProviders | (SupportedProviders | "external")
   ) => void;
-  options: {
+  options: Array<{
     value: string;
     icon: string;
     label: string;
-  }[];
+  }>;
   defaultOption?: string;
 };
 
@@ -24,17 +24,17 @@ export const registryOptions = [
   },
   {
     value: "aws",
-    icon: integrationList["ecr"]?.icon,
+    icon: integrationList.ecr?.icon,
     label: "Amazon Elastic Container Registry (ECR)",
   },
   {
     value: "gcp",
-    icon: integrationList["gcr"]?.icon,
+    icon: integrationList.gcr?.icon,
     label: "Google Cloud Registry (GCR)",
   },
   {
     value: "gar",
-    icon: integrationList["gcr"]?.icon,
+    icon: integrationList.gcr?.icon,
     label: "Google Artifact Registry (GAR)",
   },
   /*
@@ -49,12 +49,12 @@ export const registryOptions = [
 export const provisionerOptions = [
   {
     value: "aws",
-    icon: integrationList["aws"]?.icon,
+    icon: integrationList.aws?.icon,
     label: "Amazon Web Services (AWS)",
   },
   {
     value: "gcp",
-    icon: integrationList["gcp"]?.icon,
+    icon: integrationList.gcp?.icon,
     label: "Google Cloud Platform (GCP)",
   },
 
@@ -71,7 +71,7 @@ export const provisionerOptionsWithExternal = [
   ...provisionerOptions,
   {
     value: "external",
-    icon: integrationList["kubernetes"]?.icon,
+    icon: integrationList.kubernetes?.icon,
     label: "Link an existing cluster",
   },
 ];
diff --git a/dashboard/src/main/home/onboarding/components/RegistryImageList.tsx b/dashboard/src/main/home/onboarding/components/RegistryImageList.tsx
index c1ece3d9ab..e5cb55e35c 100644
--- a/dashboard/src/main/home/onboarding/components/RegistryImageList.tsx
+++ b/dashboard/src/main/home/onboarding/components/RegistryImageList.tsx
@@ -38,10 +38,10 @@ const RegistryImageList: React.FC<{
   const getIcon = () => {
     if (registryType) {
       return (
-        integrationList[registryType] && integrationList[registryType].icon
+        integrationList[registryType]?.icon
       );
     } else {
-      return integrationList["dockerhub"].icon;
+      return integrationList.dockerhub.icon;
     }
   };
 
diff --git a/dashboard/src/main/home/onboarding/state/StepHandler.ts b/dashboard/src/main/home/onboarding/state/StepHandler.ts
index a7c906452d..94e8129e89 100644
--- a/dashboard/src/main/home/onboarding/state/StepHandler.ts
+++ b/dashboard/src/main/home/onboarding/state/StepHandler.ts
@@ -3,7 +3,7 @@ import { useLocation } from "react-router";
 import { Context } from "shared/Context";
 import { useRouting } from "shared/routing";
 import { proxy, useSnapshot } from "valtio";
-import { StepKey, Steps } from "../types";
+import { type StepKey, type Steps } from "../types";
 
 type Step = {
   url: string;
@@ -219,7 +219,7 @@ export const StepHandler: StepHandlerType = proxy({
         );
       }
       StepHandler.actions.setNewCurrentStep(nextStepName);
-      return;
+      
     },
     getStep: (nextStepName: string) => {
       const [stepName, substep] = nextStepName.split(".");
@@ -298,7 +298,7 @@ export const useSteps = (isParentLoading?: boolean) => {
       StepHandler.actions.clearState();
       setHasFinishedOnboarding(true);
     }
-    if (currentProject && currentProject.id) {
+    if (currentProject?.id) {
       pushFiltered(`${snap.currentStep.url}?project_id=${currentProject.id}`, ["tab"]);
     } else {
       pushFiltered(snap.currentStep.url, ["tab"]);
diff --git a/dashboard/src/main/home/onboarding/state/index.ts b/dashboard/src/main/home/onboarding/state/index.ts
index d73985a7a9..e9bc7be91a 100644
--- a/dashboard/src/main/home/onboarding/state/index.ts
+++ b/dashboard/src/main/home/onboarding/state/index.ts
@@ -1,8 +1,8 @@
 import api from "shared/api";
 import { proxy } from "valtio";
-import { CompressedOnboardingState, Onboarding } from "../types";
+import { type CompressedOnboardingState, type Onboarding } from "../types";
 import { StateHandler } from "./StateHandler";
-import { Action, StepHandler } from "./StepHandler";
+import { type Action, StepHandler } from "./StepHandler";
 
 export const OFState = proxy({
   StateHandler,
@@ -44,8 +44,8 @@ export const OFState = proxy({
             },
             { project_id: OFState.StateHandler?.project?.id }
           )
-          .then((res) => console.log(res))
-          .catch((err) => console.log(err));
+          .then((res) => { console.log(res); })
+          .catch((err) => { console.log(err); });
       }
 
     },
@@ -68,7 +68,7 @@ const compressState = (state: typeof OFState) => {
   const registry = state.StateHandler?.connected_registry;
   const provision = state.StateHandler?.provision_resources;
 
-  let onboarding_state: CompressedOnboardingState = {
+  const onboarding_state: CompressedOnboardingState = {
     current_step: currentStep,
 
     connected_source: source,
@@ -100,7 +100,7 @@ const decompressState = (prev_state: any) => {
     name: state.project_name,
   };
 
-  let registry: any = {
+  const registry: any = {
     skip: state.skip_registry_connection,
     provider: state.registry_connection_provider,
     credentials: {
@@ -118,7 +118,7 @@ const decompressState = (prev_state: any) => {
     registry.settings.registry_url = state.registry_connection_data?.url;
   }
 
-  let provision: any = {
+  const provision: any = {
     skip: state.skip_resource_provision,
     provider: state.cluster_infra_provider,
     credentials: {
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/ConnectRegistry.tsx b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/ConnectRegistry.tsx
index c9e15e91a4..06f04873bd 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/ConnectRegistry.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/ConnectRegistry.tsx
@@ -31,7 +31,7 @@ const ConnectRegistry: React.FC<{}> = ({}) => {
     snap.StepHandler.canGoBack && !snap.StepHandler.isSubFlow;
 
   useEffect(() => {
-    let hookState = { isSubscribed: true };
+    const hookState = { isSubscribed: true };
 
     getRegistries(hookState);
 
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/components/Registry.tsx b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/components/Registry.tsx
index d27d4fced5..49aa3ae37b 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/components/Registry.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/components/Registry.tsx
@@ -7,9 +7,7 @@ import { Context } from "shared/Context";
 import styled from "styled-components";
 import { useSnapshot } from "valtio";
 
-const serviceToProvider: {
-  [key: string]: string;
-} = {
+const serviceToProvider: Record<string, string> = {
   docr: "do",
   ecr: "aws",
   gcr: "gcp",
@@ -48,7 +46,7 @@ const Registry: React.FC<{ registry: any; onDelete: () => void }> = (props) => {
       setIsDeleting(false);
       setCurrentError(error);
       setHasError(true);
-      setTimeout(() => setHasError(false), 1000);
+      setTimeout(() => { setHasError(false); }, 1000);
     }
   };
 
@@ -75,7 +73,7 @@ const Registry: React.FC<{ registry: any; onDelete: () => void }> = (props) => {
             {!hasError && !isDeleting && (
               <I
                 className="material-icons"
-                onClick={() => deleteRegistry(registry?.id)}
+                onClick={async () => { await deleteRegistry(registry?.id); }}
               >
                 delete
               </I>
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/FormFlow.tsx b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/FormFlow.tsx
index 9053606f43..2a8b43c1ab 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/FormFlow.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/FormFlow.tsx
@@ -1,11 +1,11 @@
 import {
-  ConnectedRegistryConfig,
+  type ConnectedRegistryConfig,
   StateHandler,
 } from "main/home/onboarding/state/StateHandler";
 import Breadcrumb from "components/Breadcrumb";
 import {
-  SkipRegistryConnection,
-  SupportedProviders,
+  type SkipRegistryConnection,
+  type SupportedProviders,
 } from "main/home/onboarding/types";
 import React, { useMemo } from "react";
 import styled from "styled-components";
@@ -48,25 +48,25 @@ const Forms = {
 const FormTitle = {
   aws: {
     label: "Amazon Elastic Container Registry (ECR)",
-    icon: integrationList["ecr"].icon,
+    icon: integrationList.ecr.icon,
     doc:
       "https://docs.porter.run/deploying-applications/deploying-from-docker-registry/linking-existing-registry#amazon-elastic-container-registry-ecr",
   },
   gcp: {
     label: "Google Container Registry (GCR)",
-    icon: integrationList["gcr"].icon,
+    icon: integrationList.gcr.icon,
     doc:
       "https://docs.porter.run/deploying-applications/deploying-from-docker-registry/linking-existing-registry#google-container-registry-gcr",
   },
   gar: {
     label: "Google Artifact Registry (GAR)",
-    icon: integrationList["gcr"].icon,
+    icon: integrationList.gcr.icon,
     doc:
       "https://docs.porter.run/deploying-applications/deploying-from-docker-registry/linking-existing-registry#google-artifact-registry-gar",
   },
   do: {
     label: "DigitalOcean Container Registry (DOCR)",
-    icon: integrationList["do"].icon,
+    icon: integrationList.do.icon,
     doc:
       "https://docs.porter.run/deploying-applications/deploying-from-docker-registry/linking-existing-registry#digital-ocean-container-registry",
   },
@@ -96,13 +96,13 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
   ) => {
     if (currentStep === "credentials") {
       connectRegistryTracks.trackRegistryAddCredentials({
-        provider: provider,
+        provider,
         step: stepHandler.currentStepName,
       });
       handleContinue(data.credentials);
     } else if (currentStep === "settings") {
       connectRegistryTracks.trackConnectRegistryClicked({
-        provider: provider,
+        provider,
       });
       handleContinue(data.settings);
     } else if (currentStep === "test_connection") {
@@ -121,7 +121,7 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
       return null;
     }
 
-    return React.createElement(currentForm as any, {
+    return React.createElement(currentForm , {
       nextFormStep,
       project,
     });
@@ -132,7 +132,7 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
       <Header>
         <FormHeader>
           {currentStep !== "test_connection" && (
-            <CloseButton onClick={() => handleGoBack()}>
+            <CloseButton onClick={() => { handleGoBack(); }}>
               <i className="material-icons">keyboard_backspace</i>
             </CloseButton>
           )}
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_AWSRegistryForm.tsx b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_AWSRegistryForm.tsx
index 8fc3d7ddb5..7c3289af3f 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_AWSRegistryForm.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_AWSRegistryForm.tsx
@@ -2,7 +2,7 @@ import InputRow from "components/form-components/InputRow";
 import SelectRow from "components/form-components/SelectRow";
 import Helper from "components/form-components/Helper";
 import SaveButton from "components/SaveButton";
-import { AWSRegistryConfig } from "main/home/onboarding/types";
+import { type AWSRegistryConfig } from "main/home/onboarding/types";
 import React, { useEffect, useState } from "react";
 import styled from "styled-components";
 import api from "shared/api";
@@ -54,13 +54,13 @@ export const CredentialsForm: React.FC<{
     api
       .getAWSIntegration("<token>", {}, { project_id: project.id })
       .then((res) => {
-        let integrations = res.data;
+        const integrations = res.data;
         if (!Array.isArray(integrations) || !integrations.length) {
           setShowForm(true);
           return;
         }
 
-        let lastUsed = integrations.find((i) => {
+        const lastUsed = integrations.find((i) => {
           return (
             i.id === snap.StateHandler?.connected_registry?.credentials?.id
           );
@@ -181,7 +181,7 @@ export const CredentialsForm: React.FC<{
             <CancelButton
               text="Cancel"
               disabled={false}
-              onClick={() => setShowForm(false)}
+              onClick={() => { setShowForm(false); }}
               makeFlush={true}
               clearPosition={true}
               status=""
@@ -218,7 +218,7 @@ export const CredentialsForm: React.FC<{
       </PreviewRow>
       <Helper>
         Want to use a different account?{" "}
-        <A onClick={() => setShowForm(true)} href="#">
+        <A onClick={() => { setShowForm(true); }} href="#">
           Connect another account
         </A>
         .
@@ -227,7 +227,7 @@ export const CredentialsForm: React.FC<{
       <SaveButton
         text="Continue"
         disabled={false}
-        onClick={() => continueToNextStep(lastConnectedAccount?.id)}
+        onClick={() => { continueToNextStep(lastConnectedAccount?.id); }}
         makeFlush={true}
         clearPosition={true}
         status={buttonStatus}
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_GCPRegistryForm.tsx b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_GCPRegistryForm.tsx
index c26e3c67a8..e0d3edfcc6 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_GCPRegistryForm.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectRegistry/forms/_GCPRegistryForm.tsx
@@ -8,7 +8,7 @@ import RegistryImageList from "main/home/onboarding/components/RegistryImageList
 import { GCP_REGION_OPTIONS } from "main/home/onboarding/constants";
 import { OFState } from "main/home/onboarding/state";
 import { StateHandler } from "main/home/onboarding/state/StateHandler";
-import { GCPRegistryConfig } from "main/home/onboarding/types";
+import { type GCPRegistryConfig } from "main/home/onboarding/types";
 import React, { useEffect, useState } from "react";
 import api from "shared/api";
 import { readableDate } from "shared/string_utils";
@@ -31,13 +31,13 @@ export const CredentialsForm: React.FC<{
     api
       .getGCPIntegration("<token>", {}, { project_id: project.id })
       .then((res) => {
-        let integrations = res.data;
+        const integrations = res.data;
         if (!Array.isArray(integrations) || !integrations.length) {
           setShowForm(true);
           return;
         }
 
-        let lastUsed = integrations.find((i) => {
+        const lastUsed = integrations.find((i) => {
           return (
             i.id === snap.StateHandler?.connected_registry?.credentials?.id
           );
@@ -133,7 +133,7 @@ export const CredentialsForm: React.FC<{
 
         <Helper>Service account credentials for GCP permissions.</Helper>
         <UploadArea
-          setValue={(x: any) => setServiceAccountKey(x)}
+          setValue={(x: any) => { setServiceAccountKey(x); }}
           label="🔒 GCP Key Data (JSON)"
           placeholder="Choose a file or drag it here."
           width="100%"
@@ -146,7 +146,7 @@ export const CredentialsForm: React.FC<{
             <SaveButton
               text="Cancel"
               disabled={false}
-              onClick={() => setShowForm(false)}
+              onClick={() => { setShowForm(false); }}
               makeFlush={true}
               clearPosition={true}
               status=""
@@ -182,7 +182,7 @@ export const CredentialsForm: React.FC<{
       </PreviewRow>
       <Helper>
         Want to use a different account?{" "}
-        <A onClick={() => setShowForm(true)} href="#">
+        <A onClick={() => { setShowForm(true); }} href="#">
           Connect another account
         </A>
         .
@@ -193,7 +193,7 @@ export const CredentialsForm: React.FC<{
       <SaveButton
         text="Continue"
         disabled={false}
-        onClick={() => continueToNextStep(lastConnectedAccount?.id)}
+        onClick={() => { continueToNextStep(lastConnectedAccount?.id); }}
         makeFlush={true}
         clearPosition={true}
         status={buttonStatus}
@@ -273,7 +273,7 @@ export const SettingsForm: React.FC<{
       <InputRow
         type="text"
         value={registryName}
-        setValue={(name: string) => setRegistryName(name)}
+        setValue={(name: string) => { setRegistryName(name); }}
         isRequired={true}
         label="🏷️ Registry Name"
         placeholder="ex: paper-straw"
@@ -287,7 +287,7 @@ export const SettingsForm: React.FC<{
       <InputRow
         type="text"
         value={registryUrl}
-        setValue={(url: string) => setRegistryUrl(url)}
+        setValue={(url: string) => { setRegistryUrl(url); }}
         label="🔗 GCR URL"
         placeholder="ex: gcr.io/skynet-dev-172969"
         width="100%"
@@ -357,9 +357,9 @@ export const GARegistryConfig: React.FC<{
       const gcp_integration = await api
         .getGCPIntegration("<token>", {}, { project_id: project.id })
         .then((res) => {
-          let integrations = res.data;
+          const integrations = res.data;
 
-          let lastUsed = integrations.find((i: any) => {
+          const lastUsed = integrations.find((i: any) => {
             return (
               i.id === snap.StateHandler?.connected_registry?.credentials?.id
             );
@@ -432,7 +432,7 @@ export const GARegistryConfig: React.FC<{
       <InputRow
         type="text"
         value={registryName}
-        setValue={(name: string) => setRegistryName(name)}
+        setValue={(name: string) => { setRegistryName(name); }}
         isRequired={true}
         label="🏷️ Registry Name"
         placeholder="ex: paper-straw"
diff --git a/dashboard/src/main/home/onboarding/steps/ConnectSource.tsx b/dashboard/src/main/home/onboarding/steps/ConnectSource.tsx
index 17cc09fc6a..8b67ee94ce 100644
--- a/dashboard/src/main/home/onboarding/steps/ConnectSource.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ConnectSource.tsx
@@ -11,7 +11,7 @@ import github from "assets/github.png";
 import { connectSourceTracks } from "shared/anayltics";
 import DocsHelper from "components/DocsHelper";
 
-interface GithubAppAccessData {
+type GithubAppAccessData = {
   username?: string;
   accounts?: string[];
 }
@@ -90,7 +90,7 @@ const ConnectSource: React.FC<{
         To deploy applications from your repo, you need to connect a Github
         account.
       </Helper>
-      {!isLoading && (!accountData || !accountData?.accounts?.length) && (
+      {!isLoading && (!accountData?.accounts?.length) && (
         <>
           <ConnectToGithubButton
             href={`/api/integrations/github-app/install?redirect_uri=${encoded_redirect_uri}`}
@@ -104,7 +104,7 @@ const ConnectSource: React.FC<{
           </ConnectToGithubButton>
           <Helper>
             No thanks, I want to deploy from a
-            <A onClick={() => nextStep("docker")}>Docker registry</A>.
+            <A onClick={() => { nextStep("docker"); }}>Docker registry</A>.
           </Helper>
         </>
       )}
@@ -145,7 +145,7 @@ const ConnectSource: React.FC<{
           <NextStep
             text="Continue"
             disabled={false}
-            onClick={() => nextStep("github")}
+            onClick={() => { nextStep("github"); }}
             status={""}
             makeFlush={true}
             clearPosition={true}
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResources.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResources.tsx
index b10b8640c5..b3d83e9d08 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResources.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResources.tsx
@@ -141,7 +141,7 @@ const ProvisionResources: React.FC<{}> = () => {
           <SaveButton
             text="Continue"
             disabled={false}
-            onClick={() => handleContinue()}
+            onClick={() => { handleContinue(); }}
             makeFlush={true}
             clearPosition={true}
             statusPosition="right"
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/FormFlow.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/FormFlow.tsx
index 84a612f00a..1f6bf72e3d 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/FormFlow.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/FormFlow.tsx
@@ -1,10 +1,10 @@
 import {
-  ProvisionerConfig,
+  type ProvisionerConfig,
   StateHandler,
 } from "main/home/onboarding/state/StateHandler";
 import {
-  SkipProvisionConfig,
-  SupportedProviders,
+  type SkipProvisionConfig,
+  type SupportedProviders,
 } from "main/home/onboarding/types";
 import React, { useMemo } from "react";
 import styled from "styled-components";
@@ -41,17 +41,17 @@ const Forms = {
 const FormTitle = {
   aws: {
     label: "Amazon Web Services (AWS)",
-    icon: integrationList["aws"].icon,
+    icon: integrationList.aws.icon,
     doc: "https://docs.porter.run/getting-started/provisioning-on-aws",
   },
   gcp: {
     label: "Google Cloud Platform (GCP)",
-    icon: integrationList["gcp"].icon,
+    icon: integrationList.gcp.icon,
     doc: "https://docs.porter.run/getting-started/provisioning-on-gcp",
   },
   external: {
     label: "Connect an existing cluster",
-    icon: integrationList["kubernetes"],
+    icon: integrationList.kubernetes,
     doc: "",
   },
 };
@@ -83,14 +83,14 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
   ) => {
     if (currentStep === "credentials") {
       provisionResourcesTracks.trackProvisionAddCredentials({
-        provider: provider,
+        provider,
         step: stepHandler.currentStepName,
       });
       handleContinue(data);
     } else if (currentStep === "settings") {
       const settings: any = data?.settings;
       provisionResourcesTracks.trackProvisionResourcesClicked({
-        provider: provider,
+        provider,
         cluster_name: settings?.cluster_name,
         machine_type: settings?.aws_machine_type,
         region: settings?.region,
@@ -112,9 +112,9 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
         return null;
       }
 
-      return React.createElement(currentForm as any, {
+      return React.createElement(currentForm , {
         nextFormStep,
-        project: project,
+        project,
       });
     }
   }, [currentStep, provider]);
@@ -123,11 +123,11 @@ const FormFlowWrapper: React.FC<Props> = ({ currentStep }) => {
     <FormWrapper>
       <Header>
         <FormHeader>
-          <CloseButton onClick={() => handleGoBack()}>
+          <CloseButton onClick={() => { handleGoBack(); }}>
             <i className="material-icons">keyboard_backspace</i>
           </CloseButton>
           {FormTitle[provider] && <img src={FormTitle[provider].icon} />}
-          {FormTitle[provider] && FormTitle[provider].label}
+          {FormTitle[provider]?.label}
         </FormHeader>
         <GuideButton
           href={FormTitle[provider]?.doc}
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/StatusPage.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/StatusPage.tsx
index d746c526b9..54a1965004 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/StatusPage.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/StatusPage.tsx
@@ -2,7 +2,7 @@ import Loading from "components/Loading";
 import ProvisionerStatus from "components/ProvisionerStatus";
 import React, { useEffect, useRef, useState } from "react";
 import api from "shared/api";
-import { Infrastructure } from "shared/types";
+import { type Infrastructure } from "shared/types";
 import styled from "styled-components";
 
 type Props = {
@@ -71,7 +71,7 @@ export const StatusPage = ({
         new Date(latestSavedInfra.created_at).getTime()
       ) {
         infraMap.set(infra.kind, infra);
-        return;
+        
       }
     });
 
@@ -97,7 +97,7 @@ export const StatusPage = ({
       });
 
       // determine if all infras are in a final state, and if so report to parent
-      let inProgressInfras = newInfras.filter((newInfra) => {
+      const inProgressInfras = newInfras.filter((newInfra) => {
         if (newInfra.latest_operation) {
           return (
             newInfra.latest_operation.status != "completed" &&
@@ -112,7 +112,7 @@ export const StatusPage = ({
         );
       });
 
-      let erroredInfras = newInfras.filter((newInfra) => {
+      const erroredInfras = newInfras.filter((newInfra) => {
         if (newInfra.latest_operation) {
           return newInfra.latest_operation.errored;
         }
@@ -138,7 +138,7 @@ export const StatusPage = ({
 
   useEffect(() => {
     api
-      .getInfra<Infrastructure[]>("<token>", {}, { project_id: project_id })
+      .getInfra<Infrastructure[]>("<token>", {}, { project_id })
       .then(({ data }) => {
         const matchedInfras = data.filter(filterBySelectedInfras);
 
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_AWSProvisionerForm.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_AWSProvisionerForm.tsx
index 7bb3635fc0..f6ad9579a8 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_AWSProvisionerForm.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_AWSProvisionerForm.tsx
@@ -4,8 +4,8 @@ import SelectRow from "components/form-components/SelectRow";
 import SaveButton from "components/SaveButton";
 import { OFState } from "main/home/onboarding/state";
 import {
-  AWSProvisionerConfig,
-  AWSRegistryConfig,
+  type AWSProvisionerConfig,
+  type AWSRegistryConfig,
 } from "main/home/onboarding/types";
 import React, { useEffect, useState } from "react";
 import api from "shared/api";
@@ -13,7 +13,7 @@ import { useSnapshot } from "valtio";
 import Loading from "components/Loading";
 import Helper from "components/form-components/Helper";
 import { readableDate } from "shared/string_utils";
-import { Infrastructure } from "shared/types";
+import { type Infrastructure } from "shared/types";
 
 const regionOptions = [
   { value: "us-east-1", label: "US East (N. Virginia) us-east-1" },
@@ -77,7 +77,7 @@ export const CredentialsForm: React.FC<{
 
         integrations.sort((a, b) => b.id - a.id);
 
-        let lastUsed = integrations.find((i) => {
+        const lastUsed = integrations.find((i) => {
           return (
             i.id === snap.StateHandler?.provision_resources?.credentials?.id
           );
@@ -199,7 +199,7 @@ export const CredentialsForm: React.FC<{
             <CancelButton
               text="Cancel"
               disabled={false}
-              onClick={() => setShowForm(false)}
+              onClick={() => { setShowForm(false); }}
               makeFlush={true}
               clearPosition={true}
               status=""
@@ -236,7 +236,7 @@ export const CredentialsForm: React.FC<{
       </PreviewRow>
       <Helper>
         Want to use a different account?{" "}
-        <A onClick={() => setShowForm(true)} href="#">
+        <A onClick={() => { setShowForm(true); }} href="#">
           Connect another account
         </A>
         .
@@ -244,7 +244,7 @@ export const CredentialsForm: React.FC<{
       <SaveButton
         text="Continue"
         disabled={false}
-        onClick={() => continueToNextStep(lastConnectedAccount?.id)}
+        onClick={() => { continueToNextStep(lastConnectedAccount?.id); }}
         makeFlush={true}
         clearPosition={true}
         status={buttonStatus}
@@ -282,7 +282,7 @@ export const SettingsForm: React.FC<{
     api
       .getInfra<Infrastructure[]>("<token>", {}, { project_id: project.id })
       .then(({ data }) => {
-        let sortFunc = (a: Infrastructure, b: Infrastructure) => {
+        const sortFunc = (a: Infrastructure, b: Infrastructure) => {
           return b.id < a.id ? -1 : b.id > a.id ? 1 : 0;
         };
 
@@ -345,7 +345,7 @@ export const SettingsForm: React.FC<{
   };
 
   const hasRegistryProvisioned = (
-    infras: { kind: string; status: string }[]
+    infras: Array<{ kind: string; status: string }>
   ) => {
     return !!infras.find(
       (i) => ["ecr", "gcr", "ecr"].includes(i.kind) && i.status === "created"
@@ -353,7 +353,7 @@ export const SettingsForm: React.FC<{
   };
 
   const hasClusterProvisioned = (
-    infras: { kind: string; status: string }[]
+    infras: Array<{ kind: string; status: string }>
   ) => {
     return !!infras.find(
       (i) => ["eks", "gks", "eks"].includes(i.kind) && i.status === "created"
@@ -382,7 +382,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     } else {
       try {
@@ -427,7 +427,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     } else {
       try {
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_ConnectExternalCluster.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_ConnectExternalCluster.tsx
index d07ca45924..5e25d1fdb1 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_ConnectExternalCluster.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_ConnectExternalCluster.tsx
@@ -52,7 +52,7 @@ const ConnectExternalCluster: React.FC<Props> = ({
   };
 
   useEffect(() => {
-    let status = { isSubscribed: true };
+    const status = { isSubscribed: true };
     getClusters(status);
     return () => {
       status.isSubscribed = false;
@@ -107,7 +107,7 @@ const ConnectExternalCluster: React.FC<Props> = ({
           </Placeholder>
         );
       default:
-        return;
+        
     }
   };
 
@@ -115,16 +115,16 @@ const ConnectExternalCluster: React.FC<Props> = ({
     <Wrapper>
       <StyledClusterInstructionsModal>
         <FormHeader>
-          <CloseButton onClick={() => goBack()}>
+          <CloseButton onClick={() => { goBack(); }}>
             <i className="material-icons">keyboard_backspace</i>
           </CloseButton>
-          <img src={integrationList["kubernetes"].icon} />
+          <img src={integrationList.kubernetes.icon} />
           Link an existing cluster
         </FormHeader>
         <TabSelector
           options={tabOptions}
           currentTab={currentTab}
-          setCurrentTab={(value: string) => setCurrentTab(value)}
+          setCurrentTab={(value: string) => { setCurrentTab(value); }}
         />
 
         {renderPage()}
@@ -133,7 +133,7 @@ const ConnectExternalCluster: React.FC<Props> = ({
           <i
             className="material-icons"
             onClick={() =>
-              currentPage > 0 ? setCurrentPage(currentPage - 1) : null
+              { currentPage > 0 ? setCurrentPage(currentPage - 1) : null; }
             }
           >
             arrow_back
@@ -141,7 +141,7 @@ const ConnectExternalCluster: React.FC<Props> = ({
           <i
             className="material-icons"
             onClick={() =>
-              currentPage < 2 ? setCurrentPage(currentPage + 1) : null
+              { currentPage < 2 ? setCurrentPage(currentPage + 1) : null; }
             }
           >
             arrow_forward
diff --git a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_GCPProvisionerForm.tsx b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_GCPProvisionerForm.tsx
index 4552e1f503..bc0d1f1901 100644
--- a/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_GCPProvisionerForm.tsx
+++ b/dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/_GCPProvisionerForm.tsx
@@ -7,13 +7,13 @@ import SaveButton from "components/SaveButton";
 import { GCP_REGION_OPTIONS } from "main/home/onboarding/constants";
 import { OFState } from "main/home/onboarding/state";
 import {
-  GCPProvisionerConfig,
-  GCPRegistryConfig,
+  type GCPProvisionerConfig,
+  type GCPRegistryConfig,
 } from "main/home/onboarding/types";
 import React, { useEffect, useState } from "react";
 import api from "shared/api";
 import { readableDate } from "shared/string_utils";
-import { Infrastructure } from "shared/types";
+import { type Infrastructure } from "shared/types";
 import styled from "styled-components";
 import { useSnapshot } from "valtio";
 
@@ -55,7 +55,7 @@ export const CredentialsForm: React.FC<{
 
         integrations.sort((a, b) => b.id - a.id);
 
-        let lastUsed = integrations.find((i) => {
+        const lastUsed = integrations.find((i) => {
           return (
             i.id === snap.StateHandler?.provision_resources?.credentials?.id
           );
@@ -151,7 +151,7 @@ export const CredentialsForm: React.FC<{
 
         <Helper>Service account credentials for GCP permissions.</Helper>
         <UploadArea
-          setValue={(x: any) => setServiceAccountKey(x)}
+          setValue={(x: any) => { setServiceAccountKey(x); }}
           label="🔒 GCP Key Data (JSON)"
           placeholder="Choose a file or drag it here."
           width="100%"
@@ -164,7 +164,7 @@ export const CredentialsForm: React.FC<{
             <SaveButton
               text="Cancel"
               disabled={false}
-              onClick={() => setShowForm(false)}
+              onClick={() => { setShowForm(false); }}
               makeFlush={true}
               clearPosition={true}
               status=""
@@ -201,7 +201,7 @@ export const CredentialsForm: React.FC<{
       </PreviewRow>
       <Helper>
         Want to use a different account?{" "}
-        <A onClick={() => setShowForm(true)} href="#">
+        <A onClick={() => { setShowForm(true); }} href="#">
           Connect another account
         </A>
         .
@@ -212,7 +212,7 @@ export const CredentialsForm: React.FC<{
       <SaveButton
         text="Continue"
         disabled={false}
-        onClick={() => continueToNextStep(lastConnectedAccount?.id)}
+        onClick={() => { continueToNextStep(lastConnectedAccount?.id); }}
         makeFlush={true}
         clearPosition={true}
         status={buttonStatus}
@@ -241,7 +241,7 @@ export const SettingsForm: React.FC<{
     api
       .getInfra<Infrastructure[]>("<token>", {}, { project_id: project.id })
       .then(({ data }) => {
-        let sortFunc = (a: Infrastructure, b: Infrastructure) => {
+        const sortFunc = (a: Infrastructure, b: Infrastructure) => {
           return b.id < a.id ? -1 : b.id > a.id ? 1 : 0;
         };
 
@@ -298,7 +298,7 @@ export const SettingsForm: React.FC<{
   };
 
   const hasRegistryProvisioned = (
-    infras: { kind: string; status: string }[]
+    infras: Array<{ kind: string; status: string }>
   ) => {
     return !!infras.find(
       (i) =>
@@ -307,7 +307,7 @@ export const SettingsForm: React.FC<{
   };
 
   const hasClusterProvisioned = (
-    infras: { kind: string; status: string }[]
+    infras: Array<{ kind: string; status: string }>
   ) => {
     return !!infras.find(
       (i) => ["doks", "gks", "eks"].includes(i.kind) && i.status === "created"
@@ -384,7 +384,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     } else {
       try {
@@ -401,7 +401,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     }
   };
@@ -430,7 +430,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     } else {
       try {
@@ -449,7 +449,7 @@ export const SettingsForm: React.FC<{
         );
         return res?.data;
       } catch (error) {
-        return catchError(error);
+        catchError(error); 
       }
     }
   };
diff --git a/dashboard/src/main/home/onboarding/types.ts b/dashboard/src/main/home/onboarding/types.ts
index 5d4905722e..9b43f5b05d 100644
--- a/dashboard/src/main/home/onboarding/types.ts
+++ b/dashboard/src/main/home/onboarding/types.ts
@@ -111,7 +111,7 @@ export type SkipProvisionConfig = {
 
 export type SkipRegistryConnection = SkipProvisionConfig;
 
-export interface Onboarding {
+export type Onboarding = {
   current_step: string;
 
   project_id?: number;
@@ -138,7 +138,7 @@ export interface Onboarding {
   resource_provision_settings_machine_type: string;
 }
 
-export interface CompressedOnboardingState {
+export type CompressedOnboardingState = {
   current_step: string;
   connected_source: "github" | "docker";
 
@@ -158,7 +158,7 @@ export interface CompressedOnboardingState {
   cluster_infra_provider: number;
 }
 
-export interface OnboardingState {
+export type OnboardingState = {
   current_step: string;
 
   project_id?: number;
diff --git a/dashboard/src/main/home/project-settings/Metadata.tsx b/dashboard/src/main/home/project-settings/Metadata.tsx
index 580a9b5590..981908c105 100644
--- a/dashboard/src/main/home/project-settings/Metadata.tsx
+++ b/dashboard/src/main/home/project-settings/Metadata.tsx
@@ -16,7 +16,7 @@ import Text from "components/porter/Text";
 import CopyToClipboard from "components/CopyToClipboard";
 import copy from "assets/copy-left.svg"
 import Icon from "components/porter/Icon";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 import globe from "assets/globe.svg"
 import infra from "assets/infra.png";
 import gear from "assets/gear.svg"
@@ -56,16 +56,16 @@ const Metadata: React.FC<Props> = ({
                 .then((res: any) => {
                     setRegistries(res.data);
                 })
-                .catch((err: any) => console.log(err));
+                .catch((err: any) => { console.log(err); });
 
             api
                 .getClusters("<token>", {}, { id: currentProject?.id })
                 .then((res) => {
                     if (res.data) {
-                        let clusters = res.data;
+                        const clusters = res.data;
                         clusters.sort((a: any, b: any) => a.id - b.id);
                         if (clusters.length > 0) {
-                            let options = clusters.map((item: { name: any; vanity_name: string; }) => ({
+                            const options = clusters.map((item: { name: any; vanity_name: string; }) => ({
                                 label: (item.vanity_name ? item.vanity_name : item.name),
                                 value: item.name
                             }));
diff --git a/dashboard/src/main/home/project-settings/ProjectDeleteConsent.tsx b/dashboard/src/main/home/project-settings/ProjectDeleteConsent.tsx
index 67d4b2e92d..79cb622e1c 100644
--- a/dashboard/src/main/home/project-settings/ProjectDeleteConsent.tsx
+++ b/dashboard/src/main/home/project-settings/ProjectDeleteConsent.tsx
@@ -73,7 +73,7 @@ const ProjectDeleteConsent: React.FC<Props> = ({
           onClick={() => {
             setShowCostConfirmModal(false);
             setCurrentModal("UpdateProjectModal", {
-              currentProject: currentProject,
+              currentProject,
             });
           }}
           status={confirmDelete == currentProject?.name ? "This action cannot be undone" : ""}
diff --git a/dashboard/src/main/home/project-settings/api-tokens/CreateAPITokenForm.tsx b/dashboard/src/main/home/project-settings/api-tokens/CreateAPITokenForm.tsx
index 621d2c4db9..b70b4d823a 100644
--- a/dashboard/src/main/home/project-settings/api-tokens/CreateAPITokenForm.tsx
+++ b/dashboard/src/main/home/project-settings/api-tokens/CreateAPITokenForm.tsx
@@ -16,9 +16,9 @@ import Table from "components/OldTable";
 import RadioSelector from "components/RadioSelector";
 import SelectRow from "components/form-components/SelectRow";
 import SaveButton from "components/SaveButton";
-import { APIToken } from "../APITokensSection";
+import { type APIToken } from "../APITokensSection";
 import CustomPolicyForm from "./CustomPolicyForm";
-import { PolicyDocType, Verbs } from "shared/auth/types";
+import { type PolicyDocType, type Verbs } from "shared/auth/types";
 
 type Props = {
   onCreate: () => void;
@@ -26,7 +26,7 @@ type Props = {
 };
 
 const getDateValue = (option: string): string => {
-  let now = new Date();
+  const now = new Date();
 
   switch (option) {
     case "oneday":
@@ -52,7 +52,7 @@ const getDateValue = (option: string): string => {
   }
 };
 
-export const getDateOptions = (): { value: string; label: string }[] => {
+export const getDateOptions = (): Array<{ value: string; label: string }> => {
   return [
     {
       label: "1 Day",
@@ -108,7 +108,7 @@ const CreateAPITokenForm: React.FunctionComponent<Props> = ({
   const [policyName, setPolicyName] = useState("");
 
   const createToken = () => {
-    let cb = (policyUID: string) => {
+    const cb = (policyUID: string) => {
       api
         .createAPIToken(
           "<token>",
@@ -150,16 +150,16 @@ const CreateAPITokenForm: React.FunctionComponent<Props> = ({
   };
 
   const createPolicy = (cb?: (id: string) => void) => {
-    let allSelectedFields = selectedClusterFields.concat(
+    const allSelectedFields = selectedClusterFields.concat(
       ...selectedRegistryFields,
       ...selectedInfraFields,
       ...selectedSettingsFields
     );
 
-    let allSelectedValues = allSelectedFields.map((field) => field.value);
+    const allSelectedValues = allSelectedFields.map((field) => field.value);
 
     // construct the policy
-    let policy: PolicyDocType = {
+    const policy: PolicyDocType = {
       scope: "project",
       verbs: [],
       children: {
@@ -244,7 +244,7 @@ const CreateAPITokenForm: React.FunctionComponent<Props> = ({
           <CopyToClipboard
             as={CopyTokenButton}
             text={createdToken.token}
-            onSuccess={() => setCopied(true)}
+            onSuccess={() => { setCopied(true); }}
           >
             <i className="material-icons-outlined">
               {copied ? "check" : "content_copy"}
@@ -291,7 +291,7 @@ const CreateAPITokenForm: React.FunctionComponent<Props> = ({
       <InputRow
         value={apiTokenName}
         type="text"
-        setValue={(newName: string) => setAPITokenName(newName)}
+        setValue={(newName: string) => { setAPITokenName(newName); }}
         label="API Token Name"
         width="100%"
         placeholder="ex: api-token-admin"
diff --git a/dashboard/src/main/home/project-settings/api-tokens/CustomPolicyForm.tsx b/dashboard/src/main/home/project-settings/api-tokens/CustomPolicyForm.tsx
index af28bd798e..58110820e2 100644
--- a/dashboard/src/main/home/project-settings/api-tokens/CustomPolicyForm.tsx
+++ b/dashboard/src/main/home/project-settings/api-tokens/CustomPolicyForm.tsx
@@ -19,7 +19,7 @@ import SaveButton from "components/SaveButton";
 import { APIToken } from "../APITokensSection";
 import CheckboxList from "components/form-components/CheckboxList";
 import { PolicyDocType } from "shared/auth/types";
-import { ScopeOption } from "./CreateAPITokenForm";
+import { type ScopeOption } from "./CreateAPITokenForm";
 
 type Props = {
   selectedClusterFields: ScopeOption[];
@@ -94,7 +94,7 @@ const CustomPolicyForm: React.FunctionComponent<Props> = ({
       <InputRow
         value={policyName}
         type="text"
-        setValue={(newName: string) => setPolicyName(newName)}
+        setValue={(newName: string) => { setPolicyName(newName); }}
         label="Role Name"
         width="100%"
         placeholder="ex: custom-developer-role"
diff --git a/dashboard/src/main/home/project-settings/api-tokens/TokenList.tsx b/dashboard/src/main/home/project-settings/api-tokens/TokenList.tsx
index 39f9545980..017fb4be55 100644
--- a/dashboard/src/main/home/project-settings/api-tokens/TokenList.tsx
+++ b/dashboard/src/main/home/project-settings/api-tokens/TokenList.tsx
@@ -7,7 +7,7 @@ import { Context } from "shared/Context";
 import api from "shared/api";
 import { readableDate } from "shared/string_utils";
 import styled from "styled-components";
-import { APIToken, APITokenMeta } from "../APITokensSection";
+import { type APIToken, type APITokenMeta } from "../APITokensSection";
 
 type Props = {
   tokens: APITokenMeta[];
@@ -76,7 +76,7 @@ const TokenList: React.FunctionComponent<Props> = (props) => {
           {expandedTok.policy_name}.
         </Description>
         <RevokeAccessButtonWrapper>
-          <RevokeAccessButton onClick={() => revokeAPIToken(expandedTok.id)}>
+          <RevokeAccessButton onClick={() => { revokeAPIToken(expandedTok.id); }}>
             Revoke Token
           </RevokeAccessButton>
         </RevokeAccessButtonWrapper>
diff --git a/dashboard/src/main/home/provisioner/AWSFormSection.tsx b/dashboard/src/main/home/provisioner/AWSFormSection.tsx
index 6182d18d9a..1ae22a230b 100644
--- a/dashboard/src/main/home/provisioner/AWSFormSection.tsx
+++ b/dashboard/src/main/home/provisioner/AWSFormSection.tsx
@@ -5,7 +5,7 @@ import close from "assets/close.png";
 import { isAlphanumeric } from "shared/common";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { InfraType } from "shared/types";
+import { type InfraType } from "shared/types";
 import { pushFiltered } from "shared/routing";
 
 import SelectRow from "components/form-components/SelectRow";
@@ -129,7 +129,7 @@ const AWSFormSectionFC: React.FC<PropsType> = (props) => {
       // From the dashboard, only uncheck and disable if "creating" or "created"
       let filtered = selectedInfras;
       props.infras.forEach((infra: InfraType, i: number) => {
-        let { kind, status } = infra;
+        const { kind, status } = infra;
         if (status === "creating" || status === "created") {
           filtered = filtered.filter((item: any) => {
             return item.value !== kind;
@@ -145,7 +145,7 @@ const AWSFormSectionFC: React.FC<PropsType> = (props) => {
   }, [props.projectName]);
 
   const setClusterNameIfNotSet = () => {
-    let projectName = props.projectName || context.currentProject?.name;
+    const projectName = props.projectName || context.currentProject?.name;
 
     if (!clusterNameSet && !clusterName.includes(`${projectName}-cluster`)) {
       setClusterName(
@@ -264,11 +264,11 @@ const AWSFormSectionFC: React.FC<PropsType> = (props) => {
     const infraCreationRequests = selectedInfras
       // Check that we don't include any other key into the infra creation than ecr and eks
       .filter(filterNonAWSInfras)
-      .map((infra) => {
+      .map(async (infra) => {
         if (infra.value === "ecr") {
-          return provisionECR(awsIntegrationId?.id);
+          await provisionECR(awsIntegrationId?.id); return;
         }
-        return provisionEKS(awsIntegrationId?.id);
+        await provisionEKS(awsIntegrationId?.id);
       });
     // Wait for all promises to be completed (could be just one)
     await Promise.all(infraCreationRequests);
@@ -330,12 +330,12 @@ const AWSFormSectionFC: React.FC<PropsType> = (props) => {
   return (
     <StyledAWSFormSection>
       <FormSection>
-        <CloseButton onClick={() => props.setSelectedProvisioner(null)}>
+        <CloseButton onClick={() => { props.setSelectedProvisioner(null); }}>
           <CloseButtonImg src={close} />
         </CloseButton>
         <Heading isAtTop={true}>
           AWS Credentials
-          <GuideButton onClick={() => goToGuide()}>
+          <GuideButton onClick={() => { goToGuide(); }}>
             <i className="material-icons-outlined">help</i>
             Guide
           </GuideButton>
@@ -394,7 +394,7 @@ const AWSFormSectionFC: React.FC<PropsType> = (props) => {
         <CheckboxList
           options={provisionOptions}
           selected={selectedInfras}
-          setSelected={(x: { value: string; label: string }[]) => {
+          setSelected={(x: Array<{ value: string; label: string }>) => {
             setIsFormDirty(true);
             // console.log(x);
             setSelectedInfras(x);
diff --git a/dashboard/src/main/home/provisioner/AzureFormSection.tsx b/dashboard/src/main/home/provisioner/AzureFormSection.tsx
index e9c7d7ec75..2e2a2bf185 100644
--- a/dashboard/src/main/home/provisioner/AzureFormSection.tsx
+++ b/dashboard/src/main/home/provisioner/AzureFormSection.tsx
@@ -5,7 +5,7 @@ import close from "assets/close.png";
 import { isAlphanumeric } from "shared/common";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { InfraType } from "shared/types";
+import { type InfraType } from "shared/types";
 
 import InputRow from "components/form-components/InputRow";
 import CheckboxRow from "components/form-components/CheckboxRow";
@@ -78,7 +78,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
       // From the dashboard, only uncheck and disable if "creating" or "created"
       let filtered = selectedInfras;
       props.infras.forEach((infra: InfraType, i: number) => {
-        let { kind, status } = infra;
+        const { kind, status } = infra;
         if (status === "creating" || status === "created") {
           filtered = filtered.filter((item: any) => {
             return item.value !== kind;
@@ -94,7 +94,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
   }, [props.projectName]);
 
   const setClusterNameIfNotSet = () => {
-    let projectName = props.projectName || context.currentProject?.name;
+    const projectName = props.projectName || context.currentProject?.name;
 
     if (!clusterNameSet && !clusterName.includes(`${projectName}-cluster`)) {
       setClusterName(
@@ -108,7 +108,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
       return true;
     }
 
-    let { projectName } = props;
+    const { projectName } = props;
     if (projectName || projectName === "") {
       return (
         !isAlphanumeric(projectName) ||
@@ -134,14 +134,14 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
   return (
     <StyledAWSFormSection>
       <FormSection>
-        <CloseButton onClick={() => props.setSelectedProvisioner(null)}>
+        <CloseButton onClick={() => { props.setSelectedProvisioner(null); }}>
           <CloseButtonImg src={close} />
         </CloseButton>
         <Heading isAtTop={true}>Azure credentials</Heading>
         <InputRow
           type="text"
           value={applicationId}
-          setValue={(x: string) => setApplicationId(x)}
+          setValue={(x: string) => { setApplicationId(x); }}
           label="⚙️ Azure application (client) ID"
           placeholder="ex: 123456780-abcd-1234-abcd-12345678"
           width="100%"
@@ -150,7 +150,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
         <InputRow
           type="password"
           value={azureServicePrincipal}
-          setValue={(x: string) => setAzureServicePrincipal(x)}
+          setValue={(x: string) => { setAzureServicePrincipal(x); }}
           label="🔒 Azure service principal"
           placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
           width="100%"
@@ -159,7 +159,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
         <InputRow
           type="text"
           value={tenantId}
-          setValue={(x: string) => setTenantId(x)}
+          setValue={(x: string) => { setTenantId(x); }}
           label="👤 Azure tenant ID"
           placeholder="ex: 123456780-abcd-1234-abcd-12345678"
           width="100%"
@@ -168,7 +168,7 @@ const AzureFormSectionFC: React.FC<PropsType> = (props) => {
         <InputRow
           type="text"
           value={subscriptionId}
-          setValue={(x: string) => setSubscriptionId(x)}
+          setValue={(x: string) => { setSubscriptionId(x); }}
           label="💳 Azure subscription ID"
           placeholder="ex: 123456780-abcd-1234-abcd-12345678"
           width="100%"
diff --git a/dashboard/src/main/home/provisioner/DOFormSection.tsx b/dashboard/src/main/home/provisioner/DOFormSection.tsx
index eb31438740..334fff5c9d 100644
--- a/dashboard/src/main/home/provisioner/DOFormSection.tsx
+++ b/dashboard/src/main/home/provisioner/DOFormSection.tsx
@@ -5,7 +5,7 @@ import close from "assets/close.png";
 import { isAlphanumeric } from "shared/common";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { InfraType } from "shared/types";
+import { type InfraType } from "shared/types";
 
 import InputRow from "components/form-components/InputRow";
 import CheckboxRow from "components/form-components/CheckboxRow";
@@ -77,7 +77,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
       // From the dashboard, only uncheck and disable if "creating" or "created"
       let filtered = selectedInfras;
       props.infras.forEach((infra: InfraType, i: number) => {
-        let { kind, status } = infra;
+        const { kind, status } = infra;
         if (status === "creating" || status === "created") {
           filtered = filtered.filter((item: any) => {
             return item.value !== kind;
@@ -93,7 +93,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
   }, [props.projectName]);
 
   const setClusterNameIfNotSet = () => {
-    let projectName = props.projectName || context.currentProject?.name;
+    const projectName = props.projectName || context.currentProject?.name;
 
     if (!clusterNameSet && !clusterName.includes(`${projectName}-cluster`)) {
       setClusterName(
@@ -107,7 +107,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
       return true;
     }
 
-    let { projectName } = props;
+    const { projectName } = props;
     if (projectName || projectName === "") {
       return (
         !isAlphanumeric(projectName) ||
@@ -122,7 +122,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
   const catchError = (err: any) => {
     console.log(err);
     props.handleError();
-    return;
+    
   };
 
   const doRedirect = (projectId: number) => {
@@ -138,7 +138,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
   // TODO: handle generically (with > 2 steps)
   const onCreateDO = () => {
     props?.trackOnSave();
-    let { currentProject } = context;
+    const { currentProject } = context;
     doRedirect(currentProject.id);
   };
 
@@ -179,7 +179,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
   return (
     <StyledAWSFormSection>
       <FormSection>
-        <CloseButton onClick={() => props.setSelectedProvisioner(null)}>
+        <CloseButton onClick={() => { props.setSelectedProvisioner(null); }}>
           <CloseButtonImg src={close} />
         </CloseButton>
         <Heading isAtTop={true}>DigitalOcean Settings</Heading>
@@ -213,7 +213,7 @@ const DOFormSectionFC: React.FC<PropsType> = (props) => {
         <CheckboxList
           options={provisionOptions}
           selected={selectedInfras}
-          setSelected={(x: { value: string; label: string }[]) => {
+          setSelected={(x: Array<{ value: string; label: string }>) => {
             setSelectedInfras(x);
             setIsFormDirty(true);
           }}
diff --git a/dashboard/src/main/home/provisioner/ExistingClusterSection.tsx b/dashboard/src/main/home/provisioner/ExistingClusterSection.tsx
index 5172b71b73..340b1ccff6 100644
--- a/dashboard/src/main/home/provisioner/ExistingClusterSection.tsx
+++ b/dashboard/src/main/home/provisioner/ExistingClusterSection.tsx
@@ -8,7 +8,7 @@ import { Context } from "shared/Context";
 import { pushFiltered } from "shared/routing";
 
 import SaveButton from "components/SaveButton";
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 type PropsType = RouteComponentProps & {
   projectName: string;
@@ -35,15 +35,15 @@ class ExistingClusterSection extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { children, projectName } = this.props;
-    let { buttonStatus } = this.state;
+    const { children, projectName } = this.props;
+    const { buttonStatus } = this.state;
     return (
       <StyledExistingClusterSection>
         <Placeholder>
           You can manually link to an existing cluster once this project has
           been created.
         </Placeholder>
-        {children ? children : <Padding />}
+        {children || <Padding />}
         <SaveButton
           text="Submit"
           disabled={!isAlphanumeric(projectName)}
diff --git a/dashboard/src/main/home/provisioner/GCPFormSection.tsx b/dashboard/src/main/home/provisioner/GCPFormSection.tsx
index 57a94d027c..4eeff65c66 100644
--- a/dashboard/src/main/home/provisioner/GCPFormSection.tsx
+++ b/dashboard/src/main/home/provisioner/GCPFormSection.tsx
@@ -5,7 +5,7 @@ import close from "assets/close.png";
 import { isAlphanumeric } from "shared/common";
 import api from "shared/api";
 import { Context } from "shared/Context";
-import { InfraType } from "shared/types";
+import { type InfraType } from "shared/types";
 import { pushFiltered } from "shared/routing";
 
 import UploadArea from "components/form-components/UploadArea";
@@ -91,7 +91,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
       // From the dashboard, only uncheck and disable if "creating" or "created"
       let filtered = selectedInfras;
       props.infras.forEach((infra: InfraType, i: number) => {
-        let { kind, status } = infra;
+        const { kind, status } = infra;
         if (status === "creating" || status === "created") {
           filtered = filtered.filter((item: any) => {
             return item.value !== kind;
@@ -107,7 +107,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
   }, [props.projectName]);
 
   const setClusterNameIfNotSet = () => {
-    let projectName = props.projectName || context.currentProject?.name;
+    const projectName = props.projectName || context.currentProject?.name;
 
     if (!clusterNameSet && !clusterName.includes(`${projectName}-cluster`)) {
       setClusterName(
@@ -121,7 +121,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
       return true;
     }
 
-    let { projectName } = props;
+    const { projectName } = props;
     if (projectName || projectName === "") {
       return (
         !isAlphanumeric(projectName) ||
@@ -150,10 +150,10 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
     props.handleError();
   };
 
-  const provisionGCR = (id: number) => {
-    let { currentProject } = context;
+  const provisionGCR = async (id: number) => {
+    const { currentProject } = context;
 
-    return api
+    return await api
       .provisionInfra(
         "<token>",
         {
@@ -167,7 +167,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
   };
 
   const provisionGKE = (id: number) => {
-    let { currentProject } = context;
+    const { currentProject } = context;
 
     api
       .provisionInfra(
@@ -184,15 +184,15 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
         { project_id: currentProject.id }
       )
       .then((res) =>
-        pushFiltered({ history, location }, "/dashboard", ["project_id"], {
+        { pushFiltered({ history, location }, "/dashboard", ["project_id"], {
           tab: "provisioner",
-        })
+        }); }
       )
       .catch(catchError);
   };
 
   const handleCreateFlow = () => {
-    let { currentProject } = context;
+    const { currentProject } = context;
     api
       .createGCPIntegration(
         "<token>",
@@ -204,22 +204,22 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
       )
       .then((res) => {
         if (res?.data) {
-          let { id } = res.data;
+          const { id } = res.data;
 
           if (selectedInfras.length === 2) {
             // Case: project exists, provision GCR + GKE
-            provisionGCR(id).then(() => provisionGKE(id));
+            provisionGCR(id).then(() => { provisionGKE(id); });
           } else if (selectedInfras[0].value === "gcr") {
             // Case: project exists, only provision GCR
             provisionGCR(id).then(() =>
-              pushFiltered(
+              { pushFiltered(
                 { location, history },
                 "/dashboard",
                 ["project_id"],
                 {
                   tab: "provisioner",
                 }
-              )
+              ); }
             );
           } else {
             // Case: project exists, only provision GKE
@@ -233,7 +233,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
   const onCreateGCP = () => {
     props?.trackOnSave();
     setButtonStatus("loading");
-    let { projectName } = props;
+    const { projectName } = props;
 
     handleCreateFlow();
   };
@@ -290,12 +290,12 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
   return (
     <StyledGCPFormSection>
       <FormSection>
-        <CloseButton onClick={() => props.setSelectedProvisioner(null)}>
+        <CloseButton onClick={() => { props.setSelectedProvisioner(null); }}>
           <CloseButtonImg src={close} />
         </CloseButton>
         <Heading isAtTop={true}>
           GCP Credentials
-          <GuideButton onClick={() => goToGuide()}>
+          <GuideButton onClick={() => { goToGuide(); }}>
             <i className="material-icons-outlined">help</i>
             Guide
           </GuideButton>
@@ -343,7 +343,7 @@ const GCPFormSectionFC: React.FC<PropsType> = (props) => {
         <CheckboxList
           options={provisionOptions}
           selected={selectedInfras}
-          setSelected={(x: { value: string; label: string }[]) => {
+          setSelected={(x: Array<{ value: string; label: string }>) => {
             setIsFormDirty(true);
             setSelectedInfras(x);
           }}
diff --git a/dashboard/src/main/home/provisioner/ProvisionerSettings.tsx b/dashboard/src/main/home/provisioner/ProvisionerSettings.tsx
index e8a4a4817a..5d0c4d8be4 100644
--- a/dashboard/src/main/home/provisioner/ProvisionerSettings.tsx
+++ b/dashboard/src/main/home/provisioner/ProvisionerSettings.tsx
@@ -9,7 +9,7 @@ import styled from "styled-components";
 
 import { Context } from "shared/Context";
 import { integrationList } from "shared/common";
-import { InfraType } from "shared/types";
+import { type InfraType } from "shared/types";
 
 import Helper from "components/form-components/Helper";
 import AWSFormSection from "./AWSFormSection";
@@ -107,7 +107,7 @@ const ProvisionerSettings: React.FC<Props> = ({
         {selectedProvider === "skipped" ? (
           <Helper>
             Don't have a Kubernetes cluster?
-            <Highlight onClick={() => handleSelectProvider(null)}>
+            <Highlight onClick={() => { handleSelectProvider(null); }}>
               Provision through Porter
             </Highlight>
           </Helper>
@@ -115,7 +115,7 @@ const ProvisionerSettings: React.FC<Props> = ({
           <PositionWrapper selectedProvider={selectedProvider}>
             <Helper>
               Already have a Kubernetes cluster?
-              <Highlight onClick={() => handleSelectProvider("skipped")}>
+              <Highlight onClick={() => { handleSelectProvider("skipped"); }}>
                 Skip
               </Highlight>
             </Helper>
@@ -141,7 +141,7 @@ const ProvisionerSettings: React.FC<Props> = ({
           setSelectedProvisioner={(x: string | null) => {
             handleSelectProvider(x);
           }}
-          trackOnSave={() => trackOnSave(selectedProvider)}
+          trackOnSave={() => { trackOnSave(selectedProvider); }}
         >
           {renderSkipHelper()}
         </AWSFormSection>
@@ -158,7 +158,7 @@ const ProvisionerSettings: React.FC<Props> = ({
           setSelectedProvisioner={(x: string | null) => {
             handleSelectProvider(x);
           }}
-          trackOnSave={() => trackOnSave(selectedProvider)}
+          trackOnSave={() => { trackOnSave(selectedProvider); }}
         >
           {renderSkipHelper()}
         </GCPFormSection>
@@ -175,7 +175,7 @@ const ProvisionerSettings: React.FC<Props> = ({
           setSelectedProvisioner={(x: string | null) => {
             handleSelectProvider(x);
           }}
-          trackOnSave={() => trackOnSave(selectedProvider)}
+          trackOnSave={() => { trackOnSave(selectedProvider); }}
         />
       );
     }
@@ -190,7 +190,7 @@ const ProvisionerSettings: React.FC<Props> = ({
           setSelectedProvisioner={(x: string | null) => {
             handleSelectProvider(x);
           }}
-          trackOnSave={() => trackOnSave(selectedProvider)}
+          trackOnSave={() => { trackOnSave(selectedProvider); }}
         />
       );
     }
@@ -198,7 +198,7 @@ const ProvisionerSettings: React.FC<Props> = ({
     return (
       <ExistingClusterSection
         projectName={projectName}
-        trackOnSave={() => trackOnSave(selectedProvider)}
+        trackOnSave={() => { trackOnSave(selectedProvider); }}
       >
         {renderSkipHelper()}
       </ExistingClusterSection>
@@ -206,7 +206,7 @@ const ProvisionerSettings: React.FC<Props> = ({
   };
 
   const renderFooter = () => {
-    let helper = provisioner
+    const helper = provisioner
       ? "Note: Provisioning can take up to 15 minutes"
       : "";
 
@@ -215,7 +215,7 @@ const ProvisionerSettings: React.FC<Props> = ({
         <>
           <Helper>
             Already have a Kubernetes cluster?
-            <Highlight onClick={() => handleSelectProvider("skipped")}>
+            <Highlight onClick={() => { handleSelectProvider("skipped"); }}>
               Skip
             </Highlight>
           </Helper>
@@ -254,7 +254,7 @@ const ProvisionerSettings: React.FC<Props> = ({
       {!selectedProvider ? (
         <BlockList>
           {providers.map((provider: string, i: number) => {
-            let providerInfo = integrationList[provider];
+            const providerInfo = integrationList[provider];
             return (
               <Block
                 key={i}
diff --git a/dashboard/src/main/home/sidebar/AddCluster/AWSCredentialList.tsx b/dashboard/src/main/home/sidebar/AddCluster/AWSCredentialList.tsx
index d261eba4ad..4df70964f5 100644
--- a/dashboard/src/main/home/sidebar/AddCluster/AWSCredentialList.tsx
+++ b/dashboard/src/main/home/sidebar/AddCluster/AWSCredentialList.tsx
@@ -97,7 +97,7 @@ const AWSCredentialsList: React.FunctionComponent<Props> = ({
           })}
           selectCredential={selectCredential}
           setTargetARN={setTargetARN}
-          shouldCreateCred={() => setShouldCreateCred(true)}
+          shouldCreateCred={() => { setShouldCreateCred(true); }}
           addNewText="Create new CloudFormation stack"
           gpuModal={gpuModal}
         />
diff --git a/dashboard/src/main/home/sidebar/AddCluster/CredentialList.tsx b/dashboard/src/main/home/sidebar/AddCluster/CredentialList.tsx
index dfeb3ca07b..6a0e6f7db0 100644
--- a/dashboard/src/main/home/sidebar/AddCluster/CredentialList.tsx
+++ b/dashboard/src/main/home/sidebar/AddCluster/CredentialList.tsx
@@ -21,7 +21,7 @@ type GenericCredential = {
 
 const CredentialList: React.FunctionComponent<Props> = (props) => {
   const renderCreateSection = () => {
-    let inner = (
+    const inner = (
       <Flex>
         <i className="material-icons">account_circle</i>
         {props.addNewText}
diff --git a/dashboard/src/main/home/sidebar/Clusters.tsx b/dashboard/src/main/home/sidebar/Clusters.tsx
index 58f7a35c2c..7483a85f3c 100644
--- a/dashboard/src/main/home/sidebar/Clusters.tsx
+++ b/dashboard/src/main/home/sidebar/Clusters.tsx
@@ -4,7 +4,7 @@ import styled from "styled-components";
 import api from "shared/api";
 import { pushFiltered } from "shared/routing";
 import { Context } from "shared/Context";
-import { ClusterType } from "shared/types";
+import { type ClusterType } from "shared/types";
 import { ClusterSection } from "./ClusterSection";
 import SidebarLink from "./SidebarLink";
 
@@ -13,7 +13,7 @@ import job from "assets/job-bold.png";
 import web from "assets/web-bold.png";
 import sliders from "assets/sliders.svg";
 
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 
 type PropsType = RouteComponentProps & {
   setWelcome: (x: boolean) => void;
@@ -42,7 +42,7 @@ class Clusters extends Component<PropsType, StateType> {
     if (!this.context.currentProject) {
       return;
     }
-    let {
+    const {
       user,
       currentProject,
       setCurrentCluster,
@@ -61,14 +61,14 @@ class Clusters extends Component<PropsType, StateType> {
         this.props.setWelcome(false);
         // TODO: handle uninitialized kubeconfig
         if (res.data) {
-          let clusters = res.data;
+          const clusters = res.data;
           clusters.sort((a: any, b: any) => a.id - b.id);
           if (clusters.length > 0) {
-            let queryString = window.location.search;
-            let urlParams = new URLSearchParams(queryString);
-            let paramClusterName = urlParams.get("cluster");
-            let params = this.props.match.params as any;
-            let pathClusterName = params.cluster;
+            const queryString = window.location.search;
+            const urlParams = new URLSearchParams(queryString);
+            const paramClusterName = urlParams.get("cluster");
+            const params = this.props.match.params as any;
+            const pathClusterName = params.cluster;
 
             // Set cluster from URL if in path or params
             let defaultCluster = null as ClusterType;
@@ -85,7 +85,7 @@ class Clusters extends Component<PropsType, StateType> {
             }
 
             this.setState({ clusters });
-            let saved = JSON.parse(
+            const saved = JSON.parse(
               localStorage.getItem(currentProject?.id + "-cluster")
             );
             if (!defaultCluster && saved && saved !== "null") {
@@ -117,7 +117,7 @@ class Clusters extends Component<PropsType, StateType> {
           }
         }
       })
-      .catch((err) => this.props.setWelcome(true));
+      .catch((err) => { this.props.setWelcome(true); });
   };
 
   componentDidMount() {
@@ -130,7 +130,7 @@ class Clusters extends Component<PropsType, StateType> {
       if (this.state.prevProjectId !== this.context.currentProject?.id) {
         this.updateClusters();
         this.setState({ prevProjectId: this.context.currentProject?.id });
-      } else if (this.props.forceRefreshClusters === true) {
+      } else if (this.props.forceRefreshClusters) {
         this.updateClusters();
         this.props.setRefreshClusters(false);
       }
@@ -144,8 +144,8 @@ class Clusters extends Component<PropsType, StateType> {
   };
 
   renderContents = (): React.ReactNode => {
-    let { clusters } = this.state;
-    let { currentCluster, setCurrentCluster, currentProject } = this.context;
+    const { clusters } = this.state;
+    const { currentCluster, setCurrentCluster, currentProject } = this.context;
 
     if (currentProject?.simplified_view_enabled) {
       return null;
diff --git a/dashboard/src/main/home/sidebar/ProjectSelectionModal.tsx b/dashboard/src/main/home/sidebar/ProjectSelectionModal.tsx
index 9247f7da15..40ce8d12a7 100644
--- a/dashboard/src/main/home/sidebar/ProjectSelectionModal.tsx
+++ b/dashboard/src/main/home/sidebar/ProjectSelectionModal.tsx
@@ -1,16 +1,15 @@
-import { RouteComponentProps, withRouter } from "react-router";
+import { type RouteComponentProps, withRouter } from "react-router";
 import styled from "styled-components";
-import React, { useContext, useEffect, useState } from "react";
+import React, { useContext, useEffect, useState , useMemo } from "react";
 
 import Modal from "components/porter/Modal";
 import Text from "components/porter/Text";
 import Spacer from "components/porter/Spacer";
 import { Context } from "shared/Context";
-import { DetailedClusterType, ProjectListType, ProjectType } from "shared/types";
+import { type DetailedClusterType, type ProjectListType, type ProjectType } from "shared/types";
 import { pushFiltered } from "shared/routing";
 import SearchBar from "components/porter/SearchBar";
 import _ from 'lodash';
-import { useMemo } from 'react';
 import api from "shared/api";
 import Button from "components/porter/Button";
 import Container from "components/porter/Container";
@@ -146,9 +145,9 @@ const ProjectSelectionModal: React.FC<Props> = ({
         <Spacer inline x={1} />
 
         {user.isPorterUser && <Button onClick={() =>
-          pushFiltered(props, "/new-project", ["project_id"], {
+          { pushFiltered(props, "/new-project", ["project_id"], {
             new_project: true,
-          })} height="30px" width="130px">
+          }); }} height="30px" width="130px">
           <I className="material-icons">add</I> New Project
         </Button>}
       </Container>
diff --git a/dashboard/src/shared/ace-porter-theme.js b/dashboard/src/shared/ace-porter-theme.js
index b7e2e28125..18fc5b311c 100644
--- a/dashboard/src/shared/ace-porter-theme.js
+++ b/dashboard/src/shared/ace-porter-theme.js
@@ -1,6 +1,6 @@
 import ace from 'ace-builds/src-noconflict/ace';
 
-ace["define"](
+ace.define(
   "ace/theme/porter",
   ["require", "exports", "module", "ace/lib/dom"],
   (acequire, exports) => {
@@ -109,7 +109,7 @@ ace["define"](
     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYLBWV/8PAAK4AYnhiq+xAAAAAElFTkSuQmCC) right repeat-y;
     }`;
 
-    var dom = acequire("../lib/dom");
+    const dom = acequire("../lib/dom");
     dom.importCssString(exports.cssText, exports.cssClass);
   }
 );
diff --git a/dashboard/src/shared/auth/AuthorizationHoc.tsx b/dashboard/src/shared/auth/AuthorizationHoc.tsx
index 77ca8eb94c..1408211c30 100644
--- a/dashboard/src/shared/auth/AuthorizationHoc.tsx
+++ b/dashboard/src/shared/auth/AuthorizationHoc.tsx
@@ -1,12 +1,12 @@
 import React, { useCallback, useContext } from "react";
 import { AuthzContext } from "./AuthzContext";
 import { isAuthorized } from "./authorization-helpers";
-import { ScopeType, Verbs } from "./types";
+import { type ScopeType, type Verbs } from "./types";
 
 export const GuardedComponent = <ComponentProps extends object>(
   scope: ScopeType,
   resource: string,
-  verb: Verbs | Array<Verbs>
+  verb: Verbs | Verbs[]
 ) => (Component: any) => (props: ComponentProps) => {
   const authContext = useContext(AuthzContext);
 
@@ -20,8 +20,8 @@ export const GuardedComponent = <ComponentProps extends object>(
 export type WithAuthProps = {
   isAuthorized: (
     scope: ScopeType,
-    resource: string | Array<string>,
-    verb: Verbs | Array<Verbs>
+    resource: string | string[],
+    verb: Verbs | Verbs[]
   ) => boolean;
 };
 
@@ -39,7 +39,7 @@ export function withAuth<P>(
     const authContext = useContext(AuthzContext);
 
     const isAuth = useCallback(
-      (scope: ScopeType, resource: string, verb: Verbs | Array<Verbs>) =>
+      (scope: ScopeType, resource: string, verb: Verbs | Verbs[]) =>
         isAuthorized(authContext.currentPolicy, scope, resource, verb),
       [authContext.currentPolicy]
     );
diff --git a/dashboard/src/shared/auth/authorization-helpers.ts b/dashboard/src/shared/auth/authorization-helpers.ts
index f34456d08d..cb37fcebeb 100644
--- a/dashboard/src/shared/auth/authorization-helpers.ts
+++ b/dashboard/src/shared/auth/authorization-helpers.ts
@@ -1,4 +1,4 @@
-import { HIERARCHY_TREE, PolicyDocType, ScopeType, Verbs } from "./types";
+import { type HIERARCHY_TREE, type PolicyDocType, type ScopeType, type Verbs } from "./types";
 
 export const ADMIN_POLICY_MOCK: PolicyDocType = {
   scope: "project",
@@ -53,8 +53,8 @@ export const POLICY_HIERARCHY_TREE: HIERARCHY_TREE = {
 export const isAuthorized = (
   policy: PolicyDocType,
   scope: string,
-  resource: string | Array<string>,
-  verb: Verbs | Array<Verbs>
+  resource: string | string[],
+  verb: Verbs | Verbs[]
 ): boolean => {
   if (!policy) {
     return false;
@@ -95,16 +95,16 @@ export const populatePolicy = (
   currPolicy: PolicyDocType,
   tree: HIERARCHY_TREE,
   currScope: ScopeType,
-  parentVerbs: Array<Verbs>
+  parentVerbs: Verbs[]
 ) => {
   const currTree = tree[currScope];
-  const treeKeys = Object.keys(currTree) as Array<ScopeType>;
+  const treeKeys = Object.keys(currTree) as ScopeType[];
 
   currPolicy.children = currPolicy?.children || {};
   currPolicy.resources = currPolicy?.resources || [];
 
   for (const child of treeKeys) {
-    let childPolicy = currPolicy?.children && currPolicy?.children[child];
+    let childPolicy = currPolicy?.children?.[child];
     if (!childPolicy) {
       childPolicy = {
         scope: child,
diff --git a/dashboard/src/shared/auth/types.ts b/dashboard/src/shared/auth/types.ts
index 6e50f6578c..2d3058ea24 100644
--- a/dashboard/src/shared/auth/types.ts
+++ b/dashboard/src/shared/auth/types.ts
@@ -13,9 +13,9 @@ export type ScopeType =
 
 export type Verbs = "get" | "list" | "create" | "update" | "delete";
 
-export interface PolicyDocType {
+export type PolicyDocType = {
   scope: ScopeType;
-  verbs: Array<Verbs>;
+  verbs: Verbs[];
   resources?: string[];
   children?: Partial<Record<ScopeType, PolicyDocType>>;
 }
@@ -28,4 +28,4 @@ export enum ScopeTypeEnum {
   APPLICATION = "application",
 }
 
-export type HIERARCHY_TREE = { [key: string]: any };
+export type HIERARCHY_TREE = Record<string, any>;
diff --git a/dashboard/src/shared/baseApi.ts b/dashboard/src/shared/baseApi.ts
index 7d8160b71c..9380ca2f95 100644
--- a/dashboard/src/shared/baseApi.ts
+++ b/dashboard/src/shared/baseApi.ts
@@ -1,4 +1,4 @@
-import axios, { AxiosPromise, AxiosRequestConfig, Method } from "axios";
+import axios, { type AxiosPromise, type AxiosRequestConfig, type Method } from "axios";
 import qs from "qs";
 
 type EndpointParam<PathParamsType> =
@@ -52,7 +52,7 @@ const buildAxiosConfig: BuildAxiosConfigFunction = (
   if (method.toUpperCase() === "GET") {
     return {
       ...config,
-      params: params,
+      params,
       paramsSerializer: (params) =>
         qs.stringify(params, { arrayFormat: "repeat" }),
     };
@@ -71,14 +71,14 @@ const buildAxiosConfig: BuildAxiosConfigFunction = (
 const apiQueryBuilder = <ParamsType extends {}, PathParamsType = {}>(
   method: Method = "GET",
   endpoint: EndpointParam<PathParamsType>
-) => <ResponseType = any>(
+) => async <ResponseType = any>(
   token: string,
   params: ParamsType,
   pathParams: PathParamsType
 ) =>
-  axios(
+  await (axios(
     buildAxiosConfig(method, endpoint, token, params, pathParams)
-  ) as AxiosPromise<ResponseType>;
+  ) as AxiosPromise<ResponseType>);
 
 export { apiQueryBuilder as baseApi };
 export default apiQueryBuilder;
diff --git a/dashboard/src/shared/common.tsx b/dashboard/src/shared/common.tsx
index 1278abd741..b78f041304 100644
--- a/dashboard/src/shared/common.tsx
+++ b/dashboard/src/shared/common.tsx
@@ -147,7 +147,7 @@ export const integrationList: any = {
 };
 
 export const isAlphanumeric = (x: string | null) => {
-  let re = /^[a-z0-9-]+$/;
+  const re = /^[a-z0-9-]+$/;
   if (!x || x.length == 0 || x.search(re) === -1) {
     return false;
   }
diff --git a/dashboard/src/shared/error_handling/logger.ts b/dashboard/src/shared/error_handling/logger.ts
index b80faa9653..c0f17bde7b 100644
--- a/dashboard/src/shared/error_handling/logger.ts
+++ b/dashboard/src/shared/error_handling/logger.ts
@@ -1,7 +1,7 @@
 import * as Sentry from "@sentry/react";
 import { isEmpty } from "lodash";
 
-type LogFunction = (error: Error, tags?: { [key: string]: string }) => void;
+type LogFunction = (error: Error, tags?: Record<string, string>) => void;
 type LogFunctions = {
   [key in Sentry.Severity]: LogFunction;
 };
@@ -39,7 +39,7 @@ function buildLogger(scope: string = "global") {
 
       return acc;
     },
-    {} as LogFunctions
+    {}
   );
 
   return logFunctions;
diff --git a/dashboard/src/shared/error_handling/stack_trace_utils.ts b/dashboard/src/shared/error_handling/stack_trace_utils.ts
index 82e4c148cc..74148d9154 100644
--- a/dashboard/src/shared/error_handling/stack_trace_utils.ts
+++ b/dashboard/src/shared/error_handling/stack_trace_utils.ts
@@ -1,4 +1,4 @@
-import { StackFrame } from "stacktrace-js";
+import { type StackFrame } from "stacktrace-js";
 
 export const stackFramesToString = (stackFrames: StackFrame[]) => {
   return stackFrames
diff --git a/dashboard/src/shared/hardcodedNameDict.tsx b/dashboard/src/shared/hardcodedNameDict.tsx
index 7eaec674ac..e21c7e360d 100644
--- a/dashboard/src/shared/hardcodedNameDict.tsx
+++ b/dashboard/src/shared/hardcodedNameDict.tsx
@@ -2,7 +2,7 @@ import awsRDS from "assets/amazon-rds.png";
 import awsElasticache from "assets/aws-elasticache.png";
 import lightning from "../assets/lightning.png";
 
-const hardcodedNames: { [key: string]: string } = {
+const hardcodedNames: Record<string, string> = {
   agones: "Agones System",
   docker: "Docker",
   "https-issuer": "HTTPS Issuer",
@@ -32,7 +32,7 @@ const hardcodedNames: { [key: string]: string } = {
   "nri-bundle": "New Relic",
 };
 
-const hardcodedIcons: { [key: string]: string } = {
+const hardcodedIcons: Record<string, string> = {
   "elasticache-redis": awsElasticache,
   "https-issuer":
     "https://cdn4.iconfinder.com/data/icons/macster-2/100/https__-512.png",
diff --git a/dashboard/src/shared/hooks/useOutsideAlerter.ts b/dashboard/src/shared/hooks/useOutsideAlerter.ts
index 6958772617..5595a155bf 100644
--- a/dashboard/src/shared/hooks/useOutsideAlerter.ts
+++ b/dashboard/src/shared/hooks/useOutsideAlerter.ts
@@ -1,4 +1,5 @@
-import React, { MutableRefObject, RefObject, useEffect, useRef } from "react";
+import type React from "react";
+import { MutableRefObject, RefObject, useEffect, useRef } from "react";
 
 /**
  * Hook that alerts clicks outside of the passed ref
diff --git a/dashboard/src/shared/hooks/useWebsockets.ts b/dashboard/src/shared/hooks/useWebsockets.ts
index 52e15523ed..274cd457cf 100644
--- a/dashboard/src/shared/hooks/useWebsockets.ts
+++ b/dashboard/src/shared/hooks/useWebsockets.ts
@@ -1,23 +1,19 @@
 import { useRef } from "react";
 
-export interface NewWebsocketOptions {
+export type NewWebsocketOptions = {
   onopen?: () => void;
   onmessage?: (evt: MessageEvent) => void;
   onerror?: (err: ErrorEvent) => void;
   onclose?: (ev: CloseEvent) => void;
 }
 
-interface WebsocketConfig extends NewWebsocketOptions {
+type WebsocketConfig = {
   url: string;
-}
+} & NewWebsocketOptions
 
-type WebsocketConfigMap = {
-  [id: string]: WebsocketConfig;
-};
+type WebsocketConfigMap = Record<string, WebsocketConfig>;
 
-type WebsocketMap = {
-  [id: string]: WebSocket;
-};
+type WebsocketMap = Record<string, WebSocket>;
 
 export const useWebsockets = () => {
   const websocketMap = useRef<WebsocketMap>({});
@@ -45,7 +41,7 @@ export const useWebsockets = () => {
       return;
     }
 
-    let protocol = window.location.protocol == "https:" ? "wss" : "ws";
+    const protocol = window.location.protocol == "https:" ? "wss" : "ws";
 
     const url = `${protocol}://${window.location.host}${apiEndpoint}`;
 
diff --git a/dashboard/src/shared/rosettaStone.tsx b/dashboard/src/shared/rosettaStone.tsx
index 7af9d63351..7107e5aa41 100644
--- a/dashboard/src/shared/rosettaStone.tsx
+++ b/dashboard/src/shared/rosettaStone.tsx
@@ -1,4 +1,4 @@
-export const kindToIcon: { [kind: string]: string } = {
+export const kindToIcon: Record<string, string> = {
   Deployment: "category",
   Pod: "fiber_manual_record",
   Service: "alt_route",
@@ -14,7 +14,7 @@ export const kindToIcon: { [kind: string]: string } = {
   PodSecurityPolicy: "security",
 };
 
-export const edgeColors: { [kind: string]: string } = {
+export const edgeColors: Record<string, string> = {
   LabelRel: "#32a85f",
   ControlRel: "#fcb603",
   SpecRel: "#949EFF",
diff --git a/dashboard/src/shared/string_utils.ts b/dashboard/src/shared/string_utils.ts
index d847867617..81e1944301 100644
--- a/dashboard/src/shared/string_utils.ts
+++ b/dashboard/src/shared/string_utils.ts
@@ -13,7 +13,7 @@ export const relativeDate = (date: string | number, future: boolean) => {
     return "N/A";
   }
 
-  // @ts-ignore
+  // @ts-expect-error
   const rtf = new Intl.RelativeTimeFormat("en", {
     localeMatcher: "best fit", // other values: "lookup"
     numeric: "auto", // other values: "auto"
@@ -52,7 +52,7 @@ export const timeFrom = (
   secondTime?: string | number
 ) => {
   // Get timestamps
-  let unixTime = new Date(time).getTime();
+  const unixTime = new Date(time).getTime();
   if (!unixTime) return;
 
   let now = new Date().getTime();
@@ -65,7 +65,7 @@ export const timeFrom = (
   let difference = unixTime / 1000 - now / 1000;
 
   // Setup return object
-  let tfn: any = {};
+  const tfn: any = {};
 
   // Check if time is in the past, present, or future
   tfn.when = "now";