Add button status to env group button (#4017)

dashboard/src/main/home/app-dashboard/expanded-app/env-vars/ExpandableEnvGroup.tsx

@@ -1,9 +1,8 @@
 import Button from "components/porter/Button";
 import Spacer from "components/porter/Spacer";
-import EnvGroupArray from "main/home/cluster-dashboard/env-groups/EnvGroupArray";
 import React, { useEffect, useState } from "react";
 import styled, { keyframes } from "styled-components";
-import { PopulatedEnvGroup } from "components/porter-form/types";
+import { type PopulatedEnvGroup } from "components/porter-form/types";
 import _, { isObject, differenceBy, omit } from "lodash";
 
 
@@ -22,10 +21,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>

dashboard/src/main/home/cluster-dashboard/env-groups/EnvGroupArray.tsx

@@ -23,6 +23,7 @@ type PropsType = {
   fileUpload?: boolean;
   secretOption?: boolean;
   setButtonDisabled?: (x: boolean) => void;
+  setButtonStatus?: (x: string) => void;
 };
 
 const EnvGroupArray = ({
@@ -33,6 +34,7 @@ const EnvGroupArray = ({
   fileUpload,
   secretOption,
   setButtonDisabled,
+  setButtonStatus,
 }: PropsType) => {
   const [showEditorModal, setShowEditorModal] = useState(false);
   const blankValues = (): void => {
@@ -41,6 +43,9 @@ const EnvGroupArray = ({
       (envVar) => !envVar.key.trim() || !envVar.value.trim()
     );
     if (setButtonDisabled) {
+      if (setButtonStatus) {
+        setButtonStatus(isAnyEnvVariableBlank ? "Please fill out all fields" : "");
+      }
       setButtonDisabled(isAnyEnvVariableBlank);
     }
   };
@@ -149,7 +154,7 @@ const EnvGroupArray = ({
                       rows={entry.value?.split("\n").length}
                       disabled={disabled || entry.locked}
                       spellCheck={false}
-                      override={incorrectRegex(entry.key)}
+                      override={incorrectRegex(entry.value)}
                     />
                   )}
                   {secretOption && (