Assistants can now apply to jobs succefully

Zachary48 · Zachary48 · commit 4e99ac951283 · 2025-04-13T15:42:25.000-05:00
diff --git a/.firebase/hosting.ZGlzdA.cache b/.firebase/hosting.ZGlzdA.cache
@@ -1,5 +1,5 @@
 favicon.png,1742999374775,e73ad37e8e066e7c600db58733033ab0b4e0b9ce7312e0c1e62435dedddfb108
 404.html,1742999374775,41d1e074106979fb6591ec6953bfe5ace2788be22f0ed4189bd54905ebb5b44d
-index.html,1744493021839,9851aaaf74806c33d3189720193040f64fdd2ba18a77843c6dff6758ddce776a
-assets/index-67ce75d8.css,1744493021839,9e2b4567a3922ff6483f5b4f351f0c6ad76297f5874238ed01b6440efe43718a
-assets/index-f949cbaa.js,1744493021842,2ecdb173a05ea224ea375669a2f2b7e9e83df894fba3246e94c960a9aad2d188
+index.html,1744576655250,e1e9dc94a7406f49e25275ce3f24cbaa4d4f16800b5b52485600f1f62cd47700
+assets/index-67ce75d8.css,1744576655250,9e2b4567a3922ff6483f5b4f351f0c6ad76297f5874238ed01b6440efe43718a
+assets/index-5bf94bec.js,1744576655252,2b7e52d4fda2b9082be26e0fff4bc55f730078d66b2bb08eb1deaa31345500a7
diff --git a/dist/assets/index-5bf94bec.js b/dist/assets/index-5bf94bec.js
diff --git a/dist/index.html b/dist/index.html
@@ -6,7 +6,7 @@
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>ResearchFinder</title>
-    <script type="module" crossorigin src="/assets/index-f949cbaa.js"></script>
+    <script type="module" crossorigin src="/assets/index-5bf94bec.js"></script>
     <link rel="stylesheet" href="/assets/index-67ce75d8.css">
   </head>
   <body>
diff --git a/src/components/Apply.jsx b/src/components/Apply.jsx
@@ -3,7 +3,7 @@ import { useParams } from 'react-router-dom';
 import axios from 'axios';
 
 const Apply = ({ assistantId }) => {
-  const { id: postId } = useParams(); // URL param for the post
+  const { id: postId } = useParams(); // Extract postId from URL
   const [message, setMessage] = useState('');
   const [status, setStatus] = useState(null);
   const [loading, setLoading] = useState(false);
@@ -14,16 +14,28 @@ const Apply = ({ assistantId }) => {
     setStatus(null);
 
     try {
+      const trimmedMessage = message.trim();
+      if (!trimmedMessage) {
+        setStatus("❗ Message cannot be empty.");
+        setLoading(false);
+        return;
+      }
+
       const res = await axios.post('https://research-finder-server.vercel.app/applications', {
         assistantId,
         postId,
-        message,
+        message: trimmedMessage,
       });
 
-      setStatus('✅ Application submitted successfully!');
+      if (res.status === 201) {
+        setStatus('✅ Application submitted successfully!');
+        setMessage(''); // Clear message after success
+      } else {
+        setStatus('⚠️ Unexpected response. Try again later.');
+      }
     } catch (err) {
       console.error('❌ Application error:', err.response?.data || err.message);
-      setStatus('❌ Failed to submit application.');
+      setStatus(`❌ Failed to submit application: ${err.response?.data?.error || err.message}`);
     } finally {
       setLoading(false);
     }
@@ -33,23 +45,40 @@ const Apply = ({ assistantId }) => {
     <div style={{ padding: '2rem', maxWidth: '600px', margin: '0 auto' }}>
       <h2>Apply to Research Opportunity</h2>
       <form onSubmit={handleSubmit}>
-        <label>
+        <label htmlFor="application-message">
           Why are you interested?
-          <textarea
-            rows="5"
-            value={message}
-            onChange={(e) => setMessage(e.target.value)}
-            required
-            style={{ width: '100%', marginTop: '0.5rem' }}
-          />
         </label>
-        <br />
-        <button type="submit" disabled={loading} style={{ marginTop: '1rem' }}>
+        <textarea
+          id="application-message"
+          rows="5"
+          value={message}
+          onChange={(e) => setMessage(e.target.value)}
+          required
+          placeholder="Write your message here..."
+          style={{ width: '100%', marginTop: '0.5rem', padding: '0.5rem' }}
+        />
+        <button
+          type="submit"
+          disabled={loading}
+          style={{
+            marginTop: '1rem',
+            padding: '0.5rem 1rem',
+            backgroundColor: '#007bff',
+            color: 'white',
+            border: 'none',
+            borderRadius: '5px',
+            cursor: 'pointer'
+          }}
+        >
           {loading ? 'Submitting...' : 'Submit Application'}
         </button>
       </form>
 
-      {status && <p style={{ marginTop: '1rem', fontWeight: 'bold' }}>{status}</p>}
+      {status && (
+        <p style={{ marginTop: '1rem', fontWeight: 'bold', color: status.startsWith('✅') ? 'green' : 'red' }}>
+          {status}
+        </p>
+      )}
     </div>
   );
 };
