Cleaning up MediaForm.jsx main views.

diff --git a/src/app/components/MediaForm.js b/src/app/components/MediaForm.js
index 7cd1f3ef4eb598fa312fc7cc871a73a167dcf66b..26803831bba5dced3050f6cc8870219d455280fe 100644 (file)
--- a/src/app/components/MediaForm.js
+++ b/src/app/components/MediaForm.js
@@ -1,115 +1,105 @@
+// noinspection JSValidateTypes
+
 /**
  * @file Component for creating a new media item
  */
 
 import React from 'react';
-import { useForm, Controller } from 'react-hook-form';
+import { Controller, useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import * as yup from 'yup';
-import { TextField, MenuItem, Button } from '@mui/material';
+import { Button, MenuItem, TextField } from '@mui/material';
 import { useSnackbar } from 'notistack';
 import { useNavigate } from 'react-router-dom';
 import { MediaService } from '../services';
 
-const schema = yup.object({
-  user_id: yup.number().required('User ID is required'),
-  file_path: yup.string().required('File path is required'),
-  file_type: yup.string().required('File type is required'),
-  visibility: yup.string().oneOf(['private', 'family', 'public']).required('Visibility is required'),
-}).required();
+const schema = yup.object( {
+  user_id:yup.number().required( 'User ID is required' ),
+  file_path:yup.string().required( 'File path is required' ),
+  file_type:yup.string().required( 'File type is required' ),
+  visibility:yup.string().oneOf( ['private', 'family', 'public'] ).required( 'Visibility is required' ),
+} ).required();
 
 const MediaForm = () => {
   const { enqueueSnackbar } = useSnackbar();
   const navigate = useNavigate();
-  const { control, handleSubmit, formState: { errors } } = useForm({
-    resolver: yupResolver(schema),
-  });
+  const { control, handleSubmit, formState:{ errors } } = useForm( {
+    resolver:yupResolver( schema ),
+  } );
 
-  const onSubmit = async (data) => {
+  const onSubmit = async ( data ) => {
     try {
-      await MediaService.createMedia(data);
-      enqueueSnackbar('Media created successfully', { variant: 'success' });
-      navigate('/media');
+      await MediaService.createMedia( data );
+      enqueueSnackbar( 'Media created successfully', { variant:'success' } );
+      navigate( '/media' );
     } catch (error) {
-      enqueueSnackbar(`Error creating media: ${error.message}`, { variant: 'error' });
+      enqueueSnackbar( `Error creating media: ${ error.message }`, { variant:'error' } );
     }
   };
 
   return (
     <div className="container">
       <h2 className="text-2xl font-bold mb-4">Upload Media</h2>
-      <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
-        <Controller
-          name="user_id"
-          control={control}
-          defaultValue=""
-          render={({ field }) => (
-            <TextField
-              {...field}
-              label="User ID"
-              type="number"
-              fullWidth
-              error={!!errors.user_id}
-              helperText={errors.user_id?.message}
-              className="mb-4"
-            />
-          )}
-        />
-        <Controller
-          name="file_path"
-          control={control}
-          defaultValue=""
-          render={({ field }) => (
-            <TextField
-              {...field}
-              label="File Path"
-              fullWidth
-              error={!!errors.file_path}
-              helperText={errors.file_path?.message}
-              className="mb-4"
-            />
-          )}
-        />
-        <Controller
-          name="file_type"
-          control={control}
-          defaultValue=""
-          render={({ field }) => (
-            <TextField
-              {...field}
-              label="File Type"
-              select
-              fullWidth
-              error={!!errors.file_type}
-              helperText={errors.file_type?.message}
-              className="mb-4"
-            >
-              <MenuItem value="image">Image</MenuItem>
-              <MenuItem value="video">Video</MenuItem>
-            </TextField>
-          )}
-        />
-        <Controller
-          name="visibility"
-          control={control}
-          defaultValue=""
-          render={({ field }) => (
-            <TextField
-              {...field}
-              label="Visibility"
-              select
-              fullWidth
-              error={!!errors.visibility}
-              helperText={errors.visibility?.message}
-              className="mb-4"
-            >
-              <MenuItem value="private">Private</MenuItem>
-              <MenuItem value="family">Family</MenuItem>
-              <MenuItem value="public">Public</MenuItem>
-            </TextField>
-          )}
-        />
-        <Button type="submit" variant="contained" color="primary" fullWidth>
+      <form onSubmit={ handleSubmit( onSubmit ) }
+            className="space-y-4">
+        <Controller name="user_id"
+                    control={ control }
+                    defaultValue=""
+                    render={ ( { field } ) => (
+                      <TextField
+                        { ...field } label="User ID"
+                        type="number"
+                        fullWidth
+                        error={ !!errors.user_id }
+                        helperText={ errors.user_id?.message }
+                        className="mb-4"/>
+                    ) }/>
+        <Controller name="file_path"
+                    control={ control }
+                    defaultValue=""
+                    render={ ( { field } ) => (
+                      <TextField
+                        { ...field } label="File Path"
+                        fullWidth
+                        error={ !!errors.file_path }
+                        helperText={ errors.file_path?.message }
+                        className="mb-4"/>
+                    ) }/>
+        <Controller name="file_type"
+                    control={ control }
+                    defaultValue=""
+                    render={ ( { field } ) => (
+                      <TextField
+                        { ...field } label="File Type"
+                        select
+                        fullWidth
+                        error={ !!errors.file_type }
+                        helperText={ errors.file_type?.message }
+                        className="mb-4">
+                        <MenuItem value="image">Image</MenuItem>
+                        <MenuItem value="video">Video</MenuItem>
+                      </TextField>
+                    ) }/>
+        <Controller name="visibility"
+                    control={ control }
+                    defaultValue=""
+                    render={ ( { field } ) => (
+                      <TextField
+                        { ...field } label="Visibility"
+                        select
+                        fullWidth
+                        error={ !!errors.visibility }
+                        helperText={ errors.visibility?.message }
+                        className="mb-4">
+                        <MenuItem value="private">Private</MenuItem>
+                        <MenuItem value="family">Family</MenuItem>
+                        <MenuItem value="public">Public</MenuItem>
+                      </TextField>
+                    ) }/>
+        <Button type="submit"
+                variant="contained"
+                color="primary"
+                fullWidth>
           Upload Media
         </Button>
       </form>