Merge branch 'main' into rf-refineAppDesign

CloudyBae · Apr 22, 2024 · 9a76004 · 9a76004
2 parents 07ade27 + 226eb3b
commit 9a76004
Show file tree

Hide file tree

Showing 11 changed files with 13,787 additions and 114 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -6,16 +6,19 @@ ENV PYTHONUNBUFFERED 1
 
 COPY ./zbackend/requirements.txt /tmp/requirements.txt
 COPY ./zbackend/requirements.dev.txt /tmp/requirements.dev.txt
+COPY ./scripts /scripts
 COPY ./zbackend /app
 WORKDIR /app
 EXPOSE 8000
 
+
 ARG DEV=false
 RUN python -m venv /py && \
     /py/bin/pip install --upgrade pip && \
+
+
     /py/bin/pip install -r /tmp/requirements.txt && \
-    if [ $DEV = "true" ]; \
-    then /py/bin/pip install -r /tmp/requirements.dev.txt ; \
+
     fi && \
     rm -rf /tmp && \
     adduser \

diff --git a/components/FavoriteRecipes.jsx b/components/FavoriteRecipes.jsx
@@ -7,7 +7,7 @@ import { useNavigation } from '@react-navigation/native';
 const FavoriteRecipesList = ({ scrollEnabled }) => {
   const [recipes, setRecipes] = useState([]);
   const navigation = useNavigation();
-  const { userId } = '8950a7c8-20c3-4d77-9a10-3622e07fd3dd';
+  const { userId } = '1';
 
   useEffect(() => {
     const fetchRecipes = async () => {

diff --git a/components/RecipeList.jsx b/components/RecipeList.jsx
@@ -9,7 +9,7 @@ import { Body } from './Typography';
 const RecipeList = ({ title, scrollEnabled, numberOfRecipes }) => {
   const [recipes, setRecipes] = useState([]);
   const navigation = useNavigation();
-  const { userId } = useContext(AuthContext);
+  const { userId } = "1";
 
   useEffect(() => {
     const fetchRecipes = async () => {
@@ -49,7 +49,7 @@ const RecipeList = ({ title, scrollEnabled, numberOfRecipes }) => {
     <>
       {recipes?.length === 0 ? (
         <View style={style.noRecipes}>
-          <Body style={style.noRecipesText}>No Favorite Recipes</Body>
+          <Body>No Favorite Recipes</Body>
         </View>
       ) : (
         <FlatList

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -11,4 +11,12 @@ services:
     volumes:
       - ./zbackend:/app
     command: >
-      sh -c "python manage.py runserver 0.0.0.0:8000"
+      sh -c "python manage.py wait_for_db &&
+      python manage.py migrate &&
+      python manage.py runserver 0.0.0.0:8000"
+    environment:
+      - DB_HOST=aws-0-us-west-1.pooler.supabase.com"
+      - DB_NAME="postgres"
+      - DB_USER="postgres.xmmvpjtupsyceyyeyfma"
+      - DB_PASS="!BestTeam123!"
+      - DB_PORT=5432
diff --git a/package-lock.json b/package-lock.json
diff --git a/screens/AccountSettingsMenu.jsx b/screens/AccountSettingsMenu.jsx
@@ -2,11 +2,25 @@ import { View, StyleSheet, Pressable } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import AcctHeader from '../components/AcctHeader';
 import Nav from '../components/Nav';
-import { Body, ButtonText } from '../components/Typography';
-import LogOutIcon from '../components/Icons/LogOutIcon.jsx';
-import DoNotEnter from '../components/Icons/DoNotEnter';
-import IDCard from '../components/Icons/IDCard.jsx';
-import Pot from '../components/Icons/Pot.jsx';
+import Button from '../components/Button';
+import { MaterialIcons } from '@expo/vector-icons';
+import {
+  Ionicons,
+  AntDesign,
+  MaterialCommunityIcons,
+} from '@expo/vector-icons';
+import { SettingOption } from '../components/SettingOption';
+import { useState } from 'react';
+import { DietaryAllergenFilterScreen } from './DietaryAllergenFilter';
+import { AccountDetailsScreen } from './AccountDetailsScreen';
+import { AcctSavedRecipesScreen } from './AcctSavedRecipes';
+
+export const SettingsScreen = {
+  AccountSettings: 'AccountSettings',
+  DietaryPreferences: 'DietaryPreferences',
+  MyDetails: 'MyDetails',
+  FavoriteRecipes: 'FavoriteRecipes',
+};
 
 export const AccountSettingsMenu = () => {
   const [showBackButton, setShowBackButton] = useState(false);
@@ -17,64 +31,70 @@ export const AccountSettingsMenu = () => {
   );
   return (
     <SafeAreaView style={styles.container}>
-      <View style={styles.innerContainer}>
-        <AcctHeader />
-        <View style={styles.menuItemContainer}>
-          <View style={styles.menuItemInnerContainer}>
-            <Pressable
-              onPress={() =>
-                navigation.navigate('Dietary Preferences & Allergies')
-              }
-              style={({ pressed }) => [
-                {
-                  opacity: pressed ? 0.5 : 1,
-                },
-                styles.menuItem,
-              ]}
-            >
-              <View style={styles.menuIcon}>
-                <DoNotEnter />
-              </View>
-              <Body>Dietary Preferences & Allergies</Body>
-            </Pressable>
-            <Pressable
-              onPress={() => navigation.navigate('Account Details')}
-              style={({ pressed }) => [
-                {
-                  opacity: pressed ? 0.5 : 1,
-                },
-                styles.menuItem,
-              ]}
-            >
-              <View style={styles.menuIcon}>
-                <IDCard style={styles.menuIcon} />
-              </View>
-              <Body>Account Details</Body>
-            </Pressable>
-            <Pressable
-              onPress={() => navigation.navigate('Saved Recipes')}
-              style={({ pressed }) => [
-                {
-                  opacity: pressed ? 0.5 : 1,
-                },
-                styles.menuItem,
-              ]}
-            >
-              <View style={styles.menuIcon}>
-                <Pot style={styles.menuIcon} />
-              </View>
-              <Body>Saved Recipes</Body>
-            </Pressable>
-          </View>
+      <AcctHeader />
+
+      {screenOption != SettingsScreen.AccountSettings && (
+        <Pressable
+          style={styles.backButton}
+          onPress={() => setScreenOption(SettingsScreen.AccountSettings)}
+        >
+          <Ionicons
+            name='chevron-back-circle'
+            size={26}
+            color='#72C08F'
+            style={{ margin: 20 }}
+          />
+        </Pressable>
+      )}
+      <View style={styles.menuContainer}>
+        {screenOption === SettingsScreen.AccountSettings && (
+          <>
+            <View style={styles.optionList}>
+              <SettingOption
+                title='Dietary Preferences'
+                icon={<Ionicons name={'ban-outline'} size={18} />}
+                onPress={() =>
+                  setScreenOption(SettingsScreen.DietaryPreferences)
+                }
+              />
+              <SettingOption
+                title='My Details'
+                icon={<AntDesign name={'idcard'} size={18} />}
+                onPress={() => setScreenOption(SettingsScreen.MyDetails)}
+              />
+              <SettingOption
+                title='Favorite Recipes'
+                icon={
+                  <MaterialCommunityIcons
+                    name={'pot-steam-outline'}
+                    size={18}
+                  />
+                }
+                onPress={() => setScreenOption(SettingsScreen.FavoriteRecipes)}
+              />
+            </View>
+            <View style={{ paddingHorizontal: 20 }}>
+              <Button
+                isFullWidth={true}
+                onPress={() => navigation.navigate('Login')}
+                kind='outline'
+                shape='rounded'
+                startEnhancer={
+                  <MaterialIcons name={'logout'} size={18} color='#52B175' />
+                }
+              >
+                Log Out
+              </Button>
+            </View>
+          </>
+        )}
+
+        {screenOption == SettingsScreen.DietaryPreferences && (
+          <DietaryAllergenFilterScreen />
+        )}
+        {screenOption == SettingsScreen.MyDetails && <AccountDetailsScreen />}
 
-          <Pressable
-            onPress={() => navigation.navigate('Login')}
-            style={[styles.buttonContainer, styles.button]}
-          >
-            <LogOutIcon style={styles.icon} />
-            <ButtonText>Log Out</ButtonText>
-          </Pressable>
-        </View>
+        {screenOption == SettingsScreen.FavoriteRecipes && <AcctSavedRecipesScreen />}
       </View>
       <Nav />
     </SafeAreaView>

diff --git a/screens/AcctSavedRecipes.jsx b/screens/AcctSavedRecipes.jsx
@@ -1,44 +1,44 @@
 import {
-  SafeAreaView,
-  ScrollView,
-  StyleSheet,
-  View,
-  Pressable,
-} from 'react-native';
-import AcctRecipeBar from '../components/AcctRecipeBar';
-import Nav from '../components/Nav';
-import { useNavigation } from '@react-navigation/native';
-
-export const AcctSavedRecipesScreen = () => {
-  const navigation = useNavigation();
-  return (
-    <SafeAreaView style={styles.container}>
-      <View style={{ flex: 1 }}>
-        <ScrollView contentContainerStyle={styles.scrollContainer}>
-          <View style={styles.homeContainer}>
-            <Pressable
-              onPress={() => navigation.navigate('Recipe', { id: item.id })}
-            >
-              <AcctRecipeBar />
-            </Pressable>
-          </View>
-        </ScrollView>
-      </View>
-      <Nav />
-    </SafeAreaView>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  scrollContainer: {
-    flexGrow: 1,
-  },
-  homeContainer: {
-    backgroundColor: '#f2f2f2',
-  },
-});
-
-export default AcctSavedRecipesScreen;
+    SafeAreaView,
+    ScrollView,
+    StyleSheet,
+    View,
+    Pressable,
+  } from 'react-native';
+  import AcctRecipeBar from '../components/AcctRecipeBar';
+  import Nav from '../components/Nav';
+  import { useNavigation } from '@react-navigation/native';
+  
+  export const AcctSavedRecipesScreen = () => {
+    const navigation = useNavigation();
+    return (
+      <SafeAreaView style={styles.container}>
+        <View style={{ flex: 1 }}>
+          <ScrollView contentContainerStyle={styles.scrollContainer}>
+            <View style={styles.homeContainer}>
+              <Pressable
+                onPress={() => navigation.navigate('Recipe', { id: item.id })}
+              >
+                <AcctRecipeBar />
+              </Pressable>
+            </View>
+          </ScrollView>
+        </View>
+        <Nav />
+      </SafeAreaView>
+    );
+  };
+  
+  const styles = StyleSheet.create({
+    container: {
+      flex: 1,
+    },
+    scrollContainer: {
+      flexGrow: 1,
+    },
+    homeContainer: {
+      backgroundColor: '#f2f2f2',
+    },
+  });
+  
+  export default AcctSavedRecipesScreen;
diff --git a/screens/AddIngredient.jsx b/screens/AddIngredient.jsx
@@ -10,7 +10,7 @@ export const AddIngredientModal = ({
   setModalVisible,
   onClose,
 }) => {
-  const { userId } = useContext(); // fix later
+  const { userId } = "1"; // fix when backend integrated
   const [showError, setShowError] = useState('');
   const [productData, setProductData] = useState({
     productName: '',

diff --git a/screens/Ingredient.jsx b/screens/Ingredient.jsx
@@ -11,7 +11,7 @@ import { AddIngredientModal } from './AddIngredient';
 const imageUrl = 'https://cdn-icons-png.freepik.com/512/6981/6981367.png';
 
 export const IngredientScreen = () => {
-  const { userId } = useContext(); // fix later
+  const { userId } = "1"; // update later when backend working
   const [modalVisible, setModalVisible] = useState(false);
 
   const [search, setSearch] = useState('');

diff --git a/screens/Recipe.jsx b/screens/Recipe.jsx
@@ -33,7 +33,7 @@ export const RecipeScreen = () => {
   const route = useRoute();
   const { id } = route.params;
   const navigation = useNavigation();
-  const { userId } = useContext(AuthContext);
+  const { userId } = "1"; // update after backend integration
   const [isFavourite, setIsFavourite] = useState(false);
   const [isOpenMoreTags, setOpenMoreTags] = useState(false);
 

diff --git a/zbackend/requirements.txt b/zbackend/requirements.txt
@@ -6,3 +6,7 @@ djangorestframework-simplejwt==5.3.1
 gunicorn==21.2.0
 django-allauth==0.61.1
 drf-yasg==1.21.7
+dj-rest-auth==6.0.0
+sqlparse==*
+psycopg2-binary==*
+python-dotenv==1.0.1