+
+
+ );
+};
+
+export default GoogleColorIcon;
diff --git a/src/assets/svg/Icons/HistoryClockIcon.tsx b/src/assets/svg/Icons/HistoryClockIcon.tsx
new file mode 100644
index 00000000..2c7aa401
--- /dev/null
+++ b/src/assets/svg/Icons/HistoryClockIcon.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+
+interface HistoryClockIconProps {
+ className?: string;
+}
+
+const HistoryClockIcon: React.FC
+
+
+ );
+};
+
+export default LinkedinColorIcon;
diff --git a/src/assets/svg/Icons/LinkedinIcon.tsx b/src/assets/svg/Icons/LinkedinIcon.tsx
index bc316ec4..d5f6d86c 100644
--- a/src/assets/svg/Icons/LinkedinIcon.tsx
+++ b/src/assets/svg/Icons/LinkedinIcon.tsx
@@ -4,14 +4,21 @@ const LinkedinIcon: React.FC = () => {
return (
+
+
+ );
+};
+
+export default OpenIcon;
diff --git a/src/assets/svg/Icons/ShareIcon.tsx b/src/assets/svg/Icons/ShareIcon.tsx
new file mode 100644
index 00000000..d8708554
--- /dev/null
+++ b/src/assets/svg/Icons/ShareIcon.tsx
@@ -0,0 +1,19 @@
+const ShareIcon = () => (
+
+);
+
+export default ShareIcon;
diff --git a/src/assets/svg/Icons/SuccessIcon.tsx b/src/assets/svg/Icons/SuccessIcon.tsx
new file mode 100644
index 00000000..b875b7cf
--- /dev/null
+++ b/src/assets/svg/Icons/SuccessIcon.tsx
@@ -0,0 +1,16 @@
+function SuccessIcon() {
+ return (
+
+ );
+}
+
+export default SuccessIcon;
diff --git a/src/assets/svg/Icons/TwitterIcon.tsx b/src/assets/svg/Icons/TwitterIcon.tsx
index 2ea2212f..5f87e768 100644
--- a/src/assets/svg/Icons/TwitterIcon.tsx
+++ b/src/assets/svg/Icons/TwitterIcon.tsx
@@ -3,19 +3,7 @@ import React from 'react';
const TwitterIcon: React.FC = () => {
return (
-
+ 
);
};
diff --git a/src/assets/svg/Icons/UserIcon.tsx b/src/assets/svg/Icons/UserIcon.tsx
new file mode 100644
index 00000000..c7cfb27a
--- /dev/null
+++ b/src/assets/svg/Icons/UserIcon.tsx
@@ -0,0 +1,21 @@
+function UserIcon() {
+ return (
+
+ );
+}
+
+export default UserIcon;
diff --git a/src/assets/svg/Icons/WarningIcon.tsx b/src/assets/svg/Icons/WarningIcon.tsx
new file mode 100644
index 00000000..6429c3ef
--- /dev/null
+++ b/src/assets/svg/Icons/WarningIcon.tsx
@@ -0,0 +1,20 @@
+function WarningIcon() {
+ return (
+
+ );
+}
+
+export default WarningIcon;
diff --git a/src/assets/svg/Loading.tsx b/src/assets/svg/Loading.tsx
new file mode 100644
index 00000000..c49030e3
--- /dev/null
+++ b/src/assets/svg/Loading.tsx
@@ -0,0 +1,22 @@
+import React from 'react';
+
+const Loading: React.FC = () => (
+
+);
+
+export default Loading;
diff --git a/src/components/ActionButtons/index.tsx b/src/components/ActionButtons/index.tsx
new file mode 100644
index 00000000..1b8178ff
--- /dev/null
+++ b/src/components/ActionButtons/index.tsx
@@ -0,0 +1,48 @@
+import React from 'react';
+import { ApplicationStatus } from '../../enums';
+import ConfirmButton from '../ConfirmButton';
+
+interface ActionButtonsProps {
+ state?: string;
+ handleApprove: () => Promise
+
+ );
+};
+
+export default StickyBanner;
diff --git a/src/components/ChangePasswordForm/ChangePasswordForm.component.tsx b/src/components/ChangePasswordForm/ChangePasswordForm.component.tsx
deleted file mode 100644
index 0a43b76e..00000000
--- a/src/components/ChangePasswordForm/ChangePasswordForm.component.tsx
+++ /dev/null
@@ -1,90 +0,0 @@
-import React from 'react';
-
-interface ChangePasswordFormProps {
- onSubmit: (props: {
- current_password: string;
- new_password: string;
- confirm_new_password: string;
- }) => void;
-}
-
-const ChangePasswordForm: React.FC{children}
+
+
+
+
+
+ );
+};
+
+export default EmailHistory;
diff --git a/src/components/Dashboard/scenes/Emails/Emails.tsx b/src/components/Dashboard/scenes/Emails/Emails.tsx
deleted file mode 100644
index fad8a812..00000000
--- a/src/components/Dashboard/scenes/Emails/Emails.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const Emails: React.FC = () => {
- return (
-
+
+ {emails != null && emails.length > 0 ? '📬' : '📭'}
+
+
+
+
+ ) : (
+
+ Mail Box
+ {isLoading ? ( +
+
+ ) : emails != null && emails.length > 0 ? (
+ | + Subject + | ++ Recipient + | ++ Sent Status + | ++ Open Status + | ++ Sent Time + | +
|---|---|---|---|---|
| + {email.subject.split(' ').slice(0, 4).join(' ') + + (email.subject.split(' ').length > 4 ? '...' : '')} + | ++ {getUsername(email.recipients)} + | ++ {email.status} + | ++ {email.opened} + | ++ {new Date(email.sentTime).toLocaleString()} + | +
+
+ )}
+ No mails
+
-
- );
-};
-
-export default Emails;
diff --git a/src/components/Dashboard/scenes/ManageMentorApplications/ManageMentorApplications.tsx b/src/components/Dashboard/scenes/ManageMentorApplications/ManageMentorApplications.tsx
deleted file mode 100644
index ce44a186..00000000
--- a/src/components/Dashboard/scenes/ManageMentorApplications/ManageMentorApplications.tsx
+++ /dev/null
@@ -1,202 +0,0 @@
-import React, { useState } from 'react';
-import { type Mentor } from '../../../../types';
-import { useMentors } from '../../../../hooks/useMentors';
-import useCategories from '../../../../hooks/useCategories';
-import { useQueryClient } from '@tanstack/react-query';
-
-export const ManageMentorApplications: React.FC = () => {
- const [filter, setFilter] = useState('');
- const [searchTerm, setSearchTerm] = useState('');
- const { data: categories } = useCategories();
- const [categoryFilter, setCategoryFilter] = useStateEmails
-
- {filters.map(({ label, status }) => {
- const count = mentors.filter((mentor) =>
- status.length > 0 ? mentor.state === status : true
- ).length;
- return (
-
- );
- })}
-
- )}
-
- );
- };
-
- const renderMentorTable = () => {
- const filteredMentors =
- mentors != null
- ? filter !== ''
- ? mentors.filter((mentor) => mentor.state === filter)
- : mentors
- : [];
-
- const filteredMentorsByCategory =
- categoryFilter !== ''
- ? filteredMentors.filter(
- (mentor) => mentor.category.uuid === categoryFilter
- )
- : filteredMentors;
-
- const filteredMentorsByName = filteredMentorsByCategory.filter(
- (mentor: Mentor) =>
- `${mentor.application.firstName} ${mentor.application.lastName}`
- .toLowerCase()
- .includes(searchTerm.toLowerCase())
- );
-
- return (
- <>
- {
- setSearchTerm(e.target.value);
- }}
- className="p-2 my-4 border border-gray-300 rounded-md"
- />
-
- | - Name - | -- Profession - | -- Category - | -- Status - | -
|---|---|---|---|
| - {mentor.application.firstName} {mentor.application.lastName} - | -- {mentor.application.position} - | -- {mentor.category.category} - | -- - | -
-
- {renderFilters()} - {isLoading ? ( -
- );
-};
diff --git a/src/components/Dashboard/scenes/ManageMentors/ManageMentors.tsx b/src/components/Dashboard/scenes/ManageMentors/ManageMentors.tsx
deleted file mode 100644
index 8ae44412..00000000
--- a/src/components/Dashboard/scenes/ManageMentors/ManageMentors.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const ManageMentors: React.FC = () => {
- return (
- Manage Mentor Applications
-- {renderFilters()} - {isLoading ? ( -
-
- Loading...
-
- ) : (
- renderMentorTable()
- )}
-
-
- );
-};
-
-export default ManageMentors;
diff --git a/src/components/Dashboard/scenes/MenteeApplications/MenteeApplications.tsx b/src/components/Dashboard/scenes/MenteeApplications/MenteeApplications.tsx
deleted file mode 100644
index b37d55a8..00000000
--- a/src/components/Dashboard/scenes/MenteeApplications/MenteeApplications.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const MenteeApplications: React.FC = () => {
- return (
- Manage Mentors
-
-
- );
-};
-
-export default MenteeApplications;
diff --git a/src/components/Dashboard/scenes/OngoingMentorshipPrograms/OngoingMentorshipPrograms.tsx b/src/components/Dashboard/scenes/OngoingMentorshipPrograms/OngoingMentorshipPrograms.tsx
deleted file mode 100644
index 7cbf5fac..00000000
--- a/src/components/Dashboard/scenes/OngoingMentorshipPrograms/OngoingMentorshipPrograms.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const OngoingMentorshipPrograms: React.FC = () => {
- return (
- Mentee Applications
-
-
- );
-};
-
-export default OngoingMentorshipPrograms;
diff --git a/src/components/Dashboard/scenes/PlatformSettings/PlatformSettings.tsx b/src/components/Dashboard/scenes/PlatformSettings/PlatformSettings.tsx
deleted file mode 100644
index c4d8355b..00000000
--- a/src/components/Dashboard/scenes/PlatformSettings/PlatformSettings.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const PlatformSettings: React.FC = () => {
- return (
- Ongoing Mentorship Programs
-
-
- );
-};
-
-export default PlatformSettings;
diff --git a/src/components/EditProfileForm/EditProfileForm.component.tsx b/src/components/EditProfileForm/EditProfileForm.component.tsx
deleted file mode 100644
index 38ab2201..00000000
--- a/src/components/EditProfileForm/EditProfileForm.component.tsx
+++ /dev/null
@@ -1,314 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { type Profile } from '../../types';
-import {
- Button,
- Col,
- Form,
- Input,
- Modal,
- Row,
- Skeleton,
- Upload,
- type UploadFile,
- type UploadProps,
-} from 'antd';
-import { PlusOutlined } from '@ant-design/icons';
-import Title from 'antd/es/typography/Title';
-import styles from './EditProfileForm.module.css';
-import { type RcFile } from 'antd/es/upload';
-import { getBase64 } from '../../util/imageConversion.util';
-
-interface EditProfileFormProps {
- isLoading: boolean;
- profile: Profile;
- onSubmit: (formValues: {
- first_name: string;
- last_name: string;
- contact_email: string;
- linkedin_url: string;
- image_url?: string;
- }) => void;
-}
-
-const EditProfileForm: React.FCPlatform Settings
--
-
- ) : null}
- Upload
- -
- {faq.answer.list.map((listItem, listIndex) => (
-
- {listItem} - ))} -
+ {faqs.map((faq, index) => (
+
+ );
+};
+
+export default FAQSection;
diff --git a/src/components/ForgotPasswordModal/index.tsx b/src/components/ForgotPasswordModal/index.tsx
new file mode 100644
index 00000000..0e0de2c0
--- /dev/null
+++ b/src/components/ForgotPasswordModal/index.tsx
@@ -0,0 +1,117 @@
+import React, { useState } from 'react';
+import { useForm } from 'react-hook-form';
+import { useResetPassword } from '../../hooks/useForgotPassword';
+import { type PasswordResetData } from '../../types';
+import { z } from 'zod';
+import Loading from '../../assets/svg/Loading';
+import closeIcon from '../../assets/svg/closeIcon.svg';
+
+const ForgotPasswordDataSchema = z.object({
+ email: z.string(),
+});
+
+interface ForgotPasswordModalProps {
+ handleClose: () => void;
+}
+
+const ForgotPasswordModal: React.FC
+
+ {openIndex === index && (
+
+ ))}
+
+ {faq.answer.paragraph.map((paragraphItem, paragraphIndex) => (
+
+ )}
+ + {paragraphItem} +
+ ))} + {faq.answer.list.length > 0 && ( +-
+ {faq.answer.list.map((listItem, listIndex) => (
+
- {listItem} + ))} +
+
+ );
+};
+export default ForgotPasswordModal;
diff --git a/src/components/FormFields/MenteeApplication/FormCheckbox/index.tsx b/src/components/FormFields/MenteeApplication/FormCheckbox/index.tsx
new file mode 100644
index 00000000..8a9681f4
--- /dev/null
+++ b/src/components/FormFields/MenteeApplication/FormCheckbox/index.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import type { FieldError, UseFormRegister } from 'react-hook-form';
+import { type MenteeApplication } from '../../../../types';
+
+export interface FormCheckboxProps {
+ name: keyof MenteeApplication;
+ label: string;
+ register: UseFormRegister
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Reset Password +
+ +
+
+
+ {error != null && {error.message}}
+
+ );
+};
+
+export default FormCheckbox;
diff --git a/src/components/FormFields/MenteeApplication/FormInput/index.tsx b/src/components/FormFields/MenteeApplication/FormInput/index.tsx
new file mode 100644
index 00000000..6c40d70a
--- /dev/null
+++ b/src/components/FormFields/MenteeApplication/FormInput/index.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import type { FieldError, UseFormRegister } from 'react-hook-form';
+import { type MenteeApplication } from '../../../../types';
+
+export interface FormInputProps {
+ type: string;
+ placeholder: string;
+ name: keyof MenteeApplication;
+ label: string;
+ register: UseFormRegister
+
+
+ {error != null && {error.message}}
+
+ );
+};
+
+export default FormInput;
diff --git a/src/components/FormFields/FormCheckbox/index.tsx b/src/components/FormFields/MentorApplication/FormCheckbox/index.tsx
similarity index 84%
rename from src/components/FormFields/FormCheckbox/index.tsx
rename to src/components/FormFields/MentorApplication/FormCheckbox/index.tsx
index 328033fc..772c4136 100644
--- a/src/components/FormFields/FormCheckbox/index.tsx
+++ b/src/components/FormFields/MentorApplication/FormCheckbox/index.tsx
@@ -1,6 +1,6 @@
import React from 'react';
import type { FieldError, UseFormRegister } from 'react-hook-form';
-import type { MentorApplication } from '../../MentorRegistrationPage';
+import { type MentorApplication } from '../../../../types';
export interface FormCheckboxProps {
name: keyof MentorApplication;
@@ -16,9 +16,9 @@ const FormCheckbox: React.FC
-
+ = ({
(
- <>
- {/* Main title container */}
-
-
-
-
- Testimonials
-
-
- Have a look what our past
mentees say about ScholarX -
-
-
-
-
-
-
-
- {/* Success stories container */}
-
-
-
- FAQ for Mentors
-
-
-
- FAQ for Mentees
-
-
-
-
-);
-export default Home;
diff --git a/src/components/Home/index.tsx b/src/components/Home/index.tsx
new file mode 100644
index 00000000..983abf23
--- /dev/null
+++ b/src/components/Home/index.tsx
@@ -0,0 +1,161 @@
+import React, { useContext } from 'react';
+import FAQSection from '../FAQ';
+import menteeFAQs from '../FAQ/MenteeFAQs.json';
+import mentorFAQs from '../FAQ/MentorFAQs.json';
+import { Link, useNavigate } from 'react-router-dom';
+import { useLoginModalContext } from '../../contexts/LoginModalContext';
+import { UserContext, type UserContextType } from '../../contexts/UserContext';
+
+const logos = [
+ 'google.png',
+ 'meta.png',
+ 'microsoft.png',
+ 'apple.png',
+ 'linkedin.png',
+ 'mit.png',
+ 'stanford.png',
+ 'harvard.png',
+ 'oxford.png',
+ 'cambridge.png',
+];
+
+const Home: React.FC = () => {
+ const { handleLoginModalOpen } = useLoginModalContext();
+ const navigate = useNavigate();
+
+ const { user } = useContext(UserContext) as UserContextType;
+
+ const handleMentorRegistration = (): void => {
+ if (user === null) {
+ handleLoginModalOpen();
+ } else {
+ navigate('/mentor-registration');
+ }
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ;
+ headline: string;
+ body: string;
+}
+
+const InformationModal: React.FC = ({
+ isOpen,
+ onClose,
+ onConfirm,
+ headline,
+ body,
+}) => {
+ if (!isOpen) return null;
+ const [isLoading, setIsLoading] = useState(false);
+
+ const handleConfirmClick = async () => {
+ setIsLoading(true);
+ await onConfirm();
+ setIsLoading(false);
+ onClose();
+ };
+
+ return (
+ = ({ children }) => (
-
-
-
- {children}
-
-
+import { PropsWithChildren } from 'react';
+
+import Footer from './Footer';
+import Navbar from './Navbar';
+
+const MainLayout = ({ children }: PropsWithChildren) => (
+ <>
+
+ {children}
+
+
+
);
export default MainLayout;
diff --git a/src/components/Layout/MenuDrawer/MenuDrawer.module.css b/src/components/Layout/MenuDrawer/MenuDrawer.module.css
deleted file mode 100644
index 1fbce0fb..00000000
--- a/src/components/Layout/MenuDrawer/MenuDrawer.module.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.drawerContent{
- text-align: center;
- display: flex;
- margin-left: auto;
- margin-right: auto
-}
-
-.antTypography{
- font-family: -apple-system, SanFranciscoText, sans-serif;
- color: #6D7893;
- font-size: 14px;
- font-weight: 300;
-}
-
-.antButton{
- width: 20px;
- border: none;
-}
-
-.antIcon{
- color: #525F7F;
- font-size: 20px;
-}
diff --git a/src/components/Layout/MenuDrawer/MenuDrawer.tsx b/src/components/Layout/MenuDrawer/MenuDrawer.tsx
deleted file mode 100644
index 7f0a03bf..00000000
--- a/src/components/Layout/MenuDrawer/MenuDrawer.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-import React from 'react';
-
-import {
- TwitterOutlined,
- LinkedinFilled,
- InstagramOutlined,
- FacebookFilled,
-} from '@ant-design/icons';
-import { Avatar, Button, Drawer, Space, Typography } from 'antd';
-
-import styles from './MenuDrawer.module.css';
-
-const { Text } = Typography;
-
-interface MenuDrawerProps {
- openMenu: boolean;
- setOpenMenu: (value: boolean) => void;
- handleMentorRegistration: () => void;
-}
-
-const MenuDrawer: React.FC = ({
- openMenu,
- setOpenMenu,
- handleMentorRegistration,
-}) => {
- const handleOpenMenu = (): boolean => {
- return openMenu;
- };
-
- const handleCloseMenu = (): void => {
- setOpenMenu(false);
- };
-
- return (
- {
- handleCloseMenu();
- }}
- width={320}
- closable
- >
-
- Home
-
-
- About
-
-
- Initiatives
-
-
- Join Us
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- );
-};
-export default MenuDrawer;
diff --git a/src/components/Layout/MenuDrawer/index.tsx b/src/components/Layout/MenuDrawer/index.tsx
new file mode 100644
index 00000000..7611ecee
--- /dev/null
+++ b/src/components/Layout/MenuDrawer/index.tsx
@@ -0,0 +1,112 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+import FacebookIcon from '../../../assets/svg/Icons/FacebookIcon';
+import InstagramIcon from '../../../assets/svg/Icons/InstagramIcon';
+import LinkedinIcon from '../../../assets/svg/Icons/LinkedinIcon';
+import TwitterIcon from '../../../assets/svg/Icons/TwitterIcon';
+
+interface MenuDrawerProps {
+ openMenu: boolean;
+ setOpenMenu: (value: boolean) => void;
+ handleMentorRegistration: () => void;
+}
+
+const MenuDrawer: React.FC = ({
+ openMenu,
+ setOpenMenu,
+ handleMentorRegistration,
+}) => {
+ const handleOpenMenu = (): boolean => {
+ return openMenu;
+ };
+
+ const handleCloseMenu = (): void => {
+ setOpenMenu(false);
+ };
+
+ return (
+
- 
-
- {
- setOpenMenu(true);
- }}
- />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {user === null ? (
- <>
-
-
-
- ) : (
-
- )}
-
-
-
- = useRef(null);
+ const navigate = useNavigate();
+ const location = useLocation();
+
+ const { user, isUserMentor, isUserAdmin, isUserMentee } = useContext(
+ UserContext
+ ) as UserContextType;
+
+ const logoutModalOpen = (): void => {
+ handleLogoutModalOpen();
+ toggleDropdown();
+ };
+
+ const handleMentorRegistration = (): void => {
+ if (user === null) {
+ handleLoginModalOpen();
+ } else {
+ navigate('/mentor-registration');
+ }
+ setOpenMenu(false);
+ };
+
+ const toggleDropdown = () => {
+ setIsDropdownOpen(!isDropdownOpen);
+ };
+
+ const handleClickOutside = (event: React.MouseEvent) => {
+ if (
+ dropdownRef.current &&
+ !dropdownRef.current.contains(event.target as Node)
+ ) {
+ setIsDropdownOpen(false);
+ }
+ };
+
+ useEffect(() => {
+ document.addEventListener(
+ 'mousedown',
+ handleClickOutside as unknown as EventListener
+ );
+ return () => {
+ document.removeEventListener(
+ 'mousedown',
+ handleClickOutside as unknown as EventListener
+ );
+ };
+ }, []);
+
+ return (
+ = ({ handleClose }) => {
+const LoginModal: React.FC = ({
+ handleClose,
+ onRegistrationClick,
+ onForgotPasswordClick,
+}) => {
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
- const { setUserContext } = useContext(UserContext) as UserContextType;
+ const [error, setError] = useState('');
+ const [isLoading, setIsLoading] = useState(false);
+ const { refetch } = useProfile();
- const handleLogin = (e: React.FormEvent): void => {
+ const handleLogin = async (e: React.FormEvent): Promise => {
e.preventDefault();
try {
- axios
+ setError('');
+ setIsLoading(true);
+ await axios
.post(
`${API_URL}/auth/login`,
{
@@ -34,22 +39,17 @@ const LoginModal: React.FC = ({ handleClose }) => {
withCredentials: true,
}
)
- .then((response: AxiosResponse) => {
- setUserContext(response.data);
+ .then(async () => {
+ await refetch();
handleClose();
- })
- .catch((error) => {
- if (error.response.status !== 401) {
- console.error({
- message: 'Something went wrong when fetching the user',
- description: error.toString(),
- });
- } else {
- setUserContext(null);
- }
});
+ setIsLoading(false);
} catch (error) {
+ setIsLoading(false);
console.error('Login error:', error);
+ if (error instanceof AxiosError) {
+ setError(error.response?.data.message);
+ }
}
};
@@ -60,7 +60,6 @@ const LoginModal: React.FC = ({ handleClose }) => {
-
+
{error != null && {error.message}}
);
diff --git a/src/components/FormFields/FormInput/index.tsx b/src/components/FormFields/MentorApplication/FormInput/index.tsx
similarity index 91%
rename from src/components/FormFields/FormInput/index.tsx
rename to src/components/FormFields/MentorApplication/FormInput/index.tsx
index f1351a9a..c8b15e35 100644
--- a/src/components/FormFields/FormInput/index.tsx
+++ b/src/components/FormFields/MentorApplication/FormInput/index.tsx
@@ -1,6 +1,6 @@
import React from 'react';
import type { FieldError, UseFormRegister } from 'react-hook-form';
-import type { MentorApplication } from '../../MentorRegistrationPage';
+import { type MentorApplication } from '../../../../types';
export interface FormInputProps {
type: string;
@@ -26,6 +26,7 @@ const FormInput: React.FC
-
-
- {/* Statistics container */}
-
-
-
- Unlock Mentorship opportunites with ScholarX
-
-
-
-
-
-
-
-
- 
-
-
-
-
-
- {/* Testimonials container */}
-
-
-
- 100,000+
-
-
- Mentees
-
-
-
-
- 500+
-
-
- Mentors
-
-
-
-
- 70%
-
-
- Growth
-
- mentees say about ScholarX -
-
-
-
-
-
-
-
-
-
-
- {/* Archive container */}
-
-
- 
-
-
-
-
-
- Let`s hear it from our
-
ScholarX Alumni -
- ScholarX Alumni -
-
-
-
-
-
-
-
- {/* FAQs container */}
-
-
-
- Checkout our past
-
mentors and mentees -
- mentors and mentees -
-
-
-
-
-
- 
-
-
-
+
+ + Unlock Mentorship opportunities with ScholarX +
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+ Our mentors are from{' '}
+ *
+
+
+ {logos.map((logo, index) => (
+
+
+ ![{`${logo.split('.')[0]}]({`logos/${logo}`})
+
+ ))}
+
+ 
+
+
+
+
+
+ Let's hear it from our
+
ScholarX Alumni +
+ ScholarX Alumni +
+
+
+
+
+
+
+
+ Checkout our past
+
mentors and mentees +
+ mentors and mentees +
+
+
+
+
+
+ 
+
+
+
+
+ + FAQ for Mentors +
+
+
+
+
+ + FAQ for Mentees +
+
+
+ + *Our mentors engage in mentoring voluntarily in their leisure time and + we don't have a direct affiliation with the mentioned organisations +
+ + ); +}; +export default Home; diff --git a/src/components/InformationModal/index.tsx b/src/components/InformationModal/index.tsx new file mode 100644 index 00000000..fb7b12a1 --- /dev/null +++ b/src/components/InformationModal/index.tsx @@ -0,0 +1,92 @@ +import React, { useState } from 'react'; +import WarningIcon from '../../assets/svg/Icons/WarningIcon'; +import CloseIcon from '../../assets/svg/Icons/CloseIcon'; + +interface InformationModalProps { + isOpen: boolean; + onClose: () => void; + onConfirm: () => Promise
+
+ );
+};
+
+export default InformationModal;
diff --git a/src/components/Layout/Footer/Footer.tsx b/src/components/Layout/Footer/Footer.tsx
deleted file mode 100644
index 35cff1ed..00000000
--- a/src/components/Layout/Footer/Footer.tsx
+++ /dev/null
@@ -1,144 +0,0 @@
-import React from 'react';
-import TwitterIcon from '../../../assets/svg/Icons/TwitterIcon.tsx';
-import FacebookIcon from '../../../assets/svg/Icons/FacebookIcon.tsx';
-import LinkedinIcon from '../../../assets/svg/Icons/LinkedinIcon.tsx';
-import InstagramIcon from '../../../assets/svg/Icons/InstagramIcon.tsx';
-import DiscourseIcon from '../../../assets/svg/Icons/DiscourseIcon.tsx';
-import SlackIcon from '../../../assets/svg/Icons/SlackIcon.tsx';
-import GithubIcon from '../../../assets/svg/Icons/GithubIcon.tsx';
-import YoutubeIcon from '../../../assets/svg/Icons/YoutubeIcon.tsx';
-
-const FooterComponent: React.FC = () => (
- <>
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + {headline} +
+
+
+ {body}
+
+
+
+
+
-
-
- {/* Footer Link */}
-
-
- {/* SEF Site Links */}
-
- Let`s Rethink Education!
-
-
- Get in touch with using any of these platforms.
-
-
- {/* SEF Social Media Links */}
-
-
-
-
-
- -
-
- - - Home - - -
- - - Projects - - -
- - - Team - - -
- - - Blog - - -
- - - Join Us - - -
- - - Handbook - - -
-
-
-);
-export default FooterComponent;
diff --git a/src/components/Layout/Footer/index.tsx b/src/components/Layout/Footer/index.tsx
new file mode 100644
index 00000000..c206322e
--- /dev/null
+++ b/src/components/Layout/Footer/index.tsx
@@ -0,0 +1,19 @@
+import React from 'react';
+
+const Footer: React.FC = () => (
+
+);
+export default Footer;
diff --git a/src/components/Layout/MainLayout.module.css b/src/components/Layout/MainLayout.module.css
deleted file mode 100644
index 40d5a081..00000000
--- a/src/components/Layout/MainLayout.module.css
+++ /dev/null
@@ -1,33 +0,0 @@
-.antLayoutHeader{
- background-color: white;
- z-index: 1000;
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
- height: 88px;
- padding: 0px 10px;
-}
-
-@media (min-width:1200px){
- .antLayoutHeader{
- padding: 0px 20px;
- }
-}
-
-@media (max-width:999px){
- .antLayoutHeader{
- padding: 0px 40px;
- }
-}
-
-@media (max-width:360px){
- .antLayoutHeader{
- padding: 0px 30px;
- }
-}
-
-.antLayoutContent{
- background-color: white;
-}
-
-.antLayoutFooter{
- background-color: #F8FDFF;
-}
diff --git a/src/components/Layout/MainLayout.tsx b/src/components/Layout/MainLayout.tsx
index 9f3afe14..d3c7f63b 100644
--- a/src/components/Layout/MainLayout.tsx
+++ b/src/components/Layout/MainLayout.tsx
@@ -1,26 +1,15 @@
-import React, { type ReactNode } from 'react';
-
-import { Layout } from 'antd';
-
-import FooterComponent from './Footer/Footer';
-import styles from './MainLayout.module.css';
-import Navbar from './Navbar/Navbar';
-
-const { Header, Footer, Content } = Layout;
-
-interface LayoutProps {
- children: ReactNode;
-}
-
-const MainLayout: React.FC
- © 2024
-
- {' '}
- Sustainable Education Foundation - SEF.
-
-
-
+
+
+ );
+};
+
+export default MenuDrawer;
diff --git a/src/components/Layout/Navbar/Navbar.module.css b/src/components/Layout/Navbar/Navbar.module.css
deleted file mode 100644
index 6529c318..00000000
--- a/src/components/Layout/Navbar/Navbar.module.css
+++ /dev/null
@@ -1,87 +0,0 @@
-.menuIcon{
- font-size: 20px;
-}
-
-@media (max-width:999px){
- .menuIcon{
- margin-left: 80%;
- }
-}
-
-@media (max-width:767px){
- .menuIcon{
- margin-left: 10%;
- }
-}
-
-@media (max-width:396px){
- .menuIcon{
- margin-left: 9%;
- }
-}
-
-@media (max-width:336px){
- .menuIcon{
- margin-left: 0%;
- }
-}
-
-@media (min-width:999px){
- .menuIcon{
- display: none;
- }
-}
-
-@media (max-width:999px){
- .navbarItemContainer{
- display: none;
- }
-}
-
-@media (max-width:999px){
- .socialMediaContainer{
- display: none;
- }
-}
-
-.navbarLogoContainer{
- width: 154px;
- margin-top: 15px;
-}
-
-.drawerLogoContainer{
- width: 154px;
- margin-top: 15px;
- margin-right: auto;
-}
-
-.antTypography{
- font-family: -apple-system, SanFranciscoText, sans-serif;
- color: #6D7893;
- font-size: 14px;
- font-weight: 300;
- margin-right: 65px;
-}
-
-@media (min-width:1000px){
- .antTypography{
- margin-right: 50px;
- }
-}
-
-.antButton{
- width: 20px;
- border: none;
-}
-
-.antIcon{
- color: #525F7F;
- font-size: 20px;
-}
-
-.loginButton{
- font-family: -apple-system, SanFranciscoText, sans-serif;
- font-size: 14px;
- font-weight: 500;
- height: 37px;
-}
diff --git a/src/components/Layout/Navbar/Navbar.tsx b/src/components/Layout/Navbar/Navbar.tsx
deleted file mode 100644
index 076c7a4f..00000000
--- a/src/components/Layout/Navbar/Navbar.tsx
+++ /dev/null
@@ -1,188 +0,0 @@
-import React, { useContext, useState } from 'react';
-
-import {
- AlignRightOutlined,
- TwitterOutlined,
- LinkedinFilled,
- InstagramOutlined,
- FacebookFilled,
-} from '@ant-design/icons';
-import { Button, Col, Row, Space, Typography } from 'antd';
-
-import styles from './Navbar.module.css';
-import MenuDrawer from '../MenuDrawer/MenuDrawer';
-import LoginModal from '../../LoginModal';
-import RegisterModal from '../../RegisterModal';
-
-import {
- UserContext,
- type UserContextType,
-} from './../../../contexts/UserContext';
-import LogoutModal from '../../LogoutModal';
-import { useNavigate } from 'react-router-dom';
-
-const { Text } = Typography;
-
-const Navbar: React.FC = () => {
- const [openMenu, setOpenMenu] = useState(false);
- const [isLoginModalVisible, setIsLoginModalVisible] = useState(false);
- const [isRegisterModalVisible, setIsRegisterModalVisible] = useState(false);
- const [isLogoutModalVisible, setIsLogoutModalVisible] = useState(false);
-
- const navigate = useNavigate();
-
- const { user } = useContext(UserContext) as UserContextType;
-
- const handleLoginModalClose = (): void => {
- setIsLoginModalVisible(false);
- };
-
- const handleLoginModalOpen = (): void => {
- setIsLoginModalVisible(true);
- };
-
- const handleRegisterModalClose = (): void => {
- setIsRegisterModalVisible(false);
- };
-
- const handleRegisterModalOpen = (): void => {
- setIsRegisterModalVisible(true);
- };
-
- const handleLogoutModalClose = (): void => {
- setIsLogoutModalVisible(false);
- };
-
- const handleLogoutModalOpen = (): void => {
- setIsLogoutModalVisible(true);
- };
-
- const handleMentorRegistration = (): void => {
- if (user === null) {
- handleLoginModalOpen();
- } else {
- navigate('/mentor-registration');
- }
- setOpenMenu(false);
- };
-
- return (
- <>
-
+
+
+
-
-
+
+
+
+ );
+};
+
+export default Navbar;
diff --git a/src/components/LoginModal/LoginModal.module.css b/src/components/LoginModal/LoginModal.module.css
deleted file mode 100644
index 55f39572..00000000
--- a/src/components/LoginModal/LoginModal.module.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.scholarxLogoWrapper {
- max-width: 177px;
- margin: 20px auto 50px auto;
-}
-
-.modalWrapper {
- max-width: 380px;
- margin: 20px auto;
-}
-
diff --git a/src/components/LoginModal/index.tsx b/src/components/LoginModal/index.tsx
index 27200d6b..1a19d17a 100644
--- a/src/components/LoginModal/index.tsx
+++ b/src/components/LoginModal/index.tsx
@@ -1,29 +1,34 @@
-import React, { useState, useContext } from 'react';
-import axios, { type AxiosResponse } from 'axios';
+import React, { useState } from 'react';
+import axios, { AxiosError } from 'axios';
import { API_URL } from '../../constants';
-import { type Profile } from '../../types';
-import { UserContext, type UserContextType } from '../../contexts/UserContext';
import closeIcon from '../../assets/svg/closeIcon.svg';
-import styles from './LoginModal.module.css';
+import useProfile from '../../hooks/useProfile';
+import GoogleLoginButton from '../OAuth/Google';
+import LinkedInLoginButton from '../OAuth/LinkedIn';
interface LoginModalProps {
handleClose: () => void;
+ onRegistrationClick: () => void;
+ onForgotPasswordClick: () => void;
}
-const handleLoginGoogle = (e: React.FormEvent): void => {
- e.preventDefault();
- window.location.href = `${API_URL}/auth/google`;
-};
-
-const LoginModal: React.FC = ({ handleClose }) => {
-
-
+
+
+
Welcome back!
-
- 
-
+
Welcome back!
-
-
-
+
-