iOS camera permissions, native iOS permission alert not firing on first request

Hi all I have an app with a feature that allows the user to take a picture during a task.

Recently when asking for camera permissions for the first time the device is not showing the native alert but rather deferring to my secondary alert that is supposed to be used if the user had denied or changed their permissions settings after the first attempt.

My understanding is that when a device is asked for the first time iOS will supply the permissions alert similar to this

I have this in my info.plist

    <key>NSCameraUsageDescription</key>
    <string>Allow access to your camera to take pictures of your dog!</string>

code when the user taps the camera button in app (solution at bottom)

  function takePhoto() {
    check(
      Platform.select({
        ios: PERMISSIONS.IOS.CAMERA,
        android: PERMISSIONS.ANDROID.CAMERA,
      })
    )
      .then(async (response) => {
        if (response == 'unavailable') {
          alert('Camera is not available on this device');
          return;
        }

        const userId = auth().currentUser.uid;

        let image = null;
        const mapAPI = new MapAPI(firestore(), userId, storage);

        const showSettingsAlert = (title, message) => {
          Alert.alert(
            title,
            message,
            [
              {
                text: translations['settings.goto'],
                onPress: async () => {
                  Linking.openSettings();
                },
              },
              {
                text: translations['cancel'],
                onPress: () => {
                  console.log('Cancel Pressed');
                },
                style: 'cancel',
              },
            ],
            { cancelable: true }
          );
        };

        if (response != RESULTS.GRANTED) {
          showSettingsAlert(
            translations['permissions.cameratitle'],
            translations['permissions.cameradesc']
          );
          return;
        }

I've been trying to tackle this for a while and appreciate any help. Thanks!

I realized with the help from another overflower that I had not requested to access the camera before calling the custom alert.

Here is the solution that worked in my instance.

  const takePhoto = async () => {
    const imageProps = {
      mediaType: 'photo',
      width: 400,
      height: 400,
      writeTempFile: true,
    };

    const userId = auth().currentUser.uid;

    let image = null;
    const mapAPI = new MapAPI(firestore(), userId, storage);

    try {
      image = await ImageCropPicker.openCamera(imageProps);
    } catch (error) {
      console.log(error);

      const response = await check(
        Platform.select({
          ios: PERMISSIONS.IOS.CAMERA,
          android: PERMISSIONS.ANDROID.CAMERA,
        })
      );
      if (response !== RESULTS.GRANTED && response !== RESULTS.UNAVAILABLE) {
        showSettingsAlert(
          translations['permissions.cameratitle'],
          translations['permissions.cameradesc']
        );
      }
    }

    if (!image) {
      return;
    }