Not working when App is in Background or Phone locked (Android)

[marcogmst]

Hi there,

I have been noticing some really strange behavior with this Inactivity package and I wonder if anyone have had the some problem before.

So, when I run the app in debug mode, everything runs smoothly and as it should, but when I deploy the app I start to get weird issues with the Timer. I think it is not triggering the Inactivity, but I am not sure.

Replication steps:

• login
• put the app in the background or simply lock the phone.
• leave it for 10+ minutes which is my time for Inactivity (600.000ms)
• open the app again
• the inactivity alert does not show up, even if scroll the screen up and down
• when I change screens, the inactivity alert shows up and tries to log me out (which fails because y this time my login token is invalid)

I think there something wrong with the timer when it is NOT running in Debugger mode, as when I run the app in debug mode all works as it should.

Here's how I use my component:

<Inactivity name='NameOfPageView' navigation={this.props.navigation}>
         //Other components go here   
</Inactivity>

Here's my Inactivity component:

import React from 'react';
import { View, Alert, YellowBox } from 'react-native'
import Analytics from './Analytics'
import LogoutService from '../Logout/LogoutService';
import { connect } from 'react-redux';
import { globalBegin, globalUserNotLoggedIn } from '../Shared/Global/GlobalActions';
import UserInactivity from 'react-native-user-inactivity';
import Spinner from '../Components/Spinner';

YellowBox.ignoreWarnings(['Setting a timer for a long period of time']);

class Inactivity extends React.Component{

    constructor(props) {
        super(props);
        this.state = {
            name: props.name,
            timeout: 600000,
            active: true,
        }
    }

    onAction = (active) => {
        this.setState({
            active,
        });
        
        if(active) return;

        this.onInactivity(this.state.name);
    }

    onInactivity = (name) => {
        if(this.props.isLoggedin)
        {
            var analytics = Analytics.create(name, 'logout');
            var traceId = analytics.getTraceId();
            analytics.trackEvent();
            return Alert.alert( 
                '',
                global.inactivity.Message,
                [
                    {   
                        text: 'OK', 
                        onPress: () => {
                                LogoutService
                                    .setTraceId(traceId)
                                    .logout()
                                    .then(() => {
                                        this.props.userLogout();
                                    })
                                    .catch(function (error) {
                                        analytics.trackException(error.stack);
                                        this.props.userLogout();
                                    });
                        }
                    }
                ],
                {cancelable: false }
            );
        }
    }

    render() {
        return (
            <UserInactivity 
                onAction={this.onAction} 
                timeForInactivity={this.state.timeout} >
                <Spinner visible={this.props.isBusy}/>
                <View style={{ flex: 1}}>
                    {this.props.children}
                </View>
            </UserInactivity>
        );
    }

}

const mapStateToProps = reduxState => {
    return {
        isLoggedin: reduxState.global.user.isLoggedin,
        isBusy: reduxState.global.screen.isBusy,
    }
};

const mapDispatchToProps = dispatch => {
    return {
        actionBegin: () => { dispatch(globalBegin()) },
        userLogout: () => { dispatch(globalUserNotLoggedIn()) },
    };
};

module.exports = connect(mapStateToProps, mapDispatchToProps) (Inactivity);

I hadn't checked this on iOS yet.
Any idea of what can possibly be wrong? Any tips?
All help is welcome.

Thanks

[jkomyno]

Hi, sorry for the delay, this should be fixed using a timer different than the default setTimeout, as I've described in #19.
A new version of this package is expected to be released the 13th August 2019.

[marcogmst]

Hey,

That sounds good. In case this helps you or anyone else that had the same issue here it is my work around.

In the mean time I stopped using the package, and implemented two solutions:
1 - when the app is in the foreground using a "setTimeout";
2 - when the app is in the background: (When the app goes to background state, I save the current datetime, and when it comes back to the foreground and compare that against currentDateTime+TimeoutTime.

These did the trick, but if the new release changes on the package can simplify my code, I will be happy to go back to use the package.

Cheers.

[jkomyno]

Hi, please check out the new version. You need to provide a custom timer to the library. In your case, just use any native background timer that works on Android too.