manage user credancial

src/screens/management/ManagementScreen.tsx

@@ -14,86 +14,45 @@ import {
 import { useNavigation, useFocusEffect } from "@react-navigation/native";
 import { StackNavigationProp } from "@react-navigation/stack";
 import { RootStackParamList } from "../../navigation/AppNavigator";
-import { APPROVE_REQUEST_URL, BASE_URL, DECLINE_REQUEST_URL, GET_JOINED_GROUP_URL, JOIN_GROUP_URL, MY_GROUPS_URL, REQUESTS_URL } from "../../utils/ApiUrls";
+import { APPROVE_REQUEST_URL, BASE_URL, DECLINE_REQUEST_URL, GET_JOINED_GROUP_URL, JOIN_GROUP_URL, MY_GROUPS_URL, REQUESTS_URL, USER_REQUEST } from "../../utils/ApiUrls";
 import colors from "../../components/colors";
 import AppView from "../../components/AppView";
 import { apiCall } from "../../utils/ApiHelper";
 import * as Keychain from "react-native-keychain";
-import { MyGroup, JoinedGroup, JoinRequest, ApiResponse } from '../../types';
+import { MyGroup, JoinedGroup, JoinRequest, ApiResponse, UserJoinRequest } from '../../types';
 import { MyGroupCard } from "../../components/MyGroupCard";
 import { JoinedGroupCard } from "../../components/JoinedGroupCard";
 import { RequestCard } from "../../components/RequestCard";
 import { useSelector } from "react-redux";
 import Ionicons from "@react-native-vector-icons/ionicons";
+import { UserRequested } from "../../components/UserRequested";
 
 type GroupManagementNavProp = StackNavigationProp<RootStackParamList>;
 type ActiveTab = "My Groups" | "Joined Groups" | "Requests" | "Your Requests";
 
 const ManagementScreen: FC = () => {
-  const user = useSelector((state:any) => state.user)
-  const [activeTab, setActiveTab] = useState<ActiveTab>("My Groups");
+  const userRole = useSelector((state: any) => state.user)
+  const [activeTab, setActiveTab] = useState<ActiveTab>(userRole.role === "USER" ? "Joined Groups" : "My Groups");
   const navigation = useNavigation<GroupManagementNavProp>();
   const [myGroups, setMyGroups] = useState<MyGroup[]>([]);
   const [joinedGroups, setJoinedGroups] = useState<JoinedGroup[]>([]);
   const [requests, setRequests] = useState<JoinRequest[]>([]);
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setError] = useState<string | null>(null);
-  const [userRole,setUserRole] = useState<string | null>(null)
-     const userStatus = async () => {
-         try {
-             const credentials = await Keychain.getGenericPassword();
-             if (!credentials) {
-                 Alert.alert("Error", "You are not logged in");
-                 return;
-             }
-             const token = credentials.password;
- 
-             setLoading(true);
-             setError(null);
-             const response = await fetch(`${BASE_URL}user/profile/status`, {
-                 method: "GET",
-                 headers: {
-                     Accept: "*/*",
-                     Authorization: `Bearer ${token}`,
-                 },
-             });
- 
-             const json  = await response.json();
- 
-             console.log("👤 Profile Status Response:", json.data.role);
-             if (json.status === "success") {
-                setUserRole(json.data.role);
- 
-                 if (json.data.profileStatus === false) {
-                 
-                 }
-             } else {
-                 setError(json.message || "Failed to fetch status");
-             }
-         } catch (err) {
-             setError("Something went wrong. Please try again.");
-         } finally {
-             setLoading(false);
-         }
-     };
- 
-       useFocusEffect(
-           useCallback(() => {
-               userStatus();
-           }, [])
-       );
+  const [userRequest, setUserRequest] = useState<UserJoinRequest[]>([])
+
 
   const fetchData = useCallback(async () => {
     if (loading) return;
     setLoading(true);
     setError(null);
     try {
-        console.log(" abin user : ", userRole)
-      if (userRole === "ORGANIZER") {
+      console.log(" abin user : ", userRole)
+      if (userRole.role === "ORGANIZER") {
         // Fetch all data concurrently
         const [myGroupsRes, joinedGroupsRes, requestsRes] = await Promise.all([
           apiCall(MY_GROUPS_URL, "GET") as Promise<ApiResponse<MyGroup[]>>,
-          apiCall(GET_JOINED_GROUP_URL, "GET") as Promise<ApiResponse<JoinedGroup[]>>, // Assuming this is also needed
+          apiCall(GET_JOINED_GROUP_URL, "GET") as Promise<ApiResponse<JoinedGroup[]>>,
           apiCall(REQUESTS_URL, "GET") as Promise<ApiResponse<JoinRequest[]>>,
         ]);
 
@@ -105,10 +64,14 @@ const ManagementScreen: FC = () => {
         setRequests(requestsRes.data || []);
       } else {
         // Fetch only joined groups for non-organizers
-       const [joinedGroupsRes] = await Promise.all([
+        const [joinedGroupsRes, userRequest] = await Promise.all([
           apiCall(GET_JOINED_GROUP_URL, "GET") as Promise<ApiResponse<JoinedGroup[]>>, // Assuming this is also needed
+          apiCall(USER_REQUEST, "GET") as Promise<ApiResponse<UserJoinRequest[]>>, // Assuming this is also needed
         ]);
-         setJoinedGroups(joinedGroupsRes.data || []);
+        setJoinedGroups(joinedGroupsRes.data || []);
+        setUserRequest(userRequest?.data || []);
+        console.log("joinedGroupsRes data : ", joinedGroupsRes)
+        console.log("user request data : ", userRequest)
       }
     } catch (e) {
       console.error("Fetch Data Error:", e);
@@ -197,12 +160,28 @@ const ManagementScreen: FC = () => {
             contentContainerStyle={{ paddingBottom: 100 }}
           />
         );
+      case "Your Requests":
+        if (loading && requests.length === 0) {
+          return <ActivityIndicator size="large" color={colors.primary} style={styles.loader} />;
+        }
+        return (
+          <FlatList
+            data={userRequest}
+            renderItem={({ item }: ListRenderItemInfo<UserJoinRequest>) => <UserRequested item={item} />}
+            keyExtractor={(item) => item.requestId}
+            ListEmptyComponent={<Text style={styles.emptyText}>No pending join requests.</Text>}
+            onRefresh={fetchData}
+            refreshing={loading} // This handles the "continuing loading" on pull-to-refresh
+            contentContainerStyle={{ paddingBottom: 100 }}
+          />
+        );
       default: return null;
     }
   };
 
-  const tabs: ActiveTab[] = userRole === 'ORGANIZER' ? ["My Groups", "Joined Groups", "Requests"] : ["Joined Groups", "Your Requests"];
+  const tabs: ActiveTab[] = userRole.role === 'ORGANIZER' ? ["My Groups", "Joined Groups", "Requests"] : ["Joined Groups", "Your Requests"];
 
+  console.log("user request : ", userRequest)
   return (
     <AppView style={styles.container} paddingHorizontal={0}>
       <View style={styles.header}>