Commit 7e3d719b authored by Thor-Herman's avatar Thor-Herman
Browse files

Add Ordering and Filters to FilterPage #7

Fix keys issue for checkedGenres as well
parent d90d4f77
......@@ -17,8 +17,9 @@ export const decideFilters = ({ filter, ordering }: FilteringState) => {
const decideRegex = (filterGenres: { [key in Genres]: boolean }) => {
let regex = '(';
const checkedGenres = _.values(_.pickBy(filterGenres, (genre: boolean) => genre))
const checkedGenres = _.keys(_.pickBy(filterGenres, (genre: boolean) => genre))
for (let i = 0; i < checkedGenres.length; i++) {
console.log(checkedGenres);
regex += checkedGenres[i].toString();
regex += i === checkedGenres.length - 1 ? '' : '|'; // Last element, don't add final |
}
......
import React from "react";
import { Text } from "native-base";
import React, { useState } from "react";
import { Form, Icon, Item, Label, Picker, Text } from "native-base";
import { StackParamList } from "../components/App";
import { StackNavigationProp } from '@react-navigation/stack';
import { StackNavigationProp } from "@react-navigation/stack";
import { Genres } from "../types/filter";
import _ from "lodash";
import FilterList from "../components/FilterList";
type FilterScreenNavigationProp = StackNavigationProp<StackParamList, 'Filter'>;
type FilterScreenNavigationProp = StackNavigationProp<StackParamList, "Filter">;
type Props = {
navigation: FilterScreenNavigationProp;
};
const orderingOptions = [
{ key: "title", order: "asc" },
{ key: "title", order: "desc" },
{ key: "year", order: "asc" },
{ key: "year", order: "desc" },
{ key: "length", order: "asc" },
{ key: "length", order: "desc" },
];
const FilterPage = ({ navigation }: Props) => {
const [selected, setSelected] = useState("");
const onValueChange = (value: string) => {
setSelected(value);
};
const pickerItems = orderingOptions.map((option) => (
<Picker.Item
label={`${_.startCase(option.key)} - ${option.order}`}
value={option}
key={option.key}
/>
));
const FilterPage = ({navigation}: Props) => {
return <Text>FilterPage</Text>;
return (
<Form>
<Item fixedLabel picker>
<Label>Order by...</Label>
<Picker
mode="dropdown"
iosIcon={<Icon name="arrow-down" />}
placeholder=""
placeholderStyle={{ color: "#bfc6ea" }}
placeholderIconColor="#007aff"
style={{ width: undefined }}
selectedValue={selected}
onValueChange={onValueChange}
>
{pickerItems}
</Picker>
</Item>
<FilterList />
</Form>
);
};
export default FilterPage;
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment