From 3c8e2043391ec3514f4370694d67d8533c0fd117 Mon Sep 17 00:00:00 2001 From: Matheus Albino Brunhara Date: Wed, 25 May 2022 17:06:39 -0500 Subject: [PATCH] =?UTF-8?q?Tabs=20agora=20aparecem=20somente=20para=20usu?= =?UTF-8?q?=C3=A1rios=20logados?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.tsx | 88 +++++++++++++++++++++++++------ src/pages/Cadastro/Cadastro.tsx | 4 +- src/pages/Login.tsx | 9 +++- src/pages/Perfil.css | 6 +++ src/pages/Perfil.tsx | 36 ++++++++++++- src/pages/PerfilEditar.tsx | 2 +- src/services/{ => api}/api.ts | 2 +- src/services/{ => api}/session.ts | 6 +-- src/services/{ => api}/users.ts | 6 +-- 9 files changed, 129 insertions(+), 30 deletions(-) rename src/services/{ => api}/api.ts (71%) rename src/services/{ => api}/session.ts (82%) rename src/services/{ => api}/users.ts (91%) diff --git a/src/App.tsx b/src/App.tsx index ffa29b8..2d5a17b 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,12 +1,16 @@ import { Redirect, Route } from 'react-router-dom'; import { IonApp, + IonIcon, + IonLabel, IonRouterOutlet, + IonTabBar, + IonTabButton, + IonTabs, setupIonicReact } from '@ionic/react'; import { IonReactRouter } from '@ionic/react-router'; import Cadastro from './pages/Cadastro/Cadastro'; -import MainPages from './pages/MainPages'; // importação das páginas import Login from './pages/Login'; @@ -31,26 +35,78 @@ import '@ionic/react/css/display.css'; import './theme/variables.css'; import Perfil from './pages/Perfil'; import PerfilEditar from './pages/PerfilEditar'; +import { search, home, person } from 'ionicons/icons'; +import { useState, useContext, useEffect } from 'react'; +import React from 'react'; setupIonicReact(); -const App: React.FC = () => ( +const routes = ( + <> + + + + + + + + ) + +interface IUserManager { + setIsLoggedIn: Function; +} + +const user: IUserManager = { + setIsLoggedIn: () => {} +}; + +export const UserContext = React.createContext(user); + +const IonicApp: React.FC = () => { + const [isLoggedIn, setIsLoggedIn] = useState(false); + const user = useContext(UserContext); + + user.setIsLoggedIn = setIsLoggedIn; + + useEffect(() => { + // TODO, verifica se usuário está logado + // fazer com serviço externo (evita duplicações) + }) + + return( - - - - - - - - - - - - - + {isLoggedIn ? ( + + {routes} + + + + + Buscar + + + + Home + + + + Perfil + + + + ) : ({routes})} + -); + ) +} + +const App: React.FC = () => { + return ( + + + + ); +}; export default App; diff --git a/src/pages/Cadastro/Cadastro.tsx b/src/pages/Cadastro/Cadastro.tsx index 2a21052..184691a 100644 --- a/src/pages/Cadastro/Cadastro.tsx +++ b/src/pages/Cadastro/Cadastro.tsx @@ -5,7 +5,7 @@ import { useEffect, useState } from 'react'; import { useHistory, useParams } from 'react-router'; import './Cadastro.css'; import ModalExample from '../../components/Email'; -import * as UsersService from '../../services/users' +import * as UsersService from '../../services/api/users' const Cadastro: React.FC = () => { const history = useHistory(); @@ -114,7 +114,7 @@ const Cadastro: React.FC = () => { - + diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx index 0a7f44b..afa8665 100644 --- a/src/pages/Login.tsx +++ b/src/pages/Login.tsx @@ -5,7 +5,7 @@ import { IonTitle, IonToolbar } from "@ionic/react"; -import React, { useState } from "react"; +import React, { useContext, useState } from "react"; import { IonGrid, IonRow, IonCol, IonToast } from "@ionic/react"; import { useHistory } from "react-router-dom"; import { @@ -15,9 +15,10 @@ import { IonButton, } from "@ionic/react"; -import * as sessionRoutes from '../services/session'; +import * as sessionRoutes from '../services/api/session'; import LocalStorage from '../LocalStorage'; import { Action } from "../components/Action"; +import { UserContext } from "../App"; const Page: React.FC = () => { const [showToast, setShowToast] = useState(false); @@ -27,6 +28,8 @@ const Page: React.FC = () => { const [email, setEmail] = useState("matheusalb3213@gmail.com"); const [password, setPassword] = useState("12345678"); + const user = useContext(UserContext); + function validateEmail(email: string) { const re = // eslint-disable-next-line no-control-regex @@ -84,6 +87,8 @@ const Page: React.FC = () => { LocalStorage.setToken(token); + user.setIsLoggedIn(true); + history.push({ pathname: '/home' }); }).catch(error => { // if (!error.response) return diff --git a/src/pages/Perfil.css b/src/pages/Perfil.css index 65cb3ee..f1080b7 100644 --- a/src/pages/Perfil.css +++ b/src/pages/Perfil.css @@ -1,3 +1,9 @@ #avatar { border-radius: 50%; + width: 64px; + height: 64px; +} + +IonIcon { + color: blue; } \ No newline at end of file diff --git a/src/pages/Perfil.tsx b/src/pages/Perfil.tsx index 17993c0..bce71b4 100644 --- a/src/pages/Perfil.tsx +++ b/src/pages/Perfil.tsx @@ -3,11 +3,17 @@ import { IonCardContent, IonCardHeader, IonCardTitle, + IonChip, IonContent, IonFab, IonFabButton, + IonGrid, IonHeader, IonIcon, + IonItem, + IonLabel, + IonList, + IonListHeader, IonPage, IonTitle, IonToast, @@ -18,8 +24,8 @@ import React, { useState, useEffect, useReducer } from "react"; import { IonRow, IonCol } from "@ionic/react"; import { createOutline } from "ionicons/icons"; -import * as sessionRoutes from '../services/session'; -import * as usersRoutes from '../services/users'; +import * as sessionRoutes from '../services/api/session'; +import * as usersRoutes from '../services/api/users'; import './Perfil.css' import LocalStorage from "../LocalStorage"; @@ -137,6 +143,32 @@ const Perfil: React.FC = () => { + + + Status do perfil + + Passageiro + + + + + + Dashboard + + + Confirmar perfil + + + Cadastrar Van + + + Pagamentos + + + Avaliações + + + history.push({ pathname: '/perfil/editar', state: { userData: inputValues } })}> diff --git a/src/pages/PerfilEditar.tsx b/src/pages/PerfilEditar.tsx index 8b9ca95..c2cefaa 100644 --- a/src/pages/PerfilEditar.tsx +++ b/src/pages/PerfilEditar.tsx @@ -25,7 +25,7 @@ import { saveOutline } from "ionicons/icons"; import isEqual from 'lodash.isequal'; -import * as usersRoutes from '../services/users'; +import * as usersRoutes from '../services/api/users'; import './Cadastro/Cadastro.css' diff --git a/src/services/api.ts b/src/services/api/api.ts similarity index 71% rename from src/services/api.ts rename to src/services/api/api.ts index 909f183..70062b2 100644 --- a/src/services/api.ts +++ b/src/services/api/api.ts @@ -1,5 +1,5 @@ import axios from 'axios'; -import apiConfig from '../config/api.config'; +import apiConfig from '../../config/api.config'; const instance = axios.create({ baseURL: apiConfig.getBaseUrl(), diff --git a/src/services/session.ts b/src/services/api/session.ts similarity index 82% rename from src/services/session.ts rename to src/services/api/session.ts index efa3635..ba8118a 100644 --- a/src/services/session.ts +++ b/src/services/api/session.ts @@ -1,6 +1,6 @@ -import instance from '../services/api'; -import sessionRoutes from '../constants/routes/sessionRoutes'; -import LocalStorage from '../LocalStorage'; +import instance from './api'; +import sessionRoutes from '../../constants/routes/sessionRoutes'; +import LocalStorage from '../../LocalStorage'; import { AxiosRequestHeaders } from 'axios'; let token: string | null; diff --git a/src/services/users.ts b/src/services/api/users.ts similarity index 91% rename from src/services/users.ts rename to src/services/api/users.ts index 9146158..424190a 100644 --- a/src/services/users.ts +++ b/src/services/api/users.ts @@ -1,9 +1,9 @@ -import instance from '../services/api'; +import instance from './api'; // import LocalStorage from '../LocalStorage'; -import userRoutes from '../constants/routes/usersRoutes'; +import userRoutes from '../../constants/routes/usersRoutes'; import { AxiosRequestHeaders } from 'axios'; -import LocalStorage from '../LocalStorage'; +import LocalStorage from '../../LocalStorage'; let token: string; let header: AxiosRequestHeaders;