Add message for error

canonical · Aug 2, 2023 · 6fe0791 · 6fe0791
1 parent f1d232c
commit 6fe0791
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/static/js/brand-store/components/SigningKeys/CreateSigningKeyForm.tsx b/static/js/brand-store/components/SigningKeys/CreateSigningKeyForm.tsx
@@ -14,12 +14,14 @@ import type { SigningKey } from "../../types/shared";
 type Props = {
   setShowNotification: Function;
   setShowErrorNotification: Function;
+  setErrorMessage: Function;
   refetch: Function;
 };
 
 function CreateSigningKeyForm({
   setShowNotification,
   setShowErrorNotification,
+  setErrorMessage,
   refetch,
 }: Props) {
   const navigate = useNavigate();
@@ -32,7 +34,6 @@ function CreateSigningKeyForm({
   );
 
   const handleError = () => {
-    setShowErrorNotification(true);
     setSigningKeysList((oldSigningKeysList: Array<SigningKey>) => {
       return oldSigningKeysList.filter(
         (signingKey) => signingKey.name !== newSigningKey.name
@@ -42,6 +43,7 @@ function CreateSigningKeyForm({
     setNewSigningKey({ name: "" });
     setTimeout(() => {
       setShowErrorNotification(false);
+      setErrorMessage("");
     }, 5000);
   };
 
@@ -79,6 +81,8 @@ function CreateSigningKeyForm({
       const signingKeysData = await response.json();
 
       if (!signingKeysData.success) {
+        setShowErrorNotification(true);
+        setErrorMessage(signingKeysData.message);
         throw new Error(signingKeysData.message);
       }
 
@@ -146,6 +150,7 @@ function CreateSigningKeyForm({
                 navigate(`/admin/${id}/signing-keys`);
                 setNewSigningKey({ name: "" });
                 setShowErrorNotification(false);
+                setErrorMessage("");
               }}
             >
               Cancel

diff --git a/static/js/brand-store/components/SigningKeys/SigningKeys.tsx b/static/js/brand-store/components/SigningKeys/SigningKeys.tsx
@@ -71,6 +71,7 @@ function SigningKeys() {
   const [showErrorNotification, setShowErrorNotification] = useState<boolean>(
     false
   );
+  const [errorMessage, setErrorMessage] = useState<string>("");
   const [
     showDisableSuccessNotification,
     setShowDisableSuccessNotification,
@@ -115,15 +116,16 @@ function SigningKeys() {
                 </Notification>
               </div>
             )}
-            {showErrorNotification && (
+            {showErrorNotification && errorMessage && (
               <div className="u-fixed-width">
                 <Notification
                   severity="negative"
                   onDismiss={() => {
                     setShowErrorNotification(false);
+                    setErrorMessage("");
                   }}
                 >
-                  Unable to create signing key
+                  {errorMessage}
                 </Notification>
               </div>
             )}
@@ -186,6 +188,7 @@ function SigningKeys() {
           <CreateSigningKeyForm
             setShowNotification={setShowNotification}
             setShowErrorNotification={setShowErrorNotification}
+            setErrorMessage={setErrorMessage}
             refetch={refetch}
           />
         )}