Skip to content

Commit

Permalink
Added structure for genre filtering
Browse files Browse the repository at this point in the history
  • Loading branch information
sliu-1 committed Feb 25, 2024
1 parent 1bbe30d commit 29546c9
Show file tree
Hide file tree
Showing 2 changed files with 56 additions and 11 deletions.
50 changes: 40 additions & 10 deletions mobile/Components/BookSearchBar/BookSearchBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,35 @@ import {} from "react-native-vector-icons"
import { RadioButton } from 'react-native-paper';
import { DATA } from "./Genres";

export const genresSelected: Array<string> = [
"YOUNG ADULT FICTION","ANTIQUES & COLLECTIBLES",
"LITERARY COLLECTIONS","ARCHITECTURE",
"LITERARY CRITICISM","ART",
"MATHEMATICS","BIBLES",
"MEDICAL","BIOGRAPHY & AUTOBIOGRAPHY",
"MUSIC","BODY",
"MIND & SPIRIT","NATURE",
"BUSINESS & ECONOMICS","PERFORMING ARTS",
"COMICS & GRAPHIC NOVELS","PETS",
"COMPUTERS","PHILOSOPHY",
"COOKING","PHOTOGRAPHY",
"CRAFTS & HOBBIES","POETRY","DESIGN",
"POLITICAL SCIENCE","DRAMA",
"PSYCHOLOGY","EDUCATION",
"REFERENCE","FAMILY & RELATIONSHIPS",
"RELIGION","FICTION",
"SCIENCE","FOREIGN LANGUAGE STUDY",
"SELF-HELP","GAMES & ACTIVITIES",
"SOCIAL SCIENCE","GARDENING",
"SPORTS & RECREATION","HEALTH & FITNESS",
"STUDY AIDS","HISTORY",
"TECHNOLOGY & ENGINEERING","HOUSE & HOME",
"TRANSPORTATION","HUMOR",
"TRAVEL","JUVENILE FICTION",
"TRUE CRIME","JUVENILE NONFICTION",
"LANGUAGE ARTS & DISCIPLINES",
"YOUNG ADULT NONFICTION","LAW"];

const BookSearchBar = ( {search, updateSearch} ) => {
const [checked, setChecked] = React.useState('title');
const [isOverlayVisible, setOverlayVisible] = useState(false);
Expand Down Expand Up @@ -35,20 +64,20 @@ const BookSearchBar = ( {search, updateSearch} ) => {
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
<View style={{ flex: 10 }}>
<SearchBar
placeholder={"Search list"}
lightTheme
round
onChangeText={updateSearch}
value={search}
autoCorrect={false}
containerStyle={{padding: 0, backgroundColor: "transparent", borderBottomColor: "transparent", borderTopColor: "transparent"}}
inputContainerStyle={{borderRadius: 20, backgroundColor: "#F7F7F7"}}
style={{position: "relative", }}
placeholder={"Search list"}
lightTheme
round
onChangeText={updateSearch}
value={search}
autoCorrect={false}
containerStyle={{padding: 0, backgroundColor: "transparent", borderBottomColor: "transparent", borderTopColor: "transparent"}}
inputContainerStyle={{borderRadius: 20, backgroundColor: "#F7F7F7"}}
style={{position: "relative", }}
/>
</View>
</TouchableWithoutFeedback>
<View style={{ flex: 2, alignItems:"center"}}>
<Button type="clear" onPress={ toggleOverlay } icon={<Icon name="filter" color={"#5B2FA3"} size={30} /> } />
<Button type="clear" onPress={ toggleOverlay } icon={ <Icon name="filter" color={"#5B2FA3"} size={30} /> } />
</View>

<Overlay isVisible={isOverlayVisible} onBackdropPress={toggleOverlay} overlayStyle={{ backgroundColor: "white", width: '89%', height: '70%', borderRadius: 20, marginTop: 60 }}>
Expand Down Expand Up @@ -82,6 +111,7 @@ const BookSearchBar = ( {search, updateSearch} ) => {
containerStyle={{ paddingLeft: 0, paddingTop: 0, }}
textStyle={{ fontWeight: 'normal', fontSize: 17, marginLeft: 7 }}
/> : <View/>}

</View>
</View>
}
Expand Down
17 changes: 16 additions & 1 deletion mobile/Components/ShelfModal/ShelfModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,19 @@ import { Divider } from "@rneui/base";

import { NavigationContext } from "../../Contexts";
import { shelf } from "../CarouselTabs";
import { genresSelected } from "../BookSearchBar"

function checkTitle(value, search) {
return ((value.title).toUpperCase()).includes(search.toUpperCase());
}

function checkAuthor(value, search) {
return ((value.author).toUpperCase()).includes(search.toUpperCase());
}

function checkGenres(value) {
return genresSelected.includes(value.toUpperCase());
}

const ShelfModal = ({
isShelfModalVisible,
Expand Down Expand Up @@ -93,7 +106,9 @@ const ShelfModal = ({
marginTop: -14
}}>
<FlatList
data={books.filter((e) => (((e.title).toUpperCase()).includes(search.toUpperCase()) || ((e.author).toUpperCase()).includes(search.toUpperCase())))}
data={books.filter((e) => ((checkTitle(e, search) ||
checkAuthor(e, search)) //&& (checkGenres(e.genre))
))}
scrollEventThrottle={1}
style={{
flex: 1,
Expand Down

0 comments on commit 29546c9

Please sign in to comment.