I want to implement a flip effect in my React Native app, similar like described here:

https://www.codementor.io/reactjs/tutorial/building-a-flipper-using-react-js-and-less-css

My question is. Can I achieve it somehow with the help of some library like 'Animations'https://facebook.github.io/react-native/docs/animations.html or I have to play with 'plain' CSS styles.

What is the 'good practive' for such animations in React Native?

class CardBack extends Component {  render() {    return (<TouchableOpacity onPress={this.flip}><View style={styles.scrumCardBorder}><View style={styles.cardBack}></View></View></TouchableOpacity>    );  }  flip() {    this.setState({flipped: !this.state.flipped})  }}class CardFront extends Component {  render() {    return (<TouchableOpacity><View style={styles.scrumCardBorder}><View style={styles.cardFront}><Text style={styles.cardValue}>5</Text></View></View></TouchableOpacity>    );  }}

I keep getting this error, when I try running my React Native application after installing the react-native.webview package. Please what could I be doing wrong.

info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.Jetifier found 1135 file(s) to forward-jetify. Using 8 workers...info Starting JS server...info Installing the app...Starting a Gradle Daemon, 1 busy Daemon could not be reused, use --status for details> Task :react-native-webview:compileDebugJavaWithJavac> Task :react-native-webview:compileDebugJavaWithJavac FAILEDDeprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.Use '--warning-mode all' to show the individual deprecation warnings.See https://docs.gradle.org/6.0.1/userguide/command_line_interface.html#sec:command_line_warnings79 actionable tasks: 14 executed, 65 up-to-dateC:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewModule.java:276: error: cannot find symbol    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {                                                    ^  symbol:   variable Q  location: class VERSION_CODESNote: C:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewManager.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.1 errorFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':react-native-webview:compileDebugJavaWithJavac'.> Compilation failed; see the compiler error output for details.* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.* Get more help at https://help.gradle.orgBUILD FAILED in 1m 37serror Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081C:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewModule.java:276: error: cannot find symbol    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {                                                    ^  symbol:   variable Q  location: class VERSION_CODESNote: C:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Projects\React-Native\FUNAI\node_modules\react-native-webview\android\src\main\java\com\reactnativecommunity\webview\RNCWebViewManager.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.1 errorFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':react-native-webview:compileDebugJavaWithJavac'.> Compilation failed; see the compiler error output for details.* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.* Get more help at https://help.gradle.orgBUILD FAILED in 1m 37s    at makeError (C:\Projects\React-Native\FUNAI\node_modules\execa\index.js:174:9)    at Promise.all.then.arr (C:\Projects\React-Native\FUNAI\node_modules\execa\index.js:278:16)    at process._tickCallback (internal/process/next_tick.js:68:7)

I am trying to integrate an existing android project into my react-native app.

I know how to create basic native components, to get a native android View forwarded to the front-end, but the code I'm trying to integrate uses Intents and Activities to get to the View I am trying to encapsulate. As far as I can tell I can only use the SimpleViewManager to encapsulate a View, but is it possible to launch an activity inside of this and not take over the whole screen but stay inside the view?

I don't really understand how interplay between Views and Activities and Intents work. As far as I know an Intent defines what an Activity will show and then you launch the Activity with that information and the Activity launches a View based on definitions in layout xml?

Any illumination would be greatly appreciated.

i want create a react native app which can remove other unwanted apps on device

i am using bare-workflow of expo react-native . i cannot find the ACTION_DELETE intent in expo-intent-launcher

I am trying to integrate an existing android project into my react-native app.

I know how to create basic native components, to get a native android View forwarded to the front-end, but the code I'm trying to integrate uses Intents and Activities to get to the View I am trying to encapsulate. As far as I can tell I can only use the SimpleViewManager to encapsulate a View, but is it possible to launch an activity inside of this and not take over the whole screen but stay inside the view?

I don't really understand how interplay between Views and Activities and Intents work. As far as I know an Intent defines what an Activity will show and then you launch the Activity with that information and the Activity launches a View based on definitions in layout xml?

Any illumination would be greatly appreciated.

I want to post a wav file(in blob) to my server.

I've tested my server using postman, and it works fine.

I also creat a react-app(web) and post the wav using the same logic below successfully.

const formData = new FormData();formData.append('file', blob, 'test');let requestOptions = {  method: 'POST',  body: formData,  mode:'no-cors',};// not localhostfetch('http://xx.xx.xx.xx', requestOptions)    .then(response => response.text())    .then(result => {      console.log(result)    })    .catch(error => console.log('error', error));

However I cannot even send the request out on my phone(Only got [TypeError: Network request failed] and my server didn't receive any request.)

I've been looking online and still not fix this issue. Please help.

I need help , I need fix this error when building apk using gradlew assembleRelease , configuration is succesful , but when executing at 40% there throws an error :

> Task :app:bundleReleaseJsAndAssets_SentryUpload FAILEDerror: An organization slug is required (provide with --org)Add --log-level=[info|debug] or export SENTRY_LOG_LEVEL=[info|debug] to see more output.Please attach the full debug log to all bug reports.FAILURE: Build completed with 2 failures.1: Task failed with an exception.-----------* What went wrong:Execution failed for task ':app:bundleReleaseJsAndAssets'.> Process 'command 'cmd'' finished with non-zero exit value 1* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.==============================================================================2: Task failed with an exception.-----------* What went wrong:Execution failed for task ':app:bundleReleaseJsAndAssets_SentryUpload'.> Process 'command 'cmd'' finished with non-zero exit value 1* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

I'm trying to build my apk using ./gradlew bundleRelease but I always get this error:

Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.

Do I need to update gradle? how?

In my react native app, I ask for permission to access the camera roll as so:

  getPermissionAsync = async () => {    const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);    if (status !== "granted") {      alert("Sorry, we need camera roll permissions to make this work!");    }    await this.setState({ permission: status === "granted" });  };  _pickMedia = async (index, type) => {    if (this.state.permission != true) {      await this.getPermissionAsync();    }    if (this.state.permission == true) {        // get image      } catch (E) {        console.log(E);      }    }  };

This works as expected during testing, but for my published version on Google Play, status is returned as undetermined whether or not the user gives permission. What does this mean?

I have written an component using Vidyo sdk (Vidyo.io). Component was meant to be used in React-Native application and it was written 100% in java. The problem is that when I try to use this component in React it is not showing any video or camera preview. In 100% android application everything works correctly, as it is shown in demo application. To be sure I have checked several times if permission for camera is given - and it it. I have also checked if whole project have internet connection (and permission) - and it have

here is the code of xml file:

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent"><FrameLayout        android:id="@+id/video_container"        android:layout_width="0dp"        android:layout_height="0dp"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintHorizontal_bias="1.0"        app:layout_constraintLeft_toLeftOf="parent"        app:layout_constraintRight_toRightOf="parent"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintTop_toTopOf="parent"        app:layout_constraintVertical_bias="0.0" /><ImageView        android:id="@+id/endCallButton"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="@drawable/red_round_border"        android:src="@drawable/ic_end_call"        android:padding="5dp"        android:layout_marginBottom="10dp"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintHorizontal_chainStyle="packed"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintEnd_toEndOf="@+id/changeCameraStateButton" /><ProgressBar        android:id="@+id/connectProgress"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:visibility="visible"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintRight_toRightOf="parent"        app:layout_constraintHorizontal_chainStyle="packed"        app:layout_constraintTop_toTopOf="parent"        app:layout_constraintLeft_toLeftOf="parent" /><TextView        android:id="@+id/errorText"        android:layout_width="0dp"        android:layout_height="wrap_content"        android:visibility="visible"        android:textColor="@android:color/black"        android:gravity="center"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintRight_toRightOf="parent"        app:layout_constraintTop_toTopOf="parent" /><ImageView        android:id="@+id/changeCameraStateButton"        android:layout_height="wrap_content"        android:layout_width="wrap_content"        android:background="@drawable/grey_round_border"        android:src="@drawable/ic_deactivate_camera"        android:padding="5dp"        android:layout_marginBottom="10dp"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintHorizontal_chainStyle="packed"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintStart_toStartOf="@+id/endCallButton" /></android.support.constraint.ConstraintLayout>

and here is implementation on android side:

public class VidyoView extends ConstraintLayout implements        VidyoConnector.IConnect,        VidyoConnector.IRegisterLogEventListener,        VidyoConnector.IRegisterNetworkInterfaceEventListener {    private static final String TAG = "VidyoView";    enum VIDYO_CONNECTOR_STATE {        VC_CONNECTED,        VC_DISCONNECTED,        VC_DISCONNECTED_UNEXPECTED,        VC_CONNECTION_FAILURE    }    private FrameLayout imageContainer;    private ImageView endCallButton;    private ProgressBar progress;    private TextView errorText;    private boolean vidyoClientInitialized = false;    private VIDYO_CONNECTOR_STATE vidyoConnectorState = VIDYO_CONNECTOR_STATE.VC_DISCONNECTED;    private VidyoConnector vidyoConnector = null;    private boolean vidyoConnectorConstructed = false;    private WeakReference<ThemedReactContext> reactContext;    private String host;    private String token;    private String userName;    private String resourceId;    public VidyoView(@NonNull Context context) {        super(context);        setUp();    }    public VidyoView(@NonNull Context context, @Nullable AttributeSet attrs) {        super(context, attrs);        setUp();    }    public VidyoView(@NonNull Context context, @Nullable AttributeSet attrs, @AttrRes int defStyleAttr) {        super(context, attrs, defStyleAttr);        setUp();    }    private void setUp() {        Log.d(TAG, "SET UP");        inflate(getContext(), R.layout.component_vidyo_view, this);        reactContext = new WeakReference<>((ThemedReactContext) getContext());        setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));        imageContainer = (FrameLayout) findViewById(R.id.video_container);        endCallButton = (ImageView) findViewById(R.id.endCallButton);        progress = (ProgressBar) findViewById(R.id.connectProgress);        errorText = (TextView) findViewById(R.id.errorText);        if(reactContext.get() != null) {            Connector.SetApplicationUIContext(reactContext.get().getCurrentActivity());        }        vidyoClientInitialized = Connector.Initialize();        endCallButton.setOnClickListener(new OnClickListener() {            @Override            public void onClick(View view) {                stopConnection();            }        });        start();    }    public void start() {        ViewTreeObserver viewTreeObserver = imageContainer.getViewTreeObserver();        if (viewTreeObserver.isAlive()) {            viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {                @Override                public void onGlobalLayout() {                    imageContainer.getViewTreeObserver().removeOnGlobalLayoutListener(this);                    // If the vidyo connector was not previously successfully constructed then construct it                    checkVidyoConnectionAndReconnect();                    connect();                }            });        }    }    @Override    public void OnSuccess() {        Log.d(TAG, "Success, connected");        onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE.VC_CONNECTED, "Connected");        EventEmitter.emmitVidyoConnected(reactContext.get(), getId());    }    @Override    public void OnFailure(VidyoConnector.VidyoConnectorFailReason vidyoConnectorFailReason) {        onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE.VC_CONNECTION_FAILURE, "Connected");        EventEmitter.emmitVidyoConnectionFailure(reactContext.get(), getId(), vidyoConnectorFailReason.toString());        Log.d(TAG, "On failure = "+ vidyoConnectorFailReason.toString());    }    @Override    public void OnDisconnected(VidyoConnector.VidyoConnectorDisconnectReason vidyoConnectorDisconnectReason) {        if (vidyoConnectorDisconnectReason == VidyoConnector.VidyoConnectorDisconnectReason.VIDYO_CONNECTORDISCONNECTREASON_Disconnected) {            Log.d(TAG, "OnDisconnected: successfully disconnected, reason = "+ vidyoConnectorDisconnectReason.toString());            onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE.VC_DISCONNECTED, "Disconnected");        } else {            Log.d(TAG, "OnDisconnected: successfully disconnected, reason = "+ vidyoConnectorDisconnectReason.toString());            onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE.VC_DISCONNECTED_UNEXPECTED, "Unexpected disconnection");        }    }    @Override    public void OnLog(VidyoLogRecord vidyoLogRecord) {    }    @Override    public void OnNetworkInterfaceAdded(VidyoNetworkInterface vidyoNetworkInterface) {    }    @Override    public void OnNetworkInterfaceRemoved(VidyoNetworkInterface vidyoNetworkInterface) {    }    @Override    public void OnNetworkInterfaceSelected(VidyoNetworkInterface vidyoNetworkInterface,                                           VidyoNetworkInterface.VidyoNetworkInterfaceTransportType vidyoNetworkInterfaceTransportType) {    }    @Override    public void OnNetworkInterfaceStateUpdated(VidyoNetworkInterface vidyoNetworkInterface,                                               VidyoNetworkInterface.VidyoNetworkInterfaceState vidyoNetworkInterfaceState) {    }    private void onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE state, final String statusText) {        Log.d(TAG, "onConnectorStateUpdeted, state = "+ state.toString());        vidyoConnectorState = state;        ThemedReactContext context = reactContext.get();        if (context != null && context.getCurrentActivity() != null) {            context.getCurrentActivity().runOnUiThread(new Runnable() {                @Override                public void run() {                    if (vidyoConnectorState == VIDYO_CONNECTOR_STATE.VC_CONNECTED) {                        hideProgress();                    } else if(vidyoConnectorState == VIDYO_CONNECTOR_STATE.VC_CONNECTION_FAILURE){                        hideProgress();                        errorText.setVisibility(VISIBLE);                        errorText.setText("Cannot load");                        EventEmitter.emmitVidyoConnectionFailure(reactContext.get(), getId(), "cannot connect");                    }                }            });        }    }    public void setHost(String host) {        Log.d(TAG, "SET HOST");        this.host = host;    }    public void setToken(String token) {        Log.d(TAG, "SET TOKEN");        this.token = token;    }    public void setResourceId(String resourceId) {        Log.d(TAG, "SET RESOURCE ID");        this.resourceId = resourceId;    }    public void setUserName(String userName) {        Log.d(TAG, "SET USER NAME");        this.userName = userName;    }    public void connect() {        if (vidyoConnectorState != VIDYO_CONNECTOR_STATE.VC_CONNECTED && vidyoConnector != null) {            progress.setVisibility(VISIBLE);            if (!vidyoConnector.Connect(                    host,                    token,                    userName,                    resourceId,                    this)) {                onConnectorStateUpdeted(VIDYO_CONNECTOR_STATE.VC_CONNECTION_FAILURE, "Connection failed");                Log.d(TAG, "Status: "+ false);            } else                Log.d(TAG, "Status: "+ true);        }    }    private void checkVidyoConnectionAndReconnect() {        if (!vidyoConnectorConstructed) {            if (vidyoClientInitialized) {                connectVidyo();            } else {                Log.d(TAG, "ERROR: VidyoClientInitialize failed - not constructing VidyoConnector ...");            }            Log.d(TAG, "onResume: vidyoConnectorConstructed => "+ (vidyoConnectorConstructed ? "success" : "failed"));        }    }    private void connectVidyo() {        vidyoConnector = new VidyoConnector(imageContainer,                VidyoConnector.VidyoConnectorViewStyle.VIDYO_CONNECTORVIEWSTYLE_Default,                15,"info@VidyoClient info@VidyoConnector warning","",                0);        vidyoConnectorConstructed = true;        refreshView();        if (!vidyoConnector.RegisterNetworkInterfaceEventListener(VidyoView.this)) {            Log.d(TAG, "VidyoConnector RegisterNetworkInterfaceEventListener failed");        }        if (!vidyoConnector.RegisterLogEventListener(VidyoView.this, "info@VidyoClient info@VidyoConnector warning")) {            Log.d(TAG, "VidyoConnector RegisterLogEventListener failed");        }    }    private void  hideProgress(){        progress.setVisibility(GONE);    }    private void refreshView() {        progress.setVisibility(GONE);        vidyoConnector.ShowViewAt(imageContainer, 0, 0, imageContainer.getWidth(), imageContainer.getHeight());    }}

Does anyone knows what can cause this problem?

I'm using retrofit (2.7.2) and OkHttp version (4.4.0) in an Android project and I'm facing a crash on a request.

Dependencies:

kapt("com.squareup.moshi:moshi-kotlin-codegen:1.9.2")implementation 'com.squareup.moshi:moshi:1.9.2'implementation 'com.squareup.retrofit2:retrofit:2.7.2'implementation 'com.squareup.retrofit2:converter-moshi:2.7.2'implementation("com.squareup.okhttp3:okhttp:4.4.0")implementation("com.squareup.okhttp3:okhttp-tls:4.4.0")implementation "com.squareup.okhttp3:logging-interceptor:4.4.0"

Crash:

java.lang.NoSuchMethodError: No virtual method toString(Z)Ljava/lang/String; in class Lokhttp3/Cookie; or its super classes (declaration of 'okhttp3.Cookie' appears in /data/app/com.package-1/base.apk:classes3.dex) at okhttp3.JavaNetCookieJar.saveFromResponse(JavaNetCookieJar.java:45) at com.facebook.react.modules.network.ReactCookieJarContainer.saveFromResponse(ReactCookieJarContainer.java:36) at okhttp3.internal.http.HttpHeaders.receiveHeaders(HttpHeaders.kt:207) at okhttp3.internal.http.BridgeInterceptor.intercept(BridgeInterceptor.kt:85) at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.kt:100) at okhttp3.internal.http.RetryAndFollowUpInterceptor.intercept(RetryAndFollowUpInterceptor.kt:74) at okhttp3.internal.http.RealInterceptorChain.proceed(RealInterceptorChain.kt:100) at okhttp3.internal.connection.RealCall.getResponseWithInterceptorChain$okhttp(RealCall.kt:197) at okhttp3.internal.connection.RealCall$AsyncCall.run(RealCall.kt:502) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1112) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:587) at java.lang.Thread.run(Thread.java:818)

We began to develop an app using Expo then push it to Google Play. It is still on Google Play now.

Recently, we decided to use react-native from scratch (without eject expo, it is a new project with the same functionalities with the old one, please don't ask me explain why, it is a hard decision from our team).

Now we try to upload a new release on the same project as the old one on Google Play and Google said that our app signing key has changed.

We know that is true but we don't know how to re-use the old keystore. In the old expo-project, we found a find name *.jks, but don't remember its password and its key alias.

We'd like to know if it is possible to change the app signing key on Google play, to be able to keep using the old project, instead of creating a new project.

Thank you very much!

How can I install react-native app on my android device locally, without publishing anything to Play Store. The app was created with create-react-native-app command?

I have just updated my project to use react-native version 0.60.2 . But when I am trying to run an application on Android device it gets crashed after launch screen. I got the following error logs :

E/AndroidRuntime: FATAL EXCEPTION: create_react_context    Process: com.tjspeed, PID: 3909    java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libhermes.so        at com.facebook.soloader.SoLoader.doLoadLibraryBySoName(SoLoader.java:738)        at com.facebook.soloader.SoLoader.loadLibraryBySoName(SoLoader.java:591)        at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:529)        at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:484)        at com.facebook.hermes.reactexecutor.HermesExecutor.<clinit>(HermesExecutor.java:20)        at com.facebook.hermes.reactexecutor.HermesExecutorFactory.create(HermesExecutorFactory.java:27)        at com.facebook.react.ReactInstanceManager$5.run(ReactInstanceManager.java:949)        at java.lang.Thread.run(Thread.java:760)

Few suggestions available here : https://github.com/facebook/react-native/issues/25601 but unfortunately none of them worked for me. Please suggest the workaround.

I'm adding a music-player component/functionality to this react native app.I'm gonna include all the relevant code to give you the best understanding of the setup.

In MusicContext.js, the context file that handles the logic for the music player, I have a few State objects for determining which song to play.

const initialState = {  startMusic: () => null,  stopMusic: () => null,  soundObject: null,  isPlaying: false,  currentIndex: 0}

My songs array:

mainTheme = new Audio.Sound()mainTheme2 = new Audio.Sound()mainTheme3 = new Audio.Sound()const songs = [  { path: require("../assets/sounds/MainTheme.mp3"), song: mainTheme },  { path: require("../assets/sounds/MainTheme2.mp3"), song: mainTheme2 },  { path: require("../assets/sounds/MainTheme3.mp3"), song: mainTheme3 },]

currentIndex begins at 0 so the music player will start at songs[0].

The function to start playing the music is as follows:

const startMusic = async () => {    try {      const songToPlay = songs[currentIndex].song  // first song in the array of songs      const source = songs[currentIndex].path      // the path that loadAsync() function needs to load file      await songToPlay.loadAsync(source)      await songToPlay.playAsync()      setSoundObject(songToPlay)      setIsPlaying(true)      return new Promise(resolve => {        songToPlay.setOnPlaybackStatusUpdate(playbackStatus => {          if (playbackStatus.didJustFinish) {            console.log("Song finished")            resolve()          }        })      })    } catch (error) {      console.log(`Error: ${error}`)      return    }  }

At this point, soundObject = the song that is playing, and currentIndex = 0.My function for skipping to the next song is:

const handleNextTrack = async () => {    if (soundObject) {      await soundObject.stopAsync()      await soundObject.unloadAsync()      setSoundObject(null)      currentIndex < songs.length - 1 ? (currentIndex += 1) : (currentIndex = 0)      setCurrentIndex({ currentIndex })      this.startMusic()    }  }

After that, it goes back to startMusic(), except now with the currentIndex being 1, which should play the next song in the array.

THE ERROR I'M GETTING is Possible Unhandled Promise Rejection (id: 5): Error: "currentIndex" is read-only

I tried a few different ways of implementing handleNextTrack but it all leads to the same error.

UPDATE

const handlePreviousTrack = async () => {    if (soundObject) {      await soundObject.stopAsync()      await soundObject.unloadAsync()      setSoundObject(null)      let newIndex = currentIndex      newIndex < (songs.length - 1) ? (--newIndex) : (newIndex = 0)      setCurrentIndex(newIndex)      startMusic()    }  }  const handleNextTrack = async () => {     if (soundObject) {       await soundObject.stopAsync()      await soundObject.unloadAsync()      setSoundObject(null)      let newIndex = currentIndex      newIndex < (songs.length - 1) ? (++newIndex) : (newIndex = 0)       setCurrentIndex(newIndex)       startMusic()     }   }

Song[0] plays when app opens. <~GOOD

Song[0] plays again when I hit next<~BAD

Song[1] plays only if I hit next a second time <~GOOD

Song[2] plays if I hit next again <~GOOD

After that I can cycle through a bit, hitting previous and next a few times, but it just broke and somehow the soundObject is back to null

I am trying to create an animated popup with PanResponder, to allow the user to close the pop up simply pressing the knob and sliding down.I came up with this solution where OnPressIn (knob) sets this.state.isHandlingCurtain to true and the popup's marginTop becames the vertical position of the touch. But it is not working smoothly.
How would you do this?

https://snack.expo.io/@ivantacca/curtain-1.2

State:

state = {  isHandlingCurtain: false  curtainY: 0,}

PopUp:

<Animated.View  style={[curtainStyles.curtain, this.state.isHandlingCurtain ? {marginBottom:this.state.curtainY} : {marginBottom: this.state.fadeAnim} ]}><TouchableOpacity style={curtainStyles.knob} onPressIn={this.curtainGestures}><View style={curtainStyles.knobIco}></View></TouchableOpacity></Animated.View>

PanResponder:

panResponder = PanResponder.create({    onStartShouldSetPanResponder: (event, gestureState) => true,    onStartShouldSetPanResponderCapture: (event, gestureState) => {      const {dx, dy} = gestureState;      return (Math.abs(dx) > 0) || (Math.abs(dy) > 0);    },    onMoveShouldSetPanResponder: (evt, gestureState) => false,    onMoveShouldSetPanResponderCapture: (event, gestureState) => false,    onPanResponderGrant: (event, gestureState) => false,    onPanResponderMove: (event, gestureState) => {      if(this.state.isHandlingCurtain == true){        this.setState({          curtainY: -event.nativeEvent.locationY,        });      }      return true    },    onPanResponderRelease: (event, gestureState) => false  });

Im trying to display the contents of my firestore database, its working perfectly on ios but android is null, i've followed the instructions on https://rnfirebase.io/ for the android set up to the T and i've created multiple new apps to no avail.

Firebase is acknowledging that there are 2 apps connected but no matter what I do, nothing is being shown.

Ive updated the rules to accept any connections but still nothing. Has anyone else run into this problem? Any information needed can be provided, but seeing as the app is working fine on ios i'm going crazy trying to figure out whats wrong

export default function Products(){const [loading, setLoading] = useState(true);const [products, setProducts] = useState([]);useEffect(() => {    const subscriber = firestore()    .collection('products')    .onSnapshot(querySnapshot => {        const products = [];        querySnapshot.forEach(documentSnapshot => {            products.push({                ...documentSnapshot.data(),                key: documentSnapshot.id,            });        });        setProducts(products);        setLoading(false);    });    return () => subscriber();}, []);return(<View><Text>Top</Text><FlatList        data={products}        renderItem={({ item }) => (<View style={{height: 50, flex: 1, alignItems: 'center', justifyContent: 'center'}}><Text>Product ID: {item.key}</Text><Text>Product Name: {item.name}</Text></View>    )}    /><Text>Bottom</Text></View>);

}

I am attempting to cycle through sound objects in an Array, using an index value that begins at 0 and increments/decrements depending on whether I press next or back

This is for a music player for react-native using the Expo//expo-av library. I'll include all relevant code.

State I have in my Context file

const initialState = {  startMusic: () => null,  stopMusic: () => null,  soundObject: null,  isPlaying: false,  currentIndex: 0,}

useState()

const [soundObject, setSoundObject] = useState(initialState.soundObject)const [isPlaying, setIsPlaying] = useState(initialState.isPlaying)const [currentIndex, setCurrentIndex] = useState(initialState.currentIndex)

Start Music function

const startMusic = async () => {    try {      const songToPlay = songs[currentIndex].song      const source = songs[currentIndex].path      await songToPlay.loadAsync(source)      await songToPlay.playAsync()      setSoundObject(songToPlay)      setIsPlaying(true)      return new Promise(resolve => {      // I made this promise when I was setting a loop to play through music.  May not need this anymore        songToPlay.setOnPlaybackStatusUpdate(playbackStatus => {          if (playbackStatus.didJustFinish) {            console.log("Song finished")            resolve()          }        })      })    } catch (error) {      console.log(`Error: ${error}`)      return    }  }

And finally, the handler functions that are supposed to cycle through songs

const handlePreviousTrack = async () => {    if (soundObject) {      await soundObject.stopAsync()      await soundObject.unloadAsync()      // setSoundObject(null)      let newIndex = currentIndex      newIndex < songs.length - 1 ? newIndex-- : (newIndex = 0)      setCurrentIndex(newIndex)      startMusic()      console.log(currentIndex)    }  }  const handleNextTrack = async () => {    if (soundObject) {      await soundObject.stopAsync()      await soundObject.unloadAsync()      // setSoundObject(null)      let newIndex = currentIndex      newIndex < songs.length - 1 ? newIndex++ : (newIndex = 0)      setCurrentIndex(newIndex)      startMusic()      console.log(currentIndex)    }  }

Cycling through next/previous does not go in order. Sometimes it works, sometimes previous goes to the next song, sometimes pressing next just replays the first song.

Am I manipulating the state via currentIndex incorrectly?

I just applied a production ad-unit id for my android app (not published to google play, and I'm testing on my phone and also emulator with product ad-unit-id but the ad don't display, the source code like this

// Display a banner<AdMobBanner  bannerSize="fullBanner"  adUnitID="ca-app-pub-3940256099942544/6300978111" // Test ID, Replace with your-admob-unit-id  testDeviceID="EMULATOR"  onDidFailToReceiveAdWithError={this.bannerError} />

https://docs.expo.io/versions/latest/sdk/admob/

the above code with testing id is displayed in my app (testing on my phone and also emulator), but I use my read key, anyone knows what is the problem?