diff --git a/App.tsx b/App.tsx
index ef7129a..0093817 100644
--- a/App.tsx
+++ b/App.tsx
@@ -7,8 +7,7 @@ import SettingsScreen from './screens/SettingsScreen';
import { QRCodeContext } from './types';
import CustomTabBar from './components/CustomTabBar';
-import { Button } from 'react-native';
-import { Authenticator, useAuthenticator, withAuthenticator } from '@aws-amplify/ui-react-native';
+import { withAuthenticator } from '@aws-amplify/ui-react-native';
import { Amplify } from 'aws-amplify';
import config from './src/aws-exports';
import { enableScreens } from 'react-native-screens';
@@ -17,11 +16,6 @@ enableScreens();
Amplify.configure(config);
-function SignOutButton() {
- const { signOut } = useAuthenticator();
- return ;
-}
-
const Tab = createBottomTabNavigator();
const App: React.FC = () => {
diff --git a/hooks/useFetchUserAttributes.ts b/hooks/useFetchUserAttributes.ts
new file mode 100644
index 0000000..5e8d30d
--- /dev/null
+++ b/hooks/useFetchUserAttributes.ts
@@ -0,0 +1,37 @@
+import { useState, useEffect } from 'react';
+import { fetchUserAttributes } from 'aws-amplify/auth';
+
+interface UserAttributes {
+ email: string;
+ email_verified: string;
+ family_name: string;
+ given_name: string;
+ identities: string;
+ name: string;
+ sub: string;
+}
+
+const useFetchUserAttributes = () => {
+ const [userAttributes, setUserAttributes] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ useEffect(() => {
+ const handleFetchUserAttributes = async () => {
+ try {
+ const attributes = await fetchUserAttributes();
+ setUserAttributes(attributes as unknown as UserAttributes);
+ } catch (error: any) {
+ setError(error.message);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ handleFetchUserAttributes();
+ }, []);
+
+ return { userAttributes, loading, error };
+};
+
+export default useFetchUserAttributes;
diff --git a/screens/SettingsScreen.tsx b/screens/SettingsScreen.tsx
index 3fe5b72..01e2878 100644
--- a/screens/SettingsScreen.tsx
+++ b/screens/SettingsScreen.tsx
@@ -1,10 +1,35 @@
-import React, { useContext } from 'react';
-import { View, Text, StyleSheet, TouchableOpacity, Linking } from 'react-native';
+import React, { useContext, useState } from 'react';
+import { View, Text, StyleSheet, TouchableOpacity, Linking, Button } from 'react-native';
import { QRCodeContext } from '../types';
+import { useAuthenticator } from '@aws-amplify/ui-react-native';
+import { fetchUserAttributes } from 'aws-amplify/auth';
+import useFetchUserAttributes from '../hooks/useFetchUserAttributes';
+
+async function handleFetchUserAttributes() {
+ try {
+ const userAttributes = await fetchUserAttributes();
+ console.log(userAttributes);
+ } catch (error) {
+ console.log(error);
+ }
+}
+
+function SignOutButton() {
+ const { signOut } = useAuthenticator();
+ return ;
+}
const SettingsScreen: React.FC = () => {
const qrCodeContext = useContext(QRCodeContext);
const setQrCodes = qrCodeContext ? qrCodeContext.setQrCodes : () => {};
+ const { userAttributes } = useFetchUserAttributes();
+
+ const { user } = useAuthenticator((context) => {
+ console.log(context.user);
+ handleFetchUserAttributes();
+ return [context.user]
+ });
+
const clearHistory = () => {
setQrCodes([]);
@@ -19,9 +44,16 @@ const SettingsScreen: React.FC = () => {
Settings
Profile
-
- Log In
-
+ {user ? (
+
+ Hello, {userAttributes?.name}
+
+
+ ) : (
+
+ Log In
+
+ )}
@@ -42,6 +74,10 @@ const SettingsScreen: React.FC = () => {
};
const styles = StyleSheet.create({
+ userName: {
+ fontSize: 16,
+ marginBottom: 10,
+ },
container: {
flex: 1,
backgroundColor: '#f8f0fc',