fix : UI issues & flow issues

Project/Frontend/Web_App/src/pages/translate-page.tsx

@@ -107,18 +107,27 @@ export default function AboutPage() {
   // Video Upload
 
   const translateSignLanguageToText = async () => {
+    if (file) {
       setLoading(true);
       const formData = new FormData();
       formData.append('video_request', file, 'test_video.mp4');
 
       try {
         const response = await SignLanguageToTextService.predictSignLanguageVideo(10, formData);
+        if (response.status == 200) {
           console.log(response.data);
           setValue(response.data.predictions);
+        } else {
+          enqueueSnackbar('Something went Wrong!', { variant: 'error' });
+        }
         setLoading(false);
       } catch (error) {
         console.log(error);
         setLoading(false);
+        enqueueSnackbar('Something went Wrong!', { variant: 'error' });
+      }
+    } else {
+      enqueueSnackbar('Please select a file.', { variant: 'warning' });
     }
   };
 
@@ -251,7 +260,7 @@ export default function AboutPage() {
 
           <Box sx={{ flexGrow: 1 }}>
             <Card>
-              <CardHeader title="Upload a video containing Sign Language" />
+              <CardHeader title="Capture a video containing Sign Language" />
               <Grid container spacing={2}>
                 <Grid item xs={12} md={6}>
                   <Card>