From 4a576de9c6683b86316191b7633c3599e83fe575 Mon Sep 17 00:00:00 2001
From: lcross2002 <liamdcross@outlook.com>
Date: Sun, 7 Apr 2024 13:28:40 +0100
Subject: [PATCH] various minor frontend fixes
---
.../FlightCreationForm/FlightCreationForm.tsx | 32 +++++++++++--------
client/src/components/Header/Header.tsx | 2 +-
client/src/components/Login/Login.tsx | 4 +--
3 files changed, 21 insertions(+), 17 deletions(-)
diff --git a/client/src/components/FlightCreationForm/FlightCreationForm.tsx b/client/src/components/FlightCreationForm/FlightCreationForm.tsx
index 9f0762e..6e68144 100644
--- a/client/src/components/FlightCreationForm/FlightCreationForm.tsx
+++ b/client/src/components/FlightCreationForm/FlightCreationForm.tsx
@@ -6,25 +6,26 @@ import { addFlight } from '../../services/FlightForm/FlightForm';
import './FlightCreationForm.scss';
export interface IFlightCreationForm {
- origin: string;
- destination: string;
- departure: string;
- arrival: string;
- economyCapacity: number;
- businessCapacity: number;
- economyPrice: number;
- businessPrice: number;
+ origin: string;
+ destination: string;
+ departure: string;
+ arrival: string;
+ economyCapacity: number;
+ businessCapacity: number;
+ economyPrice: number;
+ businessPrice: number;
}
function FlightCreationForm() {
const navigate = useNavigate();
const [error, setError] = useState('');
- const { register, handleSubmit } = useForm<IFlightCreationForm>({mode: 'onChange'});
+ const [disabled, setDisabled] = useState(false);
+ const { register, handleSubmit } = useForm<IFlightCreationForm>({ mode: 'onChange' });
- const onSubmit = async (formValue : IFlightCreationForm) => {
+ const onSubmit = async (formValue: IFlightCreationForm) => {
if (!Number.isInteger(formValue.businessCapacity) || !Number.isInteger(formValue.economyCapacity)) {
- setError('Please enter an integer for the capacity.')
- return;
+ setError('Please enter an integer for the capacity.')
+ return;
}
if (formValue.economyCapacity % 6 !== 0) {
@@ -43,6 +44,7 @@ function FlightCreationForm() {
}
setError('');
+ setDisabled(true);
try {
const result = await addFlight(formValue);
@@ -55,6 +57,8 @@ function FlightCreationForm() {
} else {
setError('An unexpected error has occurred');
}
+
+ setDisabled(false);
}
}
@@ -69,7 +73,7 @@ function FlightCreationForm() {
<label>Origin</label>
<input type='text' placeholder='Enter origin' {...register('origin', { required: true })} />
</div>
-
+
<div className='form-group'>
<label>Destination</label>
<input type='text' placeholder='Enter destination' {...register('destination', { required: true })} />
@@ -110,7 +114,7 @@ function FlightCreationForm() {
</div>
<div className='form-group'>
- <button type='submit'>Submit</button>
+ <button type='submit' disabled={disabled}>Submit</button>
</div>
<div className='form-group'>
diff --git a/client/src/components/Header/Header.tsx b/client/src/components/Header/Header.tsx
index 94a1e52..bbeca55 100644
--- a/client/src/components/Header/Header.tsx
+++ b/client/src/components/Header/Header.tsx
@@ -26,7 +26,7 @@ function Header() {
{isAuth ?
<div>
<NavLink to={userToDashboard(user)} className={activeClass} >Dashboard</NavLink>
- <NavLink to={'booking/query'} className={activeClass}>Book a Flight</NavLink>
+ {user?.type === 0 && <NavLink to={'booking/query'} className={activeClass}>Book a Flight</NavLink>}
<NavLink to={'logout'} className={activeClass}>Logout</NavLink>
</div> :
<div>
diff --git a/client/src/components/Login/Login.tsx b/client/src/components/Login/Login.tsx
index 10f6e48..d9190f9 100644
--- a/client/src/components/Login/Login.tsx
+++ b/client/src/components/Login/Login.tsx
@@ -28,7 +28,7 @@ export function Login() {
updateUser(result.data);
navigate(`/${userToDashboard(result.data)}`);
} else {
- throw new Error();
+ setError('Incorrect credentials');
}
} catch (error) {
const errorMessage = (error as AxiosError).response?.data;
@@ -36,7 +36,7 @@ export function Login() {
if (typeof errorMessage == 'string') {
setError(errorMessage);
} else {
- setError('An unexpected error has occurred, most likely incorrect credentials');
+ setError('An unexpected error has occurred');
}
}
};
--
GitLab