katoikia-app/mobile-ui/navigation/Menu.js

72 lines
1.9 KiB
JavaScript
Raw Permalink Normal View History

2022-07-18 20:54:08 +00:00
import { Block, Text, theme } from "galio-framework";
import { Image, ScrollView, StyleSheet } from "react-native";
import { DrawerItem as DrawerCustomItem } from "../components";
import Images from "../constants/Images";
import React from "react";
function CustomDrawerContent({
drawerPosition,
navigation,
profile,
focused,
state,
...rest
}) {
const screens = ["Home", "Profile", "Account", "Elements", "Articles"];
return (
<Block
style={styles.container}
forceInset={{ top: "always", horizontal: "never" }}
>
<Block flex={0.06} style={styles.header}>
<Image styles={styles.logo} source={Images.Logo} />
</Block>
<Block flex style={{ paddingLeft: 8, paddingRight: 14 }}>
<ScrollView style={{ flex: 1 }} showsVerticalScrollIndicator={false}>
{screens.map((item, index) => {
return (
<DrawerCustomItem
title={item}
key={index}
navigation={navigation}
focused={state.index === index ? true : false}
/>
);
})}
<Block
flex
style={{ marginTop: 24, marginVertical: 8, paddingHorizontal: 8 }}
>
<Block
style={{
borderColor: "rgba(0,0,0,0.2)",
width: "100%",
borderWidth: StyleSheet.hairlineWidth,
}}
/>
<Text color="#8898AA" style={{ marginTop: 16, marginLeft: 8 }}>
DOCUMENTATION
</Text>
</Block>
<DrawerCustomItem title="Getting Started" navigation={navigation} />
</ScrollView>
</Block>
</Block>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
header: {
paddingHorizontal: 28,
paddingBottom: theme.SIZES.BASE,
paddingTop: theme.SIZES.BASE * 3,
justifyContent: "center",
},
});
export default CustomDrawerContent;