Rename variables for clarity and adjust download filename and contents

Renamed the parameter 'e' to 'formikValues' for better clarity in the handleSubmit function. Now load formikValues into the file that get's uploaded so it has the up to date form data. Changed the downloaded JSON filename from 'form_data.json' to 'your_form_data.json' to be more user-friendly.

.env.development

@@ -0,0 +1 @@
+REACT_APP_BACKEND_BASE_URL=http://localhost:8002

.env.production

@@ -0,0 +1 @@
+REACT_APP_BACKEND_BASE_URL=https://forms-backend.alttd.com

src/components/form/data/apply.tsx

@@ -124,7 +124,7 @@ export const apply: FormData = {
             required: false,
         },
     ],
-    backend: 'https://forms-backend.alttd.com/api/apply/staffApplication',
+    backend: `${process.env.REACT_APP_BACKEND_BASE_URL}/api/apply/staffApplication`,
     userInput: {username: '', email: '', discord: '', pc_requirements: ''
     , age: '', pronoun: '', join_date: '', avg_time: '', available_days: '', available_time: '', staff_experience: ''
     , plugin_experience: '', why_staff: '', expectations_mod: '', other: ''

src/components/form/data/contact.tsx

@@ -28,7 +28,7 @@ export const contact: FormData = {
             required: true,
         },
     ],
-    backend: 'https://forms-backend.alttd.com/api/contact/submitContactForm',
+    backend: `${process.env.REACT_APP_BACKEND_BASE_URL}/api/contact/submitContactForm`,
     userInput: {username: '', email: '', question: ''},
     spec: Yup.object().shape({
         username: Yup.string()

src/components/form/genericForm.tsx

@@ -15,23 +15,23 @@ const GenericForm = (formData: FormData) => {
 
     const [currentStep, setCurrentStep] = useState<number>(0);
 
-    const handleSubmit = async (e: FormikValues) => {
+    const handleSubmit = async (formikValues: FormikValues) => {
         try {
             const response = await fetch(backend, {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
                 },
-                body: JSON.stringify(e)
+                body: JSON.stringify(formikValues)
             })
             if (!response.ok) {
-                let json: string = JSON.stringify(steps);
+                let json: string = JSON.stringify(formikValues);
                 const blob = new Blob([json], {type: "application/json"});
                 const url = URL.createObjectURL(blob);
 
                 const link = document.createElement('a');
                 link.href = url;
-                link.download = 'form_data.json';
+                link.download = 'your_form_data.json';
                 link.click();
                 URL.revokeObjectURL(url);
                 //TODO clean up
@@ -39,7 +39,7 @@ const GenericForm = (formData: FormData) => {
             } else {
                 navigate('/verify-email', {
                     state: {
-                        email: e['email']
+                        email: formikValues['email']
                     }
                 });
             }

src/components/verify_email/verify_mail.tsx

@@ -42,7 +42,7 @@ const VerifyMail: FC = () => {
             eMail: email
         }
         console.log(verificationData);
-        fetch('https://forms-backend.alttd.com/api/verify_email/form', {
+        fetch(`${process.env.REACT_APP_BACKEND_BASE_URL}/api/verify_email/form`, {
             method: 'POST',
             headers: {
                 'Content-Type': 'application/json',