Update About Screen

This commit is contained in:
docjyJ 2020-09-01 11:21:26 +02:00
parent 3ff5a40f8d
commit c6bb1ccc86
3 changed files with 70 additions and 99 deletions

View file

@ -346,9 +346,7 @@
"license": "License",
"debug": "Debug",
"team": "Team",
"author": "Author and maintainer",
"authorMail": "Send an email",
"additionalDev": "Developer",
"technologies": "Technologies",
"reactNative": "Made with React Native",
"libs": "Libraries used",

View file

@ -345,9 +345,7 @@
"license": "Licence",
"debug": "Debug",
"team": "Équipe",
"author": "Auteur et mainteneur",
"authorMail": "Envoyer un mail",
"additionalDev": "Dévelopeur",
"technologies": "Technologies",
"reactNative": "Créé avec React Native",
"libs": "Librairies utilisées",

View file

@ -5,7 +5,7 @@ import {FlatList, Linking, Platform, Image, View} from 'react-native';
import i18n from 'i18n-js';
import {Avatar, Card, List, withTheme} from 'react-native-paper';
import {StackNavigationProp} from '@react-navigation/stack';
import {Modalize} from 'react-native-modalize';
import {Modalize} from "react-native-modalize";
import packageJson from '../../../package.json';
import CollapsibleFlatList from '../../components/Collapsible/CollapsibleFlatList';
import APP_LOGO from '../../../assets/android.icon.round.png';
@ -13,7 +13,8 @@ import type {
CardTitleIconPropsType,
ListIconPropsType,
} from '../../constants/PaperStyles';
import OptionsDialog from '../../components/Dialogs/OptionsDialog';
import OptionsDialog from "../../components/Dialogs/OptionsDialog";
import type {OptionsDialogButtonType} from "../../components/Dialogs/OptionsDialog";
type ListItemType = {
onPressCallback: () => void,
@ -81,25 +82,23 @@ class AboutScreen extends React.Component<PropsType> {
*/
teamUsers = {
arnaud: {
name: 'Arnaud Vergnrt',
message: i18n.t('screens.about.user.arnaud'),
icon: 'crown',
name: 'Arnaud VERGNET',
message: 'C vrément tro 1 bg !!',
icon: 'account-circle',
btnTrool: {
title: 'SWAG',
onPress: () => {
openWebLink(links.meme);
title: 'SWAG',
onPress: () => {
openWebLink(links.meme);
},
},
},
btnLinkedin: {
title: '',
icon: 'linkedin',
title: 'Linkedin',
onPress: () => {
openWebLink(links.arnaudMail);
},
},
btnMail: {
title: '',
icon: 'email-edit',
title: i18n.t('screens.about.authorMail'),
onPress: () => {
openWebLink(links.arnaudLinkedin);
},
@ -107,38 +106,22 @@ class AboutScreen extends React.Component<PropsType> {
},
yohan: {
name: 'Yohan Simard',
message: i18n.t('screens.about.user.yohan'),
icon: 'xml',
message: 'Correction de quelques bugs',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: {
title: '',
icon: 'linkedin',
title: 'Linkedin',
onPress: () => {
openWebLink(links.yohanLinkedin);
},
},
btnMail: {
title: '',
icon: 'email-edit',
title: i18n.t('screens.about.authorMail'),
onPress: () => {
openWebLink(links.yohanMail);
},
},
},
you: {
name: i18n.t('screens.about.user.youName'),
message: i18n.t('screens.about.user.you'),
icon: 'hand-pointing-right',
btnTrool: {
title: '',
icon: 'git',
onPress: () => {
openWebLink(links.git);
},
},
btnLinkedin: null,
btnMail: null,
},
};
/**
@ -147,40 +130,40 @@ class AboutScreen extends React.Component<PropsType> {
thanksUsers = {
beranger: {
name: 'Béranger Quintana Y Arciosana',
message: i18n.t('screens.about.user.beranger'),
icon: 'account-heart',
message: 'Étudiant en AE (2020) et Président de lAmicale au moment de la création et du lancement du projet. Lapplication, cétait son idée. Il a beaucoup aidé pour trouver des bugs, de nouvelles fonctionnalités et faire de la com.',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: null,
btnMail: null,
},
celine: {
name: 'Céline Tassin',
message: i18n.t('screens.about.user.celine'),
icon: 'brush',
message: 'Étudiante en GPE (2020). Sans elle, tout serait moins mignon. Elle a aidé pour écrire le texte, faire de la com, et aussi à créer la mascotte 🦊.',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: null,
btnMail: null,
},
damien: {
name: 'Damien Molina',
message: i18n.t('screens.about.user.damien'),
icon: 'web',
message: 'Étudiant en IR (2020) et créateur de la dernière version du site de lAmicale. Grâce à son aide, intégrer les services de lAmicale à lapplication a été très simple.',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: null,
btnMail: null,
},
titouan: {
name: 'Titouan Labourdette',
message: i18n.t('screens.about.user.titouan'),
icon: 'shield-bug',
message: 'Étudiant en AE (2020) et Président de lAmicale au moment de la création et du lancement du projet. Lapplication, cétait son idée. Il a beaucoup aidé pour trouver des bugs, de nouvelles fonctionnalités et faire de la com.',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: null,
btnMail: null,
},
theo: {
name: 'Théo Tami',
message: i18n.t('screens.about.user.theo'),
icon: 'food-apple',
message: 'Étudiant en IR (2020). Il a beaucoup aidé pour trouver des bugs et proposer des nouvelles fonctionnalités.',
icon: 'account-circle',
btnTrool: null,
btnLinkedin: null,
btnMail: null,
@ -257,14 +240,6 @@ class AboutScreen extends React.Component<PropsType> {
text: this.teamUsers.yohan.name,
showChevron: false,
},
{
onPressCallback: () => {
this.onListItemPress(this.teamUsers.you);
},
icon: this.teamUsers.you.icon,
text: this.teamUsers.you.name,
showChevron: false,
},
];
/**
@ -371,24 +346,24 @@ class AboutScreen extends React.Component<PropsType> {
* Callback used when clicking an article in the list.
* It opens the modal to show detailed information about the article
*
* @param user A user key
* @param user TODO
*/
onListItemPress(user: AthorsItemType) {
const dialogBtn: Array<IconOptionsDialogButtonType> = [
const dialogBtn: Array<OptionsDialogButtonType> = [
{
title: 'OK',
onPress: () => {
this.setState({dialogVisible: false});
this.onDialogDismiss();
},
},
}
];
if (user.btnMail != null) {
if(user.btnMail != null) {
dialogBtn.push(user.btnMail);
}
if (user.btnLinkedin != null) {
if(user.btnLinkedin != null) {
dialogBtn.push(user.btnLinkedin);
}
if (user.btnTrool != null) {
if(user.btnTrool != null) {
dialogBtn.push(user.btnTrool);
}
this.setState({
@ -455,27 +430,27 @@ class AboutScreen extends React.Component<PropsType> {
}
/**
* Get the thank you card showing support information and links
* Gets the thanks card showing information and links about the team TODO
*
* @return {*}
*/
getThanksCard(): React.Node {
return (
<Card style={{marginBottom: 10}}>
<Card.Title
title={i18n.t('screens.about.thanks')}
left={(iconProps: CardTitleIconPropsType): React.Node => (
<Avatar.Icon size={iconProps.size} icon="hand-heart" />
)}
/>
<Card.Content>
<FlatList
data={this.thanksData}
keyExtractor={this.keyExtractor}
renderItem={this.getCardItem}
<Card style={{marginBottom: 10}}>
<Card.Title
title={i18n.t('screens.about.thanks')}
left={(iconProps: CardTitleIconPropsType): React.Node => (
<Avatar.Icon size={iconProps.size} icon="hand-heart" />
)}
/>
</Card.Content>
</Card>
<Card.Content>
<FlatList
data={this.thanksData}
keyExtractor={this.keyExtractor}
renderItem={this.getCardItem}
/>
</Card.Content>
</Card>
);
}
@ -486,21 +461,21 @@ class AboutScreen extends React.Component<PropsType> {
*/
getTechnoCard(): React.Node {
return (
<Card style={{marginBottom: 10}}>
<Card.Title
title={i18n.t('screens.about.technologies')}
left={(iconProps: CardTitleIconPropsType): React.Node => (
<Avatar.Icon size={iconProps.size} icon="wrench" />
)}
/>
<Card.Content>
<FlatList
data={this.technoData}
keyExtractor={this.keyExtractor}
renderItem={this.getCardItem}
<Card style={{marginBottom: 10}}>
<Card.Title
title={i18n.t('screens.about.technologies')}
left={(iconProps: CardTitleIconPropsType): React.Node => (
<Avatar.Icon size={iconProps.size} icon="build" />
)}
/>
</Card.Content>
</Card>
<Card.Content>
<FlatList
data={this.technoData}
keyExtractor={this.keyExtractor}
renderItem={this.getCardItem}
/>
</Card.Content>
</Card>
);
}
@ -589,20 +564,20 @@ class AboutScreen extends React.Component<PropsType> {
const {state} = this;
return (
<View
style={{
height: '100%',
}}>
style={{
height: '100%',
}}>
<CollapsibleFlatList
style={{padding: 5}}
data={this.dataOrder}
renderItem={this.getMainCard}
/>
<OptionsDialog
visible={state.dialogVisible}
title={state.dialogTitle}
message={state.dialogMessage}
buttons={state.dialogButtons}
onDismiss={state.onDialogDismiss}
visible={state.dialogVisible}
title={state.dialogTitle}
message={state.dialogMessage}
buttons={state.dialogButtons}
onDismiss={state.onDialogDismiss}
/>
</View>
);