How can I tell which package is using old AsyncStorage version - react-native

I updated all of my dependencies in my expo managed project for react native. Everything so far 🤞🏻 appears to be working but now I'm getting a warning that says:
AsyncStorage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-async-storage/async-storage' instead of 'react-native'. See https://github.com/react-native-async-storage/async-storage
In all of the files I've written I call for AsyncStorage like this:
import AsyncStorage from '#react-native-async-storage/async-storage';
So I'm left assuming that the deprecated use of:
import {AsyncStorage} from 'react-native';
must be coming from another node package / dependency that I'm using.....
What is the best way to check my project files to see what is generating this error?
I know it sounds like a stupid question, but in my IDE (vsCode) I have done a global search for "import {AsyncStorage} from 'react-native';" and I'm coming up with nothing.
Thanks in advance.

Related

React Native Expo shows Async Storage warning

i'm using React Native expo, and it shows
[Warning: Async Storage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-community/async-storage' instead of 'react-native'. See https://github.com/react-native-community/react-native-async-storage].
i read this link and I understood that it's due to the fact that some dependencies are using old AsyncStorage, not the new one from community.
But I hardly found that any solution for Expo users. Is there any solution for Expo? Or if I have to manual change dependencies using the old AsyncStorage, how can i do it? Since I'm new to React Native, not really sure what to do..
In Expo you should always link the libraries that Expo includes in the App. So like mentioned in the docs here https://docs.expo.dev/versions/latest/sdk/async-storage/
expo install #react-native-async-storage/async-storage
is the correct import. If you are working with an old Expo-SDK this might be different, otherwise you should adapt your imports.
Now expo has migrated to use as well the community version as you can see here.
But if you get this warning definitely you have some dependency or more that still use the react-native-core version, if so please refer to the first answer to How to resolve using AsyncStorage (deprecated) warning? Using the community (correct) library:
if this is the case the best is as suggested in that answer is to
Your best course of action is to fork the repo and fix all instances of AsyncStorage to use the correct version, or open an issue.
This error occurs because firebase imports AsyncStorage from react native core and not the new library #react-native-async-storage/async-storage. I think firebase hasn't updated the by default import yet so you have to do it yourself.The way I fixed it was ;
Install react-native-async-storage: npm i #react-native-async-storage/async-storage
Go into the firebase index.js file that imports AsyncStorage from react native core: It is located at : 'node_modules/#firebase/auth/dist/rn'.
Create a variable that imports AsycnStorage from 'node-modules/#react-native-async-storage/async-storage' :
var AsyncStorage = require('../../../../#react-native-async-storage/async-storage');
Replace all uses of AsyncStorage in this file from react native core with new variable, i.e. replace "ReactNative__namespace.AsyncStorage" with "AsycnStorage",

Cannot read property 'array' of undefined error occurring in my genymotion while running my react-native project

I recently upgraded an old project that was running in react-native 0.49 to 0.55. So after installing and running the project this pops up. I searched the internet and i did not found any solution. Please help.
Solved. For anyone like me facing this issue. Check your red box and you can see the module where the error is targeting. In my case it was DoctorTiming.js (Check the image in my question. One error is pointing towards it).
Go to that module check if it is importing from any dependencies.
If it does go to node_modules/your_dependency
Check for index.js.
Inside it change import PropTypes from 'react' to import PropTypes from 'prop-types'.
You are good to go after that.

react native how to import from third library by using "import"?

I am trying to use SliderButton, I recently installed slider-button in my terminal,
npm install --save react-native-slider-button
and tried to import it, but somehow it did not work.
on website, I am supposed to write
var SliderButton = require("react-native-slider-button");
but my react-native is latest ver so i am guessing that I probably should not use require, how do I write code with using "import"?
You can replace require with import by placing the following at the top of your file:
import SliderButton from "react-native-slider-button"
export default class MyComponent extends Component {
...
}
You can't really just "import" this particular component. It was written using an earlier implementation of JS called CommonJS which is used in NodeJS. React Native now uses ES6 for module management. The SliderButton Component is a little problematic. First, it uses the CommonJS module syntax inside the component itself, including loading React and React Native in ways that are no longer supported. So parts of this module would have to be rewritten to work with current versions of react native. You could roll back to a previous react native version that supports CommonJS, or you could modify the Component to use the ES6-style module importation.

React Native - Error on importing third party library

I am trying to use a library react-native-tinder-swipe-cards - github
The issue is that it's giving the following error:
"Seems you're trying to access ReactNative.Component from the
'react-native' package. Perhaps you meant to access 'React.Component'
from the 'react' package instead?"
I am using the latest version of react native. Although the error tells me what exactly to do, it's not actually part of my application that is causing the error. It's their library that is causing the issue because removing this line:
import SwipeCards from 'react-native-swipe-cards';
Removes the error. Has anyone had a similar problem and can help me resolve this?
The NPM published version is not up to date with React Native and is using the "old" way to bring in Component (from 'react-native' instead of 'react'). Looking at the github repo the code has actually been updated but nothing has been published to NPM for that update. Your best bet is to either contact the author and get them to publish a update to NPM or use the repo version (npm i git+https//github.com/meteor-factory/react-native-tinder-swipe-cards --save)

How can I fix Android import settings after adding your SDK as a module?

Copied from the old forum:
I am trying to access the Jawbone API for the first time so I am following your Android Github steps. I downloaded your SDK and have it added as a module to my project but it is still telling me that it can't find any of the following import settings:
import retrofit.Callback;
import retrofit.RetrofitError;
import retrofit.client.Response;
import com.jawbone.upplatformsdk.api.ApiManager;
import com.jawbone.upplatformsdk.api.response.OauthAccessTokenResponse;
import com.jawbone.upplatformsdk.oauth.OauthUtils;
import com.jawbone.upplatformsdk.oauth.OauthWebViewActivity;
import com.jawbone.upplatformsdk.utils.UpPlatformSdkConstants;
I also loaded your UpPlatform_Android_SDK-1.0.0 project and HelloUp and they both seem to have the same problem even though one of your suggested ways to get started is to just build off of your HelloUp example.
Any suggestions would be greatly appreciated!
I updated the project with the latest gradle version and buildtools. It should work now.
Reimport or do a gradle sync after you get the latest source.