Skip to content

Log the time the user spends using your React Native app, and schedule actions accordingly.

License

Notifications You must be signed in to change notification settings

ajinvm/react-native-session-stats

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-session-stats

This tiny React Native component logs locally the total time the user spent on the app since install, the count of sessions — for convenience, let's call session the time app is in the foreground — and the time the last session ended. It helps you schedule actions, for example:

  • open a Rate me dialog, when the user has already spent 10 minutes using your app,
  • want to tell the user Long time no see after seven days of absence,
  • show an interstitial ad every fifth time the app is opened,
  • or log the time of the session externally.

Install

npm install --save https://github.com/balazsherczeg/react-native-session-stats.git

Usage

The SessionStats component takes two props: onSessionStart is fired when the app's state changes to active, onSessionEnd, when it changes to inactive or background.

import SessionStats from 'react-native-session-stats';

// ...

<SessionStats
  onSessionStart={({
    timeSpent, // total time spent, in seconds...
    sessionCount, // ... and number of sessions as of at opening the app
    lastSessionEnd,
  }) => { /* ... */ }}
  onSessionEnd={({
    timeSpent, // total time spent in seconds...
    sessionCount, // ... and number of sessions as of at closing the app
    lastSessionEnd,
    sessionDuration, // the length of the ending session, in seconds
  }) => { /* ... */ }}
/>

You can use SessionStats as a context provider:

import SessionStats from 'react-native-session-stats';

// ...

<SessionStats>
  <App />
<SessionStats/>

Inside, the values — as of the start of the session — are available through a higher order component:

import {withSessionStats} from 'react-native-session-stats';

const SomeComponent = ({sessionStats: {timeSpent, sessionCount, lastSessionEnd}}) => {
    //...
}
export withSessionStats(<SomeComponent />);

... or useContext:

import {sessionStatsContext} from 'react-native-session-stats'

const SomeComponent = () => {
    const {timeSpent, sessionCount, lastSessionEnd} = useContext(sessionStatsContext);
    //...
}

Notes

Tested on Android only.

About

Log the time the user spends using your React Native app, and schedule actions accordingly.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%