Login page migrated to tsx

Author: dev-rashedin

Client/src/api/swalAlert.ts

@@ -1,21 +1,12 @@
-import Swal from 'sweetalert2';
+import Swal, { SweetAlertIcon, SweetAlertPosition } from 'sweetalert2';
+
+
 
-type SwalIcon = 'success' | 'error' | 'warning' | 'info' | 'question';
-type SwalPosition =
-  | 'top'
-  | 'top-start'
-  | 'top-end'
-  | 'center'
-  | 'center-start'
-  | 'center-end'
-  | 'bottom'
-  | 'bottom-start'
-  | 'bottom-end';
 
 const swalAlert = (
-  icon: SwalIcon,
+  icon: SweetAlertIcon,
   title: string,
-  position: SwalPosition = 'center'
+  position: SweetAlertPosition = 'center'
 ) => {
   Swal.fire({
     position,

Client/src/api/userApi.js Client/src/api/userApi.tsClient/src/api/userApi.js renamed to Client/src/api/userApi.ts

@@ -6,7 +6,7 @@ import { toast } from 'react-toastify';
 
 
 // create a user to the database
-export const createOrUpdateUser = async (userInfo) => {
+export const createOrUpdateUser = async (userInfo : any) => {
   try {
     const res = await axiosApi.put('/users', userInfo);
 
@@ -18,15 +18,15 @@ export const createOrUpdateUser = async (userInfo) => {
       toast.success('User info updated successfully');
     }
     return res;
-  } catch (error) {
+  } catch (error : any) {
     console.error(error);
     swalAlert('error', error.message);
     throw error;
   }
 };
 
 // post publisher info
-export const postPublisherInfo = async (publisherData) => {
+export const postPublisherInfo = async (publisherData : any) => {
   try {
     //console.log(publisherData)
 
@@ -37,7 +37,7 @@ export const postPublisherInfo = async (publisherData) => {
     if (res.data.insertedId) {
       swalAlert('success', 'Publisher created successfully');
     }
-  } catch (error) {
+  } catch (error : any) {
     console.error(error);
     swalAlert('error', error.message);
   }

…nt/src/components/LoginRegisterTitle.jsx …nt/src/components/LoginRegisterTitle.tsxClient/src/components/LoginRegisterTitle.jsx renamed to Client/src/components/LoginRegisterTitle.tsx Client/src/components/LoginRegisterTitle.jsx renamed to Client/src/components/LoginRegisterTitle.tsx

@@ -1,8 +1,7 @@
-import PropTypes from 'prop-types';
 import { Link } from 'react-router-dom';
 import logo from '../assets/logo3.png';
 
-const LoginRegisterTitle = ({ title }) => {
+const LoginRegisterTitle = ({ title } : {title: string}) => {
   return (
     <div>
       <Link to='/'>
@@ -15,8 +14,5 @@ const LoginRegisterTitle = ({ title }) => {
   );
 };
 
-LoginRegisterTitle.propTypes = {
-  title: PropTypes.string.isRequired,
-};
 
 export default LoginRegisterTitle;

Client/src/pages/auth/Login.jsx Client/src/pages/auth/Login.tsxClient/src/pages/auth/Login.jsx renamed to Client/src/pages/auth/Login.tsx

@@ -12,9 +12,13 @@ import { ToastContainer } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 
 import { toast } from 'react-toastify';
-import { createOrUpdateUser } from '../../api/userApi';
 import swalAlert from '../../api/swalAlert';
 
+type FormValues = {
+  email: string;
+  password: string;
+};
+
 const Login = () => {
   const [showPassword, setShowPassword] = useState(false);
 
@@ -29,15 +33,15 @@ const Login = () => {
     register,
     handleSubmit,
     formState: { errors },
-  } = useForm();
+  } = useForm<FormValues>();
 
-  const onSubmit = async ({ email, password }) => {
+  const onSubmit = async ({ email, password } : { email: string; password: string }) => {
     try {
       setLoading(true);
       await logInUser(email, password);
       swalAlert('success', 'Sign Up Successful', 'top-right');
       navigate(from);
-    } catch (err) {
+    } catch (err : any ) {
       //console.log(err);
       toast.error(err.message);
       setLoading(false);