From 10b1116d709098a16b5a7ae39a272c34a34bbe22 Mon Sep 17 00:00:00 2001
From: Sarah Gillespie <73313222+gillespi314@users.noreply.github.com>
Date: Thu, 15 Feb 2024 11:02:22 -0600
Subject: [PATCH] Fix unreleased UI bug when parsing API errors for lock and
 unlock modals (#16867)

---
 .../HostDetailsPage/modals/LockModal/LockModal.tsx       | 9 ++++-----
 .../modals/RunScriptModal/RunScriptModal.tsx             | 9 +++------
 .../HostDetailsPage/modals/UnlockModal/UnlockModal.tsx   | 6 +++---
 3 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/frontend/pages/hosts/details/HostDetailsPage/modals/LockModal/LockModal.tsx b/frontend/pages/hosts/details/HostDetailsPage/modals/LockModal/LockModal.tsx
index d163939149..9877e4729a 100644
--- a/frontend/pages/hosts/details/HostDetailsPage/modals/LockModal/LockModal.tsx
+++ b/frontend/pages/hosts/details/HostDetailsPage/modals/LockModal/LockModal.tsx
@@ -1,12 +1,12 @@
 import React, { useContext } from "react";
 
+import { NotificationContext } from "context/notification";
+import { getErrorReason } from "interfaces/errors";
 import hostAPI from "services/entities/hosts";
 
 import Modal from "components/Modal";
 import Button from "components/buttons/Button";
 import Checkbox from "components/forms/fields/Checkbox";
-import { NotificationContext } from "context/notification";
-import { AxiosError } from "axios";
 
 const baseClass = "lock-modal";
 
@@ -35,9 +35,8 @@ const LockModal = ({
       await hostAPI.lockHost(id);
       onSuccess();
       renderFlash("success", "Host is locking!");
-    } catch (error) {
-      const err = error as AxiosError;
-      renderFlash("error", err.message);
+    } catch (e) {
+      renderFlash("error", getErrorReason(e));
     }
     onClose();
     setIsLocking(false);
diff --git a/frontend/pages/hosts/details/HostDetailsPage/modals/RunScriptModal/RunScriptModal.tsx b/frontend/pages/hosts/details/HostDetailsPage/modals/RunScriptModal/RunScriptModal.tsx
index 02fc5b5332..9cfae95235 100644
--- a/frontend/pages/hosts/details/HostDetailsPage/modals/RunScriptModal/RunScriptModal.tsx
+++ b/frontend/pages/hosts/details/HostDetailsPage/modals/RunScriptModal/RunScriptModal.tsx
@@ -1,19 +1,18 @@
 import React, { useCallback, useContext, useMemo, useState } from "react";
 import { useQuery } from "react-query";
-import { AxiosResponse } from "axios";
 
 import { AppContext } from "context/app";
 import { NotificationContext } from "context/notification";
 
-import { IApiError } from "interfaces/errors";
+import { getErrorReason, IApiError } from "interfaces/errors";
 import { IHost } from "interfaces/host";
+import { IHostScript } from "interfaces/script";
 import { IUser } from "interfaces/user";
 
 import scriptsAPI, {
   IHostScriptsQueryKey,
   IHostScriptsResponse,
 } from "services/entities/scripts";
-import { IHostScript } from "interfaces/script";
 
 import Button from "components/buttons/Button";
 import DataError from "components/DataError/DataError";
@@ -96,9 +95,7 @@ const RunScriptModal = ({
             );
             refetchHostScripts();
           } catch (e) {
-            const error = e as AxiosResponse<IApiError>;
-            console.log(error);
-            renderFlash("error", error.data.errors[0].reason);
+            renderFlash("error", getErrorReason(e));
             setRunScriptRequested(false);
           }
           break;
diff --git a/frontend/pages/hosts/details/HostDetailsPage/modals/UnlockModal/UnlockModal.tsx b/frontend/pages/hosts/details/HostDetailsPage/modals/UnlockModal/UnlockModal.tsx
index 1cf9ef9272..178f21a1b8 100644
--- a/frontend/pages/hosts/details/HostDetailsPage/modals/UnlockModal/UnlockModal.tsx
+++ b/frontend/pages/hosts/details/HostDetailsPage/modals/UnlockModal/UnlockModal.tsx
@@ -3,6 +3,7 @@ import { AxiosError } from "axios";
 import { useQuery } from "react-query";
 
 import { NotificationContext } from "context/notification";
+import { getErrorReason } from "interfaces/errors";
 import hostAPI, { IUnlockHostResponse } from "services/entities/hosts";
 
 import Modal from "components/Modal";
@@ -51,9 +52,8 @@ const UnlockModal = ({
       await hostAPI.unlockHost(id);
       onSuccess();
       renderFlash("success", "Host is unlocking!");
-    } catch (error) {
-      const err = error as AxiosError;
-      renderFlash("error", err.message);
+    } catch (e) {
+      renderFlash("error", getErrorReason(e));
     }
     onClose();
     setIsUnlocking(false);