fix issues

Author: JM-Flores

apps/codebility/app/home/(dashboard)/_components/DashboardTokenPoints.tsx

@@ -37,7 +37,12 @@ export default function TokenPoints() {
 
   useEffect(() => {
     let isMounted = true;
-    const supabase = createClientClientComponent()!;
+    const supabase = createClientClientComponent();
+    if (!supabase) {
+      setError("Failed to initialize Supabase client.");
+      setLoading(false);
+      return;
+    }
 
     const fetchPointsAndCategories = async () => {
       setLoading(true);
@@ -363,7 +368,8 @@ export default function TokenPoints() {
     (sum, point) => sum + point,
     0,
   );
-  const totalPoints = totalSkillPoints + attendancePoints + profilePoints;
+  const totalPoints =
+    totalSkillPoints + attendancePoints + profilePoints + socialPoints;
 
   return (
     <Box className="!before:absolute !before:inset-0 !before:bg-gradient-to-br !before:from-white/10 !before:to-transparent !before:pointer-events-none relative flex w-full flex-1 flex-col gap-6 overflow-hidden !border-white/10 !bg-white/5 !shadow-2xl !backdrop-blur-2xl dark:!border-slate-400/10 dark:!bg-slate-900/5">
@@ -382,7 +388,8 @@ export default function TokenPoints() {
             </h2>
             <p className="text-sm text-gray-500 dark:text-gray-400">
               Total: {totalPoints} points (Skills: {totalSkillPoints} +
-              Attendance: {attendancePoints} + Profile: {profilePoints})
+              Attendance: {attendancePoints} + Profile: {profilePoints} +
+              Social: {socialPoints})
             </p>
           </div>
         </div>

apps/codebility/app/home/feeds/_services/action.ts

@@ -409,23 +409,23 @@ export async function deletePostContentImages(
   }
 }
 
-export const getSocialPoints = async (userId: string): Promise<number|null> => {
+export const getSocialPoints = async (userId: string): Promise<number | null> => {
   const supabase = await createClientServerComponent();
 
-         try {
-            // Fetch user's points
-            const { data , error} = await supabase.rpc(
-              "calculate_social_points",
-              { codev_id: userId},
-            );
+  try {
+    // Fetch user's points
+    const { data, error } = await supabase.rpc(
+      "calculate_social_points",
+      { codev_id: userId },
+    );
 
-            if (error) throw error;
+    if (error) throw error;
 
-            return data;
-          } catch (error) {
-            console.error("Failed to fetch social points:", error);
-            throw error;
-          }
+    return data;
+  } catch (error) {
+    console.error("Failed to fetch social points:", error);
+    throw error;
+  }
 };
 
 export async function createComment(

apps/codebility/app/home/feeds/page.tsx

@@ -17,12 +17,14 @@ export default function FeedsPage() {
 
   useEffect(() => {
     const fetchRole = async () => {
-      const role = await getUserRole(user!.role_id ?? null);
+      if (!user) return;
+      const role = await getUserRole(user.role_id ?? null);
       setIsAdmin(role === "Admin");
     };
 
     const fetchSocialPoints = async () => {
-      const socialPoints = await getSocialPoints(user!.id);
+      if (!user) return;
+      const socialPoints = await getSocialPoints(user.id);
       setSocialPoints(socialPoints || 0);
     };
 
@@ -47,8 +49,6 @@ export default function FeedsPage() {
         </div>
         {/* Social Points Card*/}
         <div className="dark:bg-white/3 relative mt-4 w-full rounded-xl border border-white/10 bg-gray-800 p-4 text-white shadow-lg backdrop-blur-sm transition-all duration-300 hover:scale-[1.02] hover:bg-white/10 hover:shadow-lg dark:border-white/5 xl:fixed xl:right-6 xl:top-20 xl:z-50 xl:mt-0 xl:w-64">
-          <div className="absolute inset-0 bg-gradient-to-br from-blue-500 to-cyan-500 opacity-5 transition-opacity hover:opacity-10 xl:rounded-xl" />
-          <div className="absolute inset-0 bg-gradient-to-br from-blue-500 to-cyan-500 opacity-5 transition-opacity hover:opacity-10" />
           <div className="relative">
             <div className="mb-3 flex items-center justify-between">
               <div className="flex items-center gap-2">