77 lines
2.0 KiB
TypeScript
77 lines
2.0 KiB
TypeScript
import React, { useState } from 'react';
|
|
import {
|
|
SafeAreaView,
|
|
View,
|
|
Text,
|
|
FlatList,
|
|
StyleSheet,
|
|
StatusBar,
|
|
} from 'react-native';
|
|
import { SAMPLE_ASSETS } from '../../constants/data';
|
|
import { COLORS } from '../../constants/color';
|
|
import { } from '../../types/type';
|
|
import { SearchBar } from '../../components/searchbar';
|
|
import { AssetCard } from '../../components/assetCard';
|
|
import { SafeAreaProvider } from 'react-native-safe-area-context';
|
|
import BottomTabBar from '../../navigation/bottonTabBar';
|
|
import { ScrollView } from 'react-native';
|
|
|
|
|
|
|
|
export default function AssetsScreen() {
|
|
const [search, setSearch] = useState('');
|
|
|
|
const filteredAssets = SAMPLE_ASSETS.filter(
|
|
(item) =>
|
|
item.name.toLowerCase().includes(search.toLowerCase()) ||
|
|
item.location.toLowerCase().includes(search.toLowerCase())
|
|
);
|
|
|
|
return (
|
|
<SafeAreaProvider style={{ flex: 1, backgroundColor: COLORS.background }}>
|
|
<ScrollView>
|
|
<StatusBar barStyle="light-content" backgroundColor={COLORS.background} />
|
|
<View style={styles.content}>
|
|
{/* Header Section */}
|
|
<Text style={styles.title}>Assets</Text>
|
|
<Text style={styles.subtitle}>251 assets · 242 online</Text>
|
|
|
|
{/* Search */}
|
|
<SearchBar value={search} onChangeText={setSearch} />
|
|
|
|
{/* Assets List */}
|
|
<FlatList
|
|
data={filteredAssets}
|
|
keyExtractor={(item) => item.id}
|
|
renderItem={({ item }) => <AssetCard asset={item} />}
|
|
showsVerticalScrollIndicator={false}
|
|
/>
|
|
</View>
|
|
</ScrollView>
|
|
<BottomTabBar />
|
|
</SafeAreaProvider>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: COLORS.background,
|
|
},
|
|
content: {
|
|
flex: 1,
|
|
paddingHorizontal: 20,
|
|
paddingTop: 16,
|
|
},
|
|
title: {
|
|
color: COLORS.textPrimary,
|
|
fontSize: 28,
|
|
fontWeight: 'bold',
|
|
},
|
|
subtitle: {
|
|
color: COLORS.textSecondary,
|
|
fontSize: 14,
|
|
marginTop: 4,
|
|
marginBottom: 16,
|
|
},
|
|
}); |