From 9ed047d3a7b3222745cacff62fbbee1b06ba110a Mon Sep 17 00:00:00 2001
From: Tsu-ba-me <ynho.li.aa.e@gmail.com>
Date: Fri, 5 Apr 2024 21:39:29 -0400
Subject: [PATCH] fix(striker-ui): correct message group behaviour in test
 access of init host

---
 .../components/ManageHost/TestAccessForm.tsx  | 63 +++++++++++--------
 1 file changed, 36 insertions(+), 27 deletions(-)

diff --git a/striker-ui/components/ManageHost/TestAccessForm.tsx b/striker-ui/components/ManageHost/TestAccessForm.tsx
index 827d5910..8d36f981 100644
--- a/striker-ui/components/ManageHost/TestAccessForm.tsx
+++ b/striker-ui/components/ManageHost/TestAccessForm.tsx
@@ -31,6 +31,7 @@ const TestAccessForm: FC<TestAccessFormProps> = (props) => {
         password: '',
       },
       onSubmit: (values, { setSubmitting }) => {
+        setApiMessage();
         setLoadingInquiry(true);
         setResponse(undefined);
 
@@ -42,6 +43,22 @@ const TestAccessForm: FC<TestAccessFormProps> = (props) => {
             password,
           })
           .then(({ data }) => {
+            const { isConnected } = data;
+
+            if (!isConnected) {
+              setApiMessage({
+                children: (
+                  <>
+                    Failed to connect. Please make sure the credentials are
+                    correct, and the host is reachable from this striker.
+                  </>
+                ),
+                type: 'warning',
+              });
+
+              return;
+            }
+
             setResponse({
               ...data,
               hostIpAddress: ip,
@@ -115,33 +132,25 @@ const TestAccessForm: FC<TestAccessFormProps> = (props) => {
           }
         />
       </Grid>
-      {loadingInquiry ? (
-        <Grid item width="100%">
-          <Spinner />
-        </Grid>
-      ) : (
-        <>
-          <Grid item width="100%">
-            <MessageGroup
-              count={1}
-              messages={formikErrors}
-              ref={messageGroupRef}
-            />
-          </Grid>
-          <Grid item width="100%">
-            <ActionGroup
-              actions={[
-                {
-                  background: 'blue',
-                  children: 'Test access',
-                  disabled: disabledSubmit,
-                  type: 'submit',
-                },
-              ]}
-            />
-          </Grid>
-        </>
-      )}
+      <Grid item width="100%">
+        <MessageGroup count={1} messages={formikErrors} ref={messageGroupRef} />
+      </Grid>
+      <Grid item width="100%">
+        {loadingInquiry ? (
+          <Spinner mt={0} />
+        ) : (
+          <ActionGroup
+            actions={[
+              {
+                background: 'blue',
+                children: 'Test access',
+                disabled: disabledSubmit,
+                type: 'submit',
+              },
+            ]}
+          />
+        )}
+      </Grid>
     </Grid>
   );
 };