SCRUM-158 link BE endpoints to profilePage

FYP-2024-IQMA · Oct 14, 2024 · 5158852 · 5158852
1 parent e793564
commit 5158852
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 17 deletions.
diff --git a/frontend/iQMA-Skills-Builder/app/(tabs)/_layout.tsx b/frontend/iQMA-Skills-Builder/app/(tabs)/_layout.tsx
@@ -69,7 +69,7 @@ export default function AppTabs() {
                     tabBarIcon: ({color, size}) => (
                         <Ionicons name="person" size={size} color={color} />
                     ),
-                    headerTintColor: '#fff'
+                    headerTintColor: '#fff',
                 }}
             />
             <Tab.Screen
@@ -79,7 +79,7 @@ export default function AppTabs() {
                     tabBarIcon: ({color, size}) => (
                         <Ionicons name="settings" size={size} color={color} />
                     ),
-                    headerTintColor: '#fff'
+                    headerTintColor: '#fff',
                 }}
             />
         </Tab.Navigator>

diff --git a/frontend/iQMA-Skills-Builder/app/LearnerAssessmentComplete.tsx b/frontend/iQMA-Skills-Builder/app/LearnerAssessmentComplete.tsx
@@ -86,11 +86,6 @@ export default function LearnerAssessmentComplete() {
 
             const accountResponse = await accountEndpoints.editUserDetails(account);
 
-            // const accountResponse = await axios.patch(
-            //     `${process.env.EXPO_PUBLIC_LOCALHOST_URL}/accounts/updateaccount`,
-            //     account
-            // );
-
             console.log(
                 'Account Demographics created successfully: ',
                 demographicsResponse.data

diff --git a/frontend/iQMA-Skills-Builder/app/screens/ProfilePage.tsx b/frontend/iQMA-Skills-Builder/app/screens/ProfilePage.tsx
@@ -1,20 +1,77 @@
 // app/Profile.tsx
 
-import {StyleSheet, Text, View} from 'react-native';
+import * as lessonEndpoints from '@/helpers/lessonEndpoints';
+import * as resultEndpoints from '@/helpers/resultEndpoints';
+import * as sectionEndpoints from '@/helpers/sectionEndpoints';
+import * as unitEndpoints from '@/helpers/unitEndpoints';
+import * as accountEndpoints from '@/helpers/accountEndpoints';
+import * as gamificationEndpoints from '@/helpers/gamificationEndpoints';
 
-import React from 'react';
+import {
+    NativeScrollEvent,
+    NativeSyntheticEvent,
+    ScrollView,
+    StyleSheet,
+    Text,
+    TouchableOpacity,
+    View,
+} from 'react-native';
+import React, {useEffect, useRef, useState} from 'react';
 
-const ProfilePage: React.FC = () => (
-    <View style={styles.container}>
-        <Text>Profile Screen</Text>
-    </View>
-);
+import {AuthContext} from '@/context/AuthContext';
+import {LoadingIndicator} from '@/components/LoadingIndicator';
+import SectionCard from '@/components/SectionCard';
+import {router} from 'expo-router';
+import {useContext} from 'react';
+
+const ProfilePage: React.FC = () => {
+
+    const {currentUser, isLoading} = useContext(AuthContext);
+    const [allSectionDetails, setAllSectionDetails] = useState<any[]>([]);
+    const [userDetails, setUserDetails] = useState<any>();
+    const [badges, setBadges] = useState<any[]>([]);
+    const [loading, setLoading] = useState(true);
+
+    useEffect(() => {
+        (async () => {
+            try {
+                const sectionDetails = await sectionEndpoints.getAllSectionDetails();
+                const userDetails = await accountEndpoints.getUserDetails(currentUser.sub);
+                const badges = await gamificationEndpoints.getBadges(currentUser.sub);
+
+                console.log('sectionDetails:', sectionDetails);
+                console.log('userDetails:', userDetails);
+                console.log('badges:', badges);
+
+                setAllSectionDetails(sectionDetails);
+                setUserDetails(userDetails);
+                setBadges(badges);
+            } catch (error) {
+                console.error('Error fetching Section details:', error);
+            } finally {
+                setLoading(false);
+            }
+        })();
+    }, [])
+
+    if (isLoading) {
+        return <LoadingIndicator />;
+    }
+
+    return (
+        <ScrollView contentContainerStyle={{flexGrow: 1}}>
+            <View style={styles.container}>
+                <Text>Profile Screen</Text>
+            </View>
+        </ScrollView>
+    );
+
+};
 
 const styles = StyleSheet.create({
     container: {
-        flex: 1,
-        justifyContent: 'center',
-        alignItems: 'center',
+        padding: 20,
+        backgroundColor: '#F5F5F5',
     },
 });