reactn | React , but with built-in global state management | Frontend Framework library

React Native is whole framework, for front and back end, and have nothing to do with Kotlin (well, some Kotlin snippets may be integrated into RN app, thats all). RN projects are in fact multiplatform web/js based apps and Kotlin is used for writing pure Android apps, so this isn't a front/back end separation in here, these are just different approaches to development. Mixing both, while possible, makes no sense in most cases

When you call addProduct(JSON.stringify(props.navigation.getParam('input')),true) you are setting the second argument oneadd to true. In the addProduct function, you call setDidAddInput(oneadd); before checking if(didAddInput === true), so it will always be true and still execute infinite times.

Our goal is to execute once per input.

With a boolean flag, here's what you would do. The initial value is false. We only add if it is still false and has not been changed. Then after adding, we set it to true so that it will not be run again.

You cannot return products before you setDidAddInput because nothing after the return will run.

For some reason, the undoable prop on Edit is causing problem. Set it to false and it will call the update properly. I don't know why, I am using this under a special endpoint as a "sub-app", so might be due to conflicting routers, too tired to find out.

The following answer is subjective!

There are basically 3 categories that I am aware of.

1. Keep everything local ( For any size of app which doesn't deal with sibling dependencies this will work fine. May cause some prop drilling, though it should be avoided as possible, it's not an anti-pattern. You come with better approaches to handle this i.e. PureComponent, React.memo, shouldComponentUpdate)
2. Keep everything global(redux/reactN/...) (have not seen this approach in my experience, not recommended in my opinion as requires you to hit central state every time when there is a change)
3. Keep a mix of both. (Highly seen this in medium to large scale projects, we use this approach with redux)

1. Personally speaking, irrespective of the size of an application one can start with the first approach and add the central state later when required(if you are not sure where to put states).

2. If you need to manage some state centrally from the beginning it can be added from start(if states are clearly defined).

If you choose any one of the above two approaches, to begin with, at one point in time you would need to decide either go for first-party i.e. React Context or a third party i.e. Redux, ....

You have already stated the pros and cons of these, you can compare and see which one outweighs the others.

Instead of putting your function into useState, consider using useCallback. Your code would look something like this:

You can pass props to your styles like this:

Solved by running

npm install react-native-unimodules

at the root of the project