Bugfix/adjusts header style

src/App.tsx

@@ -1,13 +1,11 @@
 import React from 'react';
 
-import Header from './components/Header/Header';
 import Routes from './routes';
 import GlobalStyle from './styles/global';
 
 function App() {
   return (
     <>
-      <Header />
       <Routes />
       <GlobalStyle />
     </>

src/DTOs/User.tsx

@@ -0,0 +1,5 @@
+export interface IUser {
+  name: string;
+  username: string;
+  email: string;
+}

src/DTOs/index.tsx

@@ -0,0 +1,2 @@
+export * from './User';
+export * from './Minute';

src/components/Header/Header.tsx → src/components/Header/index.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { useHistory } from 'react-router-dom';
 
 import addIcon from '../../assets/add_icon.svg';
 import homeIcon from '../../assets/home_icon.svg';
@@ -8,10 +9,19 @@ import logoutIcon from '../../assets/logout_icon.svg';
 import { StyledHeader } from './styles';
 
 const Header = () => {
+  const history = useHistory();
+
+  const handleNavigateToHome = () => {
+    history.push('/');
+  };
+
   return (
     <StyledHeader>
       <section className="shortOptions">
-        <img src={homeIcon} alt="" />
+        <button type="button" onClick={handleNavigateToHome}>
+          <img src={homeIcon} alt="" />
+        </button>
+
         <img src={addIcon} alt="" />
       </section>
 

src/components/Header/styles.ts

@@ -33,4 +33,15 @@ export const StyledHeader = styled.header`
       width: 14.375rem;
     }
   }
+
+  button {
+    border: none;
+    background: none;
+  }
+
+  .shortOptions {
+    max-width: 150px;
+    width: 100%;
+    justify-content: flex-start;
+  }
 `;

src/components/Route/index.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+
+import Header from 'components/Header';
+
+import { Route as ReactRoute } from 'react-router-dom';
+
+interface RouteProps {
+  component: Function;
+  path: string;
+  exact?: boolean;
+  isPrivate?: boolean;
+}
+
+const Route = ({ component: Component, isPrivate, ...rest }: RouteProps) => {
+  return (
+    <ReactRoute
+      {...rest}
+      render={() => {
+        return (
+          <>
+            {isPrivate && <Header />}
+            <Component />
+          </>
+        );
+      }}
+    />
+  );
+};
+
+Route.defaultProps = {
+  exact: false,
+  isPrivate: false,
+};
+
+export default Route;

src/components/Select/Select.tsx

@@ -0,0 +1,39 @@
+import React, { SelectHTMLAttributes } from 'react';
+import { StyledSelect } from './styles';
+
+interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+    title: string;
+    color?: string;
+    Size?: string;
+    styleWidth?: string;
+}
+
+const Select: React.FC<SelectProps> = ({
+    title,
+    id,
+    color,
+    Size,
+    styleWidth,
+    ...rest
+  }: SelectProps) => {
+    return (
+      <StyledSelect
+        SelectWidth={styleWidth || '23.75rem'}
+        Color={color || 'var(--black)'}
+        Size={Size || '1.5rem'}
+      >
+        <h3>{title}</h3>
+
+        <select name={title} id={id} {...rest} />
+
+      </StyledSelect>
+    );
+  };
+
+  Select.defaultProps = {
+    Size: '',
+    styleWidth: '23.75rem',
+    color: '',
+  };
+
+  export default Select;

src/components/Select/styles.ts

@@ -0,0 +1,36 @@
+import styled from 'styled-components';
+
+interface Props {
+    SelectWidth: string;
+    Color: string;
+    Size: string;
+  }
+
+export const StyledSelect = styled.div<Props>`
+  display: flex;
+  flex-direction: column;
+
+  width: ${props => props.SelectWidth || '23.75rem'};
+
+  margin: 0;
+
+  select {
+    display: flex;
+    align-items: center;
+    padding-left: 0.625rem;
+    height: 4.063rem;
+    background-color: var(--soft-gray);
+
+    font-family: Roboto;
+    font-size: 1.3rem;
+    font-style: normal;
+    font-weight: bold;
+
+    outline: none;
+    border: 0;
+    border-radius: 1.25rem;
+
+    width: ${props => props.SelectWidth || '23.75rem'}
+  }
+
+`;

src/contexts/AuthContext.tsx

@@ -0,0 +1,35 @@
+import React, { createContext, useState } from 'react';
+
+import { IUser } from 'DTOs';
+
+interface IAuthProvider {
+  children: React.ReactNode;
+}
+
+interface IAuthContextData {
+  user: any;
+  setUser: Function;
+}
+
+export const AuthContext = createContext({} as IAuthContextData);
+
+export const AuthProvider: React.FC<IAuthProvider> = ({
+  children,
+}: IAuthProvider) => {
+  const [user, setUser] = useState<IUser>({
+    name: '',
+    username: '',
+    email: '',
+  });
+
+  return (
+    <AuthContext.Provider
+      value={{
+        user,
+        setUser,
+      }}
+    >
+      {children}
+    </AuthContext.Provider>
+  );
+};

src/contexts/MainContext.tsx

@@ -1,14 +1,64 @@
-import React, { createContext } from 'react';
+import React, { createContext, useState } from 'react';
 
-export const MainContext = createContext({});
+import {
+  ITopic,
+  IAddressAndHour,
+  IProjectInfo,
+  ISubject,
+} from 'DTOs';
 
-interface IMainContext {
+interface IMainProvider {
   children: React.ReactNode;
 }
 
-export const MainProvider: React.FC<IMainContext> = ({ children }: IMainContext) => {
+interface IMainContextData {
+  topics: Array<ITopic>;
+  setTopics: Function;
+  showSchedule: Boolean;
+  setShowSchedule: Function;
+  addressAndHour: IAddressAndHour;
+  setAddressAndHour: Function;
+  projectInfo: IProjectInfo;
+  setProjectInfo: Function;
+  subjects: ISubject[];
+  setSubjects: Function;
+  distributions: string[];
+  setDistributions: Function;
+}
+
+export const MainContext = createContext({} as IMainContextData);
+
+export const MainProvider: React.FC<IMainProvider> = ({ children }: IMainProvider) => {
+  const [topics, setTopics] = useState<ITopic[]>([]);
+  const [showSchedule, setShowSchedule] = useState(false);
+  const [addressAndHour, setAddressAndHour] = useState<IAddressAndHour>({
+    local: '',
+    startDate: '',
+    startHour: '',
+  });
+  const [projectInfo, setProjectInfo] = useState<IProjectInfo>({
+    projectName: '',
+    members: [],
+  });
+  const [subjects, setSubjects] = useState<ISubject[]>([]);
+  const [distributions, setDistributions] = useState<string[]>([]);
+
   return (
-    <MainContext.Provider value="teste">
+    <MainContext.Provider value={{
+      topics,
+      setTopics,
+      showSchedule,
+      setShowSchedule,
+      addressAndHour,
+      setAddressAndHour,
+      projectInfo,
+      setProjectInfo,
+      subjects,
+      setSubjects,
+      distributions,
+      setDistributions,
+    }}
+    >
       {children}
     </MainContext.Provider>
   );

src/pages/Home/index.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { useHistory } from 'react-router-dom';
+
+import { Container } from './styles';
+
+const Home = () => {
+  const history = useHistory();
+
+  const handleNavigate = () => {
+    history.push('/minute');
+  };
+
+  return (
+    <Container>
+      Home asd123 12312
+      <button type="button" onClick={handleNavigate}>
+        Teste
+      </button>
+    </Container>
+  );
+};
+
+export default Home;

src/pages/Home/styles.ts

@@ -0,0 +1,3 @@
+import styled from 'styled-components';
+
+export const Container = styled.div``;

src/pages/InviteUsers/index.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+
+import Input from 'components/Input/Input';
+import Button from 'components/Button/Button';
+import Select from 'components/Select/Select';
+
+import StyleInviteUsers from './styles';
+
+function index() {
+    return (
+      <StyleInviteUsers>
+        <h1>Convidar Participante</h1>
+
+        <div className="EmailAndPermission">
+          <Input
+            title="E-mail"
+            color="black"
+            Size="large"
+            styleWidth="41.875rem"
+          />
+
+          <Select
+            title="Nível de permissão"
+            color="black"
+            styleWidth="41.875rem"
+          >
+            <option value="Admin">Administrador</option>
+            <option value="Manager">Gerente</option>
+            <option value="Normal">Comum</option>
+
+          </Select>
+
+          <Button
+            color="var(--black)"
+            colorText="white"
+            size="23.75rem"
+          >
+            Convidar
+
+          </Button>
+
+        </div>
+      </StyleInviteUsers>
+    );
+}
+
+export default index;