Merge branch 'main' into kyle/savedStoriesPage

.github/workflows/lint.yml

@@ -6,9 +6,6 @@ name: Lint
 #############################
 on:
   push:
-    branches-ignore: [main]
-  pull_request:
-    branches: [main]
 
 ###############
 # Set the Job #

.gitignore

@@ -36,3 +36,4 @@ yarn-error.*
 *.tsbuildinfo
 
 .vscode/
+eas.json

package.json

@@ -21,7 +21,7 @@
     "@mui/styled-engine-sc": "^6.0.0-alpha.1",
     "@mui/system": "^5.14.13",
     "@react-native-async-storage/async-storage": "^1.18.2",
-    "@react-native-community/datetimepicker": "7.2.0",
+    "@react-native-community/datetimepicker": "^7.2.0",
     "@react-navigation/bottom-tabs": "^6.5.9",
     "@react-navigation/material-bottom-tabs": "^6.2.17",
     "@react-navigation/native": "^6.1.8",
@@ -42,26 +42,34 @@
     "expo-status-bar": "~1.6.0",
     "html-entities": "^2.4.0",
     "react": "18.2.0",
+    "react-apple-emojis": "^2.2.1",
     "react-native": "0.72.10",
     "react-native-dom-parser": "^1.5.3",
     "react-native-element-dropdown": "^2.10.0",
     "react-native-elements": "^3.4.3",
+    "react-native-emoji": "^1.8.0",
+    "react-native-emojicon": "^1.0.0",
     "react-native-gesture-handler": "~2.12.0",
     "react-native-htmlview": "^0.16.0",
     "react-native-ionicons": "^4.6.5",
+    "react-native-modal-datetime-picker": "^17.1.0",
+    "react-native-neat-date-picker": "^1.4.12",
     "react-native-otp-textinput": "^1.1.3",
     "react-native-paper": "^5.10.6",
+    "react-native-paper-dates": "^0.22.3",
     "react-native-render-html": "^6.3.4",
     "react-native-root-siblings": "^4.1.1",
     "react-native-safe-area-context": "4.6.3",
     "react-native-screens": "~3.22.0",
     "react-native-svg": "13.9.0",
     "react-native-toast-message": "^2.2.0",
+    "react-native-ui-datepicker": "^2.0.2",
     "react-native-url-polyfill": "^2.0.0",
     "react-native-vector-icons": "^10.0.2",
     "react-scroll-to-top": "^3.0.0",
     "use-debounce": "^10.0.0",
-    "validator": "^13.11.0"
+    "validator": "^13.11.0",
+    "expo-image": "~1.3.5"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

src/app/(tabs)/_layout.tsx

@@ -1,5 +1,5 @@
 import { Tabs } from 'expo-router';
-import { Platform } from 'react-native';
+import { Platform, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 import Icon from '../../../assets/icons';
@@ -55,7 +55,6 @@ function TabNav() {
           headerShown: false,
           tabBarLabel: 'Home',
           tabBarIcon: ({ color }) => HomeIcon({ color }),
-          // tabBarLabelStyle: { borderTopWidth: 12, paddingTop: 12 },
         }}
       />
       <Tabs.Screen
@@ -88,6 +87,20 @@ function TabNav() {
           tabBarIcon: ({ color }) => LibraryIcon({ color }),
         }}
       />
+      <Tabs.Screen
+        name="settings"
+        options={{
+          headerShown: false,
+          href: null,
+        }}
+      />
+      <Tabs.Screen
+        name="genre"
+        options={{
+          headerShown: false,
+          href: null,
+        }}
+      />
     </Tabs>
   );
 }

src/app/(tabs)/author/index.tsx

@@ -6,7 +6,6 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 
 import styles from './styles';
 import BackButton from '../../../components/BackButton/BackButton';
-import ContentCard from '../../../components/ContentCard/ContentCard';
 import HorizontalLine from '../../../components/HorizontalLine/HorizontalLine';
 import PreviewCard from '../../../components/PreviewCard/PreviewCard';
 import {
@@ -15,6 +14,7 @@ import {
 } from '../../../queries/authors';
 import { Author, StoryPreview } from '../../../queries/types';
 import globalStyles from '../../../styles/globalStyles';
+import * as cheerio from 'cheerio';
 
 function AuthorScreen() {
   const [authorInfo, setAuthorInfo] = useState<Author>();
@@ -27,41 +27,39 @@ function AuthorScreen() {
   useEffect(() => {
     setLoading(true);
     (async () => {
-      const storyData: StoryPreview[] = await fetchAuthorStoryPreviews(
-        parseInt(author as string, 10),
-      );
-      const authorData: Author = await fetchAuthor(
-        parseInt(author as string, 10),
-      );
       try {
-        setAuthorInfo(authorData);
-        console.log('TESTING AUTHOR INFO QUERY OUTPUT:', authorInfo);
-      } catch (error) {
-        console.log(
-          `There was an error while trying to output authorinfo ${error}`,
+        const storyData: StoryPreview[] = await fetchAuthorStoryPreviews(
+          parseInt(author as string, 10),
         );
-      }
-      try {
+        const authorData: Author = await fetchAuthor(
+          parseInt(author as string, 10),
+        );
+
+        // Assuming these setters do not throw, but if they do, they're caught by the catch block
+        setAuthorInfo(authorData);
         setAuthorStoryPreview(storyData);
-        console.log('TESTING STORY PREVIEW INFO QUERY OUTPUT:', storyData);
       } catch (error) {
-        console.log(
-          `There was an error while trying to output author story preview info ${error}`,
-        );
+        console.error('There was an error while fetching data:', error);
+      } finally {
+        setLoading(false);
       }
-    })().then(() => {
-      setLoading(false);
-    });
+    })();
   }, [author]);
 
+  const getTextFromHtml = (text: string) => {
+    return cheerio.load(text).text().trim();
+  };
+
   return (
-    <SafeAreaView style={[globalStyles.container, { marginHorizontal: -8 }]}>
+    <SafeAreaView
+      style={[globalStyles.tabBarContainer, { marginHorizontal: -8 }]}
+    >
       {isLoading ? (
         <ActivityIndicator />
       ) : (
         <ScrollView
           showsVerticalScrollIndicator={false}
-          bounces={false}
+          bounces={true}
           contentContainerStyle={{ paddingHorizontal: 8 }}
         >
           <BackButton pressFunction={() => router.back()} />
@@ -76,12 +74,14 @@ function AuthorScreen() {
                 <Text
                   adjustsFontSizeToFit
                   numberOfLines={2}
-                  style={styles.name}
+                  style={globalStyles.h1}
                 >
-                  {authorInfo.name}
+                  {getTextFromHtml(authorInfo.name)}
                 </Text>
                 {authorInfo?.pronouns && (
-                  <Text style={styles.pronouns}>{authorInfo.pronouns}</Text>
+                  <Text style={[globalStyles.subHeading2, styles.pronouns]}>
+                    {authorInfo.pronouns}
+                  </Text>
                 )}
               </View>
             )}
@@ -91,18 +91,22 @@ function AuthorScreen() {
 
           {authorInfo?.bio && (
             <>
-              <Text style={styles.bioText}>{decode(authorInfo.bio)}</Text>
+              <Text style={globalStyles.body1}>
+                {getTextFromHtml(authorInfo.bio)}
+              </Text>
               <HorizontalLine />
             </>
           )}
 
           {authorInfo?.artist_statement && (
             <>
-              <Text style={styles.authorStatementTitle}>
+              <Text
+                style={[globalStyles.body2Bold, styles.authorStatementTitle]}
+              >
                 Artist's Statement
               </Text>
-              <Text style={styles.authorStatement}>
-                {decode(authorInfo.artist_statement)}
+              <Text style={globalStyles.body1}>
+                {getTextFromHtml(authorInfo.artist_statement)}
               </Text>
               <HorizontalLine />
             </>
@@ -118,6 +122,7 @@ function AuthorScreen() {
           {authorStoryPreview?.map(story => (
             <PreviewCard
               key={story.title}
+              storyId={story.id}
               title={story.title}
               image={story.featured_media}
               author={story.author_name}
@@ -132,6 +137,9 @@ function AuthorScreen() {
               }
             />
           ))}
+
+          {/* View so there's space between the tab bar and the stories */}
+          <View style={{ paddingBottom: 10 }}></View>
         </ScrollView>
       )}
     </SafeAreaView>

src/app/(tabs)/author/styles.tsx

@@ -10,28 +10,12 @@ const styles = StyleSheet.create({
     justifyContent: 'flex-start',
     alignItems: 'flex-end',
   },
-  name: {
-    fontWeight: 'bold',
-    fontSize: 24,
-    fontFamily: 'Manrope-Regular',
-  },
   image: {
     height: 68,
     width: 68,
     backgroundColor: colors.darkGrey,
     borderRadius: 4,
   },
-  bioText: {
-    color: 'black',
-    fontFamily: 'Manrope-Regular',
-    fontSize: 14,
-  },
-  authorStatement: {
-    fontSize: 14,
-    color: 'black',
-    fontWeight: '400',
-    fontFamily: 'Manrope-Regular',
-  },
   authorTextContainer: {
     paddingLeft: 20,
   },
@@ -40,17 +24,14 @@ const styles = StyleSheet.create({
     borderTopWidth: 20,
   },
   authorStatementTitle: {
-    fontWeight: 'bold',
-    fontFamily: 'Manrope-Regular',
-    fontSize: 16,
     marginBottom: 8,
   },
   storyCountText: {
     fontSize: 12,
     marginBottom: 8,
   },
   pronouns: {
-    color: '#797979',
+    color: colors.textGrey,
   },
 });