chore: specify RN peer dep version when installing Amplify UI RN package

aws-amplify · Jan 22, 2025 · e327ff3 · e327ff3
1 parent 19b6501
commit e327ff3
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 17 deletions.
diff --git a/...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx b/...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx
@@ -15,5 +15,5 @@ import reactnative1 from '/src/fragments/lib-v1/in-app-messaging/integrate-your-
 </Callout>
 
 ```bash
-npm install @aws-amplify/ui-react-native react-native-safe-area-context
+npm install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5
 ```
diff --git a/...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx b/...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx
@@ -22,5 +22,5 @@ import reactnative1 from '/src/fragments/lib/in-app-messaging/integrate-your-app
 </Callout>
 
 ```bash
-npm install @aws-amplify/ui-react-native react-native-safe-area-context
+npm install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5
 ```
diff --git a/src/fragments/start/getting-started/reactnative/auth.mdx b/src/fragments/start/getting-started/reactnative/auth.mdx
@@ -45,14 +45,14 @@ The `@aws-amplify/ui-react-native` package includes React Native specific UI com
 <Block name="Expo CLI">
 
 ```bash
-npm install @aws-amplify/ui-react-native react-native-get-random-values react-native-url-polyfill
+npm install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5 react-native-get-random-values react-native-url-polyfill
 ```
 
 </Block>
 <Block name="React Native CLI">
 
 ```bash
-npm install @aws-amplify/ui-react-native react-native-safe-area-context react-native-get-random-values react-native-url-polyfill
+npm install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5 react-native-get-random-values react-native-url-polyfill
 ```
 
 You will also need to install the pod dependencies for iOS:

diff --git a/...ild-a-backend/add-aws-services/in-app-messaging/integrate-application/index.mdx b/...ild-a-backend/add-aws-services/in-app-messaging/integrate-application/index.mdx
@@ -56,7 +56,7 @@ Learn more about Amplify In-App Messaging UI and how to fully unlock its capabil
 </Callout>
 
 ```bash title="Terminal" showLineNumbers={false}
-npm add @aws-amplify/ui-react-native react-native-safe-area-context
+npm add @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5
 ```
 </InlineFilter>
 

diff --git a/src/pages/[platform]/build-a-backend/auth/set-up-auth/index.mdx b/src/pages/[platform]/build-a-backend/auth/set-up-auth/index.mdx
@@ -287,7 +287,7 @@ npm add \
   aws-amplify \
   @react-native-community/netinfo \
   @react-native-async-storage/async-storage \
-  react-native-safe-area-context \
+  react-native-safe-area-context@^4.2.5 \
   react-native-get-random-values
 ```
 
@@ -316,7 +316,7 @@ Next, update the `App.tsx` file with the following to set up the authentication
 
 ```typescript
 import React from "react";
-import { Button, View, StyleSheet, SafeAreaView } from "react-native";
+import { Button, View, StyleSheet } from "react-native";
 import { Amplify } from "aws-amplify";
 import { Authenticator, useAuthenticator } from "@aws-amplify/ui-react-native";
 import outputs from "./amplify_outputs.json";
@@ -337,9 +337,7 @@ const App = () => {
   return (
     <Authenticator.Provider>
       <Authenticator>
-        <SafeAreaView>
-          <SignOutButton />
-        </SafeAreaView>
+        <SignOutButton />
       </Authenticator>
     </Authenticator.Provider>
   );

diff --git a/src/pages/[platform]/start/quickstart/index.mdx b/src/pages/[platform]/start/quickstart/index.mdx
@@ -2723,7 +2723,7 @@ npm add \
   aws-amplify \
   @react-native-community/netinfo \
   @react-native-async-storage/async-storage \
-  react-native-safe-area-context \
+  react-native-safe-area-context@^4.2.5 \
   react-native-get-random-values \
   react-native-url-polyfill
 ```
@@ -2738,7 +2738,7 @@ Next, update the `App.tsx` file with the following:
 
 ```typescript
 import React from "react";
-import { Button, View, StyleSheet, SafeAreaView } from "react-native";
+import { Button, View, StyleSheet } from "react-native";
 
 import { Amplify } from "aws-amplify";
 import { Authenticator, useAuthenticator } from "@aws-amplify/ui-react-native";
@@ -2761,9 +2761,7 @@ const App = () => {
   return (
     <Authenticator.Provider>
       <Authenticator>
-        <SafeAreaView>
-          <SignOutButton />
-        </SafeAreaView>
+        <SignOutButton />
       </Authenticator>
     </Authenticator.Provider>
   );

diff --git a/src/pages/gen1/[platform]/start/getting-started/auth/index.mdx b/src/pages/gen1/[platform]/start/getting-started/auth/index.mdx
@@ -93,14 +93,14 @@ The `@aws-amplify/ui-react-native` package includes React Native specific UI com
 <Block name="Expo CLI">
 
 ```bash
-expo install @aws-amplify/ui-react-native react-native-safe-area-context
+expo install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5
 ```
 
 </Block>
 <Block name="React Native CLI">
 
 ```bash
-npm install @aws-amplify/ui-react-native react-native-safe-area-context
+npm install @aws-amplify/ui-react-native react-native-safe-area-context@^4.2.5
 ```
 
 You will also need to install the pod dependencies for iOS: