Moved about screen in sidemenu, fixed warnings
This commit is contained in:
keplyx
parent
d654a5d7a8
commit
e72196812e
6 changed files with 155 additions and 115 deletions
|
|
@ -65,15 +65,15 @@ export default class SideBar extends React.Component<Props, State> {
|
|||
route: "TutorInsaScreen",
|
||||
icon: "school",
|
||||
},
|
||||
{
|
||||
name: "Mails BlueMind",
|
||||
route: "BlueMindScreen",
|
||||
icon: "email",
|
||||
},
|
||||
{
|
||||
name: i18n.t('sidenav.divider2'),
|
||||
route: "Divider2"
|
||||
},
|
||||
{
|
||||
name: i18n.t('screens.bluemind'),
|
||||
route: "BlueMindScreen",
|
||||
icon: "email",
|
||||
},
|
||||
{
|
||||
name: i18n.t('screens.availableRooms'),
|
||||
route: "AvailableRoomScreen",
|
||||
|
|
@ -93,6 +93,11 @@ export default class SideBar extends React.Component<Props, State> {
|
|||
route: "SettingsScreen",
|
||||
icon: "settings",
|
||||
},
|
||||
{
|
||||
name: i18n.t('screens.about'),
|
||||
route: "AboutScreen",
|
||||
icon: "information",
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -31,24 +31,22 @@ export default class AboutDependenciesScreen extends React.Component<Props> {
|
|||
return (
|
||||
<Container>
|
||||
<CustomHeader hasBackButton={true} navigation={nav} title={i18n.t('aboutScreen.libs')}/>
|
||||
<Content>
|
||||
<FlatList
|
||||
data={data}
|
||||
keyExtractor={(item) => item.name}
|
||||
style={{minHeight: 300, width: '100%'}}
|
||||
renderItem={({item}) =>
|
||||
<ListItem>
|
||||
<Body>
|
||||
<Text>
|
||||
{item.name}
|
||||
</Text>
|
||||
<Text note>
|
||||
{item.version.replace('^', '')}
|
||||
</Text>
|
||||
</Body>
|
||||
</ListItem>}
|
||||
/>
|
||||
</Content>
|
||||
<FlatList
|
||||
data={data}
|
||||
keyExtractor={(item) => item.name}
|
||||
style={{minHeight: 300, width: '100%'}}
|
||||
renderItem={({item}) =>
|
||||
<ListItem>
|
||||
<Body>
|
||||
<Text>
|
||||
{item.name}
|
||||
</Text>
|
||||
<Text note>
|
||||
{item.version.replace('^', '')}
|
||||
</Text>
|
||||
</Body>
|
||||
</ListItem>}
|
||||
/>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -185,6 +185,107 @@ export default class AboutScreen extends React.Component<Props, State> {
|
|||
},
|
||||
];
|
||||
|
||||
dataOrder: Array<Object> = [
|
||||
{
|
||||
id: 'app',
|
||||
},
|
||||
{
|
||||
id: 'team',
|
||||
},
|
||||
{
|
||||
id: 'techno',
|
||||
},
|
||||
];
|
||||
|
||||
getAppCard() {
|
||||
return (
|
||||
<Card>
|
||||
<CardItem>
|
||||
<Left>
|
||||
<Thumbnail square source={require('../../assets/icon.png')}/>
|
||||
<Body>
|
||||
<H1>{appJson.expo.name}</H1>
|
||||
<Text note>
|
||||
v.{appJson.expo.version}
|
||||
</Text>
|
||||
</Body>
|
||||
</Left>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.appData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
listKey={(item) => "app"}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
getTeamCard() {
|
||||
return (
|
||||
<Card>
|
||||
<CardItem>
|
||||
<Left>
|
||||
<CustomMaterialIcon
|
||||
icon={'account-multiple'}
|
||||
fontSize={40}
|
||||
width={40}
|
||||
color={ThemeManager.getCurrentThemeVariables().brandPrimary}/>
|
||||
<Body>
|
||||
<H1>{i18n.t('aboutScreen.team')}</H1>
|
||||
</Body>
|
||||
</Left>
|
||||
</CardItem>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.author')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.authorData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
listKey={(item) => "team1"}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.additionalDev')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.additionalDevData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
listKey={(item) => "team2"}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
getTechnoCard() {
|
||||
return (
|
||||
<Card>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.technologies')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.technoData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
listKey={(item) => "techno"}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get a clickable card item to be rendered inside a card.
|
||||
*
|
||||
|
|
@ -284,86 +385,33 @@ export default class AboutScreen extends React.Component<Props, State> {
|
|||
}
|
||||
}
|
||||
|
||||
getMainCard(item: Object) {
|
||||
switch (item.id) {
|
||||
case 'app':
|
||||
return this.getAppCard();
|
||||
case 'team':
|
||||
return this.getTeamCard();
|
||||
case 'techno':
|
||||
return this.getTechnoCard();
|
||||
}
|
||||
return <View/>;
|
||||
}
|
||||
|
||||
render() {
|
||||
const nav = this.props.navigation;
|
||||
return (
|
||||
<Container>
|
||||
{this.getBugReportModal()}
|
||||
<CustomHeader navigation={nav} title={i18n.t('screens.about')} hasBackButton={true}/>
|
||||
<Content padder>
|
||||
<Card>
|
||||
<CardItem>
|
||||
<Left>
|
||||
<Thumbnail square source={require('../../assets/icon.png')}/>
|
||||
<Body>
|
||||
<H1>{appJson.expo.name}</H1>
|
||||
<Text note>
|
||||
v.{appJson.expo.version}
|
||||
</Text>
|
||||
</Body>
|
||||
</Left>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.appData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardItem>
|
||||
<Left>
|
||||
<CustomMaterialIcon
|
||||
icon={'account-multiple'}
|
||||
fontSize={40}
|
||||
width={40}
|
||||
color={ThemeManager.getCurrentThemeVariables().brandPrimary}/>
|
||||
<Body>
|
||||
<H1>{i18n.t('aboutScreen.team')}</H1>
|
||||
</Body>
|
||||
</Left>
|
||||
</CardItem>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.author')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.authorData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.additionalDev')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.additionalDevData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardItem header>
|
||||
<Text>{i18n.t('aboutScreen.technologies')}</Text>
|
||||
</CardItem>
|
||||
<FlatList
|
||||
data={this.technoData}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.icon}
|
||||
renderItem={({item}) =>
|
||||
this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
</Content>
|
||||
<FlatList
|
||||
style={{padding: 5}}
|
||||
data={this.dataOrder}
|
||||
extraData={this.state}
|
||||
keyExtractor={(item) => item.id}
|
||||
renderItem={({item}) =>
|
||||
this.getMainCard(item)
|
||||
}
|
||||
/>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -212,24 +212,11 @@ export default class SettingsScreen extends React.Component<Props, State> {
|
|||
);
|
||||
}
|
||||
|
||||
getRightButton() {
|
||||
return (
|
||||
<Touchable
|
||||
style={{padding: 6}}
|
||||
onPress={() => this.props.navigation.navigate('AboutScreen')}>
|
||||
<CustomMaterialIcon
|
||||
color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
|
||||
icon="information"/>
|
||||
</Touchable>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
const nav = this.props.navigation;
|
||||
return (
|
||||
<Container>
|
||||
<CustomHeader navigation={nav} title={i18n.t('screens.settings')} hasBackButton={true}
|
||||
rightButton={this.getRightButton()}/>
|
||||
<CustomHeader navigation={nav} title={i18n.t('screens.settings')} hasBackButton={true}/>
|
||||
<Content padder>
|
||||
<Card>
|
||||
<CardItem header>
|
||||
|
|
|
|||
|
|
@ -7,12 +7,13 @@
|
|||
"menuSelf": "RU Menu",
|
||||
"settings": "Settings",
|
||||
"availableRooms": "Available rooms",
|
||||
"bluemind": "INSA Mails",
|
||||
"about": "About",
|
||||
"debug": "Debug"
|
||||
},
|
||||
"sidenav": {
|
||||
"divider1": "Nice websites",
|
||||
"divider2": "Useful services",
|
||||
"divider1": "Useful websites",
|
||||
"divider2": "Services",
|
||||
"divider3": "Personalisation"
|
||||
},
|
||||
"intro": {
|
||||
|
|
|
|||
|
|
@ -7,12 +7,13 @@
|
|||
"menuSelf": "Menu du RU",
|
||||
"settings": "Paramètres",
|
||||
"availableRooms": "Salles dispo",
|
||||
"bluemind": "Mails INSA",
|
||||
"about": "À Propos",
|
||||
"debug": "Debug"
|
||||
},
|
||||
"sidenav": {
|
||||
"divider1": "Sites bien",
|
||||
"divider2": "Services utiles",
|
||||
"divider1": "Sites utiles",
|
||||
"divider2": "Services",
|
||||
"divider3": "Personnalisation"
|
||||
},
|
||||
"intro": {
|
||||
|
|
|
|||
Loading…
Reference in a new issue