diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 88f220f..d7f224a 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,6 +1,6 @@
# Contributing to Ember
-***Thank you for considering contributing to Ember!***
+**_Thank you for considering contributing to Ember!_**
We welcome contributions from the community to help us make this project even better and more impactful. Whether you're a developer, designer, writer, or have other skills, your input is valuable.
diff --git a/README.md b/README.md
index e9c23ca..ab4833d 100644
--- a/README.md
+++ b/README.md
@@ -1,31 +1,32 @@
# Ember
-***A Carbon Footprint App with Monetisation Strategies***
+**_A Carbon Footprint App with Monetisation Strategies_**
![designs](assets/designs.png)
-
Welcome to Ember, your all-in-one platform for sustainable living.
-- We offer eco-friendly transit solutions, gamified sustainability challenges, a thriving community hub, incentives for green actions, a green marketplace, and carbon offset options.
+
+- We offer eco-friendly transit solutions, gamified sustainability challenges, a thriving community hub, incentives for green actions, a green marketplace, and carbon offset options.
- Our monetization strategies include advertisements, coupons, an eco-products marketplace, and location-based services.
-***Join us in the movement towards a greener future today!***
+**_Join us in the movement towards a greener future today!_**
### Mechanism
+
![Mechanism](assets/mechanism.png)
### Technology Stack
+
- Frontend: React-Native, TailwindCSS
- Backend: django REST
- Machine Learning: PyTorch
-
### Reference- Problem Statement
+
Urban areas face challenges like traffic congestion, air pollution, and carbon emissions due to increased private vehicle usage.
+
- To promote eco-friendly transportation options (walking, biking, carpooling, public transit), we need an innovative mobile app that uses gamification and social elements to motivate users, reduce private car dependence, and create
-sustainable cities.
+ sustainable cities.
- Daily challenges, leaderboards, and a supportive community foster engagement, while real-time incentives, optimized route planning, and carbon footprint tracking enhance the experience and environmental impact awareness.
- With an intuitive interface and seamless integration, the application must
-revolutionize urban commuting habits for greener, healthier, and vibrant spaces.
-
-
+ revolutionize urban commuting habits for greener, healthier, and vibrant spaces.
diff --git a/client/App.js b/client/App.js
index e67ec25..8298d42 100644
--- a/client/App.js
+++ b/client/App.js
@@ -1,6 +1,6 @@
-import React from 'react';
-import Navigation from './components/Navigation';
+import React from 'react'
+import Navigation from './components/Navigation'
export default function App() {
- return ;
-}
\ No newline at end of file
+ return
+}
diff --git a/client/app.config.js b/client/app.config.js
index 98a8a42..93eaa68 100644
--- a/client/app.config.js
+++ b/client/app.config.js
@@ -1,41 +1,40 @@
-import "dotenv/config";
+import 'dotenv/config'
export default {
- "expo": {
- "name": "client",
- "slug": "client",
- "version": "1.0.0",
- "orientation": "portrait",
- "icon": "./assets/ember.jpeg",
- "userInterfaceStyle": "light",
- "splash": {
- "image": "./assets/ember.jpeg",
- "resizeMode": "contain",
- "backgroundColor": "#ffffff"
+ expo: {
+ name: 'client',
+ slug: 'client',
+ version: '1.0.0',
+ orientation: 'portrait',
+ icon: './assets/ember.jpeg',
+ userInterfaceStyle: 'light',
+ splash: {
+ image: './assets/ember.jpeg',
+ resizeMode: 'contain',
+ backgroundColor: '#ffffff'
},
- "assetBundlePatterns": [
- "**/*"
- ],
- "ios": {
- "supportsTablet": true
+ assetBundlePatterns: ['**/*'],
+ ios: {
+ supportsTablet: true
},
- "android": {
- "adaptiveIcon": {
- "foregroundImage": "./assets/ember.jpeg",
- "backgroundColor": "#ffffff"
+ android: {
+ adaptiveIcon: {
+ foregroundImage: './assets/ember.jpeg',
+ backgroundColor: '#ffffff'
}
},
- "web": {
- "favicon": "./assets/ember.jpeg"
+ web: {
+ favicon: './assets/ember.jpeg'
},
- "plugins": [
+ plugins: [
[
- "expo-image-picker",
+ 'expo-image-picker',
{
- "photosPermission": "The app accesses your photos to let you share them with your friends."
+ photosPermission:
+ 'The app accesses your photos to let you share them with your friends.'
}
]
],
- "extra": {
+ extra: {
apiKey: process.env.API_KEY,
authDomain: process.env.AUTH_DOMAIN,
projectId: process.env.PROJECT_ID,
diff --git a/client/babel.config.js b/client/babel.config.js
index 98ac332..8cff467 100644
--- a/client/babel.config.js
+++ b/client/babel.config.js
@@ -1,7 +1,7 @@
module.exports = function (api) {
- api.cache(true);
+ api.cache(true)
return {
- presets: ["babel-preset-expo"],
- plugins: ["nativewind/babel", "react-native-reanimated/plugin"],
- };
-};
+ presets: ['babel-preset-expo'],
+ plugins: ['nativewind/babel', 'react-native-reanimated/plugin']
+ }
+}
diff --git a/client/components/Navigation.js b/client/components/Navigation.js
index 4debdcd..1b523c1 100644
--- a/client/components/Navigation.js
+++ b/client/components/Navigation.js
@@ -1,10 +1,10 @@
-import React from 'react';
-import { useAuth } from '../hooks/useAuth';
-import UserStack from './userStack';
-import AuthStack from './authStack';
+import React from 'react'
+import { useAuth } from '../hooks/useAuth'
+import UserStack from './userStack'
+import AuthStack from './authStack'
export default function Navigation() {
- const { user } = useAuth();
+ const { user } = useAuth()
- return user ? : ;
-}
\ No newline at end of file
+ return user ? :
+}
diff --git a/client/components/authStack.js b/client/components/authStack.js
index 24a8b18..7aad19b 100644
--- a/client/components/authStack.js
+++ b/client/components/authStack.js
@@ -1,33 +1,33 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
+import React from 'react'
+import { NavigationContainer } from '@react-navigation/native'
+import { createStackNavigator } from '@react-navigation/stack'
-import HomeScreen from "../screens/HomeScreen";
-import Login from "../screens/Login";
-import Signup from "../screens/Signup";
+import HomeScreen from '../screens/HomeScreen'
+import Login from '../screens/Login'
+import Signup from '../screens/Signup'
-const Stack = createStackNavigator();
+const Stack = createStackNavigator()
export default function AuthStack() {
- return (
-
-
-
-
-
-
-
- );
- }
+ return (
+
+
+
+
+
+
+
+ )
+}
diff --git a/client/components/userStack.js b/client/components/userStack.js
index ff04e7b..a5dadc8 100644
--- a/client/components/userStack.js
+++ b/client/components/userStack.js
@@ -1,53 +1,51 @@
-import React from 'react';
-import { NavigationContainer } from '@react-navigation/native';
-import { createStackNavigator } from '@react-navigation/stack';
+import React from 'react'
+import { NavigationContainer } from '@react-navigation/native'
+import { createStackNavigator } from '@react-navigation/stack'
-import Dashboard from '../screens/Dashboard';
-import TransitScreen from '../screens/TransitScreen';
-import Profile from '../screens/Profile';
-import Statistics from '../screens/Statistics';
-import Chat from '../screens/Chat';
-import Post from '../screens/Post';
+import Dashboard from '../screens/Dashboard'
+import TransitScreen from '../screens/TransitScreen'
+import Profile from '../screens/Profile'
+import Statistics from '../screens/Statistics'
+import Chat from '../screens/Chat'
+import Post from '../screens/Post'
-const Stack = createStackNavigator();
+const Stack = createStackNavigator()
export default function UserStack() {
- return (
-
-
-
-
-
-
-
-
-
-
-
- );
- }
-
\ No newline at end of file
+ return (
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/client/firebaseConfig.js b/client/firebaseConfig.js
index 63813fd..ca414e6 100644
--- a/client/firebaseConfig.js
+++ b/client/firebaseConfig.js
@@ -1,8 +1,8 @@
-import { initializeApp } from "firebase/app";
-import { getAuth } from "firebase/auth";
-import { getFirestore } from "firebase/firestore";
-import Constants from "expo-constants";
-import { getStorage } from "firebase/storage";
+import { initializeApp } from 'firebase/app'
+import { getAuth } from 'firebase/auth'
+import { getFirestore } from 'firebase/firestore'
+import Constants from 'expo-constants'
+import { getStorage } from 'firebase/storage'
const firebaseConfig = {
apiKey: Constants.expoConfig.extra.apiKey,
@@ -10,10 +10,10 @@ const firebaseConfig = {
projectId: Constants.expoConfig.extra.projectId,
storageBucket: Constants.expoConfig.extra.storageBucket,
messagingSenderId: Constants.expoConfig.extra.messagingSenderId,
- appId: Constants.expoConfig.extra.appId,
-};
+ appId: Constants.expoConfig.extra.appId
+}
-initializeApp(firebaseConfig);
-export const auth = getAuth();
-export const database = getFirestore();
-export const storage= getStorage();
\ No newline at end of file
+initializeApp(firebaseConfig)
+export const auth = getAuth()
+export const database = getFirestore()
+export const storage = getStorage()
diff --git a/client/hooks/useAuth.js b/client/hooks/useAuth.js
index d672092..d2cd332 100644
--- a/client/hooks/useAuth.js
+++ b/client/hooks/useAuth.js
@@ -1,26 +1,26 @@
-import React, { useEffect,useState } from "react";
-import { getAuth, onAuthStateChanged, User } from "firebase/auth";
-import { auth } from "../firebaseConfig";
+import React, { useEffect, useState } from 'react'
+import { getAuth, onAuthStateChanged, User } from 'firebase/auth'
+import { auth } from '../firebaseConfig'
export function useAuth() {
- const [user, setUser] = useState();
+ const [user, setUser] = useState()
useEffect(() => {
const unsubscribeFromAuthStateChanged = onAuthStateChanged(auth, (user) => {
if (user) {
// User is signed in, see docs for a list of available properties
// https://firebase.google.com/docs/reference/js/firebase.User
- setUser(user);
+ setUser(user)
} else {
// User is signed out
- setUser(undefined);
+ setUser(undefined)
}
- });
+ })
- return unsubscribeFromAuthStateChanged;
- }, []);
+ return unsubscribeFromAuthStateChanged
+ }, [])
return {
- user,
- };
-}
\ No newline at end of file
+ user
+ }
+}
diff --git a/client/metro.config.js b/client/metro.config.js
index 948c810..7ff83b8 100644
--- a/client/metro.config.js
+++ b/client/metro.config.js
@@ -1,6 +1,6 @@
-const { getDefaultConfig } = require('@expo/metro-config');
+const { getDefaultConfig } = require('@expo/metro-config')
-const defaultConfig = getDefaultConfig(__dirname);
-defaultConfig.resolver.sourceExts.push('cjs');
+const defaultConfig = getDefaultConfig(__dirname)
+defaultConfig.resolver.sourceExts.push('cjs')
-module.exports = defaultConfig;
+module.exports = defaultConfig
diff --git a/client/screens/Chat.js b/client/screens/Chat.js
index 7e90604..17f6f4e 100644
--- a/client/screens/Chat.js
+++ b/client/screens/Chat.js
@@ -1,41 +1,36 @@
-import React, {
- useState,
- useEffect,
- useLayoutEffect,
- useCallback,
-} from "react";
-import { TouchableOpacity, Text, View, StyleSheet } from "react-native";
+import React, { useState, useEffect, useLayoutEffect, useCallback } from 'react'
+import { TouchableOpacity, Text, View, StyleSheet } from 'react-native'
import {
GiftedChat,
Bubble,
InputToolbar,
- Send,
-} from "react-native-gifted-chat";
+ Send
+} from 'react-native-gifted-chat'
import {
collection,
addDoc,
orderBy,
query,
- onSnapshot,
-} from "firebase/firestore";
-import { signOut } from "firebase/auth";
-import { auth, database } from "../firebaseConfig";
-import { useNavigation } from "@react-navigation/native";
-import { AntDesign } from "@expo/vector-icons";
-import moment from "moment";
+ onSnapshot
+} from 'firebase/firestore'
+import { signOut } from 'firebase/auth'
+import { auth, database } from '../firebaseConfig'
+import { useNavigation } from '@react-navigation/native'
+import { AntDesign } from '@expo/vector-icons'
+import moment from 'moment'
export default function Chat() {
- const [messages, setMessages] = useState([]);
- const navigation = useNavigation();
+ const [messages, setMessages] = useState([])
+ const navigation = useNavigation()
const onSignOut = () => {
- signOut(auth).catch((error) => console.log("Error logging out: ", error));
- };
+ signOut(auth).catch((error) => console.log('Error logging out: ', error))
+ }
useLayoutEffect(() => {
navigation.setOptions({
headerRight: () => (
-
+
- ),
- });
- }, [navigation]);
+ )
+ })
+ }, [navigation])
useLayoutEffect(() => {
- const collectionRef = collection(database, "chats");
- const q = query(collectionRef, orderBy("createdAt", "desc"));
+ const collectionRef = collection(database, 'chats')
+ const q = query(collectionRef, orderBy('createdAt', 'desc'))
const unsubscribe = onSnapshot(q, (querySnapshot) => {
- console.log("querySnapshot unsubscribe");
+ console.log('querySnapshot unsubscribe')
setMessages(
querySnapshot.docs.map((doc) => ({
_id: doc.data()._id,
createdAt: doc.data().createdAt.toDate(),
text: doc.data().text,
- user: doc.data().user,
+ user: doc.data().user
}))
- );
- });
- return unsubscribe;
- }, []);
+ )
+ })
+ return unsubscribe
+ }, [])
const onSend = useCallback((messages = []) => {
setMessages((previousMessages) =>
GiftedChat.append(previousMessages, messages)
- );
+ )
- const { _id, createdAt, text, user } = messages[0];
- addDoc(collection(database, "chats"), {
+ const { _id, createdAt, text, user } = messages[0]
+ addDoc(collection(database, 'chats'), {
_id,
createdAt,
text,
- user,
- });
- }, []);
+ user
+ })
+ }, [])
const renderBubble = (props) => {
const formattedTime = moment(props.currentMessage.createdAt).format(
- "h:mm A"
- );
+ 'h:mm A'
+ )
return (
{props.currentMessage.text}
{formattedTime}
- );
- };
+ )
+ }
return (
onSend(messages)}
messagesContainerStyle={{
- backgroundColor: "#EEE7E1",
- borderRadius: 20,
+ backgroundColor: '#EEE7E1',
+ borderRadius: 20
}}
textInputStyle={{
- backgroundColor: "white",
+ backgroundColor: 'white',
borderRadius: 20,
paddingHorizontal: 12,
marginTop: 6,
borderWidth: 0.5,
- borderColor: "grey",
+ borderColor: 'grey'
}}
renderInputToolbar={(props) => (
)}
renderBubble={renderBubble}
user={{
_id: auth?.currentUser?.email,
- avatar: "https://i.pravatar.cc/700",
+ avatar: 'https://i.pravatar.cc/700'
}}
/>
- );
+ )
}
const styles = StyleSheet.create({
bubble: {
padding: 15,
borderRadius: 15,
- backgroundColor: "#f0f0f0",
+ backgroundColor: '#f0f0f0'
},
rightBubble: {
- backgroundColor: "#EDFFE0",
+ backgroundColor: '#EDFFE0'
},
timeText: {
fontSize: 10,
- color: "#888",
- marginTop: 3,
- },
-});
+ color: '#888',
+ marginTop: 3
+ }
+})
diff --git a/client/screens/Dashboard.js b/client/screens/Dashboard.js
index 1c174bb..8f9f211 100644
--- a/client/screens/Dashboard.js
+++ b/client/screens/Dashboard.js
@@ -152,16 +152,14 @@ const Dashboard = ({ navigation }) => {
- navigation.navigate('Post')}
- >
-
- Create Post
+ navigation.navigate('Post')}>
+
+ Create Post
diff --git a/client/screens/HomeScreen.js b/client/screens/HomeScreen.js
index 3921eea..8f5a06d 100644
--- a/client/screens/HomeScreen.js
+++ b/client/screens/HomeScreen.js
@@ -1,53 +1,53 @@
-import React from "react";
-import { View, Text, TouchableOpacity, Image } from "react-native";
-import { useNavigation } from "@react-navigation/native";
+import React from 'react'
+import { View, Text, TouchableOpacity, Image } from 'react-native'
+import { useNavigation } from '@react-navigation/native'
export default function HomeScreen() {
- const navigation = useNavigation();
+ const navigation = useNavigation()
const handleLoginPress = () => {
- navigation.navigate("Login");
- };
+ navigation.navigate('Login')
+ }
return (
-
+
ember
-
+
Get Started
{/* */}
- );
+ )
}
diff --git a/client/screens/Image.js b/client/screens/Image.js
index 3ba1983..6c7fc5a 100644
--- a/client/screens/Image.js
+++ b/client/screens/Image.js
@@ -1,95 +1,105 @@
-import React, { useState, useEffect } from 'react';
-import { View, Text, TextInput, TouchableOpacity, Image, StyleSheet, Alert,Platform,Button } from 'react-native';
-import { getDoc, setDoc, doc } from 'firebase/firestore';
-import { auth, database, storage } from '../firebaseConfig';
-import { AntDesign } from '@expo/vector-icons';
-import { useNavigation } from '@react-navigation/native';
-import * as ImagePicker from "expo-image-picker";
-import * as FileSystem from 'expo-file-system';
+import React, { useState, useEffect } from 'react'
+import {
+ View,
+ Text,
+ TextInput,
+ TouchableOpacity,
+ Image,
+ StyleSheet,
+ Alert,
+ Platform,
+ Button
+} from 'react-native'
+import { getDoc, setDoc, doc } from 'firebase/firestore'
+import { auth, database, storage } from '../firebaseConfig'
+import { AntDesign } from '@expo/vector-icons'
+import { useNavigation } from '@react-navigation/native'
+import * as ImagePicker from 'expo-image-picker'
+import * as FileSystem from 'expo-file-system'
export default function ImageUpload() {
- const [image, setImage] = useState(null);
- const [uploading, setUploading] = useState(false);
- const navigation = useNavigation(); // Initialize the useNavigation hook
+ const [image, setImage] = useState(null)
+ const [uploading, setUploading] = useState(false)
+ const navigation = useNavigation()
- const pickImage = async () => {
- // No permissions request is necessary for launching the image library
- let result = await ImagePicker.launchImageLibraryAsync({
- mediaTypes: ImagePicker.MediaTypeOptions.All,
- allowsEditing: true,
- aspect: [4, 3],
- quality: 1,
- });
-
- console.log(result);
-
- if (!result.canceled) {
- setImage(result.assets[0].uri);
- }
- };
-
- const uploadImage = async () => {
- setUploading(true);
- try {
+ const pickImage = async () => {
+ // No permissions request is necessary for launching the image library
+ let result = await ImagePicker.launchImageLibraryAsync({
+ mediaTypes: ImagePicker.MediaTypeOptions.All,
+ allowsEditing: true,
+ aspect: [4, 3],
+ quality: 1
+ })
+
+ console.log(result)
+
+ if (!result.canceled) {
+ setImage(result.assets[0].uri)
+ }
+ }
- const uri= await FileSystem.getInfoAsync(image);
- const blob = await new Promise((resolve, reject) => {
- const xhr = new XMLHttpRequest();
- xhr.onload = function() {
- resolve(xhr.response);
- };
- xhr.onerror = function(e) {
- console.log(e);
- reject(new TypeError("Network request failed"));
- };
- xhr.responseType = "blob";
- xhr.open("GET", uri, true);
- xhr.send(null);
- });
- const fileName = image.substring(image.lastIndexOf('/') + 1);
- const ref = storage.ref().child(fileName);
- const snapshot = await ref.put(blob);
- setUploading(false);
- Alert.alert("Success");
- setImage(null);
- blob.close();
+ const uploadImage = async () => {
+ setUploading(true)
+ try {
+ const uri = await FileSystem.getInfoAsync(image)
+ const blob = await new Promise((resolve, reject) => {
+ const xhr = new XMLHttpRequest()
+ xhr.onload = function () {
+ resolve(xhr.response)
}
- catch(err){
- console.log(err);
- setUploading(false);
+ xhr.onerror = function (e) {
+ console.log(e)
+ reject(new TypeError('Network request failed'))
}
+ xhr.responseType = 'blob'
+ xhr.open('GET', uri, true)
+ xhr.send(null)
+ })
+ const fileName = image.substring(image.lastIndexOf('/') + 1)
+ const ref = storage.ref().child(fileName)
+ const snapshot = await ref.put(blob)
+ setUploading(false)
+ Alert.alert('Success')
+ setImage(null)
+ blob.close()
+ } catch (err) {
+ console.log(err)
+ setUploading(false)
}
+ }
-
- return (
-
-
- {image && }
-
-
- Upload Image
-
-
-
- )
+ return (
+
+
+ {image && (
+
+ )}
+
+ Upload Image
+
+
+ )
}
const styles = StyleSheet.create({
- container: {
- flex: 1,
- alignItems: 'center',
- justifyContent: 'center',
- },
- uploadButton:{
- marginTop: 100,
- backgroundColor: 'red',
- paddingVertical: 10,
- paddingHorizontal: 20,
- borderRadius: 5,
- },
- uploadText:{
- color: 'white',
- fontSize: 20,
- fontWeight: 'bold',
- }
-});
+ container: {
+ flex: 1,
+ alignItems: 'center',
+ justifyContent: 'center'
+ },
+ uploadButton: {
+ marginTop: 100,
+ backgroundColor: 'red',
+ paddingVertical: 10,
+ paddingHorizontal: 20,
+ borderRadius: 5
+ },
+ uploadText: {
+ color: 'white',
+ fontSize: 20,
+ fontWeight: 'bold'
+ }
+})
diff --git a/client/screens/Login.js b/client/screens/Login.js
index f55644a..548b89c 100644
--- a/client/screens/Login.js
+++ b/client/screens/Login.js
@@ -1,49 +1,49 @@
-import React, { useState } from "react";
+import React, { useState } from 'react'
import {
View,
Image,
TextInput,
TouchableOpacity,
Text,
- StyleSheet,
-} from "react-native";
-import { signInWithEmailAndPassword } from "firebase/auth";
-import {auth} from "../firebaseConfig";
-import { CommonActions } from "@react-navigation/native";
+ StyleSheet
+} from 'react-native'
+import { signInWithEmailAndPassword } from 'firebase/auth'
+import { auth } from '../firebaseConfig'
+import { CommonActions } from '@react-navigation/native'
export default function Login({ navigation }) {
- const [email, setEmail] = useState("");
- const [password, setPassword] = useState("");
+ const [email, setEmail] = useState('')
+ const [password, setPassword] = useState('')
const handleLogin = async () => {
try {
- await signInWithEmailAndPassword(auth, email, password);
- console.log("User signed in successfully!");
+ await signInWithEmailAndPassword(auth, email, password)
+ console.log('User signed in successfully!')
// Navigate to the Dashboard screen upon successful login
navigation.dispatch(
CommonActions.reset({
index: 0,
- routes: [{ name: "Dashboard" }],
+ routes: [{ name: 'Dashboard' }]
})
- );
+ )
} catch (error) {
- console.error("Error signing in:", error.message);
+ console.error('Error signing in:', error.message)
}
- };
+ }
return (
Welcome!
@@ -64,39 +64,44 @@ export default function Login({ navigation }) {
Login
- Don't have an account? navigation.navigate("Signup")}>Sign Up
+
+ Don't have an account?{' '}
+ navigation.navigate('Signup')}>
+ Sign Up
+
+
- );
+ )
}
const styles = StyleSheet.create({
container: {
flex: 1,
- justifyContent: "center",
- alignItems: "center",
- backgroundColor: "white",
+ justifyContent: 'center',
+ alignItems: 'center',
+ backgroundColor: 'white'
},
input: {
height: 40,
- width: "75%",
- borderColor: "gray",
+ width: '75%',
+ borderColor: 'gray',
borderWidth: 1,
marginBottom: 20,
- padding: 10,
+ padding: 10
},
button: {
- backgroundColor: "blue",
+ backgroundColor: 'blue',
padding: 10,
- borderRadius: 10,
+ borderRadius: 10
},
buttonText: {
- color: "white",
+ color: 'white',
fontSize: 18,
- fontWeight: "bold",
+ fontWeight: 'bold'
},
loginText: {
marginTop: 10,
- color: "blue",
- fontSize: 16,
-},
-});
\ No newline at end of file
+ color: 'blue',
+ fontSize: 16
+ }
+})
diff --git a/client/screens/Profile.js b/client/screens/Profile.js
index c226d29..afafca7 100644
--- a/client/screens/Profile.js
+++ b/client/screens/Profile.js
@@ -1,171 +1,178 @@
-import React, { useState, useEffect } from 'react';
-import { View, Text, TextInput, TouchableOpacity, Image, StyleSheet, Alert,Platform,Button } from 'react-native';
-import { getDoc, setDoc, doc } from 'firebase/firestore';
-import { auth, database, storage } from '../firebaseConfig';
-import { AntDesign } from '@expo/vector-icons';
-import { useNavigation } from '@react-navigation/native';
-import ImageUpload from './Image';
+import React, { useState, useEffect } from 'react'
+import {
+ View,
+ Text,
+ TextInput,
+ TouchableOpacity,
+ Image,
+ StyleSheet,
+ Alert,
+ Platform,
+ Button
+} from 'react-native'
+import { getDoc, setDoc, doc } from 'firebase/firestore'
+import { auth, database, storage } from '../firebaseConfig'
+import { AntDesign } from '@expo/vector-icons'
+import { useNavigation } from '@react-navigation/native'
+import ImageUpload from './Image'
export default function Profile() {
- const navigation = useNavigation(); // Initialize the useNavigation hook
+ const navigation = useNavigation()
- const [profileData, setProfileData] = useState({
- user_id: '',
- username: '',
- profilePhoto: '',
- });
+ const [profileData, setProfileData] = useState({
+ user_id: '',
+ username: '',
+ profilePhoto: ''
+ })
- useEffect(() => {
- const fetchProfileData = async () => {
- try {
- const docRef = doc(database, 'profiles', auth.currentUser.email);
- const docSnap = await getDoc(docRef);
+ useEffect(() => {
+ const fetchProfileData = async () => {
+ try {
+ const docRef = doc(database, 'profiles', auth.currentUser.email)
+ const docSnap = await getDoc(docRef)
- if (docSnap.exists()) {
- setProfileData(docSnap.data());
- } else {
- console.log('No such document!');
- }
- } catch (error) {
- console.error('Error fetching profile data:', error);
- }
- };
+ if (docSnap.exists()) {
+ setProfileData(docSnap.data())
+ } else {
+ console.log('No such document!')
+ }
+ } catch (error) {
+ console.error('Error fetching profile data:', error)
+ }
+ }
- fetchProfileData();
- }, []);
+ fetchProfileData()
+ }, [])
- const updateProfile = async () => {
- try {
- const docRef = doc(database, 'profiles', auth.currentUser.email);
- await setDoc(docRef, profileData);
+ const updateProfile = async () => {
+ try {
+ const docRef = doc(database, 'profiles', auth.currentUser.email)
+ await setDoc(docRef, profileData)
- console.log('Profile updated successfully!');
- } catch (error) {
- console.error('Error updating profile:', error);
- }
- };
+ console.log('Profile updated successfully!')
+ } catch (error) {
+ console.error('Error updating profile:', error)
+ }
+ }
+
+ const handleChangeUsername = (text) => {
+ setProfileData((prevData) => ({
+ ...prevData,
+ username: text,
+ user_id: auth.currentUser.email
+ }))
+ }
- const handleChangeUsername = (text) => {
- setProfileData((prevData) => ({ ...prevData, username: text, user_id: auth.currentUser.email}));
- };
+ const navigateToDashboard = () => {
+ navigation.navigate('Dashboard')
+ }
- const navigateToDashboard = () => {
- navigation.navigate('Dashboard');
- };
+ return (
+
+
+
+
- return (
-
-
-
-
- {/*
- My Profile
-
- {profileData.username}
- {auth.currentUser.email}
- */}
- {/* Conditionally render the image
- or error message */}
-
- Username
-
-
- Update Username
-
-
-
- );
+
+ Username
+
+
+ Update Username
+
+
+
+ )
}
const styles = StyleSheet.create({
- container: {
- flex: 1,
- alignItems: 'center',
- justifyContent: 'center',
- },
- backButton: {
- position: 'absolute',
- top: 20,
- left: 20,
- },
- profileContainer: {
- alignItems: 'center',
- marginBottom: 30,
- },
- profilePhoto: {
- width: 150,
- height: 150,
- borderRadius: 75,
- marginBottom: 10,
- },
- username: {
- fontSize: 24,
- fontWeight: 'bold',
- marginBottom: 5,
- },
- email: {
- fontSize: 16,
- color: 'gray',
- marginBottom: 20,
- },
- formContainer: {
- width: '80%',
- alignItems: 'center',
- },
- label: {
- fontSize: 16,
- fontWeight: 'bold',
- marginBottom: 5,
- },
- input: {
- height: 40,
- width: '100%',
- borderColor: 'gray',
- borderWidth: 1,
- marginTop: 10,
- paddingHorizontal: 10,
- },
- button: {
- marginTop: 20,
- backgroundColor: 'blue',
- paddingVertical: 10,
- paddingHorizontal: 20,
- borderRadius: 5,
- },
- buttonText: {
- fontSize: 16,
- fontWeight: 'bold',
- color: 'white',
- },
- myProfileText: {
- fontSize: 20,
- fontWeight: 'bold',
- marginBottom: 10,
- },
- imageContainer: {
- borderRadius: 8,
- marginBottom: 16,
- shadowColor: "#000000",
- shadowOffset: { width: 0, height: 2 },
- shadowOpacity: 0.4,
- shadowRadius: 4,
- elevation: 5,
- },
- image: {
- width: 200,
- height: 200,
- borderRadius: 8,
- },
- errorText: {
- color: "red",
- marginTop: 16,
- },
- header: {
- fontSize: 20,
- marginBottom: 16,
- },
-});
+ container: {
+ flex: 1,
+ alignItems: 'center',
+ justifyContent: 'center'
+ },
+ backButton: {
+ position: 'absolute',
+ top: 20,
+ left: 20
+ },
+ profileContainer: {
+ alignItems: 'center',
+ marginBottom: 30
+ },
+ profilePhoto: {
+ width: 150,
+ height: 150,
+ borderRadius: 75,
+ marginBottom: 10
+ },
+ username: {
+ fontSize: 24,
+ fontWeight: 'bold',
+ marginBottom: 5
+ },
+ email: {
+ fontSize: 16,
+ color: 'gray',
+ marginBottom: 20
+ },
+ formContainer: {
+ width: '80%',
+ alignItems: 'center'
+ },
+ label: {
+ fontSize: 16,
+ fontWeight: 'bold',
+ marginBottom: 5
+ },
+ input: {
+ height: 40,
+ width: '100%',
+ borderColor: 'gray',
+ borderWidth: 1,
+ marginTop: 10,
+ paddingHorizontal: 10
+ },
+ button: {
+ marginTop: 20,
+ backgroundColor: 'blue',
+ paddingVertical: 10,
+ paddingHorizontal: 20,
+ borderRadius: 5
+ },
+ buttonText: {
+ fontSize: 16,
+ fontWeight: 'bold',
+ color: 'white'
+ },
+ myProfileText: {
+ fontSize: 20,
+ fontWeight: 'bold',
+ marginBottom: 10
+ },
+ imageContainer: {
+ borderRadius: 8,
+ marginBottom: 16,
+ shadowColor: '#000000',
+ shadowOffset: { width: 0, height: 2 },
+ shadowOpacity: 0.4,
+ shadowRadius: 4,
+ elevation: 5
+ },
+ image: {
+ width: 200,
+ height: 200,
+ borderRadius: 8
+ },
+ errorText: {
+ color: 'red',
+ marginTop: 16
+ },
+ header: {
+ fontSize: 20,
+ marginBottom: 16
+ }
+})
diff --git a/client/screens/Signup.js b/client/screens/Signup.js
index 820877d..6a2f265 100644
--- a/client/screens/Signup.js
+++ b/client/screens/Signup.js
@@ -1,102 +1,106 @@
-import React, { useState } from "react";
+import React, { useState } from 'react'
import {
- View,
- TextInput,
- TouchableOpacity,
- Text,
- StyleSheet,
- Image,
-} from "react-native";
-import { createUserWithEmailAndPassword } from "firebase/auth";
-import {auth} from "../firebaseConfig";
-import { CommonActions } from "@react-navigation/native";
+ View,
+ TextInput,
+ TouchableOpacity,
+ Text,
+ StyleSheet,
+ Image
+} from 'react-native'
+import { createUserWithEmailAndPassword } from 'firebase/auth'
+import { auth } from '../firebaseConfig'
+import { CommonActions } from '@react-navigation/native'
export default function Signup({ navigation }) {
- const [email, setEmail] = useState("");
- const [password, setPassword] = useState("");
+ const [email, setEmail] = useState('')
+ const [password, setPassword] = useState('')
- const handleSignup = async () => {
- try {
- await createUserWithEmailAndPassword(auth, email, password);
- console.log("User signed up successfully!");
+ const handleSignup = async () => {
+ try {
+ await createUserWithEmailAndPassword(auth, email, password)
+ console.log('User signed up successfully!')
- // Navigate to the Login screen upon successful signup
- navigation.dispatch(
- CommonActions.reset({
- index: 0,
- routes: [{ name: "Login" }],
- })
- );
- } catch (error) {
- console.error("Error signing up:", error.message);
- }
- };
+ navigation.dispatch(
+ CommonActions.reset({
+ index: 0,
+ routes: [{ name: 'Login' }]
+ })
+ )
+ } catch (error) {
+ console.error('Error signing up:', error.message)
+ }
+ }
- return (
-
-
-
- Welcome!
-
- setEmail(text)}
- value={email}
- />
- setPassword(text)}
- value={password}
- secureTextEntry
- />
-
- Signup
-
- Already have an account? navigation.navigate("Login")}>Login
-
- );
+ return (
+
+
+
+ Welcome!
+
+ setEmail(text)}
+ value={email}
+ />
+ setPassword(text)}
+ value={password}
+ secureTextEntry
+ />
+
+ Signup
+
+
+ Already have an account?{' '}
+ navigation.navigate('Login')}>
+ Login
+
+
+
+ )
}
const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: "center",
- alignItems: "center",
- backgroundColor: "white",
- },
- input: {
- height: 40,
- width: "75%",
- borderColor: "gray",
- borderWidth: 1,
- marginBottom: 20,
- padding: 10,
- },
- button: {
- backgroundColor: "blue",
- padding: 10,
- borderRadius: 10,
- },
- buttonText: {
- color: "white",
- fontSize: 18,
- fontWeight: "bold",
- },
- loginText: {
- marginTop: 10,
- color: "blue",
- fontSize: 16,
- },
-});
\ No newline at end of file
+ container: {
+ flex: 1,
+ justifyContent: 'center',
+ alignItems: 'center',
+ backgroundColor: 'white'
+ },
+ input: {
+ height: 40,
+ width: '75%',
+ borderColor: 'gray',
+ borderWidth: 1,
+ marginBottom: 20,
+ padding: 10
+ },
+ button: {
+ backgroundColor: 'blue',
+ padding: 10,
+ borderRadius: 10
+ },
+ buttonText: {
+ color: 'white',
+ fontSize: 18,
+ fontWeight: 'bold'
+ },
+ loginText: {
+ marginTop: 10,
+ color: 'blue',
+ fontSize: 16
+ }
+})
diff --git a/client/screens/Statistics.js b/client/screens/Statistics.js
index 2d0576a..4286db5 100644
--- a/client/screens/Statistics.js
+++ b/client/screens/Statistics.js
@@ -1,68 +1,65 @@
-// Assuming you are using a database like MongoDB with a profile collection
-
-// Import the necessary modules
-import React, { useState, useEffect } from 'react';
-import { View, Text, StyleSheet } from 'react-native';
-import { getDoc, collection, query, getDocs } from 'firebase/firestore';
-import { auth, database } from '../firebaseConfig';
+import React, { useState, useEffect } from 'react'
+import { View, Text, StyleSheet } from 'react-native'
+import { getDoc, collection, query, getDocs } from 'firebase/firestore'
+import { auth, database } from '../firebaseConfig'
export default function Statistics() {
- const [users, setUsers] = useState([]);
+ const [users, setUsers] = useState([])
- useEffect(() => {
- const fetchUsers = async () => {
- try {
- const usersRef = collection(database, 'profiles');
- const usersQuery = query(usersRef);
- const usersSnapshot = await getDocs(usersQuery);
+ useEffect(() => {
+ const fetchUsers = async () => {
+ try {
+ const usersRef = collection(database, 'profiles')
+ const usersQuery = query(usersRef)
+ const usersSnapshot = await getDocs(usersQuery)
- const usersData = [];
- usersSnapshot.forEach((doc) => {
- usersData.push(doc.data());
- });
+ const usersData = []
+ usersSnapshot.forEach((doc) => {
+ usersData.push(doc.data())
+ })
- setUsers(usersData);
- } catch (error) {
- console.error('Error fetching users:', error);
- }
- };
+ setUsers(usersData)
+ } catch (error) {
+ console.error('Error fetching users:', error)
+ }
+ }
- fetchUsers();
- }, []);
+ fetchUsers()
+ }, [])
- return (
-
- Statistics
- {users.map((user) => (
-
- {user.username}
-
- ))}
+ return (
+
+ Statistics
+ {users.map((user) => (
+
+ {user.username}
- );
+ ))}
+
+ )
}
const styles = StyleSheet.create({
- container: {
- flex: 1,
- alignItems: 'center',
- justifyContent: 'center',
- },
- title: {
- fontSize: 24,
- fontWeight: 'bold',
- marginBottom: 20,
- },
- userContainer: {
- marginBottom: 10,
- },
- username: {
- fontSize: 16,
- fontWeight: 'bold',
- marginBottom: 5,
- },
- email: {
- fontSize: 14,
- color: 'gray',
- },
-});
+ container: {
+ flex: 1,
+ alignItems: 'center',
+ justifyContent: 'center'
+ },
+ title: {
+ fontSize: 24,
+ fontWeight: 'bold',
+ marginBottom: 20
+ },
+ userContainer: {
+ marginBottom: 10
+ },
+ username: {
+ fontSize: 16,
+ fontWeight: 'bold',
+ marginBottom: 5
+ },
+ email: {
+ fontSize: 14,
+ color: 'gray'
+ }
+})
diff --git a/client/screens/TransitScreen.js b/client/screens/TransitScreen.js
index 5bfa414..1c84953 100644
--- a/client/screens/TransitScreen.js
+++ b/client/screens/TransitScreen.js
@@ -1,71 +1,71 @@
-import React, { useState, useEffect } from "react";
-import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
-import * as Location from "expo-location";
-import axios from "axios";
+import React, { useState, useEffect } from 'react'
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native'
+import * as Location from 'expo-location'
+import axios from 'axios'
const TransitScreen = () => {
- const [origin, setOrigin] = useState(null);
- const [destination, setDestination] = useState(null);
- const [distanceTraveled, setDistanceTraveled] = useState(null);
+ const [origin, setOrigin] = useState(null)
+ const [destination, setDestination] = useState(null)
+ const [distanceTraveled, setDistanceTraveled] = useState(null)
useEffect(() => {
- (async () => {
- let { status } = await Location.requestForegroundPermissionsAsync();
- if (status !== "granted") {
- console.error("Permission to access location was denied");
- return;
+ ;(async () => {
+ let { status } = await Location.requestForegroundPermissionsAsync()
+ if (status !== 'granted') {
+ console.error('Permission to access location was denied')
+ return
}
- let location = await Location.getCurrentPositionAsync({});
- setOrigin(`${location.coords.latitude},${location.coords.longitude}`);
- })();
- }, []);
+ let location = await Location.getCurrentPositionAsync({})
+ setOrigin(`${location.coords.latitude},${location.coords.longitude}`)
+ })()
+ }, [])
const handleStartJourney = async () => {
- let { status } = await Location.requestForegroundPermissionsAsync();
- if (status !== "granted") {
- console.error("Permission to access location was denied");
- return;
+ let { status } = await Location.requestForegroundPermissionsAsync()
+ if (status !== 'granted') {
+ console.error('Permission to access location was denied')
+ return
}
- let location = await Location.getCurrentPositionAsync({});
- setOrigin(`${location.coords.latitude},${location.coords.longitude}`);
- };
+ let location = await Location.getCurrentPositionAsync({})
+ setOrigin(`${location.coords.latitude},${location.coords.longitude}`)
+ }
const handleStopJourney = async () => {
- let { status } = await Location.requestForegroundPermissionsAsync();
- if (status !== "granted") {
- console.error("Permission to access location was denied");
- return;
+ let { status } = await Location.requestForegroundPermissionsAsync()
+ if (status !== 'granted') {
+ console.error('Permission to access location was denied')
+ return
}
- let location = await Location.getCurrentPositionAsync({});
- setDestination(`${location.coords.latitude},${location.coords.longitude}`);
+ let location = await Location.getCurrentPositionAsync({})
+ setDestination(`${location.coords.latitude},${location.coords.longitude}`)
const options = {
- method: "GET",
- url: "https://trueway-matrix.p.rapidapi.com/CalculateDrivingMatrix",
+ method: 'GET',
+ url: 'https://trueway-matrix.p.rapidapi.com/CalculateDrivingMatrix',
params: {
origins: origin,
- destinations: destination,
+ destinations: destination
},
headers: {
// Get your API key from https://rapidapi.com/trueway/api/trueway-matrix/
- "X-RapidAPI-Key": "API_KEY_HERE",
- "X-RapidAPI-Host": "trueway-matrix.p.rapidapi.com",
- },
- };
+ 'X-RapidAPI-Key': 'API_KEY_HERE',
+ 'X-RapidAPI-Host': 'trueway-matrix.p.rapidapi.com'
+ }
+ }
axios
.request(options)
.then((response) => {
- const distance = response.data.distances[0][0];
- setDistanceTraveled(distance);
+ const distance = response.data.distances[0][0]
+ setDistanceTraveled(distance)
})
.catch((error) => {
- console.error(error);
- });
- };
+ console.error(error)
+ })
+ }
return (
@@ -81,9 +81,9 @@ const TransitScreen = () => {
Distance Traveled: {distanceTraveled} meters
@@ -91,32 +91,32 @@ const TransitScreen = () => {
}
- );
-};
+ )
+}
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 16,
- justifyContent: "center",
+ justifyContent: 'center'
},
distanceInfoContainer: {
- marginTop: 20,
+ marginTop: 20
},
button: {
- backgroundColor: "blue",
+ backgroundColor: 'blue',
padding: 10,
borderRadius: 10,
- width: "20%",
- alignSelf: "center",
- marginBottom: 20,
+ width: '20%',
+ alignSelf: 'center',
+ marginBottom: 20
},
buttonText: {
- color: "white",
+ color: 'white',
fontSize: 18,
- fontWeight: "bold",
- textAlign: "center",
- },
-});
+ fontWeight: 'bold',
+ textAlign: 'center'
+ }
+})
-export default TransitScreen;
+export default TransitScreen
diff --git a/client/tailwind.config.js b/client/tailwind.config.js
index d23daeb..28fafa0 100644
--- a/client/tailwind.config.js
+++ b/client/tailwind.config.js
@@ -1,8 +1,8 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
- content: ["./App.{js,jsx,ts,tsx}"],
+ content: ['./App.{js,jsx,ts,tsx}'],
theme: {
- extend: {},
+ extend: {}
},
- plugins: [],
-};
+ plugins: []
+}