Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

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

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
```
2 changes: 1 addition & 1 deletion ...-app-messaging/integrate-your-application/react-native/install-dependencies.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
```
4 changes: 2 additions & 2 deletions src/fragments/start/getting-started/reactnative/auth.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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:
Expand Down
2 changes: 1 addition & 1 deletion ...ild-a-backend/add-aws-services/in-app-messaging/integrate-application/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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>

Expand Down
8 changes: 3 additions & 5 deletions src/pages/[platform]/build-a-backend/auth/set-up-auth/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
```

Expand Down Expand Up @@ -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";
Expand All @@ -337,9 +337,7 @@ const App = () => {
return (
<Authenticator.Provider>
<Authenticator>
<SafeAreaView>
<SignOutButton />
</SafeAreaView>
<SignOutButton />
</Authenticator>
</Authenticator.Provider>
);
Expand Down
8 changes: 3 additions & 5 deletions src/pages/[platform]/start/quickstart/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
```
Expand All @@ -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";
Expand All @@ -2761,9 +2761,7 @@ const App = () => {
return (
<Authenticator.Provider>
<Authenticator>
<SafeAreaView>
Copy link
Member Author

@tiffanynwyeung tiffanynwyeung Jan 22, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please note that SafeAreaView is removed here because the Authenticator UI component has safe area handling included in its implementation, making this call unnecessary.

(Specifically, the component uses SafeAreaProvider and the useSafeAreaInsets hook as recommended by the React Navigation team.)

<SignOutButton />
</SafeAreaView>
<SignOutButton />
</Authenticator>
</Authenticator.Provider>
);
Expand Down
4 changes: 2 additions & 2 deletions src/pages/gen1/[platform]/start/getting-started/auth/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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:
Expand Down
Loading