feat: added new inactivity wrapper component

[al-rosenthal]

Summary of Changes

Created a new component: InactivityWrapper.tsx. This component is intended to wrap the app view to track user interactions (clicks, swipes, ect.). When an interaction is detected a timer internal to the component resets, if no interactions in a set time are made while the app is open, the user is logged out and is sent back to the pin entry screen.

Related Issues

bc-wallet-mobile: 2136

Pull Request Checklist

Tick all boxes below to demonstrate that you have completed the respective task. If the item does not apply to your this PR check it anyway to make it apparent that there's nothing to do.

• All commits contain a DCO Signed-off-by line (we use the DCO GitHub app to enforce this);
• Updated LICENSE-3RD-PARTY.md for any added dependencies or vendored components;
• Updated documentation as needed for changed code and new or modified features;
• Added sufficient tests so that overall code coverage is not reduced.

If you have any questions to any of the points above, just submit and ask! This checklist is here to help you, not to deter you from contributing!

Pro Tip 🤓

• Read our contribution guide at least once; it will save you a few review cycles!
• Your PR will likely not be reviewed until all the above boxes are checked and all automated tests have passed.

PR template adapted from the Python attrs project.

[bryce-mcmath]

I wonder if it's worth consolidating some of the very similar code in the RootStack into this component, so both types of lockout are handled from the same place. @jleach thoughts?

[bryce-mcmath]

Will also need to add this wrapper to the Bifold example app (so either in RootStack.tsx or in something like packages/legacy/app/App.tsx depending on how you implement it)

[jleach]

Enums are somewhat of a hack in typescript. I think we favour as const like

const X = {
  Blah: 'zzzzzz',
  Blarb: 'rrrrr',
} as const

[al-rosenthal]

Happy to change that. Is there a way to still have this object act as a type when defining something like a type or interface? for example:

const MyConst = {
  Blah: 'something'
} as const

type MyType = {
  someAttribute: MyConst
}

[jleach]

You probably need to wrap all your fn inside a useCallback. Every time a component renders a function will be re-created which is a performance hit. Also, because a fn can be a dependency on a useEffect when it is re-created it will change causing a useEffect to trigger. So, in general, its good to just wrap 'em and let RN sort it out.

[al-rosenthal]

functions are wrapped in callbacks

[al-rosenthal]

Will also need to add this wrapper to the Bifold example app (so either in RootStack.tsx or in something like packages/legacy/app/App.tsx depending on how you implement it)

I've added the wrapper to the App.tsx

[jleach]

@al-rosenthal You can use yarn run lint in bifold and yarn run typecheck:core to cache code quality issues quicker or use husky on push.

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud