Merge branch 'main' into justin/favorite-story-button

calblueprint · Apr 24, 2024 · 78ebf1b · 78ebf1b
2 parents 8acb085 + 3148c48
commit 78ebf1b
Show file tree

Hide file tree

Showing 24 changed files with 469 additions and 155 deletions.
diff --git a/app.json b/app.json
@@ -17,16 +17,24 @@
       "supportsTablet": true
     },
     "android": {
+      "package": "org.calblueprint.girlswritenow",
       "softwareKeyboardLayoutMode": "pan",
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#ffffff"
-      },
-      "softwareKeyboardLayoutMode": "pan"
+      }
     },
     "web": {
       "favicon": "./assets/favicon.png"
     },
-    "plugins": ["expo-router"]
+    "plugins": ["expo-router"],
+    "extra": {
+      "router": {
+        "origin": false
+      },
+      "eas": {
+        "projectId": "12e1580c-e57a-466e-bc0d-c7a051565998"
+      }
+    }
   }
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -16,6 +16,9 @@
     "@emotion/styled": "^11.11.0",
     "@expo-google-fonts/manrope": "^0.2.3",
     "@expo/vector-icons": "^13.0.0",
+    "@fortawesome/fontawesome-svg-core": "^6.5.2",
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
+    "@fortawesome/react-native-fontawesome": "^0.3.0",
     "@mui/icons-material": "^5.14.13",
     "@mui/material": "^5.14.13",
     "@mui/styled-engine-sc": "^6.0.0-alpha.1",

diff --git a/src/app/(tabs)/_layout.tsx b/src/app/(tabs)/_layout.tsx
@@ -4,6 +4,7 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 import Icon from '../../../assets/icons';
 import colors from '../../styles/colors';
+import globalStyles from '../../styles/globalStyles';
 
 function HomeIcon({ color }: { color: string }) {
   return (
@@ -36,7 +37,7 @@ function TabNav() {
     <Tabs
       backBehavior="history"
       screenOptions={{
-        tabBarLabelStyle: { fontSize: 14 },
+        tabBarLabelStyle: globalStyles.body1,
         tabBarHideOnKeyboard: true,
         tabBarActiveTintColor: colors.citrus,
         tabBarInactiveTintColor: colors.fadedBlack,

diff --git a/src/app/(tabs)/genre/_layout.tsx b/src/app/(tabs)/genre/_layout.tsx
@@ -1,10 +1,14 @@
 import { Stack } from 'expo-router';
 
+import { FilterContextProvider } from '../../../utils/FilterContext';
+
 function StackLayout() {
   return (
-    <Stack>
-      <Stack.Screen name="index" options={{ headerShown: false }} />
-    </Stack>
+    <FilterContextProvider>
+      <Stack>
+        <Stack.Screen name="index" options={{ headerShown: false }} />
+      </Stack>
+    </FilterContextProvider>
   );
 }
 

diff --git a/src/app/(tabs)/genre/index.tsx b/src/app/(tabs)/genre/index.tsx
@@ -1,19 +1,20 @@
 import { useLocalSearchParams, router } from 'expo-router';
-import { useEffect, useState, useMemo, ReactNode } from 'react';
+import React, { useEffect, useState, useMemo } from 'react';
 import {
   ActivityIndicator,
   ScrollView,
   View,
   Text,
   FlatList,
 } from 'react-native';
-import { MultiSelect } from 'react-native-element-dropdown';
+import { Dropdown, MultiSelect } from 'react-native-element-dropdown';
 import { Icon } from 'react-native-elements';
 import { TouchableOpacity } from 'react-native-gesture-handler';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 import styles from './styles';
 import BackButton from '../../../components/BackButton/BackButton';
+
 import PreviewCard from '../../../components/PreviewCard/PreviewCard';
 import { fetchGenreStoryById } from '../../../queries/genres';
 import { fetchStoryPreviewByIds } from '../../../queries/stories';

diff --git a/src/app/(tabs)/genre/styles.tsx b/src/app/(tabs)/genre/styles.tsx
@@ -1,6 +1,7 @@
 import { StyleSheet } from 'react-native';
 
 import colors from '../../../styles/colors';
+import globalStyles from '../../../styles/globalStyles';
 
 const styles = StyleSheet.create({
   textSelected: {
@@ -12,7 +13,6 @@ const styles = StyleSheet.create({
     width: '100%',
     flex: 1,
   },
-
   flatListStyle: {
     paddingTop: 15,
   },

diff --git a/src/app/(tabs)/home/index.tsx b/src/app/(tabs)/home/index.tsx
@@ -1,21 +1,17 @@
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { router } from 'expo-router';
 import { useEffect, useState } from 'react';
-import {
-  ActivityIndicator,
-  Pressable,
-  ScrollView,
-  Text,
-  View,
-} from 'react-native';
+import { ActivityIndicator, ScrollView, Text, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 import styles from './styles';
 import ContentCard from '../../../components/ContentCard/ContentCard';
 import PreviewCard from '../../../components/PreviewCard/PreviewCard';
+
 import { fetchUsername } from '../../../queries/profiles';
 import {
   fetchFeaturedStoriesDescription,
+  fetchFeaturedStoriesHeader,
   fetchFeaturedStoryPreviews,
   fetchNewStories,
   fetchRecommendedStories,
@@ -33,6 +29,7 @@ function HomeScreen() {
   const [recentlyViewed, setRecentlyViewed] = useState<StoryPreview[]>([]);
   const [featuredStoriesDescription, setFeaturedStoriesDescription] =
     useState<string>('');
+  const [featuredStoriesHeader, setFeaturedStoriesHeader] = useState('');
   const [recommendedStories, setRecommendedStories] = useState<StoryCard[]>([]);
   const [newStories, setNewStories] = useState<StoryCard[]>([]);
 
@@ -93,7 +90,7 @@ function HomeScreen() {
   };
 
   useEffect(() => {
-    const getRecommendedStories = async () => {
+    const updateRecommendedStories = async () => {
       const recentStoryResponse = await getRecentStory();
 
       const recommendedStoriesResponse =
@@ -105,22 +102,27 @@ function HomeScreen() {
       const [
         usernameResponse,
         featuredStoryResponse,
+        featuredStoryHeaderResponse,
         featuredStoryDescriptionResponse,
         newStoriesResponse,
         recentStoryResponse,
+        _,
       ] = await Promise.all([
         fetchUsername(user?.id).catch(() => ''),
         fetchFeaturedStoryPreviews().catch(() => []),
+        fetchFeaturedStoriesHeader().catch(() => ''),
         fetchFeaturedStoriesDescription().catch(() => ''),
         fetchNewStories().catch(() => []),
         getRecentStory(),
+        updateRecommendedStories(),
       ]);
+
       setUsername(usernameResponse);
       setFeaturedStories(featuredStoryResponse);
+      setFeaturedStoriesHeader(featuredStoryHeaderResponse);
       setFeaturedStoriesDescription(featuredStoryDescriptionResponse);
       setNewStories(newStoriesResponse);
       setRecentlyViewed(recentStoryResponse);
-      await getRecommendedStories();
     })().finally(() => {
       setLoading(false);
     });
@@ -142,21 +144,29 @@ function HomeScreen() {
         contentContainerStyle={{ paddingHorizontal: 8 }}
       >
         <View style={styles.headerContainer}>
-          <Text style={globalStyles.h1}>
+          <Text style={[globalStyles.h1, { paddingBottom: 24 }]}>
             {username ? `Welcome, ${username}` : 'Welcome!'}
           </Text>
         </View>
 
         {featuredStories.length > 0 && (
           <View>
-            <Text style={globalStyles.h3}>Featured Stories</Text>
-            {featuredStoriesDescription != null &&
-              featuredStoriesDescription.length > 0 && (
+            <Text style={[globalStyles.h2, { paddingBottom: 16 }]}>
+              Featured Stories
+            </Text>
+            {featuredStoriesHeader != null && featuredStoriesHeader != '' && (
+              <Text style={[globalStyles.h3, { paddingBottom: 16 }]}>
+                {featuredStoriesHeader}
+              </Text>
+            )}
+            {featuredStoriesHeader != '' &&
+              featuredStoriesDescription != null &&
+              featuredStoriesDescription != '' && (
                 <Text style={[globalStyles.body1, styles.featuredDescription]}>
                   {featuredStoriesDescription}
                 </Text>
               )}
-            <View style={{ marginRight: 24, marginTop: 16 }}>
+            <View style={{ marginRight: 24 }}>
               {featuredStories.map(story => (
                 <PreviewCard
                   key={story.id}

diff --git a/src/app/(tabs)/home/styles.ts b/src/app/(tabs)/home/styles.ts
@@ -38,8 +38,7 @@ const styles = StyleSheet.create({
     marginRight: 24,
   },
   featuredDescription: {
-    marginBottom: 16,
-    marginTop: 8,
+    marginBottom: 24,
     marginRight: 24,
   },
 });

diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx
@@ -230,14 +230,14 @@ function SearchScreen() {
           }}
         />
 
-        {search && (
-          <View style={styles.default}>
-            <Button
-              title="Show Filter Modal"
-              onPress={() => setFilterVisible(true)}
-            />
-          </View>
-        )}
+        {/* {search && ( */}
+        {/*   <View style={styles.default}> */}
+        {/*     <Button */}
+        {/*       title="Show Filter Modal" */}
+        {/*       onPress={() => setFilterVisible(true)} */}
+        {/*     /> */}
+        {/*   </View> */}
+        {/* )} */}
 
         {showRecents &&
           (search && searchResults.length > 0 ? (
@@ -424,11 +424,11 @@ function SearchScreen() {
           />
         )}
 
-        <FilterModal
-          isVisible={filterVisible}
-          setIsVisible={setFilterVisible}
-          title="Genre"
-        />
+        {/* <FilterModal */}
+        {/*   isVisible={filterVisible} */}
+        {/*   setIsVisible={setFilterVisible} */}
+        {/*   title="Genre" */}
+        {/* /> */}
       </View>
     </SafeAreaView>
   );

diff --git a/src/app/(tabs)/story/index.tsx b/src/app/(tabs)/story/index.tsx
@@ -18,6 +18,7 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 import styles from './styles';
 import FavoriteStoryButton from '../../../components/FavoriteStoryButton/FavoriteStoryButton';
 import SaveStoryButton from '../../../components/SaveStoryButton/SaveStoryButton';
+import ReactionPicker from '../../../components/ReactionPicker/ReactionPicker';
 import BackButton from '../../../components/BackButton/BackButton';
 import { fetchStory } from '../../../queries/stories';
 import { Story } from '../../../queries/types';
@@ -206,6 +207,9 @@ function StoryScreen() {
           >
             <Text style={globalStyles.bodyBoldUnderline}>Back To Top</Text>
           </Button>
+          <View style={styles.bottomReactionContainer}>
+            <ReactionPicker storyId={parseInt(storyId as string, 10)} />
+          </View>
         </ScrollView>
       )}
     </SafeAreaView>

diff --git a/src/app/(tabs)/story/styles.ts b/src/app/(tabs)/story/styles.ts
@@ -62,6 +62,17 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     justifyContent: 'flex-end',
   },
+  backToTopButtonText: {
+    fontFamily: 'Manrope-Regular',
+    fontSize: 12,
+    fontWeight: '800',
+    textAlign: 'left',
+    color: 'black',
+  },
+  bottomReactionContainer: {
+    flex: 1,
+    justifyContent: 'space-around',
+  },
 });
 
 export default styles;