added dummy profile for the time being so I don't touch backend atm

src/api/communityuser_profile/get_fulldetailsprofile.js

@@ -0,0 +1,36 @@
+export default async function fetchFullCommunityUserProfile(communityUserId) {
+  const apiUrl = import.meta.env.VITE_API_URL;
+  if (!apiUrl) {
+    console.error("VITE_API_URL is not defined in environment variables");
+    return Promise.reject(new Error("API URL is not configured"));
+  }
+
+  const token = localStorage.getItem("token");
+  if (!token) {
+    return Promise.reject(new Error("Please log in to see full details on profile."));
+  }
+
+  const url = `${apiUrl}/community-users/${communityUserId}`;
+  console.log("Full API URL:", url);
+
+  try {
+    const response = await fetch(url, {
+      method: "GET",
+      headers: {
+        "Authorization": `Token ${token}`,
+        "Accept": "application/json",
+        "Content-Type": "application/json",
+      },
+    });
+
+    if (!response.ok) {
+      const errorMessage = await response.text();
+      throw new Error(`Server responded with ${response.status}: ${errorMessage}`);
+    }
+
+    return await response.json();
+  } catch (error) {
+    console.error("Fetch error:", { message: error.message, url });
+    return Promise.reject(error);
+  }
+}

src/api/communityuser_profile/get_fulldetailsprofiles.js

@@ -0,0 +1,44 @@
+// const url = `${import.meta.env.VITE_API_URL}/community-users/`;
+
+
+export default async function fetchFullCommunityUserProfiles() {
+  // Add debug logging for the API URL
+  if (!import.meta.env.VITE_API_URL) {
+      console.error('VITE_API_URL is not defined in environment variables');
+      throw new Error('API URL is not configured');
+  }
+
+
+  const token = window.localStorage.getItem("token");
+  const url = `${import.meta.env.VITE_API_URL}/role-models/`;
+  console.log('Full API URL:', url); // This will help us verify the complete URL
+
+
+   // Check if the token exists
+   if (!token) {
+      throw new Error("Please log in to see full details on profile.");
+  }
+
+  try {
+      const response = await fetch(url, { 
+          method: "GET",
+          headers: {
+              "Authorization": `Token ${token}`,
+              'Accept': 'application/json',
+              'Content-Type': 'application/json'
+          }
+      });
+
+      if (!response.ok) {
+          throw new Error(`Server responded with ${response.status}`);
+      }
+
+      return await response.json();
+  } catch (error) {
+      console.error('Fetch error:', {
+          message: error.message,
+          url: url
+      });
+      throw error;
+  }
+}

src/api/communityuser_profile/get_publicview_profile.js

@@ -0,0 +1,32 @@
+export default async function fetchLimitedCommunityUserProfile(communityuserId) {
+    const apiUrl = import.meta.env.VITE_API_URL;
+
+    if (!apiUrl) {
+        console.error("VITE_API_URL is not defined in environment variables");
+        return Promise.reject(new Error("API URL is not configured"));
+    }
+
+    const url = `${apiUrl}/community-users/public/${communityuserId}`;
+    console.log("Full API URL:", url); // Debugging
+
+    try {
+        const response = await fetch(url, {
+            method: "GET",
+            headers: {
+                "Accept": "application/json",
+                "Content-Type": "application/json",
+            },
+        });
+
+        if (!response.ok) {
+            const errorMessage = await response.text();
+            throw new Error(`Server responded with ${response.status}: ${errorMessage}`);
+        }
+
+        return await response.json();
+    } catch (error) {
+        console.error("Fetch error:", { message: error.message, url });
+        return Promise.reject(error);
+    }
+  }
+

src/api/communityuser_profile/get_publicview_profiles.js

@@ -0,0 +1,32 @@
+export default async function fetchLimitedCommunityUserProfiles() {
+    // Add debug logging for the API URL
+    if (!import.meta.env.VITE_API_URL) {
+        console.error('VITE_API_URL is not defined in environment variables');
+        throw new Error('API URL is not configured');
+    }
+
+    const url = `${import.meta.env.VITE_API_URL}/community-users/public`;
+    console.log('Full API URL:', url); 
+
+    try {
+        const response = await fetch(url, { 
+            method: "GET",
+            headers: {
+                'Accept': 'application/json',
+                'Content-Type': 'application/json'
+            }
+        });
+
+        if (!response.ok) {
+            throw new Error(`Server responded with ${response.status}`);
+        }
+
+        return await response.json();
+    } catch (error) {
+        console.error('Fetch error:', {
+            message: error.message,
+            url: url
+        });
+        throw error;
+    }
+  }

src/components/GeneralUserProfileDetails.jsx

@@ -1,110 +1,68 @@
-import React, { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import React, { useEffect, useState } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import fetchPublicCommunityUserProfile from "../api/communityuser_profile/get_publicview_profile";
+import fetchFullCommunityUserProfile from "../api/communityuser_profile/get_fulldetailsprofile";
 
-const GeneralUserProfileDetails = ({ communityuserId }) => {
-  const [profile, setProfile] = useState(null);
+const GeneralUserProfileDetails = (props) => {
+  const { communityuserId } = useParams();
+  const profile = props.profile;
   const [isAuthenticated, setIsAuthenticated] = useState(false);
   const [loading, setLoading] = useState(true);
   const navigate = useNavigate();
 
-  useEffect(() => {
-    // Check authentication
-    const token = localStorage.getItem('token');
-    if (token) {
-      setIsAuthenticated(true);
-    }
+  // useEffect(() => {
+  //   // Check authentication
+  //   const token = localStorage.getItem("token");
+  //   if (token) {
+  //     setIsAuthenticated(true);
+  //   }
 
-    // Fetch profile data based on authentication status
-    const fetchData = async () => {
-      try {
-        const url = isAuthenticated
-          ? `${import.meta.env.VITE_API_URL}/community-user/profile/${communityuserId}`
-          : `${import.meta.env.VITE_API_URL}/community-user/public-profile/${communityuserId}`;
+  //   // Fetch profile data from the correct endpoint for public or authenticated user
+  //   const fetchData = async () => {
+  //     try { console.log(communityuserId)
+  //       const data = isAuthenticated
+  //         ? await fetchFullCommunityUserProfile(communityuserId)
+  //         : await fetchPublicCommunityUserProfile(communityuserId);
+  //       setProfile(data);
+  //     } catch (error) {
+  //       console.error("Error fetching profile:", error);
+  //     } finally {
+  //       setLoading(false);
+  //     }
+  //   };
 
-        const response = await fetch(url, {
-          headers: token ? {
-            'Authorization': `Bearer ${token}`
-          } : {}
-        });
-
-        if (!response.ok) {
-          throw new Error('Failed to fetch profile');
-        }
-
-        const data = await response.json();
-        setProfile(data);
-      } catch (error) {
-        console.error('Error fetching profile:', error);
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    fetchData();
-  }, [communityuserId, isAuthenticated]);
-
-  if (loading) return <p>Loading profile...</p>;
-  if (!profile) return <p>Profile not found.</p>;
+  //   fetchData();
+  // }, [communityuserId, isAuthenticated]);
 
+  // if (loading) return <p>Loading profile...</p>;
+  // if (!profile) return <p>Profile not found.</p>;
+  console.log(props.profile);
   return (
-    <div className="profile-details">
-      {profile.image && (
-        <div className="profile-image">
-          <img src={profile.image} alt="Profile" className="rounded-full w-32 h-32 object-cover" />
-        </div>
-      )}
-
-      <div className="basic-info">
-        <h2 className="text-2xl font-bold mb-4">
-          {profile.first_name} {profile.last_name}
-        </h2>
-        <p className="mb-2"><strong>Current Role:</strong> {profile.current_role}</p>
-        <p className="mb-2"><strong>Industry:</strong> {profile.industry?.replace('_', ' ')}</p>
-        <p className="mb-2"><strong>Location:</strong> {profile.location}</p>
-      </div>
+    <div>
+      {profile.image && <img src={'https://drive.google.com/file/d/1cq_WSC97TvKpsf1m4Zp4Ku2ncKPECI0e/view?usp=sharing'} alt="Profile" />} 
+      <h2>{profile.first_name} {profile.last_name}</h2>
+      <p><strong>Current Role:</strong> {profile.current_role}</p>
+      <p><strong>Industry:</strong> {profile.industry}</p>
+      <p><strong>Location:</strong> {profile.location}</p>
 
       {isAuthenticated ? (
-        <div className="detailed-info mt-6">
-          <div className="contact-info mb-4">
-            <h3 className="text-xl font-semibold mb-2">Contact Information</h3>
-            <p className="mb-2"><strong>Email:</strong> {profile.email}</p>
-            {profile.phone_number && (
-              <p className="mb-2"><strong>Phone:</strong> {profile.phone_number}</p>
-            )}
-            {profile.linkedin && (
-              <p className="mb-2">
-                <strong>LinkedIn:</strong>{' '}
-                <a 
-                  href={profile.linkedin}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-blue-600 hover:text-blue-800"
-                >
-                  View Profile
-                </a>
-              </p>
-            )}
-          </div>
-
-          <div className="professional-info">
-            <h3 className="text-xl font-semibold mb-2">Professional Information</h3>
-            {profile.skills && profile.skills.length > 0 && (
-              <p className="mb-2"><strong>Skills:</strong> {profile.skills.join(', ')}</p>
-            )}
-            {profile.interests && profile.interests.length > 0 && (
-              <p className="mb-2"><strong>Interests:</strong> {profile.interests.join(', ')}</p>
-            )}
-          </div>
-        </div>
+        <>
+          <p><strong>Skills:</strong> {profile.skills?.join(", ")}</p>
+          <p><strong>Interests:</strong> {profile.interests?.join(", ")}</p>
+          <p><strong>Email:</strong> {profile.email}</p>
+          {profile.linkedin && (
+            <p>
+              <strong>LinkedIn:</strong>
+              <a href={profile.linkedin} target="_blank" rel="noopener noreferrer">
+                View Profile
+              </a>
+            </p>
+          )}
+        </>
       ) : (
-        <div className="mt-6">
-          <button
-            onClick={() => navigate('/login')}
-            className="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition-colors"
-          >
-            Login to View Full Profile
-          </button>
-        </div>
+        <button onClick={() => navigate("/login")}>
+          Login to View Full Profile
+        </button>
       )}
     </div>
   );

src/components/LoginForm.jsx

@@ -33,11 +33,13 @@ const LoginForm = () => {
   };
 
   const handleSubmit = async (e) => {
+    console.log('handleSubmit');
     e.preventDefault();
     setIsLoading(true);
     setErrors({});
 
     const validationErrors = validateLoginForm(formData);
+    console.log('formData', formData);
     if (Object.keys(validationErrors).length > 0) {
       setErrors(validationErrors);
       setIsLoading(false);
@@ -46,6 +48,7 @@ const LoginForm = () => {
 
     try {
       const data = await loginUser(formData);
+      console.log(formData);
       // Update auth context with token
       setAuth({ token: data.token });
       // Store token in localStorage