Compare commits
No commits in common. "5977ce257b458c4d5d2d955cdc4788c0790d1a0b" and "172b7e81877b9e9634e6759bfbaaa16b697f4de5" have entirely different histories.
5977ce257b
...
172b7e8187
8 changed files with 252 additions and 258 deletions
|
|
@ -27,7 +27,7 @@ import type {
|
|||
|
||||
type PropsType = {
|
||||
onPress: () => void;
|
||||
categoryTranslator: (id: number) => ClubCategoryType | null;
|
||||
categoryTranslator: (id: number) => ClubCategoryType;
|
||||
item: ClubType;
|
||||
height: number;
|
||||
theme: ReactNativePaper.Theme;
|
||||
|
|
@ -50,16 +50,14 @@ class ClubListItem extends React.Component<PropsType> {
|
|||
const final: Array<React.ReactNode> = [];
|
||||
categories.forEach((cat: number | null) => {
|
||||
if (cat != null) {
|
||||
const category = props.categoryTranslator(cat);
|
||||
if (category) {
|
||||
final.push(
|
||||
<Chip
|
||||
style={{marginRight: 5, marginBottom: 5}}
|
||||
key={`${props.item.id}:${category.id}`}>
|
||||
{category.name}
|
||||
</Chip>,
|
||||
);
|
||||
}
|
||||
const category: ClubCategoryType = props.categoryTranslator(cat);
|
||||
final.push(
|
||||
<Chip
|
||||
style={{marginRight: 5, marginBottom: 5}}
|
||||
key={`${props.item.id}:${category.id}`}>
|
||||
{category.name}
|
||||
</Chip>,
|
||||
);
|
||||
}
|
||||
});
|
||||
return <View style={{flexDirection: 'row'}}>{final}</View>;
|
||||
|
|
|
|||
|
|
@ -17,6 +17,8 @@
|
|||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {List} from 'react-native-paper';
|
||||
import {View} from 'react-native-animatable';
|
||||
|
|
@ -24,8 +26,8 @@ import CollapsibleFlatList from '../../components/Collapsible/CollapsibleFlatLis
|
|||
import packageJson from '../../../package.json';
|
||||
|
||||
type ListItemType = {
|
||||
name: string;
|
||||
version: string;
|
||||
name: string,
|
||||
version: string,
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -35,9 +37,9 @@ type ListItemType = {
|
|||
* @return {Array<ListItemType>}
|
||||
*/
|
||||
function generateListFromObject(object: {
|
||||
[key: string]: string;
|
||||
[key: string]: string,
|
||||
}): Array<ListItemType> {
|
||||
const list: Array<ListItemType> = [];
|
||||
const list = [];
|
||||
const keys = Object.keys(object);
|
||||
keys.forEach((key: string) => {
|
||||
list.push({name: key, version: object[key]});
|
||||
|
|
@ -54,13 +56,13 @@ export default class AboutDependenciesScreen extends React.Component<null> {
|
|||
data: Array<ListItemType>;
|
||||
|
||||
constructor() {
|
||||
super(null);
|
||||
super();
|
||||
this.data = generateListFromObject(packageJson.dependencies);
|
||||
}
|
||||
|
||||
keyExtractor = (item: ListItemType): string => item.name;
|
||||
|
||||
getRenderItem = ({item}: {item: ListItemType}) => (
|
||||
getRenderItem = ({item}: {item: ListItemType}): React.Node => (
|
||||
<List.Item
|
||||
title={item.name}
|
||||
description={item.version.replace('^', '').replace('~', '')}
|
||||
|
|
@ -69,15 +71,15 @@ export default class AboutDependenciesScreen extends React.Component<null> {
|
|||
);
|
||||
|
||||
getItemLayout = (
|
||||
data: Array<ListItemType> | null | undefined,
|
||||
data: ListItemType,
|
||||
index: number,
|
||||
): {length: number; offset: number; index: number} => ({
|
||||
): {length: number, offset: number, index: number} => ({
|
||||
length: LIST_ITEM_HEIGHT,
|
||||
offset: LIST_ITEM_HEIGHT * index,
|
||||
index,
|
||||
});
|
||||
|
||||
render() {
|
||||
render(): React.Node {
|
||||
return (
|
||||
<View>
|
||||
<CollapsibleFlatList
|
||||
|
|
@ -17,32 +17,37 @@
|
|||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {FlatList, Linking, Platform, Image, View} from 'react-native';
|
||||
import i18n from 'i18n-js';
|
||||
import {Avatar, Card, List} from 'react-native-paper';
|
||||
import {Avatar, Card, List, withTheme} from 'react-native-paper';
|
||||
import {StackNavigationProp} from '@react-navigation/stack';
|
||||
import packageJson from '../../../package.json';
|
||||
import CollapsibleFlatList from '../../components/Collapsible/CollapsibleFlatList';
|
||||
import APP_LOGO from '../../../assets/android.icon.round.png';
|
||||
import type {
|
||||
CardTitleIconPropsType,
|
||||
ListIconPropsType,
|
||||
} from '../../constants/PaperStyles';
|
||||
import OptionsDialog from '../../components/Dialogs/OptionsDialog';
|
||||
import type {OptionsDialogButtonType} from '../../components/Dialogs/OptionsDialog';
|
||||
|
||||
const APP_LOGO = require('../../../assets/android.icon.round.png');
|
||||
|
||||
type ListItemType = {
|
||||
onPressCallback: () => void;
|
||||
icon: string;
|
||||
text: string;
|
||||
showChevron: boolean;
|
||||
onPressCallback: () => void,
|
||||
icon: string,
|
||||
text: string,
|
||||
showChevron: boolean,
|
||||
};
|
||||
|
||||
type MemberItemType = {
|
||||
name: string;
|
||||
message: string;
|
||||
icon: string;
|
||||
trollLink?: string;
|
||||
linkedin?: string;
|
||||
mail?: string;
|
||||
name: string,
|
||||
message: string,
|
||||
icon: string,
|
||||
trollLink?: string,
|
||||
linkedin?: string,
|
||||
mail?: string,
|
||||
};
|
||||
|
||||
const links = {
|
||||
|
|
@ -59,14 +64,14 @@ const links = {
|
|||
};
|
||||
|
||||
type PropsType = {
|
||||
navigation: StackNavigationProp<any>;
|
||||
navigation: StackNavigationProp,
|
||||
};
|
||||
|
||||
type StateType = {
|
||||
dialogVisible: boolean;
|
||||
dialogTitle: string;
|
||||
dialogMessage: string;
|
||||
dialogButtons: Array<OptionsDialogButtonType>;
|
||||
dialogVisible: boolean,
|
||||
dialogTitle: string,
|
||||
dialogMessage: string,
|
||||
dialogButtons: Array<OptionsDialogButtonType>,
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -81,6 +86,7 @@ function openWebLink(link: string) {
|
|||
* Class defining an about screen. This screen shows the user information about the app and it's author.
|
||||
*/
|
||||
class AboutScreen extends React.Component<PropsType, StateType> {
|
||||
|
||||
/**
|
||||
* Object containing data relative to major contributors
|
||||
*/
|
||||
|
|
@ -103,8 +109,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
message: i18n.t('screens.about.user.yohan'),
|
||||
icon: 'xml',
|
||||
linkedin: 'https://www.linkedin.com/in/yohan-simard',
|
||||
mail:
|
||||
'mailto:ysimard@etud.insa-toulouse.fr?' +
|
||||
mail: 'mailto:ysimard@etud.insa-toulouse.fr?' +
|
||||
'subject=' +
|
||||
'Application Amicale INSA Toulouse' +
|
||||
'&body=' +
|
||||
|
|
@ -328,7 +333,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
* @param user The member to show information for
|
||||
*/
|
||||
onContributorListItemPress(user: MemberItemType) {
|
||||
const dialogBtn: Array<OptionsDialogButtonType> = [
|
||||
const dialogBtn = [
|
||||
{
|
||||
title: 'OK',
|
||||
onPress: this.onDialogDismiss,
|
||||
|
|
@ -374,14 +379,15 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getAppCard() {
|
||||
getAppCard(): React.Node {
|
||||
return (
|
||||
<Card style={{marginBottom: 10}}>
|
||||
<Card.Title
|
||||
title="Campus"
|
||||
subtitle={packageJson.version}
|
||||
left={(iconProps) => (
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Image
|
||||
size={iconProps.size}
|
||||
source={APP_LOGO}
|
||||
style={{width: iconProps.size, height: iconProps.size}}
|
||||
/>
|
||||
|
|
@ -403,12 +409,12 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getTeamCard() {
|
||||
getTeamCard(): React.Node {
|
||||
return (
|
||||
<Card style={{marginBottom: 10}}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.about.team')}
|
||||
left={(iconProps) => (
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Avatar.Icon size={iconProps.size} icon="account-multiple" />
|
||||
)}
|
||||
/>
|
||||
|
|
@ -428,12 +434,12 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getThanksCard() {
|
||||
getThanksCard(): React.Node {
|
||||
return (
|
||||
<Card style={{marginBottom: 10}}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.about.thanks')}
|
||||
left={(iconProps) => (
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Avatar.Icon size={iconProps.size} icon="hand-heart" />
|
||||
)}
|
||||
/>
|
||||
|
|
@ -453,12 +459,12 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getTechnoCard() {
|
||||
getTechnoCard(): React.Node {
|
||||
return (
|
||||
<Card style={{marginBottom: 10}}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.about.technologies')}
|
||||
left={(iconProps) => (
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Avatar.Icon size={iconProps.size} icon="wrench" />
|
||||
)}
|
||||
/>
|
||||
|
|
@ -479,13 +485,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
* @param props
|
||||
* @return {*}
|
||||
*/
|
||||
static getChevronIcon(props: {
|
||||
color: string;
|
||||
style?: {
|
||||
marginRight: number;
|
||||
marginVertical?: number;
|
||||
};
|
||||
}) {
|
||||
static getChevronIcon(props: ListIconPropsType): React.Node {
|
||||
return (
|
||||
<List.Icon color={props.color} style={props.style} icon="chevron-right" />
|
||||
);
|
||||
|
|
@ -498,16 +498,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
* @param props
|
||||
* @return {*}
|
||||
*/
|
||||
static getItemIcon(
|
||||
item: ListItemType,
|
||||
props: {
|
||||
color: string;
|
||||
style?: {
|
||||
marginRight: number;
|
||||
marginVertical?: number;
|
||||
};
|
||||
},
|
||||
) {
|
||||
static getItemIcon(item: ListItemType, props: ListIconPropsType): React.Node {
|
||||
return (
|
||||
<List.Icon color={props.color} style={props.style} icon={item.icon} />
|
||||
);
|
||||
|
|
@ -518,14 +509,9 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @returns {*}
|
||||
*/
|
||||
getCardItem = ({item}: {item: ListItemType}) => {
|
||||
const getItemIcon = (props: {
|
||||
color: string;
|
||||
style?: {
|
||||
marginRight: number;
|
||||
marginVertical?: number;
|
||||
};
|
||||
}) => AboutScreen.getItemIcon(item, props);
|
||||
getCardItem = ({item}: {item: ListItemType}): React.Node => {
|
||||
const getItemIcon = (props: ListIconPropsType): React.Node =>
|
||||
AboutScreen.getItemIcon(item, props);
|
||||
if (item.showChevron) {
|
||||
return (
|
||||
<List.Item
|
||||
|
|
@ -551,7 +537,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
* @param item The item to show
|
||||
* @return {*}
|
||||
*/
|
||||
getMainCard = ({item}: {item: {id: string}}) => {
|
||||
getMainCard = ({item}: {item: {id: string}}): React.Node => {
|
||||
switch (item.id) {
|
||||
case 'app':
|
||||
return this.getAppCard();
|
||||
|
|
@ -578,7 +564,7 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
*/
|
||||
keyExtractor = (item: ListItemType): string => item.icon;
|
||||
|
||||
render() {
|
||||
render(): React.Node {
|
||||
const {state} = this;
|
||||
return (
|
||||
<View
|
||||
|
|
@ -602,4 +588,4 @@ class AboutScreen extends React.Component<PropsType, StateType> {
|
|||
}
|
||||
}
|
||||
|
||||
export default AboutScreen;
|
||||
export default withTheme(AboutScreen);
|
||||
|
|
@ -17,6 +17,8 @@
|
|||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {View} from 'react-native';
|
||||
import {
|
||||
|
|
@ -30,21 +32,22 @@ import {
|
|||
import {Modalize} from 'react-native-modalize';
|
||||
import CustomModal from '../../components/Overrides/CustomModal';
|
||||
import AsyncStorageManager from '../../managers/AsyncStorageManager';
|
||||
import type {CustomThemeType} from '../../managers/ThemeManager';
|
||||
import CollapsibleFlatList from '../../components/Collapsible/CollapsibleFlatList';
|
||||
|
||||
type PreferenceItemType = {
|
||||
key: string;
|
||||
default: string;
|
||||
current: string;
|
||||
key: string,
|
||||
default: string,
|
||||
current: string,
|
||||
};
|
||||
|
||||
type PropsType = {
|
||||
theme: ReactNativePaper.Theme;
|
||||
theme: CustomThemeType,
|
||||
};
|
||||
|
||||
type StateType = {
|
||||
modalCurrentDisplayItem: PreferenceItemType | null;
|
||||
currentPreferences: Array<PreferenceItemType>;
|
||||
modalCurrentDisplayItem: PreferenceItemType,
|
||||
currentPreferences: Array<PreferenceItemType>,
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -52,7 +55,7 @@ type StateType = {
|
|||
* This screen allows the user to get and modify information on the app/device.
|
||||
*/
|
||||
class DebugScreen extends React.Component<PropsType, StateType> {
|
||||
modalRef: Modalize | null;
|
||||
modalRef: Modalize;
|
||||
|
||||
modalInputValue: string;
|
||||
|
||||
|
|
@ -63,16 +66,16 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
*/
|
||||
constructor(props: PropsType) {
|
||||
super(props);
|
||||
this.modalRef = null;
|
||||
this.modalInputValue = '';
|
||||
const currentPreferences: Array<PreferenceItemType> = [];
|
||||
// eslint-disable-next-line flowtype/no-weak-types
|
||||
Object.values(AsyncStorageManager.PREFERENCES).forEach((object: any) => {
|
||||
const newObject: PreferenceItemType = {...object};
|
||||
newObject.current = AsyncStorageManager.getString(newObject.key);
|
||||
currentPreferences.push(newObject);
|
||||
});
|
||||
this.state = {
|
||||
modalCurrentDisplayItem: null,
|
||||
modalCurrentDisplayItem: {},
|
||||
currentPreferences,
|
||||
};
|
||||
}
|
||||
|
|
@ -82,27 +85,21 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getModalContent() {
|
||||
getModalContent(): React.Node {
|
||||
const {props, state} = this;
|
||||
let key = '';
|
||||
let defaultValue = '';
|
||||
let current = '';
|
||||
if (state.modalCurrentDisplayItem) {
|
||||
key = state.modalCurrentDisplayItem.key;
|
||||
defaultValue = state.modalCurrentDisplayItem.default;
|
||||
defaultValue = state.modalCurrentDisplayItem.default;
|
||||
current = state.modalCurrentDisplayItem.current;
|
||||
}
|
||||
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
flex: 1,
|
||||
padding: 20,
|
||||
}}>
|
||||
<Title>{key}</Title>
|
||||
<Subheading>Default: {defaultValue}</Subheading>
|
||||
<Subheading>Current: {current}</Subheading>
|
||||
<Title>{state.modalCurrentDisplayItem.key}</Title>
|
||||
<Subheading>
|
||||
Default: {state.modalCurrentDisplayItem.default}
|
||||
</Subheading>
|
||||
<Subheading>
|
||||
Current: {state.modalCurrentDisplayItem.current}
|
||||
</Subheading>
|
||||
<TextInput
|
||||
label="New Value"
|
||||
onChangeText={(text: string) => {
|
||||
|
|
@ -119,7 +116,10 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
dark
|
||||
color={props.theme.colors.success}
|
||||
onPress={() => {
|
||||
this.saveNewPrefs(key, this.modalInputValue);
|
||||
this.saveNewPrefs(
|
||||
state.modalCurrentDisplayItem.key,
|
||||
this.modalInputValue,
|
||||
);
|
||||
}}>
|
||||
Save new value
|
||||
</Button>
|
||||
|
|
@ -128,7 +128,10 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
dark
|
||||
color={props.theme.colors.danger}
|
||||
onPress={() => {
|
||||
this.saveNewPrefs(key, defaultValue);
|
||||
this.saveNewPrefs(
|
||||
state.modalCurrentDisplayItem.key,
|
||||
state.modalCurrentDisplayItem.default,
|
||||
);
|
||||
}}>
|
||||
Reset to default
|
||||
</Button>
|
||||
|
|
@ -137,7 +140,7 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
);
|
||||
}
|
||||
|
||||
getRenderItem = ({item}: {item: PreferenceItemType}) => {
|
||||
getRenderItem = ({item}: {item: PreferenceItemType}): React.Node => {
|
||||
return (
|
||||
<List.Item
|
||||
title={item.key}
|
||||
|
|
@ -167,9 +170,7 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
this.setState({
|
||||
modalCurrentDisplayItem: item,
|
||||
});
|
||||
if (this.modalRef) {
|
||||
this.modalRef.open();
|
||||
}
|
||||
if (this.modalRef) this.modalRef.open();
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -198,25 +199,24 @@ class DebugScreen extends React.Component<PropsType, StateType> {
|
|||
*/
|
||||
saveNewPrefs(key: string, value: string) {
|
||||
this.setState((prevState: StateType): {
|
||||
currentPreferences: Array<PreferenceItemType>;
|
||||
currentPreferences: Array<PreferenceItemType>,
|
||||
} => {
|
||||
const currentPreferences = [...prevState.currentPreferences];
|
||||
currentPreferences[this.findIndexOfKey(key)].current = value;
|
||||
return {currentPreferences};
|
||||
});
|
||||
AsyncStorageManager.set(key, value);
|
||||
if (this.modalRef) {
|
||||
this.modalRef.close();
|
||||
}
|
||||
this.modalRef.close();
|
||||
}
|
||||
|
||||
render() {
|
||||
render(): React.Node {
|
||||
const {state} = this;
|
||||
return (
|
||||
<View>
|
||||
<CustomModal onRef={this.onModalRef}>
|
||||
{this.getModalContent()}
|
||||
</CustomModal>
|
||||
{/* $FlowFixMe */}
|
||||
<CollapsibleFlatList
|
||||
data={state.currentPreferences}
|
||||
extraData={state.currentPreferences}
|
||||
72
src/screens/Amicale/Clubs/ClubAboutScreen.js
Normal file
72
src/screens/Amicale/Clubs/ClubAboutScreen.js
Normal file
|
|
@ -0,0 +1,72 @@
|
|||
/*
|
||||
* Copyright (c) 2019 - 2020 Arnaud Vergnet.
|
||||
*
|
||||
* This file is part of Campus INSAT.
|
||||
*
|
||||
* Campus INSAT is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* Campus INSAT is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {Image, View} from 'react-native';
|
||||
import {Card, Avatar, Text, withTheme} from 'react-native-paper';
|
||||
import i18n from 'i18n-js';
|
||||
import Autolink from 'react-native-autolink';
|
||||
import CollapsibleScrollView from '../../../components/Collapsible/CollapsibleScrollView';
|
||||
import AMICALE_ICON from '../../../../assets/amicale.png';
|
||||
import type {CardTitleIconPropsType} from '../../../constants/PaperStyles';
|
||||
|
||||
const CONTACT_LINK = 'clubs@amicale-insat.fr';
|
||||
|
||||
// eslint-disable-next-line react/prefer-stateless-function
|
||||
class ClubAboutScreen extends React.Component<null> {
|
||||
render(): React.Node {
|
||||
return (
|
||||
<CollapsibleScrollView style={{padding: 5}}>
|
||||
<View
|
||||
style={{
|
||||
width: '100%',
|
||||
height: 100,
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}>
|
||||
<Image
|
||||
source={AMICALE_ICON}
|
||||
style={{flex: 1, resizeMode: 'contain'}}
|
||||
resizeMode="contain"
|
||||
/>
|
||||
</View>
|
||||
<Text>{i18n.t('screens.clubs.about.text')}</Text>
|
||||
<Card style={{margin: 5}}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.clubs.about.title')}
|
||||
subtitle={i18n.t('screens.clubs.about.subtitle')}
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Avatar.Icon size={iconProps.size} icon="information" />
|
||||
)}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Text>{i18n.t('screens.clubs.about.message')}</Text>
|
||||
<Autolink text={CONTACT_LINK} component={Text} />
|
||||
</Card.Content>
|
||||
</Card>
|
||||
</CollapsibleScrollView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withTheme(ClubAboutScreen);
|
||||
|
|
@ -1,66 +0,0 @@
|
|||
/*
|
||||
* Copyright (c) 2019 - 2020 Arnaud Vergnet.
|
||||
*
|
||||
* This file is part of Campus INSAT.
|
||||
*
|
||||
* Campus INSAT is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* Campus INSAT is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import * as React from 'react';
|
||||
import {Image, View} from 'react-native';
|
||||
import {Card, Avatar, Text} from 'react-native-paper';
|
||||
import i18n from 'i18n-js';
|
||||
import Autolink from 'react-native-autolink';
|
||||
import CollapsibleScrollView from '../../../components/Collapsible/CollapsibleScrollView';
|
||||
const AMICALE_ICON = require('../../../../assets/amicale.png');
|
||||
|
||||
const CONTACT_LINK = 'clubs@amicale-insat.fr';
|
||||
|
||||
function ClubAboutScreen() {
|
||||
return (
|
||||
<CollapsibleScrollView style={{padding: 5}}>
|
||||
<View
|
||||
style={{
|
||||
width: '100%',
|
||||
height: 100,
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}>
|
||||
<Image
|
||||
source={AMICALE_ICON}
|
||||
style={{flex: 1, resizeMode: 'contain'}}
|
||||
resizeMode="contain"
|
||||
/>
|
||||
</View>
|
||||
<Text>{i18n.t('screens.clubs.about.text')}</Text>
|
||||
<Card style={{margin: 5}}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.clubs.about.title')}
|
||||
subtitle={i18n.t('screens.clubs.about.subtitle')}
|
||||
left={(iconProps) => (
|
||||
<Avatar.Icon size={iconProps.size} icon="information" />
|
||||
)}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Text>{i18n.t('screens.clubs.about.message')}</Text>
|
||||
<Autolink<typeof Text> text={CONTACT_LINK} component={Text} />
|
||||
</Card.Content>
|
||||
</Card>
|
||||
</CollapsibleScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClubAboutScreen;
|
||||
|
|
@ -17,6 +17,8 @@
|
|||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {Linking, View} from 'react-native';
|
||||
import {
|
||||
|
|
@ -33,20 +35,24 @@ import AuthenticatedScreen from '../../../components/Amicale/AuthenticatedScreen
|
|||
import CustomHTML from '../../../components/Overrides/CustomHTML';
|
||||
import CustomTabBar from '../../../components/Tabbar/CustomTabBar';
|
||||
import type {ClubCategoryType, ClubType} from './ClubListScreen';
|
||||
import type {CustomThemeType} from '../../../managers/ThemeManager';
|
||||
import {ERROR_TYPE} from '../../../utils/WebData';
|
||||
import CollapsibleScrollView from '../../../components/Collapsible/CollapsibleScrollView';
|
||||
import type {ApiGenericDataType} from '../../../utils/WebData';
|
||||
import type {CardTitleIconPropsType} from '../../../constants/PaperStyles';
|
||||
import ImageGalleryButton from '../../../components/Media/ImageGalleryButton';
|
||||
|
||||
type PropsType = {
|
||||
navigation: StackNavigationProp<any>;
|
||||
navigation: StackNavigationProp,
|
||||
route: {
|
||||
params?: {
|
||||
data?: ClubType;
|
||||
categories?: Array<ClubCategoryType>;
|
||||
clubId?: number;
|
||||
};
|
||||
};
|
||||
theme: ReactNativePaper.Theme;
|
||||
data?: ClubType,
|
||||
categories?: Array<ClubCategoryType>,
|
||||
clubId?: number,
|
||||
},
|
||||
...
|
||||
},
|
||||
theme: CustomThemeType,
|
||||
};
|
||||
|
||||
const AMICALE_MAIL = 'clubs@amicale-insat.fr';
|
||||
|
|
@ -67,20 +73,21 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
|
||||
constructor(props: PropsType) {
|
||||
super(props);
|
||||
this.displayData = null;
|
||||
this.categories = null;
|
||||
this.clubId = props.route.params?.clubId ? props.route.params.clubId : 0;
|
||||
this.shouldFetchData = true;
|
||||
|
||||
if (
|
||||
props.route.params &&
|
||||
props.route.params.data &&
|
||||
props.route.params.categories
|
||||
) {
|
||||
this.displayData = props.route.params.data;
|
||||
this.categories = props.route.params.categories;
|
||||
this.clubId = props.route.params.data.id;
|
||||
this.shouldFetchData = false;
|
||||
if (props.route.params != null) {
|
||||
if (
|
||||
props.route.params.data != null &&
|
||||
props.route.params.categories != null
|
||||
) {
|
||||
this.displayData = props.route.params.data;
|
||||
this.categories = props.route.params.categories;
|
||||
this.clubId = props.route.params.data.id;
|
||||
this.shouldFetchData = false;
|
||||
} else if (props.route.params.clubId != null) {
|
||||
this.displayData = null;
|
||||
this.categories = null;
|
||||
this.clubId = props.route.params.clubId;
|
||||
this.shouldFetchData = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -94,9 +101,7 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
let categoryName = '';
|
||||
if (this.categories !== null) {
|
||||
this.categories.forEach((item: ClubCategoryType) => {
|
||||
if (id === item.id) {
|
||||
categoryName = item.name;
|
||||
}
|
||||
if (id === item.id) categoryName = item.name;
|
||||
});
|
||||
}
|
||||
return categoryName;
|
||||
|
|
@ -108,12 +113,10 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
* @param categories The categories to display (max 2)
|
||||
* @returns {null|*}
|
||||
*/
|
||||
getCategoriesRender(categories: Array<number | null>) {
|
||||
if (this.categories == null) {
|
||||
return null;
|
||||
}
|
||||
getCategoriesRender(categories: Array<number | null>): React.Node {
|
||||
if (this.categories == null) return null;
|
||||
|
||||
const final: Array<React.ReactNode> = [];
|
||||
const final = [];
|
||||
categories.forEach((cat: number | null) => {
|
||||
if (cat != null) {
|
||||
final.push(
|
||||
|
|
@ -133,9 +136,9 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
* @param email The club contact email
|
||||
* @returns {*}
|
||||
*/
|
||||
getManagersRender(managers: Array<string>, email: string | null) {
|
||||
getManagersRender(managers: Array<string>, email: string | null): React.Node {
|
||||
const {props} = this;
|
||||
const managersListView: Array<React.ReactNode> = [];
|
||||
const managersListView = [];
|
||||
managers.forEach((item: string) => {
|
||||
managersListView.push(<Paragraph key={item}>{item}</Paragraph>);
|
||||
});
|
||||
|
|
@ -150,7 +153,7 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
? i18n.t('screens.clubs.managersSubtitle')
|
||||
: i18n.t('screens.clubs.managersUnavailable')
|
||||
}
|
||||
left={(iconProps) => (
|
||||
left={(iconProps: CardTitleIconPropsType): React.Node => (
|
||||
<Avatar.Icon
|
||||
size={iconProps.size}
|
||||
style={{backgroundColor: 'transparent'}}
|
||||
|
|
@ -178,7 +181,10 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
* @param hasManagers True if the club has managers
|
||||
* @returns {*}
|
||||
*/
|
||||
static getEmailButton(email: string | null, hasManagers: boolean) {
|
||||
static getEmailButton(
|
||||
email: string | null,
|
||||
hasManagers: boolean,
|
||||
): React.Node {
|
||||
const destinationEmail =
|
||||
email != null && hasManagers ? email : AMICALE_MAIL;
|
||||
const text =
|
||||
|
|
@ -200,15 +206,20 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
);
|
||||
}
|
||||
|
||||
getScreen = (response: Array<ClubType | null>) => {
|
||||
let data: ClubType | null = response[0];
|
||||
if (data != null) {
|
||||
getScreen = (response: Array<ApiGenericDataType | null>): React.Node => {
|
||||
const {navigation} = this.props;
|
||||
let data: ClubType | null = null;
|
||||
if (response[0] != null) {
|
||||
[data] = response;
|
||||
this.updateHeaderTitle(data);
|
||||
}
|
||||
if (data != null) {
|
||||
return (
|
||||
<CollapsibleScrollView style={{paddingLeft: 5, paddingRight: 5}} hasTab>
|
||||
{this.getCategoriesRender(data.category)}
|
||||
{data.logo !== null ? (
|
||||
<ImageGalleryButton
|
||||
navigation={navigation}
|
||||
images={[{url: data.logo}]}
|
||||
style={{
|
||||
width: 300,
|
||||
|
|
@ -248,9 +259,9 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
props.navigation.setOptions({title: data.name});
|
||||
}
|
||||
|
||||
render() {
|
||||
render(): React.Node {
|
||||
const {props} = this;
|
||||
if (this.shouldFetchData) {
|
||||
if (this.shouldFetchData)
|
||||
return (
|
||||
<AuthenticatedScreen
|
||||
navigation={props.navigation}
|
||||
|
|
@ -272,7 +283,6 @@ class ClubDisplayScreen extends React.Component<PropsType> {
|
|||
]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return this.getScreen([this.displayData]);
|
||||
}
|
||||
}
|
||||
|
|
@ -17,6 +17,8 @@
|
|||
* along with Campus INSAT. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {Platform} from 'react-native';
|
||||
import {Searchbar} from 'react-native-paper';
|
||||
|
|
@ -32,27 +34,27 @@ import MaterialHeaderButtons, {
|
|||
import CollapsibleFlatList from '../../../components/Collapsible/CollapsibleFlatList';
|
||||
|
||||
export type ClubCategoryType = {
|
||||
id: number;
|
||||
name: string;
|
||||
id: number,
|
||||
name: string,
|
||||
};
|
||||
|
||||
export type ClubType = {
|
||||
id: number;
|
||||
name: string;
|
||||
description: string;
|
||||
logo: string;
|
||||
email: string | null;
|
||||
category: Array<number | null>;
|
||||
responsibles: Array<string>;
|
||||
id: number,
|
||||
name: string,
|
||||
description: string,
|
||||
logo: string,
|
||||
email: string | null,
|
||||
category: Array<number | null>,
|
||||
responsibles: Array<string>,
|
||||
};
|
||||
|
||||
type PropsType = {
|
||||
navigation: StackNavigationProp<any>;
|
||||
navigation: StackNavigationProp,
|
||||
};
|
||||
|
||||
type StateType = {
|
||||
currentlySelectedCategories: Array<number>;
|
||||
currentSearchString: string;
|
||||
currentlySelectedCategories: Array<number>,
|
||||
currentSearchString: string,
|
||||
};
|
||||
|
||||
const LIST_ITEM_HEIGHT = 96;
|
||||
|
|
@ -60,9 +62,8 @@ const LIST_ITEM_HEIGHT = 96;
|
|||
class ClubListScreen extends React.Component<PropsType, StateType> {
|
||||
categories: Array<ClubCategoryType>;
|
||||
|
||||
constructor(props: PropsType) {
|
||||
super(props);
|
||||
this.categories = [];
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
currentlySelectedCategories: [],
|
||||
currentSearchString: '',
|
||||
|
|
@ -113,7 +114,7 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @return {*}
|
||||
*/
|
||||
getSearchBar = () => {
|
||||
getSearchBar = (): React.Node => {
|
||||
return (
|
||||
<Searchbar
|
||||
placeholder={i18n.t('screens.proximo.search')}
|
||||
|
|
@ -130,7 +131,7 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
* Gets the header button
|
||||
* @return {*}
|
||||
*/
|
||||
getHeaderButtons = () => {
|
||||
getHeaderButtons = (): React.Node => {
|
||||
const onPress = () => {
|
||||
const {props} = this;
|
||||
props.navigation.navigate('club-about');
|
||||
|
|
@ -144,12 +145,12 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
|
||||
getScreen = (
|
||||
data: Array<{
|
||||
categories: Array<ClubCategoryType>;
|
||||
clubs: Array<ClubType>;
|
||||
categories: Array<ClubCategoryType>,
|
||||
clubs: Array<ClubType>,
|
||||
} | null>,
|
||||
) => {
|
||||
let categoryList: Array<ClubCategoryType> = [];
|
||||
let clubList: Array<ClubType> = [];
|
||||
): React.Node => {
|
||||
let categoryList = [];
|
||||
let clubList = [];
|
||||
if (data[0] != null) {
|
||||
categoryList = data[0].categories;
|
||||
clubList = data[0].clubs;
|
||||
|
|
@ -173,7 +174,7 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
*
|
||||
* @returns {*}
|
||||
*/
|
||||
getListHeader() {
|
||||
getListHeader(): React.Node {
|
||||
const {state} = this;
|
||||
return (
|
||||
<ClubListHeader
|
||||
|
|
@ -193,14 +194,12 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
getCategoryOfId = (id: number): ClubCategoryType | null => {
|
||||
let cat = null;
|
||||
this.categories.forEach((item: ClubCategoryType) => {
|
||||
if (id === item.id) {
|
||||
cat = item;
|
||||
}
|
||||
if (id === item.id) cat = item;
|
||||
});
|
||||
return cat;
|
||||
};
|
||||
|
||||
getRenderItem = ({item}: {item: ClubType}) => {
|
||||
getRenderItem = ({item}: {item: ClubType}): React.Node => {
|
||||
const onPress = () => {
|
||||
this.onListItemPress(item);
|
||||
};
|
||||
|
|
@ -220,9 +219,9 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
keyExtractor = (item: ClubType): string => item.id.toString();
|
||||
|
||||
itemLayout = (
|
||||
data: Array<ClubType> | null | undefined,
|
||||
data: {...},
|
||||
index: number,
|
||||
): {length: number; offset: number; index: number} => ({
|
||||
): {length: number, offset: number, index: number} => ({
|
||||
length: LIST_ITEM_HEIGHT,
|
||||
offset: LIST_ITEM_HEIGHT * index,
|
||||
index,
|
||||
|
|
@ -241,23 +240,17 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
const {state} = this;
|
||||
const newCategoriesState = [...state.currentlySelectedCategories];
|
||||
let newStrState = state.currentSearchString;
|
||||
if (filterStr !== null) {
|
||||
newStrState = filterStr;
|
||||
}
|
||||
if (filterStr !== null) newStrState = filterStr;
|
||||
if (categoryId !== null) {
|
||||
const index = newCategoriesState.indexOf(categoryId);
|
||||
if (index === -1) {
|
||||
newCategoriesState.push(categoryId);
|
||||
} else {
|
||||
newCategoriesState.splice(index, 1);
|
||||
}
|
||||
if (index === -1) newCategoriesState.push(categoryId);
|
||||
else newCategoriesState.splice(index, 1);
|
||||
}
|
||||
if (filterStr !== null || categoryId !== null) {
|
||||
if (filterStr !== null || categoryId !== null)
|
||||
this.setState({
|
||||
currentSearchString: newStrState,
|
||||
currentlySelectedCategories: newCategoriesState,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -271,13 +264,12 @@ class ClubListScreen extends React.Component<PropsType, StateType> {
|
|||
let shouldRender =
|
||||
state.currentlySelectedCategories.length === 0 ||
|
||||
isItemInCategoryFilter(state.currentlySelectedCategories, item.category);
|
||||
if (shouldRender) {
|
||||
if (shouldRender)
|
||||
shouldRender = stringMatchQuery(item.name, state.currentSearchString);
|
||||
}
|
||||
return shouldRender;
|
||||
}
|
||||
|
||||
render() {
|
||||
render(): React.Node {
|
||||
const {props} = this;
|
||||
return (
|
||||
<AuthenticatedScreen
|
||||
Loading…
Reference in a new issue