How to Track user action for breadcrumb in react native? - react-native

Trying to create a breadcrumb module where all the user action will be stored. Problem is how do I track the user actions in React native as a third party module. Need to know the UIElements and their respective callback functions.
Example : User has clicked on Button X in Screen Y.
Any pointers would be helpful. Thanks in advance

Related

React native - How to pass data to another screen using class components

i want to send an ID that i get from a database to another screen and i've seen how to do it on google but people only use hook components and i'm new to react native so i don't really understand how to do it.
You can send data from one screen to another using navigation params. Here is example: https://reactnavigation.org/docs/params/.

What is the proper way to access data from multiple pages in React Native?

So I am working on my first React Native project and I am curious as to what the proper way to handle user data is. I have 3 different pages that are: HomePage, ProfilePage, ChatPage. When a user logs in it navigates them to the HomePage.
As of now, I have it to where when the HomePage loads it makes a backend call that retrieves all of the user data and sets it to some states.
Now when the user navigates to a new page like the ProfilePage none of the data is there anymore of course so do I have to make another backend call? So one backend call for each page? Im sure there has to be some way to only make the backend call once. Could I possibly set a global state of some sort? Should I save all the user data to AsyncStorage?
My current File structure is as follows:
App.js -> Contains my React Navigation stack
HomePage.js
ProfilePage.js
ChatPage.js
Thanks for the help!
You can use Redux plus React-Redux.
To say in short redux is a state management library for react. The states will be global to your app accessible across various components inside app. also there will be reactivity.
For more info visit this link
https://react-redux.js.org/
You should use React-Redux and manage your states globally.

How to replace default share options popup with a custom action sheet?

I am using the share api that react native offers by default.
I want to use a custom action sheet with sharing options instead of the default share popup that comes with react native share api.
replace this default screen
with something like this instead
Please check whether the below links satisfy your requirement. I think with Share API we can't control the apps shown in share popup dialog.
https://github.com/meedan/react-native-share-menu
https://www.npmjs.com/package/react-native-share

Creating a landing page with an extension using shoutem builder

It seems likes I am limited by the shoutem builder to having a default Main Navigation, whereby all of the other screens are wrapped by it. Is it possible for me to create a landing page where my users can sign in, and then segue to the Main Navigation? How would I achieve this?
The shoutem.auth (Users) extension does something you're asking for. It displays a screen before any shortcuts (i.e. navigation items) are displayed. It achieves this through the use of a middleware which is implemented throughout the entire Shoutem app, visible in the #shoutem/core package.
You could use a similar pattern to achieve your landing/onboarding page extension.

How to implement logout functionality in react native?

As i'm trying to develop an app in react native , i want to implement logout functionality.Now i found a problem that for every user who is logging, the name,and details appearing in their profile is same for each user.I'm using asyncstorage for setting unique id.Now i'm trying to unset this session using
Asyncstorage.removeItem('key_uuid').Do i need to write this in a separate js file?I don't know actually where to give this code in my project.Sorry can anybody help me to figure this out?
It is simple implementation, on login you need to save some logged in user information as to check weather a user is logged in or not.
You canprovide logout button anywhere in the app, and on clk of that you can clear your asyncStorage or remove only user info from storage.
And when user opens your app you can check user in asyncstorage.