49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import {
|
|
SafeAreaView,
|
|
View,
|
|
Text,
|
|
ScrollView,
|
|
StyleSheet,
|
|
StatusBar,
|
|
} from 'react-native';
|
|
import { COLORS } from '../../constants/color';
|
|
import { ModuleTile } from '../../components/Module/module';
|
|
import { SafeAreaProvider } from 'react-native-safe-area-context';
|
|
import { MODULES_DATA } from '../../constants/data';
|
|
import styles from '../../styles/Module/module';
|
|
|
|
|
|
|
|
|
|
export default function ModulesScreen() {
|
|
|
|
|
|
return (
|
|
<SafeAreaProvider style={{ flex: 1, backgroundColor: COLORS.background }}>
|
|
|
|
<StatusBar barStyle="light-content" backgroundColor={COLORS.background} />
|
|
|
|
<ScrollView contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false}>
|
|
{/* Header Title & Subtitle */}
|
|
<View style={styles.header}>
|
|
<Text style={styles.title}>All modules</Text>
|
|
<Text style={styles.subtitle}>Facility Management & IoT platform</Text>
|
|
</View>
|
|
|
|
{/* 3-Column Grid Container */}
|
|
<View style={styles.gridContainer}>
|
|
{MODULES_DATA.map((item) => (
|
|
<ModuleTile
|
|
key={item.id}
|
|
module={item}
|
|
|
|
/>
|
|
))}
|
|
</View>
|
|
</ScrollView>
|
|
</SafeAreaProvider>
|
|
);
|
|
}
|
|
|