diff --git a/frontend/.prettierrc.yaml b/frontend/.prettierrc.yaml
index dda1437..98eb2b2 100644
--- a/frontend/.prettierrc.yaml
+++ b/frontend/.prettierrc.yaml
@@ -2,3 +2,4 @@ trailingComma: "es5"
 tabWidth: 2
 semi: true
 singleQuote: false
+bracketSpacing: true
diff --git a/frontend/src/API/k8s.ts b/frontend/src/API/k8s.ts
index c292fd7..e3c2205 100644
--- a/frontend/src/API/k8s.ts
+++ b/frontend/src/API/k8s.ts
@@ -6,10 +6,11 @@ import apiService from "./apiService";
 // Get list of kubectl contexts configured locally
 function useGetKubectlContexts(options?: UseQueryOptions<KubectlContexts>) {
   return useQuery<KubectlContexts>({
-    queryKey:["k8s", "contexts"],
-    queryFn:() => apiService.fetchWithDefaults<KubectlContexts>("/api/k8s/contexts"),
-...(options ?? {})
-});
+    queryKey: ["k8s", "contexts"],
+    queryFn: () =>
+      apiService.fetchWithDefaults<KubectlContexts>("/api/k8s/contexts"),
+    ...(options ?? {}),
+  });
 }
 
 // Get resources information
@@ -21,12 +22,12 @@ function useGetK8sResource(
 ) {
   return useQuery<K8sResource>({
     queryKey: ["k8s", kind, "get", name, namespace],
-    queryFn:() =>
+    queryFn: () =>
       apiService.fetchWithDefaults<K8sResource>(
         `/api/k8s/${kind}/get?name=${name}&namespace=${namespace}`
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // Get list of resources
@@ -36,10 +37,10 @@ function useGetK8sResourceList(
 ) {
   return useQuery<K8sResourceList>({
     queryKey: ["k8s", kind, "list"],
-    queryFn:() =>
+    queryFn: () =>
       apiService.fetchWithDefaults<K8sResourceList>(`/api/k8s/${kind}/list`),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // Get describe text for kubernetes resource
@@ -50,8 +51,8 @@ function useGetK8sResourceDescribe(
   options?: UseQueryOptions<string>
 ) {
   return useQuery<string>({
-    queryKey:["k8s", kind, "describe", name, namespace],
-    queryFn:() =>
+    queryKey: ["k8s", kind, "describe", name, namespace],
+    queryFn: () =>
       apiService.fetchWithDefaults<string>(
         `/api/k8s/${kind}/describe?name=${name}&namespace=${namespace}`,
         {
@@ -60,6 +61,6 @@ function useGetK8sResourceDescribe(
           },
         }
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
diff --git a/frontend/src/API/other.ts b/frontend/src/API/other.ts
index add491a..ab4600b 100644
--- a/frontend/src/API/other.ts
+++ b/frontend/src/API/other.ts
@@ -12,12 +12,12 @@ export function useShutdownHelmDashboard(
   options?: UseMutationOptions<void, Error>
 ) {
   return useMutation<void, Error>({
-    mutationFn:() =>
+    mutationFn: () =>
       apiService.fetchWithDefaults("/", {
         method: "DELETE",
       }),
-...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // Gets application status
@@ -27,6 +27,6 @@ export function useGetApplicationStatus(
   return useQuery<ApplicationStatus>({
     queryKey: ["status"],
     queryFn: () => apiService.fetchWithDefaults<ApplicationStatus>("/status"),
-      ...(options ?? {}),
+    ...(options ?? {}),
   });
 }
diff --git a/frontend/src/API/releases.ts b/frontend/src/API/releases.ts
index e316d2c..68deb43 100644
--- a/frontend/src/API/releases.ts
+++ b/frontend/src/API/releases.ts
@@ -15,10 +15,11 @@ export function useGetInstalledReleases(
   options?: UseQueryOptions<Release[]>
 ) {
   return useQuery<Release[]>({
-    queryKey:["installedReleases", context],
-    queryFn: () => apiService.fetchWithDefaults<Release[]>("/api/helm/releases"),
-    ...(options ?? {})}
-  );
+    queryKey: ["installedReleases", context],
+    queryFn: () =>
+      apiService.fetchWithDefaults<Release[]>("/api/helm/releases"),
+    ...(options ?? {}),
+  });
 }
 
 export interface ReleaseManifest {
@@ -63,13 +64,13 @@ export function useGetReleaseManifest({
   options?: UseQueryOptions<ReleaseManifest[]>;
 }) {
   return useQuery<ReleaseManifest[]>({
-    queryKey:["manifest", namespace, chartName],
-    queryFn:() =>
+    queryKey: ["manifest", namespace, chartName],
+    queryFn: () =>
       apiService.fetchWithDefaults<ReleaseManifest[]>(
         `/api/helm/releases/${namespace}/${chartName}/manifests`
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // List of installed k8s resources for this release
@@ -79,13 +80,13 @@ export function useGetResources(
   options?: UseQueryOptions<StructuredResources[]>
 ) {
   const { data, ...rest } = useQuery<StructuredResources[]>({
-    queryKey:["resources", ns, name],
-    queryFn:() =>
+    queryKey: ["resources", ns, name],
+    queryFn: () =>
       apiService.fetchWithDefaults<StructuredResources[]>(
         `/api/helm/releases/${ns}/${name}/resources?health=true`
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 
   return {
     data: data
@@ -116,29 +117,29 @@ export function useGetResourceDescription(
   options?: UseQueryOptions<string>
 ) {
   return useQuery<string>({
-    queryKey:["describe", type, ns, name],
-    queryFn:() =>
+    queryKey: ["describe", type, ns, name],
+    queryFn: () =>
       apiService.fetchWithDefaults<string>(
         `/api/k8s/${type}/describe?name=${name}&namespace=${ns}`,
         {
           headers: { "Content-Type": "text/plain; charset=utf-8" },
         }
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 export function useGetLatestVersion(
   chartName: string,
   options?: UseQueryOptions<ChartVersion[]>
 ) {
   return useQuery<ChartVersion[]>({
-    queryKey:["latestver", chartName],
-    queryFn:() =>
+    queryKey: ["latestver", chartName],
+    queryFn: () =>
       apiService.fetchWithDefaults<ChartVersion[]>(
         `/api/helm/repositories/latestver?name=${chartName}`
       ),
-...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 export function useGetVersions(
   chartName: string,
@@ -150,8 +151,8 @@ export function useGetVersions(
       apiService.fetchWithDefaults<LatestChartVersion[]>(
         `/api/helm/repositories/versions?name=${chartName}`
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 export function useGetReleaseInfoByType(
@@ -161,16 +162,16 @@ export function useGetReleaseInfoByType(
 ) {
   const { chart, namespace, tab, revision } = params;
   return useQuery<string>({
-    queryKey:[tab, namespace, chart, revision, additionalParams],
-    queryFn:() =>
+    queryKey: [tab, namespace, chart, revision, additionalParams],
+    queryFn: () =>
       apiService.fetchWithDefaults<string>(
         `/api/helm/releases/${namespace}/${chart}/${tab}?revision=${revision}${additionalParams}`,
         {
           headers: { "Content-Type": "text/plain; charset=utf-8" },
         }
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 export function useGetDiff(
@@ -178,16 +179,16 @@ export function useGetDiff(
   options?: UseQueryOptions<string>
 ) {
   return useQuery<string>({
-    queryKey:["diff", formData],
-    queryFn:() => {
+    queryKey: ["diff", formData],
+    queryFn: () => {
       return apiService.fetchWithDefaults<string>("/diff", {
         body: formData,
 
         method: "POST",
       });
     },
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // Rollback the release to a previous revision
@@ -202,18 +203,21 @@ export function useRollbackRelease(
     void,
     unknown,
     { ns: string; name: string; revision: number }
-  >({mutationFn:({ ns, name, revision }) => {
-    const formData = new FormData();
-    formData.append("revision", revision.toString());
+  >({
+    mutationFn: ({ ns, name, revision }) => {
+      const formData = new FormData();
+      formData.append("revision", revision.toString());
 
-    return apiService.fetchWithDefaults<void>(
-      `/api/helm/releases/${ns}/${name}/rollback`,
-      {
-        method: "POST",
-        body: formData,
-      }
-    );
-  }, ...(options ?? {})});
+      return apiService.fetchWithDefaults<void>(
+        `/api/helm/releases/${ns}/${name}/rollback`,
+        {
+          method: "POST",
+          body: formData,
+        }
+      );
+    },
+    ...(options ?? {}),
+  });
 }
 
 // Run the tests on a release
@@ -221,7 +225,7 @@ export function useTestRelease(
   options?: UseMutationOptions<void, unknown, { ns: string; name: string }>
 ) {
   return useMutation<void, unknown, { ns: string; name: string }>({
-    mutationFn:({ ns, name }) => {
+    mutationFn: ({ ns, name }) => {
       return apiService.fetchWithDefaults<void>(
         `/api/helm/releases/${ns}/${name}/test`,
         {
@@ -229,8 +233,8 @@ export function useTestRelease(
         }
       );
     },
-...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 export function useChartReleaseValues({
@@ -249,8 +253,8 @@ export function useChartReleaseValues({
   options?: UseQueryOptions<unknown>;
 }) {
   return useQuery<unknown>({
-    queryKey:["values", namespace, release, userDefinedValue, version],
-    queryFn:() =>
+    queryKey: ["values", namespace, release, userDefinedValue, version],
+    queryFn: () =>
       apiService.fetchWithDefaults<unknown>(
         `/api/helm/releases/${namespace}/${release}/values?${"userDefined=true"}${
           revision ? `&revision=${revision}` : ""
@@ -259,8 +263,8 @@ export function useChartReleaseValues({
           headers: { "Content-Type": "text/plain; charset=utf-8" },
         }
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 export const useVersionData = ({
@@ -315,7 +319,7 @@ export const useVersionData = ({
       return data;
     },
 
-    ...(options ?? {})
+    ...(options ?? {}),
   });
 };
 
diff --git a/frontend/src/API/repositories.ts b/frontend/src/API/repositories.ts
index f39abd8..ca9caf0 100644
--- a/frontend/src/API/repositories.ts
+++ b/frontend/src/API/repositories.ts
@@ -12,10 +12,10 @@ export function useGetRepositories(
   options?: UseQueryOptions<HelmRepositories>
 ) {
   return useQuery<HelmRepositories>({
-    queryKey:["helm", "repositories"],
+    queryKey: ["helm", "repositories"],
     queryFn: () =>
       apiService.fetchWithDefaults<HelmRepositories>("/api/helm/repositories"),
-    ...(options ?? {})
+    ...(options ?? {}),
   });
 }
 
@@ -24,14 +24,17 @@ export function useUpdateRepo(
   repo: string,
   options?: UseMutationOptions<void, unknown, void>
 ) {
-  return useMutation<void, unknown, void>({ mutationFn:() => {
-    return apiService.fetchWithDefaults<void>(
-      `/api/helm/repositories/${repo}`,
-      {
-        method: "POST",
-      }
-    );
-  }, ...(options ?? {})});
+  return useMutation<void, unknown, void>({
+    mutationFn: () => {
+      return apiService.fetchWithDefaults<void>(
+        `/api/helm/repositories/${repo}`,
+        {
+          method: "POST",
+        }
+      );
+    },
+    ...(options ?? {}),
+  });
 }
 
 // Remove repository
@@ -39,14 +42,17 @@ export function useDeleteRepo(
   repo: string,
   options?: UseMutationOptions<void, unknown, void>
 ) {
-  return useMutation<void, unknown, void>({mutationFn:() => {
-    return apiService.fetchWithDefaults<void>(
-      `/api/helm/repositories/${repo}`,
-      {
-        method: "DELETE",
-      }
-    );
-  }, ...(options ?? {})});
+  return useMutation<void, unknown, void>({
+    mutationFn: () => {
+      return apiService.fetchWithDefaults<void>(
+        `/api/helm/repositories/${repo}`,
+        {
+          method: "DELETE",
+        }
+      );
+    },
+    ...(options ?? {}),
+  });
 }
 
 export function useChartRepoValues({
@@ -57,15 +63,14 @@ export function useChartRepoValues({
   chart: string;
 }) {
   return useQuery<string>({
-    queryKey:["helm", "repositories", "values", chart, version],
-    queryFn:() =>
+    queryKey: ["helm", "repositories", "values", chart, version],
+    queryFn: () =>
       apiService.fetchWithDefaults<string>(
         `/api/helm/repositories/values?chart=${chart}&version=${version}`,
         {
           headers: { "Content-Type": "text/plain; charset=utf-8" },
         }
       ),
-      enabled: Boolean(version) && Boolean(chart),
-    }
-  );
+    enabled: Boolean(version) && Boolean(chart),
+  });
 }
diff --git a/frontend/src/API/scanners.ts b/frontend/src/API/scanners.ts
index 046bc3a..f149dc9 100644
--- a/frontend/src/API/scanners.ts
+++ b/frontend/src/API/scanners.ts
@@ -14,9 +14,9 @@ import apiService from "./apiService";
 function useGetDiscoveredScanners(options?: UseQueryOptions<ScannersList>) {
   return useQuery<ScannersList>({
     queryKey: ["scanners"],
-    queryFn:() => apiService.fetchWithDefaults<ScannersList>("/api/scanners"),
-    ...(options ?? {})}
-  );
+    queryFn: () => apiService.fetchWithDefaults<ScannersList>("/api/scanners"),
+    ...(options ?? {}),
+  });
 }
 
 // Scan manifests using all applicable scanners
@@ -27,13 +27,13 @@ function useScanManifests(
   const formData = new FormData();
   formData.append("manifest", manifest);
   return useMutation<ScanResults, Error, string>({
-    mutationFn:() =>
+    mutationFn: () =>
       apiService.fetchWithDefaults<ScanResults>("/api/scanners/manifests", {
         method: "POST",
         body: formData,
       }),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
 
 // Scan specified k8s resource in cluster
@@ -43,12 +43,12 @@ function useScanK8sResource(
   name: string,
   options?: UseQueryOptions<ScanResults>
 ) {
-  return useQuery<ScanResults>({queryKey:
-    ["scanners", "resource", kind, namespace, name],
-    queryFn:() =>
+  return useQuery<ScanResults>({
+    queryKey: ["scanners", "resource", kind, namespace, name],
+    queryFn: () =>
       apiService.fetchWithDefaults<ScanResults>(
         `/api/scanners/resource/${kind}?namespace=${namespace}&name=${name}`
       ),
-    ...(options ?? {})}
-  );
+    ...(options ?? {}),
+  });
 }
diff --git a/frontend/src/API/shared.ts b/frontend/src/API/shared.ts
index 75ec43a..3337957 100644
--- a/frontend/src/API/shared.ts
+++ b/frontend/src/API/shared.ts
@@ -44,7 +44,13 @@ export const useDiffData = ({
   chart: string;
 }) => {
   return useQuery({
-    queryKey: [selectedRepo, versionsError, chart, currentVerManifest, selectedVerData],
+    queryKey: [
+      selectedRepo,
+      versionsError,
+      chart,
+      currentVerManifest,
+      selectedVerData,
+    ],
     queryFn: async () => {
       const formData = new FormData();
       formData.append("a", currentVerManifest);
@@ -58,6 +64,5 @@ export const useDiffData = ({
       return diff;
     },
     enabled: Boolean(selectedVerData),
-}
-  );
+  });
 };
diff --git a/frontend/src/components/modal/InstallChartModal/InstallReleaseChartModal.tsx b/frontend/src/components/modal/InstallChartModal/InstallReleaseChartModal.tsx
index cc31efc..cec73ed 100644
--- a/frontend/src/components/modal/InstallChartModal/InstallReleaseChartModal.tsx
+++ b/frontend/src/components/modal/InstallChartModal/InstallReleaseChartModal.tsx
@@ -130,8 +130,8 @@ export const InstallReleaseChartModal = ({
   });
 
   // Confirm method (install)
-  const setReleaseVersionMutation = useMutation(
-    {mutationKey:[
+  const setReleaseVersionMutation = useMutation({
+    mutationKey: [
       "setVersion",
       namespace,
       releaseName,
@@ -140,7 +140,7 @@ export const InstallReleaseChartModal = ({
       selectedCluster,
       chartAddress,
     ],
-    mutationFn:async () => {
+    mutationFn: async () => {
       setInstallError("");
       const formData = new FormData();
       formData.append("preview", "false");
@@ -161,21 +161,20 @@ export const InstallReleaseChartModal = ({
       );
       return data;
     },
-      onSuccess: async (response) => {
-        onClose();
-        setSelectedVersionData({ version: "", urls: [] }); //cleanup
-        navigate(
-          `/${
-            namespace ? namespace : "default"
-          }/${releaseName}/installed/revision/${response.version}`
-        );
-        window.location.reload();
-      },
-      onError: (error) => {
-        setInstallError((error as Error)?.message || "Failed to update");
-      },
-    }
-  );
+    onSuccess: async (response) => {
+      onClose();
+      setSelectedVersionData({ version: "", urls: [] }); //cleanup
+      navigate(
+        `/${
+          namespace ? namespace : "default"
+        }/${releaseName}/installed/revision/${response.version}`
+      );
+      window.location.reload();
+    },
+    onError: (error) => {
+      setInstallError((error as Error)?.message || "Failed to update");
+    },
+  });
 
   return (
     <Modal
diff --git a/frontend/src/components/modal/InstallChartModal/InstallRepoChartModal.tsx b/frontend/src/components/modal/InstallChartModal/InstallRepoChartModal.tsx
index beb0328..4f56ecf 100644
--- a/frontend/src/components/modal/InstallChartModal/InstallRepoChartModal.tsx
+++ b/frontend/src/components/modal/InstallChartModal/InstallRepoChartModal.tsx
@@ -112,8 +112,8 @@ export const InstallRepoChartModal = ({
   });
 
   // Confirm method (install)
-  const setReleaseVersionMutation = useMutation(
-    {mutationKey:[
+  const setReleaseVersionMutation = useMutation({
+    mutationKey: [
       "setVersion",
       namespace,
       releaseName,
@@ -122,7 +122,7 @@ export const InstallRepoChartModal = ({
       selectedCluster,
       chartAddress,
     ],
-    mutationFn:async () => {
+    mutationFn: async () => {
       setInstallError("");
       const formData = new FormData();
       formData.append("preview", "false");
@@ -140,17 +140,14 @@ export const InstallRepoChartModal = ({
       return data;
     },
 
-      onSuccess: async (response) => {
-        onClose();
-        navigate(
-          `/${response.namespace}/${response.name}/installed/revision/1`
-        );
-      },
-      onError: (error) => {
-        setInstallError((error as Error)?.message || "Failed to update");
-      },
-    }
-  );
+    onSuccess: async (response) => {
+      onClose();
+      navigate(`/${response.namespace}/${response.name}/installed/revision/1`);
+    },
+    onError: (error) => {
+      setInstallError((error as Error)?.message || "Failed to update");
+    },
+  });
 
   return (
     <Modal
diff --git a/frontend/src/components/revision/RevisionDetails.tsx b/frontend/src/components/revision/RevisionDetails.tsx
index 83ca841..264d5c5 100644
--- a/frontend/src/components/revision/RevisionDetails.tsx
+++ b/frontend/src/components/revision/RevisionDetails.tsx
@@ -458,20 +458,19 @@ const Uninstall = () => {
     enabled: isOpen,
   });
 
-  const uninstallMutation = useMutation(
-    {mutationKey:["uninstall", namespace, chart],
-    mutationFn:() =>
+  const uninstallMutation = useMutation({
+    mutationKey: ["uninstall", namespace, chart],
+    mutationFn: () =>
       apiService.fetchWithDefaults(
         "/api/helm/releases/" + namespace + "/" + chart,
         {
           method: "delete",
         }
       ),
-      onSuccess: () => {
-        window.location.href = "/";
-      },
-    }
-  );
+    onSuccess: () => {
+      window.location.href = "/";
+    },
+  });
   const uninstallTitle = (
     <div className="font-semibold text-lg">
       Uninstall <span className="text-red-500">{chart}</span> from namespace{" "}