fix(striker-ui): correct message group behaviour in test access of init host

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,20 +132,13 @@ const TestAccessForm: FC<TestAccessFormProps> = (props) => {
           }
         />
       </Grid>
-      {loadingInquiry ? (
       <Grid item width="100%">
-          <Spinner />
-        </Grid>
-      ) : (
-        <>
-          <Grid item width="100%">
-            <MessageGroup
-              count={1}
-              messages={formikErrors}
-              ref={messageGroupRef}
-            />
+        <MessageGroup count={1} messages={formikErrors} ref={messageGroupRef} />
       </Grid>
       <Grid item width="100%">
+        {loadingInquiry ? (
+          <Spinner mt={0} />
+        ) : (
           <ActionGroup
             actions={[
               {
@@ -139,10 +149,9 @@ const TestAccessForm: FC<TestAccessFormProps> = (props) => {
               },
             ]}
           />
-          </Grid>
-        </>
         )}
       </Grid>
+    </Grid>
   );
 };