Fix: bugs

README.md

@@ -83,6 +83,23 @@ Esse projeto é usado pela [SouJunior](https://github.com/SouJunior).
 
 [Projeto Vagas - Backend](https://github.com/SouJunior/vagas-backend)
 
+
+## Autor(es) 🙎🏻‍♂️
+
+-   Max Faria | [GitHub](https://github.com/max-faria) - [Linkedin](https://www.linkedin.com/in/maxfariaa/)
+-   Isabela S. Hyeda Buitoni | [GitHub](https://github.com/isabelahyeda) - [Linkedin](https://www.linkedin.com/in/isabelahyeda/)
+-   Leonardo Dias Monteiro | [GitHub](https://github.com/Leodias2204) - [Linkedin](https://www.linkedin.com/in/leonardo-dias-monteiro-54642264/)
+
+## Ex-Autor(es) 🙎🏻‍♂️
+
+-   Filipe Reis | [GitHub](https://github.com/FilipeLeoni) - [LinkedIn](https://www.linkedin.com/in/filipe-leoni-5745551a8/)
+-   Igor Gonçalves | [GitHub](https://github.com/igords-goncalves) - [Linkedin](https://www.linkedin.com/in/igords-goncalves/)
+- João Vitor Kremer | [GitHub](https://github.com/JoaoKremerDev) - [LinkedIn](https://www.linkedin.com/in/joaokremer/)
+-   Alberto Santos | [GitHub](https://github.com/allbertuu) - [LinkedIn](https://www.linkedin.com/in/albertov-albuquerque/) - [Portfólio](https://portfolio-allbertuu.vercel.app/)
+-   Carlos Junior | [GitHub](https://github.com/CarlosJunioor) - [LinkedIn](https://www.linkedin.com/in/carlosjuniordev/)
+-   Rafael Pires | [GitHub](https://github.com/RafaelPires2) - [Linkedin](https://www.linkedin.com/in/rafael-pires-075891212/)
+-   Silvia Luiza | [GitHub](https://github.com/SilviaLTeixeira) - [LinkedIn](https://www.linkedin.com/in/silvialuiza/)
+
 ## Feedback 💬
 
 Se você tiver algum feedback, por favor nos deixe saber por meio do nosso [site](https://soujunior.tech). Ou fazendo uma [contribuição](#contribuição-).

package.json

@@ -14,7 +14,8 @@
     "@emotion/styled": "^11.11.0",
     "@hookform/resolvers": "^2.9.10",
     "@mui/icons-material": "^5.15.13",
-    "@mui/material": "^5.15.13",
+    "@mui/material": "^5.16.6",
+    "@mui/styled-engine-sc": "^6.0.0-alpha.18",
     "@phosphor-icons/react": "^2.0.9",
     "@tiptap/extension-bubble-menu": "^2.0.0-beta.206",
     "@tiptap/extension-bullet-list": "^2.0.0-beta.209",
@@ -53,11 +54,11 @@
     "react-markdown": "^9.0.1",
     "react-number-format": "^5.1.4",
     "react-query": "^3.39.3",
-    "react-router-dom": "^6.3.0",
+    "react-router-dom": "^6.26.0",
     "react-scripts": "5.0.1",
     "react-toastify": "^9.1.1",
     "rehype-raw": "^7.0.0",
-    "styled-components": "^5.3.5",
+    "styled-components": "^6.1.12",
     "swiper": "^9.3.2",
     "tiptap": "^1.32.2",
     "uuid": "^9.0.0",

src/components/FooterDefault/styles.ts

@@ -9,6 +9,7 @@ export const Footer = styled.footer`
     display: flex;
     justify-content: center;
     padding: 25px 0;
+    background-color: white;
 
     .mobile-wrapper {
         display: none;

src/components/HeaderDefault/index.tsx

@@ -9,6 +9,7 @@ import JobFilter from './components/JobFilter';
 
 import * as S from './styles';
 import { CaretLeft } from 'phosphor-react';
+import Header from '../Header';
 
 interface HeaderProps {
     isActive: boolean;
@@ -61,7 +62,7 @@ const HeaderDefault: React.FC<HeaderProps> = ({ isActive }) => {
 
     const shouldShowJobFilter = (isActive && isLaptop) || feedJob;
     const isFeed = !isLaptop && feedJob;
-
+     
     return (
         <>
             {isMobileOpen && (

src/components/Home/HomeJobFilter/styles.ts

@@ -72,6 +72,7 @@ export const Input = styled.input`
     padding: 0 56px;
     color: #515151;
     background-color: transparent;
+    outline: none;
     text-overflow: ellipsis;
 
     ::placeholder {

src/components/JobFilterPerfil/index.tsx

@@ -0,0 +1,75 @@
+import { useState, useEffect } from 'react';
+import { useNavigate, useLocation, useSearchParams } from 'react-router-dom';
+
+import Search from '../../assets/imgs/search.svg';
+import Location from '../../assets/imgs/location.svg';
+
+import * as S from './styles';
+import SwitchButton from '../SwitchButton';
+
+
+const JobFilterPerfil = () => {
+    const [searchParams, setSearchParams] = useSearchParams();
+    const [searchTerm, setSearchTerm] = useState(searchParams.get('search') || '',);
+    const [location, setLocation] = useState(searchParams.get('location') || '',);
+    const [isSwitchChecked, setIsSwitchChecked] = useState(false);
+    const navigate = useNavigate();
+    const { pathname } = useLocation();
+
+    useEffect(() => {
+        setIsSwitchChecked(false);
+    }, [searchTerm, location]);
+
+    const handleSubmit = (event: any) => {
+        event.preventDefault();
+
+        if (pathname !== '/job') {
+            setSearchParams({});
+        };
+
+        navigate(`/candidate-portal/job?search=${searchTerm}&location=${location}`);
+    };
+
+    return (
+        <S.Container onSubmit={handleSubmit}>
+            <S.BoxInput>
+                <S.Input
+                    type="text"
+                    placeholder="Cargo, empresa, palavra-chave"
+                    maxLength={30}
+                    value={searchTerm}
+                    onChange={(event: any) => setSearchTerm(event.target.value)}
+                />
+
+                <S.BtnIcon name="search btn" onClick={handleSubmit}>
+                    <img src={Search} alt="search btn" />
+                </S.BtnIcon>
+            </S.BoxInput>
+
+            <S.BoxInput className="location">
+                <S.Input
+                    type="text"
+                    placeholder="Local"
+                    maxLength={30}
+                    value={location}
+                    onChange={(event: any) => setLocation(event.target.value)}
+                    className="location"
+                />
+
+                <S.BtnIcon className="location" name="location btn">
+                    <img src={Location} alt="location btn" />
+                </S.BtnIcon>
+
+            </S.BoxInput>
+
+            <SwitchButton
+                checked={isSwitchChecked}
+                onChange={(event: any) => setIsSwitchChecked(event.target.checked)}
+            />
+
+            {/* <S.Button type="submit">Pesquisar</S.Button> */}
+        </S.Container>
+    );
+};
+
+export default JobFilterPerfil;

src/components/JobFilterPerfil/styles.ts

@@ -0,0 +1,83 @@
+import styled from 'styled-components';
+
+export const Container = styled.form`
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 16px;
+    height: 100%;
+
+    @media (max-width: 1280px) {
+        .location {
+            display: none;
+        }
+    }
+
+    @media (max-width: 1024px) {
+        gap: 8px;
+    }
+
+    @media (max-width: 767px) {
+        width: 100%;
+    }
+`;
+
+export const BoxInput = styled.div`
+    display: flex;
+    align-items: center;
+    position: relative;
+    width: 256px;
+
+    @media (max-width: 767px) {
+        width: 100%;
+    }
+`;
+
+export const Input = styled.input`
+    position: relative;
+    width: 100%;
+    height: 45px;
+    padding: 0 16px 0 40px;
+    border: 1px solid #c1dfff;
+    background: #eff3f9;
+    border-radius: 42px;
+    font-size: 14px;
+    line-height: 120%;
+    color: #666666;
+    outline: none;
+
+    :focus {
+        outline-color: #1165ba;
+    }
+
+    @media (max-width: 767px) {
+        height: 36px;
+    }
+`;
+
+export const BtnIcon = styled.button`
+    position: absolute;
+    left: 14px;
+`;
+
+// export const Button = styled.button`
+//     width: 116px;
+//     height: 45px;
+//     border: none;
+//     border-radius: 24px;
+//     background: #003986;
+//     font-family: 'Radio Canada';
+//     font-size: 14px;
+//     line-height: 140%;
+//     color: #fff;
+//     cursor: pointer;
+//     transition: all 0.2s ease-in-out;
+
+//     &:hover {
+//         opacity: 0.8;
+//     }
+
+//     @media (max-width: 1024px) {
+//         display: none;
+//     }
+// `;

src/components/LoginCard/PopUpAntiFraudMessage/index.tsx

@@ -50,7 +50,7 @@ const PopUpAntiFraudMessage = () => {
                                 '& .MuiAlert-message': { width: "100%" },
                             }}
                         >
-                            <AlertTitle>
+                            <AlertTitle sx={{ marginTop: "6px" }}>
                                 Cuidado com fraudes de pessoas ou empresas que tentam se passar pela SouJunior! <Link sx={{ cursor: "pointer" }} underline="none" onClick={handleExpand}>Ler Mais</Link>.
                             </AlertTitle>
                         </Alert>

src/components/LoginCard/UserForms/index.tsx

@@ -72,10 +72,8 @@ export const UserForms = (props: any): JSX.Element => {
     const navigate = useNavigate();
     const auth: any = useContext(AuthContext);
 
-    // Recebe o tipo do usuário
     const userType = props.type;
 
-    // Define qual formulário deverá ser validado
     const getFormValidation =
         isLogin === 'login' ? schemaUserLoginForm : schemaUserRegisterForm;
 
@@ -89,12 +87,10 @@ export const UserForms = (props: any): JSX.Element => {
         resolver: yupResolver(getFormValidation),
     });
 
-    // Realiza o login e maniopula dados
     async function handleFormOnSubmit() {
         setIsFormSubmitted(true);
 
         try {
-            // Recebe dados do contexto para verificação
             await auth.login(email, password, userType);
             navigate('/candidate-portal');
             setPopUpAntiFraudOpen(true);
@@ -271,6 +267,7 @@ export const UserForms = (props: any): JSX.Element => {
                             placeholder="Digite seu nome completo"
                             aria-label="Nome do candidato"
                             maxLength={50}
+                            pattern="[A-Za-z\s]+"
                         ></Input>
                         <MessageError>
                             {errors.registerName && (
@@ -371,20 +368,22 @@ export const UserForms = (props: any): JSX.Element => {
                     </Checklist>
                     <InputContainer>
                         <Label>
-                            <CheckboxInput {...register('privacyTerms')} />
+                        <CheckboxInput
+                            id="privacyTerms"
+                            {...register('privacyTerms', {
+                                required: 'Você deve aceitar os termos de uso e política de privacidade.'
+                            })}
+                        />
                             <TermsLink>
-                                {/* TODO: Direcionar para as páginas correspondentes após criadas */}
                                 Li e aceito os <a onClick={handleTermsModal}>Termos de Uso</a> e{' '}
                                 <br /> <a onClick={handlePolicyModal}>Política de Privacidade</a>
                             </TermsLink>
                         </Label>
-                        {hasError && (
                             <MessageError2>
                                 {errors.privacyTerms && (
                                     <>{errors.privacyTerms.message}</>
                                 )}
                             </MessageError2>
-                        )}
                     </InputContainer>
                     <MessageError2>
                         {errorEmail && <>{errorEmail} </>}

src/components/Portal/Header/styles.ts

@@ -59,10 +59,9 @@ export const Name = styled.div`
 
     @media (max-width: 540px) {
         display: none;
-    }
-
-
+    }    
 `;
+
 export const Email = styled.div`
     font-size: 14px;
     font-weight: 400;

src/components/Portal/ProfileModal/ChangePasswordModal/index.tsx

@@ -20,12 +20,11 @@ const ChangePasswordModal = ({ setChangePasswordModal }: ChangePasswordModalProp
     const modalRef = useRef<HTMLDivElement | null>(null);
 
     const handleClick = () => {
-        setChangePasswordModal (false);
-        auth.user.type === 'USER' ?
-            (navigate('/candidate-portal'))
-            :
-            (navigate('/company-portal'))
-        setTimeout(() => window.location.reload(), 0)
+        setChangePasswordModal(false);
+        navigate('/change-password');
+        setTimeout(() => {
+            window.location.reload();
+        }, 0); 
         document.body.style.overflow = 'auto';
     }
 

src/components/Portal/ProfileModal/PolicyModal/index.tsx

@@ -21,6 +21,15 @@ const PolicyModal: React.FC<PolicyModalProps> = ({ setPolicyModal }) => {
         setPolicyModal(false);
     };
 
+    useEffect(() => {
+        const handleOutsideClick = (e: MouseEvent) => {
+          if (modalRef.current && e.target instanceof Node && !modalRef.current.contains(e.target)) {
+            setPolicyModal(false);
+          }
+        };
+        document.addEventListener('mousedown', handleOutsideClick);
+      }, []);
+
     return (
         <MaskBackground>
             <ModalContent ref={modalRef}>

src/components/Portal/ProfileModal/TermsModal/index.tsx

@@ -21,6 +21,15 @@ const TermsModal: React.FC<TermsModalProps> = ({ setTermsModal }) => {
         setTermsModal(false);
     };
 
+    useEffect(() => {
+        const handleOutsideClick = (e: MouseEvent) => {
+          if (modalRef.current && e.target instanceof Node && !modalRef.current.contains(e.target)) {
+            setTermsModal(false);
+          }
+        };
+        document.addEventListener('mousedown', handleOutsideClick);
+      }, []);
+
     return (
         <MaskBackground>
             <ModalContent ref={modalRef}>

src/components/SwitchButton/index.tsx

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import Switch from '@mui/material/Switch';
+import { Container } from './styles'; 
+
+interface SwitchButtonProps {
+  checked: boolean;
+  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+
+export default function SwitchButton({ checked, onChange }: SwitchButtonProps) {
+  const text = checked ? 'Alerta criado' : 'Alerta de vagas';
+
+  return (
+    <Container>
+      <h2>{text}</h2>
+      <Switch
+        checked={checked}
+        onChange={onChange}
+        inputProps={{ 'aria-label': 'controlled' }}
+      />
+    </Container>
+  );
+}