diff --git a/package-lock.json b/package-lock.json
index 065fd07..ad26060 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,6 +23,7 @@
"react": "18.3.1",
"react-dom": "18.3.1",
"react-native": "0.76.5",
+ "react-native-elements": "^3.4.3",
"react-native-gesture-handler": "~2.20.2",
"react-native-reanimated": "^3.16.6",
"react-native-safe-area-context": "4.12.0",
@@ -4278,6 +4279,41 @@
"@types/node": "*"
}
},
+ "node_modules/@types/prop-types": {
+ "version": "15.7.14",
+ "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz",
+ "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==",
+ "license": "MIT"
+ },
+ "node_modules/@types/react": {
+ "version": "18.3.18",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.18.tgz",
+ "integrity": "sha512-t4yC+vtgnkYjNSKlFx1jkAhH8LgTo2N/7Qvi83kdEaUtMDiwpbLAktKDaAMlRcJ5eSxZkH74eEGt1ky31d7kfQ==",
+ "license": "MIT",
+ "dependencies": {
+ "@types/prop-types": "*",
+ "csstype": "^3.0.2"
+ }
+ },
+ "node_modules/@types/react-native": {
+ "version": "0.70.19",
+ "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.70.19.tgz",
+ "integrity": "sha512-c6WbyCgWTBgKKMESj/8b4w+zWcZSsCforson7UdXtXMecG3MxCinYi6ihhrHVPyUrVzORsvEzK8zg32z4pK6Sg==",
+ "license": "MIT",
+ "dependencies": {
+ "@types/react": "*"
+ }
+ },
+ "node_modules/@types/react-native-vector-icons": {
+ "version": "6.4.18",
+ "resolved": "https://registry.npmjs.org/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.18.tgz",
+ "integrity": "sha512-YGlNWb+k5laTBHd7+uZowB9DpIK3SXUneZqAiKQaj1jnJCZM0x71GDim5JCTMi4IFkhc9m8H/Gm28T5BjyivUw==",
+ "license": "MIT",
+ "dependencies": {
+ "@types/react": "*",
+ "@types/react-native": "^0.70"
+ }
+ },
"node_modules/@types/stack-utils": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.3.tgz",
@@ -5701,6 +5737,12 @@
"integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==",
"license": "CC0-1.0"
},
+ "node_modules/csstype": {
+ "version": "3.1.3",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
+ "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+ "license": "MIT"
+ },
"node_modules/debug": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
@@ -8016,6 +8058,12 @@
"integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
"license": "MIT"
},
+ "node_modules/lodash.isequal": {
+ "version": "4.5.0",
+ "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+ "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+ "license": "MIT"
+ },
"node_modules/lodash.throttle": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
@@ -9142,6 +9190,15 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/opencollective-postinstall": {
+ "version": "2.0.3",
+ "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
+ "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==",
+ "license": "MIT",
+ "bin": {
+ "opencollective-postinstall": "index.js"
+ }
+ },
"node_modules/ora": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/ora/-/ora-3.4.0.tgz",
@@ -10134,6 +10191,52 @@
"node": ">=10"
}
},
+ "node_modules/react-native-elements": {
+ "version": "3.4.3",
+ "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.4.3.tgz",
+ "integrity": "sha512-VtZc25EecPZyUBER85zFK9ZbY6kkUdcm1ZwJ9hdoGSCr1R/GFgxor4jngOcSYeMvQ+qimd5No44OVJW3rSJECA==",
+ "hasInstallScript": true,
+ "license": "MIT",
+ "dependencies": {
+ "@types/react-native-vector-icons": "^6.4.6",
+ "color": "^3.1.2",
+ "deepmerge": "^4.2.2",
+ "hoist-non-react-statics": "^3.3.2",
+ "lodash.isequal": "^4.5.0",
+ "opencollective-postinstall": "^2.0.3",
+ "react-native-ratings": "8.0.4",
+ "react-native-size-matters": "^0.3.1"
+ },
+ "peerDependencies": {
+ "react-native-safe-area-context": ">= 3.0.0",
+ "react-native-vector-icons": ">7.0.0"
+ }
+ },
+ "node_modules/react-native-elements/node_modules/color": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/color/-/color-3.2.1.tgz",
+ "integrity": "sha512-aBl7dZI9ENN6fUGC7mWpMTPNHmWUSNan9tuWN6ahh5ZLNk9baLJOnSMlrQkHcrfFgz2/RigjUVAjdx36VcemKA==",
+ "license": "MIT",
+ "dependencies": {
+ "color-convert": "^1.9.3",
+ "color-string": "^1.6.0"
+ }
+ },
+ "node_modules/react-native-elements/node_modules/color-convert": {
+ "version": "1.9.3",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+ "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+ "license": "MIT",
+ "dependencies": {
+ "color-name": "1.1.3"
+ }
+ },
+ "node_modules/react-native-elements/node_modules/color-name": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
+ "license": "MIT"
+ },
"node_modules/react-native-gesture-handler": {
"version": "2.20.2",
"resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.20.2.tgz",
@@ -10150,6 +10253,19 @@
"react-native": "*"
}
},
+ "node_modules/react-native-ratings": {
+ "version": "8.0.4",
+ "resolved": "https://registry.npmjs.org/react-native-ratings/-/react-native-ratings-8.0.4.tgz",
+ "integrity": "sha512-Xczu5lskIIRD6BEdz9A0jDRpEck/SFxRqiglkXi0u67yAtI1/pcJC76P4MukCbT8K4BPVl+42w83YqXBoBRl7A==",
+ "license": "MIT",
+ "dependencies": {
+ "lodash": "^4.17.15"
+ },
+ "peerDependencies": {
+ "react": "*",
+ "react-native": "*"
+ }
+ },
"node_modules/react-native-reanimated": {
"version": "3.16.6",
"resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.16.6.tgz",
@@ -10198,6 +10314,15 @@
"react-native": "*"
}
},
+ "node_modules/react-native-size-matters": {
+ "version": "0.3.1",
+ "resolved": "https://registry.npmjs.org/react-native-size-matters/-/react-native-size-matters-0.3.1.tgz",
+ "integrity": "sha512-mKOfBLIBFBcs9br1rlZDvxD5+mAl8Gfr5CounwJtxI6Z82rGrMO+Kgl9EIg3RMVf3G855a85YVqHJL2f5EDRlw==",
+ "license": "MIT",
+ "peerDependencies": {
+ "react-native": "*"
+ }
+ },
"node_modules/react-native-svg": {
"version": "15.8.0",
"resolved": "https://registry.npmjs.org/react-native-svg/-/react-native-svg-15.8.0.tgz",
diff --git a/package.json b/package.json
index 3e91be9..025310c 100644
--- a/package.json
+++ b/package.json
@@ -17,12 +17,14 @@
"@react-navigation/native-stack": "^7.2.0",
"expo": "~52.0.23",
"expo-font": "~13.0.2",
+ "expo-linear-gradient": "~14.0.1",
"expo-splash-screen": "~0.29.18",
"expo-status-bar": "~2.0.0",
"nativewind": "^4.1.23",
"react": "18.3.1",
"react-dom": "18.3.1",
"react-native": "0.76.5",
+ "react-native-elements": "^3.4.3",
"react-native-gesture-handler": "~2.20.2",
"react-native-reanimated": "^3.16.6",
"react-native-safe-area-context": "4.12.0",
@@ -30,8 +32,7 @@
"react-native-svg": "15.8.0",
"react-native-svg-transformer": "^1.5.0",
"react-native-vector-icons": "^10.2.0",
- "react-native-web": "~0.19.13",
- "expo-linear-gradient": "~14.0.1"
+ "react-native-web": "~0.19.13"
},
"devDependencies": {
"@babel/core": "^7.20.0",
diff --git a/src/App.js b/src/App.js
index 8fb4cbe..6d1bd8e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -3,8 +3,10 @@ import { Text, View, StatusBar } from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
-import Icon from "react-native-vector-icons/Ionicons";
-import { Quicksand_400Regular, Quicksand_700Bold } from "@expo-google-fonts/quicksand";
+import {
+ Quicksand_400Regular,
+ Quicksand_700Bold,
+} from "@expo-google-fonts/quicksand";
import { useFonts } from "expo-font";
// Importar os ícones personalizados
@@ -23,6 +25,7 @@ import ProfilePage from "./pages/ProfilePage";
import HelpPage from "./pages/HelpPage";
import LoginPage from "./pages/LoginPage";
import RegisterPage from "./pages/RegisterPage";
+import FirstQuestionnaire from "./pages/FirstQuestionnaire";
export default function App() {
const [fontsLoaded] = useFonts({
@@ -77,7 +80,13 @@ export default function App() {
IconComponent = null;
}
- return ;
+ return (
+
+ );
},
tabBarActiveTintColor: "#fcc766",
tabBarInactiveTintColor: "#d0d0d0",
@@ -95,7 +104,6 @@ export default function App() {
// Stack Navigator (para gerenciar Welcome e HomeTabs)
return (
<>
-
{/* Tela de boas-vindas sem navbar */}
@@ -110,9 +118,14 @@ export default function App() {
options={{ headerShown: false }}
/>
+
{/* Tela HomeTabs com navbar */}
- Código
+ Código
{/* Bubble */}
-
+
Ainda não estás registado?
diff --git a/src/components/TermsAndConditionsModal.js b/src/components/TermsAndConditionsModal.js
new file mode 100644
index 0000000..cdccf04
--- /dev/null
+++ b/src/components/TermsAndConditionsModal.js
@@ -0,0 +1,68 @@
+import React from "react";
+import { View, Text, Modal, TouchableOpacity, ScrollView } from "react-native";
+import { FontAwesome } from "@expo/vector-icons";
+
+export default function TermsAndContitionsModal({
+ modalVisible,
+ setModalVisible,
+}) {
+ function CloseModal() {
+ setModalVisible(false);
+ }
+ return (
+
+ {/* Overlay */}
+
+
+
+
+ Termos e Condições
+
+
+ Lorem ipsum
+
+ Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+ incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+ veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
+ ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
+ voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+ Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
+ officia deserunt mollit anim id est laborum.
+
+ Lorem ipsum
+
+ Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+ incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+ veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
+ ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
+ voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+ Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
+ officia deserunt mollit anim id est laborum.
+
+ Lorem ipsum
+
+ Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+ incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+ veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
+ ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
+ voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+ Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
+ officia deserunt mollit anim id est laborum.
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/pages/FirstQuestionnaire.js b/src/pages/FirstQuestionnaire.js
new file mode 100644
index 0000000..d9dc0e1
--- /dev/null
+++ b/src/pages/FirstQuestionnaire.js
@@ -0,0 +1,9 @@
+import React from "react";
+import { View, Text, TouchableOpacity, TextInput } from "react-native";
+export default function FirstQuestionnaire() {
+ return (
+
+ First Questionnaire
+
+ );
+}
diff --git a/src/pages/LoginPage.js b/src/pages/LoginPage.js
index d9c6714..694193e 100644
--- a/src/pages/LoginPage.js
+++ b/src/pages/LoginPage.js
@@ -1,8 +1,9 @@
import React, { useState } from "react";
-import { View, Text, TextInput, TouchableOpacity, Image } from "react-native";
+import { View, Text, TextInput, TouchableOpacity } from "react-native";
import { FontAwesome } from "@expo/vector-icons";
import PasswordResetModal from "../components/PasswordResetModal";
import SpeechBubble from "../components/SpeechBubble";
+import { useNavigation } from "@react-navigation/native";
export default function LoginPage() {
//DB Simulation
@@ -30,6 +31,8 @@ export default function LoginPage() {
},
];
+ const navigation = useNavigation();
+
//State Variables
const [username, setUname] = useState("");
const [pass, setPass] = useState("");
@@ -57,6 +60,7 @@ export default function LoginPage() {
// !Falta a encriptação da password
console.log(username, pass);
clearLoginForm();
+ navigation.replace("HomeTabs");
} else {
console.log("Wrong password.");
}
diff --git a/src/pages/RegisterPage.js b/src/pages/RegisterPage.js
index 3e1c80d..d8685dc 100644
--- a/src/pages/RegisterPage.js
+++ b/src/pages/RegisterPage.js
@@ -1,12 +1,160 @@
-import React from "react";
-import { View, Text } from "react-native";
+import React, { useState } from "react";
+import {
+ View,
+ Text,
+ TouchableOpacity,
+ TextInput,
+ ScrollView,
+} from "react-native";
+import { CheckBox } from "react-native-elements";
+import { FontAwesome } from "@expo/vector-icons";
+import { useNavigation } from "@react-navigation/native";
+import TermsAndContitionsModal from "../components/TermsAndConditionsModal";
export default function RegisterPage() {
+ const navigation = useNavigation();
+
+ //DB Simulation
+ const Users = [];
+
+ const [username, setUname] = useState("");
+ const [email, setEmail] = useState("");
+ const [pass, setPass] = useState("");
+ const [passConf, setPassConf] = useState("");
+ const [idade, setIdade] = useState("");
+ const [isChecked, setIsChecked] = useState(false);
+ const [error, setError] = useState("");
+ const [hasError, setHasError] = useState(false);
+ const [modalVisible, setModalVisible] = useState(false);
+
+ function RedirectToLogin() {
+ navigation.replace("Login");
+ }
+
+ function handleRegistration() {
+ if (
+ username != "" &&
+ email != "" &&
+ idade != "" &&
+ pass != "" &&
+ passConf != ""
+ ) {
+ if (pass === passConf) {
+ if (isChecked) {
+ const user = {
+ id: Users.length,
+ User_name: username,
+ Pass: pass,
+ Email: email,
+ Idade: idade,
+ };
+ Users.push(user);
+ navigation.replace("FirstQuestionnaire");
+ }
+ } else {
+ setHasError(true);
+ setError("As passwords devem coincidir");
+ }
+ } else {
+ setHasError(true);
+ setError("Deve preencher todos os campos do formulário");
+ console.log(Users.length);
+ }
+ }
+
+ function QuestionnaireRedirect() {
+ navigation.replace("FirstQuestionnaire");
+ }
return (
<>
-
- Hello
-
+
+
+
+ {/* Page Title*/}
+
+ Register
+
+
+
+
+
+ {/*Form*/}
+
+ {/* Input do username */}
+
+
+
+
+
+
+ {/* Input da password */}
+
+
+ {/* Input da Confirm password */}
+
+
+
+ setIsChecked(!isChecked)}
+ checkedColor="#ff9d00"
+ size={20}
+ />
+ setModalVisible(true)}>
+
+ Termos e condições
+
+
+
+ {hasError && {error}}
+
+ {/* Botão do form */}
+
+
+ Criar Conta
+
+
+
+
>
);
}