'Expo - When navigating to IOS settings via linking, an error is thrown

I'm trying to send the user to my app IOS settings using expo linking:

The component:

<Card disabled={true}>
              <Text>{isSettingModalOpen}</Text>
              <Button onPress={() => setIsSettingModalOpen(null)}>
                DISMISS
              </Button>
              <Button
                onPress={() => {
                  openAppSettings();
                }}
              >
                Go To Settings
              </Button>
</Card>

The logic of the open settings button:

export const openAppSettings = async () => {
  try {
    if (Platform.OS === "ios") {
      await Linking.openURL("app-settings:");
    } else {
      const pkg = Constants.manifest.releaseChannel
        ? Constants.manifest.android.package build
        : "host.exp.exponent"; 

      await IntentLauncher.startActivityAsync(
        IntentLauncher.ActivityAction.APPLICATION_DETAILS_SETTINGS,
        { data: "package:" + pkg }
      );
    }
  } catch (e) {
    console.log("Error -openAppSettings-", e);
  }
};

On android devices this code works without any issues, but on IOS devices, when we press on "go to settings button" we get the error:

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

We aren't using any refs at our project so any help would be appreciated.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source