Commit 8ac51fe1 authored by Halvor Horge's avatar Halvor Horge

#7 Added filtering buttons to hamburger button

parent 6430a54b
......@@ -2,8 +2,8 @@
"devToolsPort": 19002,
"expoServerPort": 19000,
"packagerPort": 19001,
"packagerPid": 17848,
"expoServerNgrokUrl": "https://av-4mb.hhorge.p4.exp.direct",
"packagerNgrokUrl": "https://packager.av-4mb.hhorge.p4.exp.direct",
"ngrokPid": 1920
"packagerPid": 13272,
"expoServerNgrokUrl": "https://3u-kzx.hhorge.p4.exp.direct",
"packagerNgrokUrl": "https://packager.3u-kzx.hhorge.p4.exp.direct",
"ngrokPid": 18672
}
......@@ -3,6 +3,6 @@
"lanType": "ip",
"dev": true,
"minify": false,
"urlRandomness": "av-4mb",
"urlRandomness": "3u-kzx",
"https": false
}
......@@ -3,19 +3,13 @@ import React from 'react';
import { Text, StyleSheet, ScrollView, Image } from 'react-native';
import Search from './Search';
import Content from './Content'
import Filtering from './Filtering'
import SideMenuComp from './SideMenu'
//import Content from '../Content/Content.js';
//import Wordcloud from '../Wordcloud/Wordcloud.js';
const Body = () => {
return(
<ScrollView>
<Search/>
<Content/>
<Filtering/>
</ScrollView>
);
}
......
......@@ -38,11 +38,19 @@ const Content = () => {
const dispatch = useDispatch();
const stateAlbums = useSelector(state => state.albums);
const stateSearch = useSelector(state => state.search);
const stateGenre = useSelector(state => state.filter);
const stateType = useSelector(state => state.filter);
const example = {filterType: 'Vodka'}
function checkStateTypeEmpty (){
let isStateTypeEmpty = stateType == '';
return isStateTypeEmpty ? { } : {filterType: stateType};
}
const { loading, error, data } = useQuery(GET_PRODUCTS, {
variables: { limit: 15, search: stateSearch, sort: "-price"}
});
variables: { limit: 15, search: stateSearch, sort: "-price", filters: checkStateTypeEmpty() }});
if (loading) return <Text> Loading ... </Text>;
if (error) return <Text> {error} </Text>;
......
......@@ -3,35 +3,43 @@ import { View } from 'react-native';
import RadioForm, {RadioButton, RadioButtonInput, RadioButtonLabel} from 'react-native-simple-radio-button';
import { useDispatch } from "react-redux";
import { filter } from "../actions";
import { useSelector } from "react-redux";
import { toggleSideMenu } from "../actions";
const genres = [
{label: "All", value: ""},
{label: "Jazz", value: "All"},
{label: "Blues", value: "Blues"},
{label: "Pop", value: "Pop"},
{label: "Rock", value: "Rock"},
{label: "Funk/Soul", value: "Funk/Soul"},
{label: "Electronic", value: "Electronic"},
{label: "Classical", value: "Classical"},
{label: "Reggae", value: "Reggae"},
{label: "Hip Hop", value: "Hip Hop"},
{label: "Folk", value: "Folk"}
{label: "Akevitt", value: "Akevitt"},
{label: "Bitter", value: "Bitter"},
{label: "Druebrennevin", value: "Druebrennevin"},
{label: "Gin", value: "Gin"},
{label: "Hvitvin", value: "Hvitvin"},
{label: "Likør", value: "Likør"},
{label: "Portvin", value: "Portvin"},
{label: "Rødvin", value: "Rødvin"},
{label: "Vodka", value: "Vodka"},
{label: "Whisky", value: "Whisky"},
]
const Filtering = () => {
const stateType = useSelector(state => state.filter);
const dispatch = useDispatch();
function updateFilter(e) {
dispatch(filter(e));
}
function onButtonPress(v){
updateFilter(v)
dispatch(toggleSideMenu())
}
return(
<View>
<RadioForm
radio_props={genres}
initial={0}
onPress={(value) => updateFilter(value)}
initial={"Akevitt"}
onPress={(value) => onButtonPress(value)}
/>
</View>
)
......
Markdown is supported
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