diff --git a/craco.config.js b/craco.config.js
new file mode 100644
index 0000000..53cb819
--- /dev/null
+++ b/craco.config.js
@@ -0,0 +1,11 @@
+// craco.config.js
+module.exports = {
+ style: {
+ postcss: {
+ plugins: [
+ require('tailwindcss'),
+ require('autoprefixer'),
+ ],
+ },
+ },
+ }
\ No newline at end of file
diff --git a/package.json b/package.json
index 462ebed..2127989 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
"@capacitor/haptics": "1.1.4",
"@capacitor/keyboard": "1.2.2",
"@capacitor/status-bar": "1.0.8",
+ "@craco/craco": "^6.4.5",
"@hookform/error-message": "^2.0.0",
"@ionic-selectable/core": "^5.0.0-alpha.13",
"@ionic/react": "^6.0.0",
@@ -17,21 +18,23 @@
"@testing-library/user-event": "^12.6.3",
"@types/jest": "^26.0.20",
"@types/node": "^12.19.15",
- "@types/react": "^16.14.3",
- "@types/react-dom": "^16.9.10",
+ "@types/react": "^18.0.18",
+ "@types/react-dom": "^18.0.6",
"@types/react-router": "^5.1.11",
"@types/react-router-dom": "^5.1.7",
"axios": "^0.26.1",
+ "cross-env": "^7.0.3",
"ionicons": "^5.4.0",
"lodash.isequal": "^4.5.0",
"pigeon-maps": "^0.21.0",
"pullstate": "^1.24.0",
- "react": "^17.0.1",
- "react-dom": "^17.0.1",
+ "react": "^18.2.0",
+ "react-dom": "^18.2.0",
"react-google-places-autocomplete": "^3.4.0",
"react-hook-form": "^7.30.0",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
+ "react-scripts": "4.0.3",
"reselect": "^4.1.5",
"typescript": "^4.1.3",
"web-vitals": "^0.2.4",
@@ -50,8 +53,10 @@
"yup": "^0.32.11"
},
"scripts": {
- "start": "react-scripts start",
- "build": "react-scripts build",
+ "start": "cross-env TAILWIND_MODE=watch craco start",
+ "build": "craco build",
+ "ionic:serve": "cross-env TAILWIND_MODE=watch craco start",
+ "ionic:build": "craco build",
"test": "react-scripts test --transformIgnorePatterns 'node_modules/(?!(@ionic/react|@ionic/react-router|@ionic/core|@stencil/core|ionicons)/)'",
"eject": "react-scripts eject"
},
@@ -77,7 +82,9 @@
"@capacitor/cli": "3.4.3",
"@types/axios": "^0.14.0",
"@types/lodash.isequal": "^4.5.6",
- "react-scripts": "5.0.1"
+ "autoprefixer": "^9.8.8",
+ "postcss": "^7.0.39",
+ "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.17"
},
"description": "Projeto de conclusão de curso a fim de resolver a dificuldade de alunos universitários ao buscar vans para suas universidades"
}
diff --git a/postcss.config.js b/postcss.config.js
new file mode 100644
index 0000000..56dcb48
--- /dev/null
+++ b/postcss.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+ plugins: {
+ tailwindcss: {},
+ autoprefixer: {},
+ },
+ }
+
\ No newline at end of file
diff --git a/src/App.tsx b/src/App.tsx
index 68357e2..83b47eb 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,4 +1,4 @@
-import { Redirect, Route } from 'react-router-dom';
+import React, { useContext, useState } from "react";
import {
IonApp,
IonIcon,
@@ -7,109 +7,123 @@ import {
IonTabBar,
IonTabButton,
IonTabs,
- setupIonicReact
-} from '@ionic/react';
-import { IonReactRouter } from '@ionic/react-router';
+ setupIonicReact,
+} from "@ionic/react";
+import { IonReactRouter } from "@ionic/react-router";
+import { Redirect, Route } from "react-router-dom";
+
+import { home, person, search } from "ionicons/icons";
// importação das páginas
-import Cadastro from './pages/Cadastro/Cadastro';
-import Login from './pages/Login';
-import Home from './pages/Home';
-import Buscas from './pages/Buscas';
-import Perfil from './pages/Perfil';
-import PerfilEditar from './pages/PerfilEditar';
-import VeiculoCadastro from './pages/VeiculoCadastro';
-import CadastroCompletar from './pages/CadastroCompletar/CadastroCompletar';
-import CompletarDocumento from './pages/CadastroCompletar/CompletarDocumento';
-import CompletarTelefone from './pages/CadastroCompletar/CompletarTelefone';
-import Transportes from './pages/Transportes/Transportes';
-import BuscarPassageiro from './pages/BuscarPassageiro/BuscarPassageiro';
+import Cadastro from "./pages/Cadastro/Cadastro";
+import CadastroCompletar from "./pages/CadastroCompletar/CadastroCompletar";
+import CompletarDocumento from "./pages/CadastroCompletar/CompletarDocumento";
+import CompletarTelefone from "./pages/CadastroCompletar/CompletarTelefone";
+
+import Home from "./pages/Home";
+import Login from "./pages/Login";
+import Perfil from "./pages/Perfil";
+import PerfilEditar from "./pages/PerfilEditar";
+
+import VeiculoCadastro from "./pages/VeiculoCadastro";
+import MeusVeiculos from "./pages/MeusVeiculos";
+import CadastrarItinerario from "./pages/CadastrarItinerario/CadastrarItinerario";
+import MeusItinerarios from "./pages/MeusItinerarios/MeusItinerarios";
+
+import Buscas from "./pages/Buscas";
+import BuscarItinerario from "./pages/BuscarItinerario";
+import BuscarPassageiro from "./pages/BuscarPassageiro/BuscarPassageiro";
+import Transportes from "./pages/Transportes/Transportes";
/* Core CSS required for Ionic components to work properly */
-import '@ionic/react/css/core.css';
+import "@ionic/react/css/core.css";
/* Basic CSS for apps built with Ionic */
-import '@ionic/react/css/normalize.css';
-import '@ionic/react/css/structure.css';
-import '@ionic/react/css/typography.css';
+import "@ionic/react/css/normalize.css";
+import "@ionic/react/css/structure.css";
+import "@ionic/react/css/typography.css";
/* Optional CSS utils that can be commented out */
-import '@ionic/react/css/padding.css';
-import '@ionic/react/css/float-elements.css';
-import '@ionic/react/css/text-alignment.css';
-import '@ionic/react/css/text-transformation.css';
-import '@ionic/react/css/flex-utils.css';
-import '@ionic/react/css/display.css';
+import "@ionic/react/css/display.css";
+import "@ionic/react/css/flex-utils.css";
+import "@ionic/react/css/float-elements.css";
+import "@ionic/react/css/padding.css";
+import "@ionic/react/css/text-alignment.css";
+import "@ionic/react/css/text-transformation.css";
/* Theme variables */
-import './theme/variables.css';
+import "./theme/variables.css";
-// import Tabs from './components/Tabs';
-import { search, home, person } from 'ionicons/icons';
-import { useState, useContext } from 'react';
-import React from 'react';
-import MeusVeiculos from './pages/MeusVeiculos';
-import MeusItinerarios from './pages/MeusItinerarios/MeusItinerarios';
-import CadastrarItinerario from './pages/CadastrarItinerario/CadastrarItinerario';
-import BuscarItinerario from './pages/BuscarItinerario';
+/* Tailwind styles */
+import "./theme/tailwind.css";
setupIonicReact();
const routes = (
-<>
-
-
+ <>
+
+
+
+
-
+
+
+
+
-
+
-
-
-
-
-
+
+
+
+
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-)
+
+
+
+
+);
interface IUserManager {
setIsLoggedIn: Function;
}
const user: IUserManager = {
- setIsLoggedIn: () => {}
+ setIsLoggedIn: () => {},
};
export const UserContext = React.createContext(user);
const IonicApp: React.FC = () => {
-
const [isLoggedIn, setIsLoggedIn] = useState(false);
const user = useContext(UserContext);
user.setIsLoggedIn = setIsLoggedIn;
- return(
-
-
+ return (
+
+
{isLoggedIn ? (
{routes}
-
+
@@ -125,11 +139,13 @@ const IonicApp: React.FC = () => {
- ) : ({routes})}
+ ) : (
+ {routes}
+ )}
-
- )
-}
+
+ );
+};
const App: React.FC = () => {
return (
diff --git a/src/components/Tabs.tsx b/src/components/Tabs.tsx
deleted file mode 100644
index ceed0f0..0000000
--- a/src/components/Tabs.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from 'react';
-import { IonTabs, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/react';
-
-import { logInOutline, logInSharp, personOutline, personSharp } from 'ionicons/icons';
-
-interface AppTab {
- label: string;
- iosIcon: string;
- mdIcon: string;
- // badge: string;
-}
-
-const appPages: AppTab[] = [
- {
- label: 'Login',
- iosIcon: logInOutline,
- mdIcon: logInSharp,
- // badge: '',
- },
- {
- label: 'Cadastro',
- iosIcon: personOutline,
- mdIcon: personSharp,
- // badge: '',
- }
-]
-
-const Tabs: React.FC = () => {
- return (
-
-
- {appPages.map((appPage, index) => {
-
-
-
- {appPage.label}
-
-
-
- })}
-
- );
-}
-
-export default Tabs
\ No newline at end of file
diff --git a/src/pages/CadastrarItinerario/CadastrarItinerario.tsx b/src/pages/CadastrarItinerario/CadastrarItinerario.tsx
index 8bf2ab4..2072967 100644
--- a/src/pages/CadastrarItinerario/CadastrarItinerario.tsx
+++ b/src/pages/CadastrarItinerario/CadastrarItinerario.tsx
@@ -2,91 +2,54 @@ import {
IonBackButton,
IonButton,
IonButtons,
- IonCard,
- IonCardContent,
IonContent,
IonHeader,
IonIcon,
- IonItem,
- IonLabel,
- IonList,
- IonListHeader,
IonPage,
- IonRadio,
- IonRadioGroup,
IonTitle,
IonToolbar,
} from "@ionic/react";
import { close, locateOutline, locationOutline } from "ionicons/icons";
-import { useState } from "react";
import GooglePlacesAutocomplete from "react-google-places-autocomplete";
import { PageHeader } from "../../components/PageHeader";
export default function CadastrarItinerario() {
- const [selected, setSelected] = useState("");
-
return (
-
+
-
-
-
-
-
-
-
-
-
-
-
- setSelected(e.detail.value)}
- >
-
- Name
-
-
-
- Biff
-
-
-
-
- Griff
-
-
-
-
- Buford
-
-
-
-
-
- Cadastrar
-
-
-
+
+
Digite o endereço de onde você iniciará a rota do itinerário
+
+
+
+
+
+
+
+
+
+ Cadastrar
+
+