[docs] Add info about known UIImagePickerController iOS issue in Im…

…age Picker and minor fix in usage section (expo#22955)

docs/pages/versions/unversioned/sdk/imagepicker.mdx

@@ -16,6 +16,8 @@ import { APIInstallSection } from '~/components/plugins/InstallSection';
 import PlatformsSection from '~/components/plugins/PlatformsSection';
 import Video from '~/components/plugins/Video';
 import { SnackInline } from '~/ui/components/Snippet';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { GithubIcon } from '@expo/styleguide-icons';
 
 **`expo-image-picker`** provides access to the system's UI for selecting images and videos from the phone's library or taking a photo with the camera.
 
@@ -141,13 +143,27 @@ When you run this example and pick an image, you will see the image that you pic
 }
 ```
 
-### Using with AWS S3
+### With AWS S3
 
-Refer the [with-aws-storage-upload example](https://github.com/expo/examples/tree/master/with-aws-storage-upload). Follow [Amplify docs](https://docs.amplify.aws/) to set your project up correctly.
+<BoxLink
+  title="AWS storage example"
+  description="An example of how to use AWS storage can be found in with-aws-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
+
+See [Amplify documentation](https://docs.amplify.aws/) guide to set up your project correctly.
+
+### With Firebase
 
-### Using with Firebase
+<BoxLink
+  title="Firebase storage example"
+  description="An example of how to use Firebase storage can be found in with-firebase-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
 
-Refer the [with-firebase-storage-upload example](https://github.com/expo/examples/tree/master/with-firebase-storage-upload). Make sure you follow the [Using Firebase](/guides/using-firebase/) guide to set your project up correctly.
+See [Using Firebase](/guides/using-firebase/) guide to set up your project correctly.
 
 ## API
 
@@ -176,3 +192,7 @@ The following usage description keys are used by the APIs in this library.
     'NSCameraUsageDescription',
   ]}
 />
+
+## Known issue
+
+There is a known issue on iOS with the underlying `UIImagePickerController`. When an image (usually of a [higher resolution](http://www.openradar.me/49866214)) is picked from the camera roll, the result of the cropped image gives the wrong value for the cropped rectangle in some cases. Unfortunately, this issue is due to a bug in the closed source tools built into iOS.

docs/pages/versions/v46.0.0/sdk/imagepicker.mdx

@@ -16,6 +16,8 @@ import { APIInstallSection } from '~/components/plugins/InstallSection';
 import PlatformsSection from '~/components/plugins/PlatformsSection';
 import Video from '~/components/plugins/Video';
 import { SnackInline } from '~/ui/components/Snippet';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { GithubIcon } from '@expo/styleguide-icons';
 
 **`expo-image-picker`** provides access to the system's UI for selecting images and videos from the phone's library or taking a photo with the camera.
 
@@ -129,13 +131,27 @@ When you run this example and pick an image, you will see the image that you pic
 }
 ```
 
-### Using with AWS S3
+### With AWS S3
 
-Refer the [with-aws-storage-upload example](https://github.com/expo/examples/tree/master/with-aws-storage-upload). Follow [Amplify docs](https://docs.amplify.aws/) to set your project up correctly.
+<BoxLink
+  title="AWS storage example"
+  description="An example of how to use AWS storage can be found in with-aws-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
+
+See [Amplify documentation](https://docs.amplify.aws/) guide to set up your project correctly.
+
+### With Firebase
 
-### Using with Firebase
+<BoxLink
+  title="Firebase storage example"
+  description="An example of how to use Firebase storage can be found in with-firebase-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
 
-Refer the [with-firebase-storage-upload example](https://github.com/expo/examples/tree/master/with-firebase-storage-upload). Make sure you follow the [Using Firebase](/guides/using-firebase/) guide to set your project up correctly.
+See [Using Firebase](/guides/using-firebase/) guide to set up your project correctly.
 
 ## API
 
@@ -164,3 +180,7 @@ The following usage description keys are used by the APIs in this library.
     'NSCameraUsageDescription',
   ]}
 />
+
+## Known issue
+
+There is a known issue on iOS with the underlying `UIImagePickerController`. When an image (usually of a [higher resolution](http://www.openradar.me/49866214)) is picked from the camera roll, the result of the cropped image gives the wrong value for the cropped rectangle in some cases. Unfortunately, this issue is due to a bug in the closed source tools built into iOS.

docs/pages/versions/v47.0.0/sdk/imagepicker.mdx

@@ -16,6 +16,8 @@ import { APIInstallSection } from '~/components/plugins/InstallSection';
 import PlatformsSection from '~/components/plugins/PlatformsSection';
 import Video from '~/components/plugins/Video';
 import { SnackInline } from '~/ui/components/Snippet';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { GithubIcon } from '@expo/styleguide-icons';
 
 **`expo-image-picker`** provides access to the system's UI for selecting images and videos from the phone's library or taking a photo with the camera.
 
@@ -141,13 +143,27 @@ When you run this example and pick an image, you will see the image that you pic
 }
 ```
 
-### Using with AWS S3
+### With AWS S3
 
-Refer the [with-aws-storage-upload example](https://github.com/expo/examples/tree/master/with-aws-storage-upload). Follow [Amplify docs](https://docs.amplify.aws/) to set your project up correctly.
+<BoxLink
+  title="AWS storage example"
+  description="An example of how to use AWS storage can be found in with-aws-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
+
+See [Amplify documentation](https://docs.amplify.aws/) guide to set up your project correctly.
+
+### With Firebase
 
-### Using with Firebase
+<BoxLink
+  title="Firebase storage example"
+  description="An example of how to use Firebase storage can be found in with-firebase-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
 
-Refer the [with-firebase-storage-upload example](https://github.com/expo/examples/tree/master/with-firebase-storage-upload). Make sure you follow the [Using Firebase](/guides/using-firebase/) guide to set your project up correctly.
+See [Using Firebase](/guides/using-firebase/) guide to set up your project correctly.
 
 ## API
 
@@ -176,3 +192,7 @@ The following usage description keys are used by the APIs in this library.
     'NSCameraUsageDescription',
   ]}
 />
+
+## Known issue
+
+There is a known issue on iOS with the underlying `UIImagePickerController`. When an image (usually of a [higher resolution](http://www.openradar.me/49866214)) is picked from the camera roll, the result of the cropped image gives the wrong value for the cropped rectangle in some cases. Unfortunately, this issue is due to a bug in the closed source tools built into iOS.

docs/pages/versions/v48.0.0/sdk/imagepicker.mdx

@@ -16,6 +16,8 @@ import { APIInstallSection } from '~/components/plugins/InstallSection';
 import PlatformsSection from '~/components/plugins/PlatformsSection';
 import Video from '~/components/plugins/Video';
 import { SnackInline } from '~/ui/components/Snippet';
+import { BoxLink } from '~/ui/components/BoxLink';
+import { GithubIcon } from '@expo/styleguide-icons';
 
 **`expo-image-picker`** provides access to the system's UI for selecting images and videos from the phone's library or taking a photo with the camera.
 
@@ -141,13 +143,27 @@ When you run this example and pick an image, you will see the image that you pic
 }
 ```
 
-### Using with AWS S3
+### With AWS S3
 
-Refer the [with-aws-storage-upload example](https://github.com/expo/examples/tree/master/with-aws-storage-upload). Follow [Amplify docs](https://docs.amplify.aws/) to set your project up correctly.
+<BoxLink
+  title="AWS storage example"
+  description="An example of how to use AWS storage can be found in with-aws-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
+
+See [Amplify documentation](https://docs.amplify.aws/) guide to set up your project correctly.
+
+### With Firebase
 
-### Using with Firebase
+<BoxLink
+  title="Firebase storage example"
+  description="An example of how to use Firebase storage can be found in with-firebase-storage-upload."
+  Icon={GithubIcon}
+  href="https://github.com/expo/examples/tree/master/with-aws-storage-upload"
+/>
 
-Refer the [with-firebase-storage-upload example](https://github.com/expo/examples/tree/master/with-firebase-storage-upload). Make sure you follow the [Using Firebase](/guides/using-firebase/) guide to set your project up correctly.
+See [Using Firebase](/guides/using-firebase/) guide to set up your project correctly.
 
 ## API
 
@@ -176,3 +192,7 @@ The following usage description keys are used by the APIs in this library.
     'NSCameraUsageDescription',
   ]}
 />
+
+## Known issue
+
+There is a known issue on iOS with the underlying `UIImagePickerController`. When an image (usually of a [higher resolution](http://www.openradar.me/49866214)) is picked from the camera roll, the result of the cropped image gives the wrong value for the cropped rectangle in some cases. Unfortunately, this issue is due to a bug in the closed source tools built into iOS.