minor fixes

client/package.json

@@ -1,7 +1,7 @@
 {
   "name": "client",
   "private": true,
-  "version": "2.0.0-beta-3",
+  "version": "2.0.0-beta-4",
   "type": "module",
   "scripts": {
     "dev": "vite",

client/src/components/logForm/LogForm.tsx

@@ -33,7 +33,7 @@ const LogForm = () => {
           `api/logs/${logbookContext.state.selectedLogId}`
         );
         const log = response.data;
-
+        console.log(log)
         reset(log);
       } catch (error) {
         const axiosError = error as AxiosError;
@@ -485,7 +485,9 @@ const LogForm = () => {
                   type='number'
                   className='input w-full'
                   disabled={state.isDisabled}
-                  onChange={onChange}
+                  min={0}
+                  onChange={(event) => onChange(Number(event.target.value))}
+                  step={0.1}
                   value={value}
                 />
               )}
@@ -505,6 +507,7 @@ const LogForm = () => {
               className='textarea w-full'
               disabled={state.isDisabled}
               onChange={onChange}
+              value={value}
             ></textarea>
           )}
         />

client/src/components/logbookDrawer/LogbookDrawer.tsx

@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { LogbookDrawerProps } from "./LogbookDrawerProps.interface";
 import LogForm from "../logForm/LogForm";
 import TracksForm from "../tracksForm/TracksForm";
@@ -9,7 +10,8 @@ import { FormMode } from "../../enums/formMode";
 import httpClient from "../../httpClient/httpClient";
 import { AxiosError } from "axios";
 import { useLogbookContext } from "../../hooks/logbookContext/UseLogbookContext";
-import { ChangeEventHandler, MouseEventHandler, useState } from "react";
+import { useBreakpoints } from "../../hooks/useBreakpoints/UseBreakpoints";
+import { ScreenSize } from "../../enums/screenSize";
 
 const LogbookDrawer = ({ onOpenClose }: LogbookDrawerProps) => {
   const [activeTab, setActiveTab] = useState<string>('time');
@@ -40,6 +42,7 @@ const LogbookDrawer = ({ onOpenClose }: LogbookDrawerProps) => {
   };
   const methods = useForm();
   const logbookContext = useLogbookContext()
+  const { screenSize } = useBreakpoints();
 
   const onCancel = () => {
     methods.reset(defaultValues);
@@ -49,6 +52,7 @@ const LogbookDrawer = ({ onOpenClose }: LogbookDrawerProps) => {
 
   const onSubmit = async (data: unknown) => {
     try {
+      logbookContext.dispatch({ type: 'SET_IS_FORM_DISABLED', payload: true });
       logbookContext.dispatch({ type: 'SET_IS_FORM_LOADING', payload: true });
 
       if (!logbookContext.state.selectedLogId) {
@@ -58,21 +62,20 @@ const LogbookDrawer = ({ onOpenClose }: LogbookDrawerProps) => {
       }
 
       methods.reset(defaultValues);
-      logbookContext.dispatch({ type: 'SET_IS_FORM_DISABLED', payload: false });
-      logbookContext.dispatch({ type: 'SET_FORM_MODE', payload: FormMode.CANCEL });
+      
+      
     } catch (error) {
       const axiosError = error as AxiosError;
 
       logbookContext.dispatch({ type: 'SET_FORM_ALERT', payload: { severity: 'error', message: axiosError.message }});
     } finally {
       logbookContext.dispatch({ type: 'SET_IS_FORM_LOADING', payload: false });
+      logbookContext.dispatch({ type: 'SET_IS_FORM_DISABLED', payload: false });
+      logbookContext.dispatch({ type: 'SET_FORM_MODE', payload: FormMode.CANCEL });
+      onOpenClose(FormMode.CANCEL);
     }
   };
 
-  const onSelectedKeyChanged = (tab: string) => {
-    setActiveTab(tab)
-  }
-
   const onTabClicked = (event: any) => {
     setActiveTab(event.target.ariaLabel)
   }
@@ -86,7 +89,7 @@ const LogbookDrawer = ({ onOpenClose }: LogbookDrawerProps) => {
           aria-label='close-sidebar'
           className='drawer-overlay'
         ></label>
-        <div className='menu bg-base-100 text-base-content min-h-full p-4' style={{ width: '25%' }}>
+        <div className={`menu bg-base-100 text-base-content min-h-full p-4 ${screenSize === ScreenSize.SM ? 'w-full' : screenSize === ScreenSize.MD ? 'w-[66%]' : 'w-[25%]'}`}>
           <FormProvider {...methods}>
             <form className='prose max-w-none' onSubmit={methods.handleSubmit(onSubmit)} style={{ paddingBottom: '50px' }}>
               <div className='grid grid-cols-12 mb-6'>

client/src/components/pilotForm/PilotForm.tsx

@@ -12,6 +12,8 @@ import httpClient from '../../httpClient/httpClient';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faSave, faXmark } from '@fortawesome/free-solid-svg-icons';
 import { states } from './states';
+import { useBreakpoints } from '../../hooks/useBreakpoints/UseBreakpoints';
+import { ScreenSize } from '../../enums/screenSize';
 
 const PilotForm: React.FC<IPilotFormProps> = ({
   pilotId,
@@ -43,6 +45,7 @@ const PilotForm: React.FC<IPilotFormProps> = ({
   });
   const [isDisabled, setIsDisabled] = useState<boolean>(false);
   const [isError, setIsError] = useState<boolean>(false);
+  const { screenSize } = useBreakpoints();
 
   const onCancel = () => {
     methods.reset(defaultValues);
@@ -112,7 +115,7 @@ const PilotForm: React.FC<IPilotFormProps> = ({
           aria-label='close-sidebar'
           className='drawer-overlay'
         ></label>
-        <div className='menu bg-base-100 text-base-content min-h-full p-4' style={{ width: '25%' }}>
+        <div className={`menu bg-base-100 text-base-content min-h-full p-4 ${screenSize === ScreenSize.SM ? 'w-full' : screenSize === ScreenSize.MD ? 'w-[66%]' : 'w-[25%]'}`}>
           <FormProvider {...methods}>
             <form className='prose max-w-none' onSubmit={methods.handleSubmit(onSubmit)} style={{ paddingBottom: '50px' }}>
               <div className='grid grid-cols-12 gap-3'>