87 lines
2.1 KiB
JavaScript
87 lines
2.1 KiB
JavaScript
import React, { useEffect, useState } from 'react'
|
|
import {
|
|
View,
|
|
StyleSheet,
|
|
Text,
|
|
TouchableOpacity
|
|
} from 'react-native'
|
|
import { useNavigation } from '@react-navigation/native';
|
|
import Theme from '../../../../components/theme.style.js';
|
|
import List from './List.js';
|
|
import Search from '../search/Search.js';
|
|
import SearchResult from '../search/SearchResult';
|
|
import CustomHeader from '../../../../components/header.js'
|
|
import CustomSafeArea from '../../../../components/safeArea.component.js'
|
|
import DB from '../../../../components/storage';
|
|
|
|
const Lists = (props) => {
|
|
const [result, setResult] = useState([]);
|
|
const [savedLocations, setSavedLocations] = useState([]);
|
|
const navigation = useNavigation();
|
|
|
|
useEffect(() => {
|
|
init();
|
|
}, [])
|
|
|
|
const init = async () => {
|
|
const locations = await DB.get("iqair");
|
|
const parsedLocations = JSON.parse(locations);
|
|
|
|
setSavedLocations(parsedLocations);
|
|
}
|
|
|
|
const onPress = () => {
|
|
navigation.navigate("Search", { onGoBack: () => init() });
|
|
}
|
|
|
|
return (
|
|
<CustomSafeArea>
|
|
<CustomHeader
|
|
navigation={navigation}
|
|
title="IQAIR"
|
|
boldTitle={true}
|
|
back={result.length > 0}
|
|
onBackPress={result.length > 0 ? () => {
|
|
init();
|
|
setResult([]);
|
|
}
|
|
:
|
|
() => navigation.goBack()
|
|
}
|
|
/>
|
|
|
|
<View style={styles.container}>
|
|
<Search onPress={onPress} />
|
|
|
|
{ result.length === 0 &&
|
|
<List data={savedLocations} init={init} /> }
|
|
|
|
<TouchableOpacity onPress={onPress} style={styles.addLocationButton}>
|
|
<Text style={styles.addLocationText}>ADD UNIOIL STATION</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</CustomSafeArea>
|
|
)
|
|
}
|
|
|
|
export default Lists
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
paddingTop: 20,
|
|
},
|
|
addLocationButton: {
|
|
backgroundColor: Theme.colors.primary,
|
|
width: Theme.screen.w - 80,
|
|
alignSelf: 'center',
|
|
marginBottom: 20,
|
|
alignItems: 'center',
|
|
paddingVertical: 10,
|
|
borderRadius: 5
|
|
},
|
|
addLocationText: {
|
|
color: Theme.colors.white,
|
|
fontSize: 15
|
|
}
|
|
}) |