Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[65]added questions page #32

Merged
merged 3 commits into from
Nov 30, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 69 additions & 21 deletions frontend/src/components/appNavigation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import LogInScreen from '../screens/login';
import SignUpScreen from '../screens/signup';
import DashBoardScreen from '../screens/dashboard';
import Forum from '../screens/forum';
import SignUpQuestions from '../screens/signUpQuestions';
import FoodForum from '../screens/Food/foodForum';
import EnergyForum from '../screens/Energy/energyForum';
import TransportationForum from '../screens/Transportation/transportationForum';
Expand All @@ -28,7 +29,6 @@ const Tab = createBottomTabNavigator();

const AppNavigation = (): JSX.Element => {
return (

<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} options={{ headerShown: false }} />
Expand All @@ -37,24 +37,52 @@ const AppNavigation = (): JSX.Element => {
<Stack.Screen name="Settings" component={SettingsScreen} />
<Stack.Screen name="MainApp" component={MainAppTabs} options={{ headerShown: false }} />

<Stack.Screen name="Forum" component={Forum} options={{ headerShown: false }} />
<Stack.Screen name="Forum" component={Forum} options={{ headerShown: false }} />

<Stack.Screen name="TransportationForum" component={TransportationForum} options={{ headerShown: false }}/>
<Stack.Screen name="TransportationEntryEdit" component={TransportationEntryEdit} options={{ headerShown: false }} />
<Stack.Screen name="TransportationHistory" component={TransportationHistory} options={{ headerShown: false }} />
<Stack.Screen
name="TransportationForum"
component={TransportationForum}
options={{ headerShown: false }}
/>
<Stack.Screen
name="TransportationEntryEdit"
component={TransportationEntryEdit}
options={{ headerShown: false }}
/>
<Stack.Screen
name="TransportationHistory"
component={TransportationHistory}
options={{ headerShown: false }}
/>

<Stack.Screen name="FoodForum" component={FoodForum} options={{ headerShown: false }} />
<Stack.Screen name="FoodEntryEdit" component={FoodEntryEdit} options={{ headerShown: false }}/>
<Stack.Screen
name="FoodEntryEdit"
component={FoodEntryEdit}
options={{ headerShown: false }}
/>
<Stack.Screen name="FoodHistory" component={FoodHistory} options={{ headerShown: false }} />

<Stack.Screen name="EnergyForum" component={EnergyForum} options={{ headerShown: false }} />
<Stack.Screen name="EnergyEntryEdit" component={EnergyEntryEdit} options={{ headerShown: false }} />
<Stack.Screen name="EnergyHistory" component={EnergyHistory} options={{ headerShown: false }} />

<Stack.Screen
name="EnergyEntryEdit"
component={EnergyEntryEdit}
options={{ headerShown: false }}
/>
<Stack.Screen
name="EnergyHistory"
component={EnergyHistory}
options={{ headerShown: false }}
/>
<Stack.Screen
name="SignUpQuestions"
component={SignUpQuestions}
options={{ headerShown: false }}
/>
</Stack.Navigator>
</NavigationContainer>
</NavigationContainer>
);
}
};

const MainAppTabs = (): JSX.Element => {
return (
Expand All @@ -67,8 +95,9 @@ const MainAppTabs = (): JSX.Element => {
},
}}
>

<Tab.Screen name="Dashboard" component={DashboardStack}
<Tab.Screen
name="Dashboard"
component={DashboardStack}
options={{
headerShown: false,
tabBarIcon: ({ focused }) => (
Expand All @@ -80,7 +109,9 @@ const MainAppTabs = (): JSX.Element => {
),
}}
/>
<Tab.Screen name="SettingsPage" component={SettingsScreen}
<Tab.Screen
name="SettingsPage"
component={SettingsScreen}
options={{
title: 'Settings',
headerStyle: { backgroundColor: Colors.DARKGREEN },
Expand All @@ -93,27 +124,44 @@ const MainAppTabs = (): JSX.Element => {
style={{ color: (focused as boolean) ? Colors.LIGHTFGREEN : Colors.WHITE }}
/>
),
}} />
<Tab.Screen name="YourForms" component={YourForms}
}}
/>
<Tab.Screen
name="YourForms"
component={YourForms}
options={{
title: 'My Forms',
headerStyle: { backgroundColor: Colors.DARKGREEN },
headerTintColor: '#fff',
headerTitleStyle: { fontWeight: 'bold' },
tabBarIcon: ({ focused }) => (
<AntDesign name="form" size={24} color="black" style={{ color: (focused as boolean) ? Colors.LIGHTFGREEN : Colors.WHITE }} />
<AntDesign
name="form"
size={24}
color="black"
style={{ color: (focused as boolean) ? Colors.LIGHTFGREEN : Colors.WHITE }}
/>
),
}} />
<Tab.Screen name="CommunityHub" component={CommunityHub}
}}
/>
<Tab.Screen
name="CommunityHub"
component={CommunityHub}
options={{
title: 'Community Hub',
headerStyle: { backgroundColor: Colors.DARKGREEN },
headerTintColor: '#fff',
headerTitleStyle: { fontWeight: 'bold' },
tabBarIcon: ({ focused }) => (
<Fontisto name="world-o" size={24} color="black" style={{ color: (focused as boolean) ? Colors.LIGHTFGREEN : Colors.WHITE }} />
<Fontisto
name="world-o"
size={24}
color="black"
style={{ color: (focused as boolean) ? Colors.LIGHTFGREEN : Colors.WHITE }}
/>
),
}} />
}}
/>
</Tab.Navigator>
);
};
Expand Down
3 changes: 2 additions & 1 deletion frontend/src/components/types.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@ export interface RootStackParamList {
TransportationForum: undefined;
FoodHistory: undefined;
TransportationHistory: undefined;
[key: string]: { screen: string } | undefined
SignUpQuestions: undefined;
[key: string]: { screen: string } | undefined;
}

export interface GoogleSVGType {
Expand Down
58 changes: 1 addition & 57 deletions frontend/src/screens/Energy/energyForum.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { StyleSheet, Text, View, ScrollView, TouchableOpacity, TextInput } from 'react-native';
import { Picker } from '@react-native-picker/picker';
import * as React from 'react';
import { type StackNavigationProp } from '@react-navigation/stack';
import { type RootStackParamList } from '../../components/types';
Expand All @@ -19,27 +18,19 @@ export default function EnergyForum(): JSX.Element {

const navigation = useNavigation<StackNavigation>();

const [province, setProvince] = useState<string>('');
const [numOfPpl, setNumOfPpl] = useState(0);
const [electricalConsumption, setElectricalConsumption] = useState(0);
const [heatingOil, setHeatingOil] = useState(0);
const [naturalGas, setNaturalGas] = useState(0);

const handleValueChange = (itemValue: string): void => {
setProvince(itemValue);
};

const handleSurveySubmit = (): void => {
// Process survey responses, e.g., send them to a server
console.log('Survey Responses:', {
province,
numOfPpl,
electricalConsumption,
heatingOil,
naturalGas,
});

navigation.navigate('DashBoard');
navigation.navigate('MainApp');
};

if (!loaded) {
Expand All @@ -51,44 +42,6 @@ export default function EnergyForum(): JSX.Element {
<ScrollView style={styles.scrollContainer}>
<Text style={styles.header}>Calculate your energy consumption:</Text>

<View style={styles.questionContainer}>
<Text style={styles.question}>Which Province do you live in:</Text>
<View style={styles.pickerContainer}>
<Picker
selectedValue={province}
style={styles.picker}
onValueChange={handleValueChange}
>
<Picker.Item label="Ontario" value="Ontario" />
<Picker.Item label="Saskatchewan" value="Saskatchewan" />
<Picker.Item label="PEI" value="PEI" />
<Picker.Item label="Nunavut" value="Nunavut" />
<Picker.Item label="Alberta" value="Alberta" />
<Picker.Item label="Manitoba" value="Manitoba" />
<Picker.Item label="Quebec" value="Quebec" />
<Picker.Item label="Newfoundland and Labrador" value="Newfoundland and Labrador" />
<Picker.Item label="British Columbia" value="British Columbia" />
<Picker.Item label="Nova Scotia" value="Nova Scotia" />
<Picker.Item label="Northwest Territories" value="Northwest Territories" />
<Picker.Item label="New Brunswick" value="New Brunswick" />
<Picker.Item label="Yukon" value="Yukon" />
{/* Add more Picker.Item components for additional options */}
</Picker>
</View>
</View>

<View style={styles.questionContainer}>
<Text style={styles.question}>How many people live in your household:</Text>
<TextInput
style={styles.input}
keyboardType="numeric"
placeholder="Input"
onChangeText={(text) => {
setNumOfPpl(Number(text));
}}
/>
</View>

<View style={styles.questionContainer}>
<Text style={styles.question}>What is your monthly electricity consumption, in kWh:</Text>
<TextInput
Expand Down Expand Up @@ -158,15 +111,6 @@ const styles = StyleSheet.create({
questionContainer: {
paddingBottom: 30,
},
pickerContainer: {
height: 50,
width: 250,
backgroundColor: Colors.WHITE,
borderColor: Colors.GREY,
borderRadius: 5,
borderWidth: 1,
},
picker: { height: 50, width: 250 },
question: {
fontFamily: 'Montserrat',
fontSize: 20,
Expand Down
60 changes: 38 additions & 22 deletions frontend/src/screens/Transportation/transportationEntryEdit.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,4 @@
import {
StyleSheet,
Text,
View,
TouchableOpacity,
ScrollView,
Modal,
Linking,
} from 'react-native';
import { StyleSheet, Text, View, TouchableOpacity, ScrollView, Modal, Linking } from 'react-native';
import * as React from 'react';
import Icon from 'react-native-vector-icons/FontAwesome';
import { useEffect, useState } from 'react';
Expand Down Expand Up @@ -42,7 +34,7 @@ export default function TransportationEntryEdit(): JSX.Element {
const [bikeTravel, setBikeTravel] = useState(0);

const onSliderValueChange = (value: number, index: number): void => {
slidersData[index].initialValue = value
slidersData[index].initialValue = value;
switch (index) {
case 0:
setElectricCarTravel(value);
Expand Down Expand Up @@ -102,38 +94,62 @@ export default function TransportationEntryEdit(): JSX.Element {
electric_car: electricCarTravel,
gasoline_car: gasolineCarTravel,
carbon_emissions: transportationEntry.carbon_emissions,
date: transportationEntry.date
}
date: transportationEntry.date,
};
void TransportationAPI.updateTransportation(newEntry).then(() => {
navigation.navigate('TransportationHistory');
})
});
}
};

useEffect(() => {
if (transportationEntry != null) {
setSliderData([
{ id: 1, label: 'Electric Car', minValue: 0, maxValue: 800, initialValue: transportationEntry.electric_car },
{ id: 2, label: 'Gasoline Car', minValue: 0, maxValue: 800, initialValue: transportationEntry.gasoline_car },
{ id: 3, label: 'Train', minValue: 0, maxValue: 800, initialValue: transportationEntry.train },
{
id: 1,
label: 'Electric Car',
minValue: 0,
maxValue: 800,
initialValue: transportationEntry.electric_car,
},
{
id: 2,
label: 'Gasoline Car',
minValue: 0,
maxValue: 800,
initialValue: transportationEntry.gasoline_car,
},
{
id: 3,
label: 'Train',
minValue: 0,
maxValue: 800,
initialValue: transportationEntry.train,
},
{ id: 4, label: 'Bus', minValue: 0, maxValue: 800, initialValue: transportationEntry.bus },
{ id: 5, label: 'Motobike', minValue: 0, maxValue: 800, initialValue: transportationEntry.motorbike },
])
{
id: 5,
label: 'Motobike',
minValue: 0,
maxValue: 800,
initialValue: transportationEntry.motorbike,
},
]);
setElectricCarTravel(transportationEntry.electric_car);
setGasolineCarTravel(transportationEntry.gasoline_car);
setBusTravel(transportationEntry.bus);
setTrainTravel(transportationEntry.train);
setBikeTravel(transportationEntry.motorbike);
}
}, [transportationEntry])
}, [transportationEntry]);

useEffect(() => {
void TransportationAPI.getTransportationMetricForToday().then((res) => {
if (res != null) {
setTransportationEntry(res)
setTransportationEntry(res);
}
})
}, [loaded])
});
}, [loaded]);

if (!loaded || slidersData.length === 0) {
return <></>;
Expand Down
Loading