added fetch contact from real device icon

src/screens/management/ManagementScreen.tsx

@@ -23,6 +23,7 @@ import { MyGroup, JoinedGroup, JoinRequest, ApiResponse } from '../../types';
 import { MyGroupCard } from "../../components/MyGroupCard";
 import { JoinedGroupCard } from "../../components/JoinedGroupCard";
 import { RequestCard } from "../../components/RequestCard";
+import Ionicons from "@react-native-vector-icons/ionicons";
 
 type GroupManagementNavProp = StackNavigationProp<RootStackParamList>;
 type ActiveTab = "My Groups" | "Joined Groups" | "Requests";
@@ -44,7 +45,7 @@ const ManagementScreen: FC = () => {
     try {
       if (userRole === "ORGANIZER") {
         // Fetch all data concurrently
-        const [myGroupsRes,joinedGroupsRes,requestsRes] = await Promise.all([
+        const [myGroupsRes, joinedGroupsRes, requestsRes] = await Promise.all([
           apiCall(MY_GROUPS_URL, "GET") as Promise<ApiResponse<MyGroup[]>>,
           apiCall(DECLINE_REQUEST_URL, "GET") as Promise<ApiResponse<JoinedGroup[]>>, // Assuming this is also needed
           apiCall(REQUESTS_URL, "GET") as Promise<ApiResponse<JoinRequest[]>>,
@@ -74,7 +75,7 @@ const ManagementScreen: FC = () => {
   const handleAction = async (url: string, body: object, successMessage: string, failureMessage: string, action: string) => {
     // ... (logic remains the same)
     console.log(url)
-       try {
+    try {
       setLoading(true); // Optionally show a loading state during the action
       // Make the POST request with an empty body
       const res = await apiCall(url, "PUT", {}) as ApiResponse<null> | null;
@@ -93,15 +94,15 @@ const ManagementScreen: FC = () => {
     }
   };
 
-  const handleApprove = (req: JoinRequest) => handleAction(APPROVE_REQUEST_URL+req.requestId+"/approve", { requestId: req.requestId }, `${req.userName} has been added.`, "Failed to approve request.","Approve");
-  const handleDecline = (req: JoinRequest) => handleAction(DECLINE_REQUEST_URL+req.requestId+"/reject?reason=/"+" ", { requestId: req.requestId }, `Request from ${req.userName} has been declined.`, "Failed to decline request.","Decline");
+  const handleApprove = (req: JoinRequest) => handleAction(APPROVE_REQUEST_URL + req.requestId + "/approve", { requestId: req.requestId }, `${req.userName} has been added.`, "Failed to approve request.", "Approve");
+  const handleDecline = (req: JoinRequest) => handleAction(DECLINE_REQUEST_URL + req.requestId + "/reject?reason=/" + " ", { requestId: req.requestId }, `Request from ${req.userName} has been declined.`, "Failed to decline request.", "Decline");
   const handleManageGroup = (group: MyGroup) => navigation.navigate('EditGroup', { groupId: group.id });
 
   const renderContent = () => {
     if (error) {
       return <Text style={styles.emptyText}>{error}</Text>;
     }
-    
+
     switch (activeTab) {
       case "My Groups":
         if (loading) {
@@ -151,9 +152,9 @@ const ManagementScreen: FC = () => {
       default: return null;
     }
   };
-  
+
   const tabs: ActiveTab[] = userRole === 'ORGANIZER' ? ["My Groups", "Joined Groups", "Requests"] : ["Joined Groups"];
-  
+
   return (
     <AppView style={styles.container} paddingHorizontal={0}>
       <View style={styles.header}>
@@ -167,6 +168,32 @@ const ManagementScreen: FC = () => {
         ))}
       </View>
       <View style={styles.contentArea}>
+        {
+          activeTab === "Requests" && userRole === "ORGANIZER" ? (
+            <TouchableOpacity
+              style={{
+                position: "absolute",
+                bottom: 85,
+                right: 20,
+                backgroundColor: colors.pastelOrange,
+                width: 60,
+                height: 60,
+                borderRadius: 30,
+                justifyContent: "center",
+                alignItems: "center",
+                shadowColor: "#000",
+                shadowOpacity: 0.2,
+                shadowRadius: 5,
+                shadowOffset: { width: 0, height: 3 },
+                elevation: 5, // for Android shadow
+              }}
+              onPress={() => navigation.navigate("YourContacts" as never)}
+            >
+              <Ionicons name="person-add" size={28} color={colors.textDark} />
+            </TouchableOpacity>
+          ) : null
+        }
+
         {renderContent()}
       </View>
     </AppView>
@@ -176,7 +203,7 @@ const ManagementScreen: FC = () => {
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: '#f5f6fa' 
+    backgroundColor: '#f5f6fa'
   },
   header: {
     paddingHorizontal: 20,