components/FeedItem.js

@@ -9,7 +9,7 @@ const ICON_AMICALE = require('../assets/amicale.png');
 function FeedItem(props) {
     const {colors} = props.theme;
     return (
-        <Card style={{margin: 10}}>
+        <Card style={{margin: 5}}>
             <Card.Title
                 title={props.title}
                 subtitle={props.subtitle}

screens/About/AboutScreen.js

@@ -7,7 +7,7 @@ import appJson from '../../app';
 import AsyncStorageManager from "../../utils/AsyncStorageManager";
 import {Modalize} from "react-native-modalize";
 import ThemeManager from "../../utils/ThemeManager";
-import {Avatar, Button, Card, List, Text, Title} from 'react-native-paper';
+import {Avatar, Card, Text, Title, List, Button} from 'react-native-paper';
 
 const links = {
     appstore: 'https://apps.apple.com/us/app/campus-amicale-insat/id1477722148',
@@ -271,8 +271,8 @@ export default class AboutScreen extends React.Component<Props, State> {
                 return (
                     <List.Item
                         title={item.text}
-                        left={props => <List.Icon {...props} icon={item.icon}/>}
-                        right={props => <List.Icon {...props} icon={'chevron-right'}/>}
+                        left={props => <List.Icon {...props} icon={item.icon} />}
+                        right={props => <List.Icon {...props} icon={'chevron-right'} />}
                         onPress={item.onPressCallback}
                     />
                 );
@@ -280,7 +280,7 @@ export default class AboutScreen extends React.Component<Props, State> {
                 return (
                     <List.Item
                         title={item.text}
-                        left={props => <List.Icon {...props} icon={item.icon}/>}
+                        left={props => <List.Icon {...props} icon={item.icon} />}
                         onPress={item.onPressCallback}
                     />
                 );
@@ -311,10 +311,7 @@ export default class AboutScreen extends React.Component<Props, State> {
         return (
             <Modalize ref={this.modalRef}
                       adjustToContentHeight
-                      handlePosition={'inside'}
-                      modalStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().surface}}
-                      handleStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().text}}
-            >
+                      modalStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().surface}}>
                 <View style={{
                     flex: 1,
                     padding: 20

screens/Proxiwash/ProxiwashScreen.js

@@ -7,12 +7,10 @@ import WebSectionList from "../../components/WebSectionList";
 import NotificationsManager from "../../utils/NotificationsManager";
 import AsyncStorageManager from "../../utils/AsyncStorageManager";
 import * as Expo from "expo";
-import {Avatar, Banner, Button, Card, Text} from 'react-native-paper';
+import {Card, Banner, Avatar} from 'react-native-paper';
 import HeaderButton from "../../components/HeaderButton";
 import ProxiwashListItem from "../../components/ProxiwashListItem";
 import ProxiwashConstants from "../../constants/ProxiwashConstants";
-import {Modalize} from "react-native-modalize";
-import ThemeManager from "../../utils/ThemeManager";
 
 const DATA_URL = "https://etud.insa-toulouse.fr/~amicale_app/washinsa/washinsa.json";
 
@@ -29,7 +27,6 @@ type Props = {
 type State = {
     refreshing: boolean,
     firstLoading: boolean,
-    modalCurrentDisplayItem: React.Node,
     machinesWatched: Array<string>,
     bannerVisible: boolean,
 };
@@ -41,8 +38,6 @@ type State = {
  */
 export default class ProxiwashScreen extends React.Component<Props, State> {
 
-    modalRef: { current: null | Modalize };
-
     onAboutPress: Function;
     getRenderItem: Function;
     getRenderSectionHeader: Function;
@@ -57,7 +52,6 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
         fetchedData: {},
         // machinesWatched: JSON.parse(dataString),
         machinesWatched: [],
-        modalCurrentDisplayItem: null,
         bannerVisible: AsyncStorageManager.getInstance().preferences.proxiwashShowBanner.current === '1',
     };
 
@@ -66,7 +60,6 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
      */
     constructor() {
         super();
-        this.modalRef = React.createRef();
         stateStrings[ProxiwashConstants.machineStates.TERMINE] = i18n.t('proxiwashScreen.states.finished');
         stateStrings[ProxiwashConstants.machineStates.DISPONIBLE] = i18n.t('proxiwashScreen.states.ready');
         stateStrings[ProxiwashConstants.machineStates["EN COURS"]] = i18n.t('proxiwashScreen.states.running');
@@ -245,40 +238,29 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
         ];
     }
 
-    showModal(title: string, item: Object, isDryer: boolean) {
-        this.setState({
-            modalCurrentDisplayItem: this.getModalContent(title, item, isDryer)
-        });
-        if (this.modalRef.current) {
-            this.modalRef.current.open();
-        }
-    }
-
-    onSetupNotificationsPress(machineId: string) {
-        if (this.modalRef.current) {
-            this.modalRef.current.close();
-        }
-        this.setupNotifications(machineId)
-    }
-
-    getModalContent(title: string, item: Object, isDryer: boolean) {
-        let button = {
-            text: i18n.t("proxiwashScreen.modal.ok"),
-            icon: '',
-            onPress: undefined
-        };
+    /**
+     * Show an alert fo a machine, allowing to enable/disable notifications if running
+     *
+     * @param title
+     * @param item
+     * @param isDryer
+     */
+    showAlert(title: string, item: Object, isDryer: boolean) {
+        let buttons = [{text: i18n.t("proxiwashScreen.modal.ok")}];
         let message = modalStateStrings[ProxiwashConstants.machineStates[item.state]];
-        const onPress = this.onSetupNotificationsPress.bind(this, item.number);
+        const onPress = this.setupNotifications.bind(this, item.number);
         if (ProxiwashConstants.machineStates[item.state] === ProxiwashConstants.machineStates["EN COURS"]) {
-            button =
+            buttons = [
                 {
                     text: this.isMachineWatched(item.number) ?
                         i18n.t("proxiwashScreen.modal.disableNotifications") :
                         i18n.t("proxiwashScreen.modal.enableNotifications"),
-                    icon: '',
                     onPress: onPress
+                },
+                {
+                    text: i18n.t("proxiwashScreen.modal.cancel")
                 }
-            ;
+            ];
             message = i18n.t('proxiwashScreen.modal.running',
                 {
                     start: item.startTime,
@@ -291,39 +273,13 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
             else
                 message += '\n' + i18n.t('proxiwashScreen.washersTariff');
         }
-        return (
-            <View style={{
-                flex: 1,
-                padding: 20
-            }}>
-                <Card.Title
-                    title={title}
-                    left={() => <Avatar.Icon
-                        icon={isDryer ? 'tumble-dryer' : 'washing-machine'}
-                        color={ThemeManager.getCurrentThemeVariables().text}
-                        style={{backgroundColor: 'transparent'}}/>}
-
-                />
-                <Card.Content>
-                    <Text>{message}</Text>
-                </Card.Content>
-
-                {button.onPress !== undefined ?
-                    <Card.Actions>
-                        <Button
-                            icon={button.icon}
-                            mode="contained"
-                            onPress={button.onPress}
-                            style={{marginLeft: 'auto', marginRight: 'auto'}}
-                        >
-                            {button.text}
-                        </Button>
-                    </Card.Actions> : null}
-            </View>
+        Alert.alert(
+            title,
+            message,
+            buttons
         );
     }
 
-
     onAboutPress() {
         this.props.navigation.navigate('ProxiwashAboutScreen');
     }
@@ -349,18 +305,10 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
                     icon={() => <Avatar.Icon
                         icon={'information'}
                         size={40}
-                    />}
+                        />}
                 >
                     {i18n.t('proxiwashScreen.enableNotificationsTip')}
                 </Banner>
-                <Modalize ref={this.modalRef}
-                          adjustToContentHeight
-                          handlePosition={'inside'}
-                          modalStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().surface}}
-                          handleStyle={{backgroundColor: ThemeManager.getCurrentThemeVariables().text}}
-                >
-                    {this.state.modalCurrentDisplayItem}
-                </Modalize>
                 <WebSectionList
                     createDataset={this.createDataset}
                     navigation={nav}
@@ -426,7 +374,7 @@ export default class ProxiwashScreen extends React.Component<Props, State> {
         const isMachineRunning = ProxiwashConstants.machineStates[item.state] === ProxiwashConstants.machineStates["EN COURS"];
         const machineName = (section.title === i18n.t('proxiwashScreen.dryers') ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')) + ' n°' + item.number;
         const isDryer = section.title === i18n.t('proxiwashScreen.dryers');
-        const onPress = this.showModal.bind(this, machineName, item, isDryer);
+        const onPress = this.showAlert.bind(this, machineName, item, isDryer);
         let width = item.donePercent !== '' ? (parseInt(item.donePercent)).toString() + '%' : 0;
         if (ProxiwashConstants.machineStates[item.state] === '0')
             width = '100%';

utils/NotificationsManager.js

@@ -123,10 +123,7 @@ export default class NotificationsManager {
                     'Content-Type': 'application/json',
                 }),
                 body: JSON.stringify(data) // <-- Post parameters
-            }).then((response) => response.json())
-                .then((responseJson) => {
-                    callback(responseJson);
-                });
+            });
         }
     }