fixed invalid target in created refs

Author: iykekings

react-app/src/components/CreatedRefs.tsx

@@ -27,13 +27,13 @@ const CreatedRefs = (props: { refs: { ref: string; title: string }[] }) => {
               <CopyToClipboard text={ref.ref}>
                 <div>
                   <MdContentCopy
-                    id={ref.ref.replace(/@|[/]/g, '')}
+                    id={ref.ref.replace(/\W/g, '')}
                     className="ml-2"
                     onClick={() => alertSuccess('copied')}
                   />
                   <UncontrolledTooltip
                     placement="bottom"
-                    target={ref.ref.replace(/@|[/]/g, '')}
+                    target={ref.ref.replace(/\W/g, '')}
                   >
                     copy to clipboard
                   </UncontrolledTooltip>

react-app/src/components/LemmaForm/LemmaForm.tsx

@@ -13,7 +13,7 @@ import {
   Button
 } from 'reactstrap';
 import { IoMdTrash } from 'react-icons/io';
-// import './LemmaForm.css';
+import './LemmaForm.css';
 import { isNotOwner, isUrl, isEmail } from '../../helpers/input-validation';
 import {
   RECAPTCHA_CLIENT_KEY,
@@ -74,6 +74,7 @@ const LemmaForm = (props: any) => {
     list: [{ ref: '', required: true, id: 0, invalid: false }],
     currentId: 0
   });
+
   const [search, setSearch] = useState({
     searchable: false,
     synopsis: ''
@@ -85,7 +86,7 @@ const LemmaForm = (props: any) => {
   useEffect(() => {
     recaptchaRef.current!.execute();
   }, [recaptchaRef]);
-  
+
   // Submit form
   const createRef = () => {
     const nOwner = !!owner.password && !!owner.name ? '@' + owner.name : '';
@@ -141,19 +142,19 @@ const LemmaForm = (props: any) => {
               'X-AUTH-PASSWORD': owner.password
             }
           : {};
-      console.log(withSearch, headers);
-      // Axios.post(`${BASE_URL}/ref`, withSearch, { headers })
-      //   .then(res => {
-      //     props.addRef(res.data.link, title);
-      //     alertSuccess('Ref Successflly Created');
-      //   })
-      //   .catch(err => {
-      //     if (err.response) {
-      //       alertError(err.response.data.error);
-      //     } else {
-      //       alertError(err.message);
-      //     }
-      //   });
+      // console.log(withSearch, headers);
+      Axios.post(`${BASE_URL}/ref`, withSearch, { headers })
+        .then(res => {
+          props.addRef(res.data.link, title);
+          alertSuccess('Ref Successflly Created');
+        })
+        .catch(err => {
+          if (err.response) {
+            alertError(err.response.data.error);
+          } else {
+            alertError(err.message);
+          }
+        });
     }
   };
 

react-app/src/components/NotFound.tsx

@@ -5,7 +5,7 @@ const NotFound = () => {
   return (
     <div style={{ textAlign: 'center' }}>
       <h1>This Page doesn't exist!</h1>
-      <Link to="/create-ref">Go to main page</Link>
+      <Link to="/">Go to main page</Link>
     </div>
   );
 };

react-app/src/components/Register.tsx

@@ -42,7 +42,7 @@ const Register = (props: any) => {
   useEffect(() => {
     recaptchaRef.current!.execute();
   }, [recaptchaRef]);
-  // const handleRecaptcha = (val: string | null) => setRecaptcha(val);
+
   const inputChange = (input: EventTarget & HTMLInputElement) => {
     const inValidUser = {
       ...user,
@@ -92,20 +92,20 @@ const Register = (props: any) => {
     } else if (!recaptcha_code) {
       alertWarning('Captcha not authenticated. Reload Page');
     } else {
-      console.log(req);
-      // Axios.post(`${BASE_URL}/accounts`, req)
-      //   .then(res => {
-      //     AUTH_SYNC(name, email, password_1);
-      //     alertSuccess('Account Created');
-      //     props.history.push('/create-ref');
-      //   })
-      //   .catch(err => {
-      //     if (err.response) {
-      //       alertError(err.response.data.error);
-      //     } else {
-      //       alertError(err.message);
-      //     }
-      //   });
+      Axios.post(`${BASE_URL}/accounts`, req)
+        .then(res => {
+          alertSuccess('Account Created');
+          setTimeout(() => {
+            props.history.push('/');
+          }, 1500);
+        })
+        .catch(err => {
+          if (err.response) {
+            alertError(err.response.data.error);
+          } else {
+            alertError(err.message);
+          }
+        });
     }
   };