profile friends finished

berat-samli · Mar 23, 2024 · a39db4d · a39db4d
1 parent 05ae884
commit a39db4d
Show file tree

Hide file tree

Showing 6 changed files with 103 additions and 14 deletions.
diff --git a/API/Apps/Profile/admin.py b/API/Apps/Profile/admin.py
@@ -5,4 +5,4 @@
 from Apps.Profile.models import Profile, Stats
 
 admin.site.register(Profile)
-admin.site.register(Stats)
+admin.site.register(Stats)
diff --git a/API/Apps/Profile/api/Serializers.py b/API/Apps/Profile/api/Serializers.py
@@ -1,4 +1,4 @@
-
+from django.contrib.auth.models import User
 from rest_framework import serializers
 from ..models import Profile
 
@@ -12,4 +12,18 @@ class Meta:
 class ProfilePostSerializer(serializers.ModelSerializer):
     class Meta:
         model = Profile
-        fields = ['nickname', 'bio']
+        fields = ['nickname', 'bio']
+
+
+class UserSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = User
+        fields = ['username', 'first_name', 'last_name']
+
+
+class ProfileFriendsSerializer(serializers.ModelSerializer):
+    user = UserSerializer(read_only=True)
+
+    class Meta:
+        model = Profile
+        fields = ['friends','nickname','user']
diff --git a/API/Apps/Profile/api/urls.py b/API/Apps/Profile/api/urls.py
@@ -1,8 +1,10 @@
 from django.urls import path
-from .views import ProfileView, ProfileGameHistoryView, ProfileStatsView, ProfileDetailView
+from .views import ProfileGameHistoryView, ProfileStatsView, ProfileDetailView, ProfileFriendsView
+
 urlpatterns = [
     #path('profile/', ProfileView.as_view(), name='profile'),
     path('profile', ProfileDetailView.as_view(), name='profileDetail'),
     path('profile/stats/', ProfileStatsView.as_view(), name='profile_stats'),
-    path('profile/history/', ProfileGameHistoryView.as_view(), name='profile_game_history')
+    path('profile/history/', ProfileGameHistoryView.as_view(), name='profile_game_history'),
+    path('profile/friends', ProfileFriendsView.as_view(), name='profile_friends')
 ]
diff --git a/API/Apps/Profile/api/views.py b/API/Apps/Profile/api/views.py
@@ -2,11 +2,10 @@
 from rest_framework.permissions import IsAuthenticated
 from rest_framework.views import APIView
 from rest_framework_simplejwt.authentication import JWTAuthentication
-
 from ..models import Profile
 from rest_framework.response import Response
 
-from .Serializers import ProfileGetSerializer, ProfilePostSerializer
+from .Serializers import ProfileGetSerializer, ProfilePostSerializer, ProfileFriendsSerializer
 
 
 class ProfileView(APIView):
@@ -80,7 +79,8 @@ def put(self, request,profile_id):
         profile.save()
         return Response(profile.stats, status=200)
 
-
+@authentication_classes([JWTAuthentication])
+@permission_classes([IsAuthenticated])
 class ProfileGameHistoryView(APIView):
     def get(self, request):
         profile = request.user.profile
@@ -106,3 +106,10 @@ def put(self, request,profile_id):
         return Response(profile.game_history, status=200)
 
 
+class ProfileFriendsView(APIView):
+    def get(self, request):
+        profile = request.user.profile
+        if not profile:
+            return Response({"error": "Profile not found"}, status=404)
+        serializer = ProfileFriendsSerializer(profile.friends, many=True)
+        return Response(serializer.data, status=200)
diff --git a/API/Apps/Profile/models.py b/API/Apps/Profile/models.py
@@ -9,7 +9,8 @@ class Stats(models.Model):
     points = models.IntegerField()
     # match_history = models.ManyToManyField('Game', blank=True)
 
-
+    def __str__(self):
+        return f"Total Games: {self.total_games}, Total Wins: {self.total_wins}, Total Losses: {self.total_losses}, Points: {self.points}"
 class Profile(models.Model):
     user = models.OneToOneField(User, on_delete=models.CASCADE)
     nickname = models.CharField(max_length=100, blank=True, null=True, default=None)
@@ -19,3 +20,6 @@ class Profile(models.Model):
     is_verified = models.BooleanField(default=False)
     friends = models.ManyToManyField('Profile', blank=True)
     bio = models.TextField(blank=True, null=True, default=None)
+
+    def __str__(self):
+        return f"{self.nickname if self.nickname else self.user.username}"
diff --git a/Backend/static/scripts/profile.js b/Backend/static/scripts/profile.js
@@ -10,7 +10,6 @@ class History extends BaseComponent
     }
     handleHTML()
     {
-        console.log(this.state.histories)
         return `
             <div class="histories-wrapper">
             ${this.state.histories.map(history => `
@@ -41,6 +40,42 @@ class History extends BaseComponent
         this.parentElement.innerHTML = this.handleHTML();
     }
 }
+class Friends extends BaseComponent
+{
+    constructor(state,parentElement = null) {
+        super(state,parentElement);
+        this.html = this.handleHTML()
+    }
+    handleHTML()
+    {
+        return `
+            <div class="friends-wrapper">
+            ${this.state.friends.map(friend => `
+              <div class="friend-wrapper">
+                <div class="friend-info">
+                  <div class="friend-image">
+                    <img src="https://picsum.photos/id/237/200/300" alt="" />
+                  </div>
+                  <div class="friend-data">
+                    <h6>${friend.user.first_name.length  > 0 ?friend.user.first_name : "No name is set for this user" }</h6>
+                    <span>${friend.nickname.length > 0 ? friend.nickname: friend.user.username}</span>
+                  </div>
+                </div>
+                <div class="friend-more">
+                  <div><img src="/static/public/image.svg" alt="" /></div>
+                  <div><img src="/static/public/chat-bubble.svg" alt="" /></div>
+                  <div><img src="/static/public/more.svg" alt="" /></div>
+                </div>
+              </div>
+            </div>
+            `)}
+        `
+    }
+    setState(newState) {
+        this.state = { ...this.state, ...newState };
+        this.render();
+    }
+}
 class ProfileInfo extends BaseComponent
 {
     constructor(state,parentElement = null) {
@@ -176,9 +211,10 @@ async function fetchProfile()
     catch(error)
     {
         console.error('Error:', error);
+        notify('Error fetching profile', 3, 'error')
     }
 }
-function assignDataRouting()
+async function assignDataRouting()
 {
     const historyButton = document.getElementById('history-button');
     const friendsButton  = document.getElementById('friends-button');
@@ -191,7 +227,27 @@ function assignDataRouting()
         handleRouting()
     });
 }
-function handleRouting()
+async function fetchFriends()
+{
+    try{
+        let response = await fetch(`${API_URL}/profile/friends`,{
+            method:'GET',
+            headers:{
+                'Content-Type':'application/json',
+                'Authorization':`Bearer ${JSON.parse(getCookie('tokens')).access}`
+        }
+    });
+    const data = await response.json();
+    console.log(data);
+    return data;
+    }
+    catch (error)
+    {
+        console.error('Error:', error);
+        notify('Error fetching friends', 3, 'error')
+    }
+}
+async function handleRouting()
 {
     const hash = location.hash;
     const parentElement = document.getElementById('data-wrapper');
@@ -200,12 +256,18 @@ function handleRouting()
         const history = new History({histories: [1]},parentElement);
         history.render();
     }
+    if(hash === '#friends')
+    {
+        let data = await fetchFriends();
+        const friends = new Friends({friends:data},parentElement);
+        friends.render();
+    }
 
 }
 const App = async () => {
     await fetchProfile();
-    assignDataRouting();
-    handleRouting();
+    await assignDataRouting();
+    await handleRouting();
 }