[dashboard] fix form to display error from backend

Author: sjillen

dashboard/src/components/ScanForm.js

@@ -8,17 +8,24 @@ const ScanForm = ({ addScan }) => {
 
     const handleSubmit = ev => {
         const form = ev.currentTarget;
-        if (form.checkValidity() === true) {
-            addScan(repoName).catch(err => {
-                setError(err.message);
-            });
-        } else {
-            ev.preventDefault();
+        ev.preventDefault();
+
+        if (form.checkValidity() === false) {
             ev.stopPropagation();
+        } else {
+            addScan(repoName)
+                .catch(err => {
+                    setError(err.message);
+                })
+                .then(() => {
+                    setRepoName('');
+                    setValidated(false);
+                });
         }
 
         setValidated(true);
     };
+
     return (
         <>
             <h2>Submit a Scan Result</h2>

dashboard/src/components/useScan.js

@@ -12,7 +12,7 @@ const useScan = () => {
             response = await axios.post(url, { repoName });
             setScans([...scans, response.data]);
         } catch (e) {
-            throw new Error('You must enter a valid name!');
+            throw new Error('The name you entered does not contain authorized characters!');
         }
     };