From ed7460177ca70e92dda68bad9947d48df800aa10 Mon Sep 17 00:00:00 2001 From: Chneemann Date: Tue, 27 Aug 2024 01:20:23 +0200 Subject: [PATCH] update liked_videos handling in frontend and backend --- backend/videoflix/users/serializer.py | 8 ++++- backend/videoflix/users/views.py | 19 +++++++++-- backend/videoflix/videoflix/urls.py | 1 + .../hero-banner/hero-banner.component.html | 2 +- .../hero-banner/hero-banner.component.scss | 2 +- .../hero-banner/hero-banner.component.ts | 33 +++++++++++++++---- frontend/src/app/services/user.service.ts | 7 +++- 7 files changed, 59 insertions(+), 13 deletions(-) diff --git a/backend/videoflix/users/serializer.py b/backend/videoflix/users/serializer.py index a3f1b5b..ec709b2 100644 --- a/backend/videoflix/users/serializer.py +++ b/backend/videoflix/users/serializer.py @@ -4,4 +4,10 @@ from .models import CustomUser class UserSerializer(serializers.ModelSerializer): class Meta: model = CustomUser - fields = ["id", "username", "email", "liked_videos"] \ No newline at end of file + fields = ["id", "username", "email", "liked_videos"] + + +class LikedVideosSerializer(serializers.ModelSerializer): + class Meta: + model = CustomUser + fields = ['liked_videos'] \ No newline at end of file diff --git a/backend/videoflix/users/views.py b/backend/videoflix/users/views.py index 22e0450..116be2b 100644 --- a/backend/videoflix/users/views.py +++ b/backend/videoflix/users/views.py @@ -4,7 +4,7 @@ from rest_framework.decorators import api_view, permission_classes from rest_framework.permissions import IsAuthenticated from rest_framework.response import Response from rest_framework import status -from .serializer import UserSerializer +from .serializer import LikedVideosSerializer, UserSerializer from .models import CustomUser @api_view(['GET', 'POST']) @@ -45,4 +45,19 @@ def user_detail(request, id): elif request.method == 'DELETE': user.delete() - return Response(status=status.HTTP_204_NO_CONTENT) \ No newline at end of file + return Response(status=status.HTTP_204_NO_CONTENT) + +@api_view(['PUT']) +@permission_classes([IsAuthenticated]) +def user_liked_detail(request, id): + try: + user = CustomUser.objects.get(pk=id) + except CustomUser.DoesNotExist: + return Response(status=status.HTTP_404_NOT_FOUND) + + if request.method == 'PUT': + serializer = LikedVideosSerializer(user, data=request.data, partial=True) + if serializer.is_valid(): + serializer.save() + return Response(serializer.data, status=status.HTTP_200_OK) + return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST) \ No newline at end of file diff --git a/backend/videoflix/videoflix/urls.py b/backend/videoflix/videoflix/urls.py index 9f42377..0219a01 100644 --- a/backend/videoflix/videoflix/urls.py +++ b/backend/videoflix/videoflix/urls.py @@ -43,6 +43,7 @@ urlpatterns = [ # Users URLs path('users/', user_views.user_list, name='user_list'), path('users//', user_views.user_detail, name='user_detail'), + path('users/liked//', user_views.user_liked_detail, name='user_liked_detail'), # Authentication URLs path('auth/', AuthView.as_view(), name='auth_view'), diff --git a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html index 1423bbd..2f30e19 100644 --- a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html +++ b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html @@ -59,7 +59,7 @@ " >
- @if(currentUserLikedCurrentMovie) { + @if(checkLikeMovies(currentMovie[0].id)) { (); @Output() moviesChange = new EventEmitter(); - currentUserLikedCurrentMovie: boolean = false; + currentUserLikedMovies: number[] = []; environmentBaseUrl: string = environment.baseUrl; movieIsUploaded: { [resolution: string]: boolean } = { '480': false, @@ -42,25 +42,44 @@ export class HeroBannerComponent { public userService: UserService ) {} + ngOnInit() { + this.loadLikedMovies(); + } + + checkLikeMovies(videoId: number) { + return this.currentUserLikedMovies.includes(videoId); + } + async loadLikedMovies() { try { const likedMovies = await this.userService.getLikedMovies(); - this.currentUserLikedCurrentMovie = likedMovies.liked_videos.includes( - this.currentMovie[0].id - ); + this.currentUserLikedMovies = likedMovies.liked_videos; } catch (error) { console.error(error); } } - toggleLikeMovie(movieId: number) { - this.currentUserLikedCurrentMovie = !this.currentUserLikedCurrentMovie; + toggleLikeMovie(movieId: number): void { + if (this.currentUserLikedMovies.includes(movieId)) { + this.currentUserLikedMovies = this.currentUserLikedMovies.filter( + (id) => id !== movieId + ); + } else { + this.currentUserLikedMovies.push(movieId); + } + this.updateLikeMovies(); + } + + updateLikeMovies() { + const body = { + liked_videos: this.currentUserLikedMovies, + }; + this.userService.updateLikedMovies(body); } ngOnChanges(changes: SimpleChanges) { if (changes['currentMovie'] && this.currentMovie.length > 0) { const movieId = this.currentMovie[0]?.id; - this.loadLikedMovies(); if (movieId) { this.movieService .isMovieResolutionUploaded(movieId) diff --git a/frontend/src/app/services/user.service.ts b/frontend/src/app/services/user.service.ts index 930f632..b3457cf 100644 --- a/frontend/src/app/services/user.service.ts +++ b/frontend/src/app/services/user.service.ts @@ -14,10 +14,15 @@ export class UserService { async getLikedMovies(): Promise { const url = environment.baseUrl + `/users/${this.currentUserId}/`; const headers = this.getAuthHeaders(); - return lastValueFrom(this.http.get(url, { headers })); } + updateLikedMovies(likedMovies: any) { + const url = `${environment.baseUrl}/users/liked/${this.currentUserId}/`; + const headers = this.getAuthHeaders(); + return lastValueFrom(this.http.put(url, likedMovies, { headers })); + } + private getAuthHeaders(): HttpHeaders { let authToken = localStorage.getItem('authToken'); if (!authToken) {