emh/blazerapp
1
0
Fork 0
mirror of https://github.com/Blair-SGA-Dev-Team/blazerapp.git synced 2024-11-13 17:01:16 -05:00
Code Issues Packages Projects Releases Wiki Activity

Improved the clubs interface

Browse Source
This commit is contained in:
M10T 2020-08-10 15:25:00 -04:00
parent fbcd10dec0
commit 9a037e92a6
1 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/Clubs.js
View File

@ -1,4 +1,4 @@
import React from 'react'; import React, { useState } from 'react';
import { import {
SafeAreaView, SafeAreaView,
StyleSheet, StyleSheet,
@ -8,6 +8,7 @@ import {
StatusBar, StatusBar,
ActivityIndicator, ActivityIndicator,
FlatList, FlatList,
TouchableOpacity
} from 'react-native'; } from 'react-native';
import { import {
@ -20,12 +21,15 @@ import {
import { SearchBar } from 'react-native-elements'; import { SearchBar } from 'react-native-elements';
const ClubElement = ({item}) => { const ClubElement = ({item}) => {
//console.log(item) const [visible, setVisible] = useState(0)
const extra = visible?(<Text>{'\n'}Location: {item.item.loc} {"\n\n"}Sponsor: {item.item.sponsor}</Text>):(<></>);
return( return(
<View style={styles.item}> <View>
<Text style={styles.title}>{item.item.name}</Text> <TouchableOpacity style={styles.item} onPress={()=>setVisible(!visible)}>
<Text>Location: {item.item.loc} {"\n"}Sponsor: {item.item.sponsor}</Text> <Text style={styles.title}>{item.item.name}</Text>
</View> {extra}
</TouchableOpacity>
</View>
) )
} }
class Clubs extends React.Component { class Clubs extends React.Component {
@ -66,14 +70,12 @@ class Clubs extends React.Component {
} }
updateSearch = (search) => { updateSearch = (search) => {
this.setState({ search:search }); this.setState({ search:search });
ds = this.state.dataSearch.filter((thing)=>{return thing.name.startsWith(search)}) const searchPool = search.startsWith(this.state.search)?this.state.dataSearch:this.state.data;
const ds = searchPool.filter((thing)=>{return thing.name.toLowerCase().startsWith(search.toLowerCase())})
this.setState({dataSearch: ds}) this.setState({dataSearch: ds})
if (search == ""){
this.setState({dataSearch:this.state.data})
}
}; };
clearSearch = (search)=>{ clearSearch = (search)=>{
ds = this.state.data; const ds = this.state.data;
this.setState({dataSearch:ds}) this.setState({dataSearch:ds})
} }
render() { render() {
@ -85,7 +87,7 @@ class Clubs extends React.Component {
<SafeAreaView style={styles.container}> <SafeAreaView style={styles.container}>
<SearchBar <SearchBar
lightTheme lightTheme
placeholder="Type Here..." placeholder="Search Clubs"
onChangeText={this.updateSearch} onChangeText={this.updateSearch}
onCancel={this.clearSearch} onCancel={this.clearSearch}
onClear={this.clearSearch} onClear={this.clearSearch}