From 20370e32c93dda233d9228c0db99f4c04a2b3be5 Mon Sep 17 00:00:00 2001 From: Marcos Hernandez Date: Sun, 12 Nov 2023 15:47:26 -0800 Subject: [PATCH 1/6] accidently forgot to branch --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index b7a1c1e7..b96fd7e9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,7 @@ "@mui/material": "^5.14.13", "@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-async-storage/async-storage": "^1.18.2", "@react-native-community/datetimepicker": "7.2.0", "@react-navigation/bottom-tabs": "^6.5.9", "@react-navigation/material-bottom-tabs": "^6.2.17", diff --git a/package.json b/package.json index 9904cb90..7c10cf75 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "@mui/material": "^5.14.13", "@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-async-storage/async-storage": "^1.18.2", "@react-native-community/datetimepicker": "7.2.0", "@react-navigation/bottom-tabs": "^6.5.9", "@react-navigation/material-bottom-tabs": "^6.2.17", From ce0925171fc754e5e59eb65b59bb4dd1de723964 Mon Sep 17 00:00:00 2001 From: Marcos Hernandez Date: Tue, 26 Mar 2024 16:35:15 -0700 Subject: [PATCH 2/6] updated search styling and added screens for when there are no search results and no recent searches/stories --- src/app/(tabs)/search/index.tsx | 44 +++++++++++++++---- src/app/(tabs)/search/styles.ts | 15 +++++-- .../RecentSearchCard/RecentSearchCard.tsx | 8 +++- src/components/RecentSearchCard/styles.ts | 2 +- 4 files changed, 54 insertions(+), 15 deletions(-) diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx index 23450af4..bde4a008 100644 --- a/src/app/(tabs)/search/index.tsx +++ b/src/app/(tabs)/search/index.tsx @@ -190,18 +190,19 @@ function SearchScreen() { setShowRecents(true); setShowGenreCarousals(false); }} - searchIcon={false} - clearIcon + searchIcon + clearIcon={false} + cancelButtonProps={{ color: colors.grey }} containerStyle={[ styles.searchContainer, showGenreCarousals && { marginRight: 24 }, ]} inputContainerStyle={styles.inputContainer} - inputStyle={{ color: 'black' }} + inputStyle={globalStyles.body1} // this is where we put the styling leftIconContainerStyle={{}} rightIconContainerStyle={{}} - placeholder="Search" - placeholderTextColor="black" + placeholder="What do you want to read?" + placeholderTextColor="grey" onChangeText={text => searchFunction(text)} value={search} onSubmitEditing={searchString => { @@ -222,19 +223,31 @@ function SearchScreen() { )} {showRecents && - (search ? ( + (search && searchResults.length > 0 ? ( {searchResults.length}{' '} {searchResults.length === 1 ? 'Story' : 'Stories'} - ) : ( + ) : search && searchResults.length === 0 ? ( + + + There are no stories + matching your filters. + + + Try removing some filters. + + + ) : recentSearches.length > 0 || recentlyViewed.length > 0 ? ( Recent Searches - Clear All + + Clear All + @@ -254,7 +267,9 @@ function SearchScreen() { Recently Viewed - Clear All + + Clear All + @@ -278,6 +293,17 @@ function SearchScreen() { ))} + ) : ( + + + + Find stories from young creators. + + + + Search for stories, authors, or collections. + + ))} {showGenreCarousals ? ( diff --git a/src/app/(tabs)/search/styles.ts b/src/app/(tabs)/search/styles.ts index 648752e0..831f6400 100644 --- a/src/app/(tabs)/search/styles.ts +++ b/src/app/(tabs)/search/styles.ts @@ -16,12 +16,14 @@ const styles = StyleSheet.create({ searchContainer: { backgroundColor: 'transparent', borderRadius: 10, - borderColor: 'transparent', marginBottom: 8, }, inputContainer: { - backgroundColor: '#D9D9D9', + backgroundColor: 'transparent', borderRadius: 10, + borderColor: 'grey', + borderWidth: 1, + borderBottomWidth: 1, }, greyOverlay: { flex: 1, @@ -62,7 +64,7 @@ const styles = StyleSheet.create({ clearAll: { color: colors.gwnOrange, fontSize: 12, - fontWeight: '400', + fontWeight: '600', }, contentContainerRecents: { paddingHorizontal: 8, @@ -86,6 +88,13 @@ const styles = StyleSheet.create({ fontSize: 12, textDecorationLine: 'underline', }, + emptySearch: { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + textAlign: 'center', + marginTop: '60%', + }, }); export default styles; diff --git a/src/components/RecentSearchCard/RecentSearchCard.tsx b/src/components/RecentSearchCard/RecentSearchCard.tsx index eb77fcc6..e142baee 100644 --- a/src/components/RecentSearchCard/RecentSearchCard.tsx +++ b/src/components/RecentSearchCard/RecentSearchCard.tsx @@ -21,10 +21,14 @@ function RecentSearchCard({ - {value} + + {value} + - {numResults} Results + + {numResults} Results + diff --git a/src/components/RecentSearchCard/styles.ts b/src/components/RecentSearchCard/styles.ts index 676937de..3894fd37 100644 --- a/src/components/RecentSearchCard/styles.ts +++ b/src/components/RecentSearchCard/styles.ts @@ -31,7 +31,7 @@ const styles = StyleSheet.create({ searchValueText: { color: 'black', fontWeight: '400', - fontSize: 14, + fontSize: 10, justifyContent: 'center', }, numResultsText: { From de73b5c81e47075fb7c10dbe96119b240b60a2bd Mon Sep 17 00:00:00 2001 From: Marcos Hernandez Date: Wed, 27 Mar 2024 13:02:20 -0700 Subject: [PATCH 3/6] chnages made --- src/app/(tabs)/search/index.tsx | 35 +++++++++++++++++------ src/app/(tabs)/search/styles.ts | 11 ++++--- src/components/RecentSearchCard/styles.ts | 6 ++-- 3 files changed, 35 insertions(+), 17 deletions(-) diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx index bde4a008..9fe7fcc2 100644 --- a/src/app/(tabs)/search/index.tsx +++ b/src/app/(tabs)/search/index.tsx @@ -192,13 +192,15 @@ function SearchScreen() { }} searchIcon clearIcon={false} - cancelButtonProps={{ color: colors.grey }} + cancelButtonProps={{ + buttonTextStyle: [globalStyles.body1Bold, styles.cancelButton], + }} containerStyle={[ styles.searchContainer, showGenreCarousals && { marginRight: 24 }, ]} inputContainerStyle={styles.inputContainer} - inputStyle={globalStyles.body1} // this is where we put the styling + inputStyle={globalStyles.body1Bold} leftIconContainerStyle={{}} rightIconContainerStyle={{}} placeholder="What do you want to read?" @@ -233,11 +235,18 @@ function SearchScreen() { ) : search && searchResults.length === 0 ? ( - There are no stories - matching your filters. + + There are no stories + + + for "your search". + - - Try removing some filters. + + Try searching by title or author, or + + + check if your spelling is correct. ) : recentSearches.length > 0 || recentlyViewed.length > 0 ? ( @@ -245,7 +254,12 @@ function SearchScreen() { Recent Searches - + Clear All @@ -267,7 +281,12 @@ function SearchScreen() { Recently Viewed - + Clear All diff --git a/src/app/(tabs)/search/styles.ts b/src/app/(tabs)/search/styles.ts index 831f6400..13b1a6af 100644 --- a/src/app/(tabs)/search/styles.ts +++ b/src/app/(tabs)/search/styles.ts @@ -17,6 +17,7 @@ const styles = StyleSheet.create({ backgroundColor: 'transparent', borderRadius: 10, marginBottom: 8, + borderColor: 'grey', }, inputContainer: { backgroundColor: 'transparent', @@ -61,11 +62,6 @@ const styles = StyleSheet.create({ marginTop: 24, marginBottom: 8, }, - clearAll: { - color: colors.gwnOrange, - fontSize: 12, - fontWeight: '600', - }, contentContainerRecents: { paddingHorizontal: 8, marginBottom: 8, @@ -91,10 +87,13 @@ const styles = StyleSheet.create({ emptySearch: { display: 'flex', flexDirection: 'column', - alignItems: 'center', textAlign: 'center', + alignItems: 'center', marginTop: '60%', }, + cancelButton: { + color: 'grey', + }, }); export default styles; diff --git a/src/components/RecentSearchCard/styles.ts b/src/components/RecentSearchCard/styles.ts index 3894fd37..6e4a684b 100644 --- a/src/components/RecentSearchCard/styles.ts +++ b/src/components/RecentSearchCard/styles.ts @@ -1,4 +1,5 @@ import { StyleSheet } from 'react-native'; +import colors from '../../styles/colors'; const styles = StyleSheet.create({ card: { @@ -29,10 +30,9 @@ const styles = StyleSheet.create({ alignItems: 'center', }, searchValueText: { - color: 'black', - fontWeight: '400', - fontSize: 10, justifyContent: 'center', + color: colors.grey, + fontSize: 10, }, numResultsText: { color: '#A7A5A5', From ffdaaeba401db03bde3a48dc1ec482f3acbaa317 Mon Sep 17 00:00:00 2001 From: Marcos Hernandez Date: Fri, 29 Mar 2024 11:05:25 -0700 Subject: [PATCH 4/6] changes made to color options --- src/app/(tabs)/search/index.tsx | 2 +- src/app/(tabs)/search/styles.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx index 9fe7fcc2..3f256ff9 100644 --- a/src/app/(tabs)/search/index.tsx +++ b/src/app/(tabs)/search/index.tsx @@ -239,7 +239,7 @@ function SearchScreen() { There are no stories - for "your search". + for {search}. diff --git a/src/app/(tabs)/search/styles.ts b/src/app/(tabs)/search/styles.ts index 13b1a6af..a9c55555 100644 --- a/src/app/(tabs)/search/styles.ts +++ b/src/app/(tabs)/search/styles.ts @@ -17,7 +17,7 @@ const styles = StyleSheet.create({ backgroundColor: 'transparent', borderRadius: 10, marginBottom: 8, - borderColor: 'grey', + borderColor: colors.grey, }, inputContainer: { backgroundColor: 'transparent', @@ -92,7 +92,7 @@ const styles = StyleSheet.create({ marginTop: '60%', }, cancelButton: { - color: 'grey', + color: colors.grey, }, }); From d18469abc49e5e5d0b8ae2de0f8974e74d7c4a6c Mon Sep 17 00:00:00 2001 From: Aditya Pawar Date: Thu, 4 Apr 2024 17:57:15 -0700 Subject: [PATCH 5/6] Small style changes --- src/app/(tabs)/home/index.tsx | 1 + src/app/(tabs)/search/index.tsx | 11 +++++------ src/app/(tabs)/search/styles.ts | 6 +----- src/components/PreviewCard/styles.ts | 4 ++-- src/components/RecentSearchCard/styles.ts | 9 ++++----- src/styles/colors.ts | 1 + 6 files changed, 14 insertions(+), 18 deletions(-) diff --git a/src/app/(tabs)/home/index.tsx b/src/app/(tabs)/home/index.tsx index 81ffc8db..a584572e 100644 --- a/src/app/(tabs)/home/index.tsx +++ b/src/app/(tabs)/home/index.tsx @@ -77,6 +77,7 @@ function HomeScreen() { + {featuredStories.length > 0 && ( Featured Stories diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx index 3f256ff9..ccdb2afc 100644 --- a/src/app/(tabs)/search/index.tsx +++ b/src/app/(tabs)/search/index.tsx @@ -227,9 +227,8 @@ function SearchScreen() { {showRecents && (search && searchResults.length > 0 ? ( - - {searchResults.length}{' '} - {searchResults.length === 1 ? 'Story' : 'Stories'} + + Showing results 1-{searchResults.length} ) : search && searchResults.length === 0 ? ( @@ -239,7 +238,7 @@ function SearchScreen() { There are no stories - for {search}. + for "{search}". @@ -252,7 +251,7 @@ function SearchScreen() { ) : recentSearches.length > 0 || recentlyViewed.length > 0 ? ( - Recent Searches + Recent Searches - Recently Viewed + Recently Viewed Date: Thu, 4 Apr 2024 18:05:20 -0700 Subject: [PATCH 6/6] Run prettier --- src/app/(tabs)/search/index.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/app/(tabs)/search/index.tsx b/src/app/(tabs)/search/index.tsx index ccdb2afc..8f488acd 100644 --- a/src/app/(tabs)/search/index.tsx +++ b/src/app/(tabs)/search/index.tsx @@ -251,7 +251,9 @@ function SearchScreen() { ) : recentSearches.length > 0 || recentlyViewed.length > 0 ? ( - Recent Searches + + Recent Searches + - Recently Viewed + + Recently Viewed +