getting user photo

postrify-backend/src/main/java/com/postrify/postrifybackend/controller/UserController.java

@@ -0,0 +1,31 @@
+package com.postrify.postrifybackend.controller;
+
+import com.postrify.postrifybackend.service.UserService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.PutMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+@RestController
+@RequestMapping("/api/users")
+public class UserController {
+
+  @Autowired private UserService userService;
+
+  @GetMapping("/{username}/image")
+  public ResponseEntity<String> getUserImage(@PathVariable final String username) {
+    String base64Image = userService.getUserImage(username);
+    return ResponseEntity.ok(base64Image);
+  }
+
+  @PutMapping("/{username}/image")
+  public ResponseEntity<String> updateUserImage(
+      @PathVariable final String username, @RequestBody final String base64Image) {
+    userService.updateUserImage(username, base64Image);
+    return ResponseEntity.ok("User image updated successfully!");
+  }
+}

postrify-backend/src/main/java/com/postrify/postrifybackend/dto/UserDTO.java

@@ -4,11 +4,13 @@ public class UserDTO {
   private Long id;
   private String username;
   private String email;
+  private String image;
 
-  public UserDTO(final Long id, final String username, final String email) {
+  public UserDTO(final Long id, final String username, final String email, final String image) {
     this.id = id;
     this.username = username;
     this.email = email;
+    this.image = image;
   }
 
   public Long getId() {
@@ -34,4 +36,12 @@ public void setUsername(final String username) {
   public void setEmail(final String email) {
     this.email = email;
   }
+
+  public String getImage() {
+    return image;
+  }
+
+  public void setImage(final String image) {
+    this.image = image;
+  }
 }

postrify-backend/src/main/java/com/postrify/postrifybackend/model/User.java

@@ -20,6 +20,9 @@ public class User {
   @Column(nullable = false, unique = true)
   private String email;
 
+  @Column(columnDefinition = "TEXT")
+  private String image;
+
   @OneToMany(mappedBy = "user", cascade = CascadeType.ALL, orphanRemoval = true)
   @JsonIgnore
   private List<Post> posts;
@@ -59,4 +62,12 @@ public List<Post> getPosts() {
   public void setPosts(final List<Post> posts) {
     this.posts = posts;
   }
+
+  public String getImage() {
+    return image;
+  }
+
+  public void setImage(final String image) {
+    this.image = image;
+  }
 }

postrify-backend/src/main/java/com/postrify/postrifybackend/service/PostService.java

@@ -74,7 +74,8 @@ public void deletePost(final Long id, final User currentUser) {
 
   private PostResponseDTO convertToDTO(final Post post) {
     User user = post.getUser();
-    UserDTO userDTO = new UserDTO(user.getId(), user.getUsername(), user.getEmail());
+    UserDTO userDTO =
+        new UserDTO(user.getId(), user.getUsername(), user.getEmail(), user.getImage());
 
     return new PostResponseDTO(
         post.getId(),

postrify-backend/src/main/java/com/postrify/postrifybackend/service/UserService.java

@@ -29,6 +29,17 @@ public User registerUser(final User user) {
     return userRepository.save(user);
   }
 
+  public String getUserImage(final String username) {
+    User user = findByUsername(username);
+    return user.getImage();
+  }
+
+  public void updateUserImage(final String username, final String base64Image) {
+    User user = findByUsername(username);
+    user.setImage(base64Image);
+    userRepository.save(user);
+  }
+
   public User findByUsername(final String username) {
     return userRepository
         .findByUsername(username)

postrify-backend/src/test/java/com/postrify/postrifybackend/PostControllerTest.java

@@ -48,7 +48,7 @@ void setUp() {
   @SuppressWarnings("unchecked")
   @Test
   void getAllPosts_Success() {
-    UserDTO userDTO = new UserDTO(1L, "jordi", "[email protected]");
+    UserDTO userDTO = new UserDTO(1L, "jordi", "[email protected]", null);
     PostResponseDTO post1 =
         new PostResponseDTO(
             1L, "Post 1", "Content 1", userDTO, LocalDateTime.now(), LocalDateTime.now());
@@ -69,10 +69,11 @@ void getAllPosts_Success() {
     verify(postService, times(1)).getAllPosts(pageable);
   }
 
+  @SuppressWarnings("null")
   @Test
   void getPostById_Found() {
     Long postId = 1L;
-    UserDTO userDTO = new UserDTO(1L, "jordi", "[email protected]");
+    UserDTO userDTO = new UserDTO(1L, "jordi", "[email protected]", null);
     PostResponseDTO post =
         new PostResponseDTO(
             postId, "Post 1", "Content 1", userDTO, LocalDateTime.now(), LocalDateTime.now());
@@ -102,7 +103,7 @@ void getPostById_NotFound() {
   @Test
   void getPostsByUser_Success() {
     Long userId = 1L;
-    UserDTO userDTO = new UserDTO(userId, "jordi", "[email protected]");
+    UserDTO userDTO = new UserDTO(userId, "jordi", "[email protected]", null);
     PostResponseDTO post1 =
         new PostResponseDTO(
             1L, "Post 1", "Content 1", userDTO, LocalDateTime.now(), LocalDateTime.now());
@@ -120,6 +121,7 @@ void getPostsByUser_Success() {
     verify(postService, times(1)).getPostsByUser(userId);
   }
 
+  @SuppressWarnings("null")
   @Test
   void createPost_Success() {
     PostRequest postRequest = new PostRequest();
@@ -136,7 +138,7 @@ void createPost_Success() {
             1L,
             postRequest.getTitle(),
             postRequest.getContent(),
-            new UserDTO(user.getId(), user.getUsername(), user.getEmail()),
+            new UserDTO(user.getId(), user.getUsername(), user.getEmail(), null),
             LocalDateTime.now(),
             LocalDateTime.now());
 
@@ -176,6 +178,7 @@ void createPost_UserNotFound() {
     verify(postService, times(0)).createPost(any(Post.class));
   }
 
+  @SuppressWarnings("null")
   @Test
   void updatePost_Success() {
     Long postId = 1L;
@@ -193,7 +196,7 @@ void updatePost_Success() {
             postId,
             postRequest.getTitle(),
             postRequest.getContent(),
-            new UserDTO(user.getId(), user.getUsername(), user.getEmail()),
+            new UserDTO(user.getId(), user.getUsername(), user.getEmail(), null),
             LocalDateTime.now(),
             LocalDateTime.now());
 

postrify-frontend/src/app/components/header/header.component.ts

@@ -1,14 +1,39 @@
 import { Component, OnInit } from '@angular/core';
 import { RouterLink } from '@angular/router';
 import { AuthService } from '../../services/auth.service';
+import { SettingsModalComponent } from '../settings-modal/settings-modal.component';
+import { Subscription } from 'rxjs';
+import { UserImageService } from '../../services/user-image.service';
 
 @Component({
   selector: 'app-header',
   standalone: true,
-  imports: [RouterLink],
+  imports: [RouterLink, SettingsModalComponent],
   template: `
     <header>
       <div class="toggle-container">
+        @if (authService.isAuthenticated()) {
+          <button (click)="openSettings()" class="settings-button">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="24"
+              height="24"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              class="icon icon-tabler icons-tabler-outline icon-tabler-settings"
+            >
+              <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+              <path
+                d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z"
+              />
+              <path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" />
+            </svg>
+          </button>
+        }
         <button (click)="toggleDarkMode()" class="toggle-button">
           @if (isDarkMode) {
             <svg
@@ -70,6 +95,14 @@ import { AuthService } from '../../services/auth.service';
       </a>
       <div class="auth-container">
         @if (authService.isAuthenticated()) {
+          <div
+            class="current-photo"
+            [style.backgroundImage]="
+              userImage
+                ? 'url(' + userImage + ')'
+                : 'url(/assets/placeholder.jpg)'
+            "
+          ></div>
           <span class="username">{{ authService.getUsername() }}</span>
           <button class="logout-button" (click)="logout()">
             <svg
@@ -97,6 +130,11 @@ import { AuthService } from '../../services/auth.service';
         }
       </div>
     </header>
+    @if (isSettingsOpen) {
+      <app-settings-modal
+        (closeModalEvent)="isSettingsOpen = false"
+      ></app-settings-modal>
+    }
   `,
   styles: [
     `
@@ -146,13 +184,16 @@ import { AuthService } from '../../services/auth.service';
         color: var(--header-text);
         font-weight: 500;
         padding-bottom: 5px;
+        margin-top: 5px;
       }
 
       .logout-button {
+        margin-top: 5px;
         color: var(--header-text);
       }
 
-      .toggle-button {
+      .toggle-button,
+      .settings-button {
         color: var(--header-text);
       }
 
@@ -191,21 +232,49 @@ import { AuthService } from '../../services/auth.service';
           margin-right: 0rem;
         }
       }
+
+      @media (max-width: 450px) {
+        .username {
+          display: none;
+        }
+      }
+
+      .current-photo {
+        width: 35px;
+        height: 35px;
+        border-radius: 50%;
+        background-size: cover;
+        background-position: center;
+        position: relative;
+        border: 2px solid var(--border-color);
+        margin-right: 0.5rem;
+      }
     `,
   ],
 })
 export class HeaderComponent implements OnInit {
+  private imageUpdateSubscription: Subscription | undefined;
+
   isDarkMode = false;
   logoSrc = 'assets/logo-light.png';
   isAuthenticated = false;
   username: string | null = null;
+  userImage: string | null = null;
+  isSettingsOpen = false;
 
-  constructor(public authService: AuthService) {}
+  constructor(
+    public authService: AuthService,
+    private userImageService: UserImageService,
+  ) {}
 
   ngOnInit() {
     this.loadDarkModePreference();
     this.updateLogo();
     this.checkAuthentication();
+    this.imageUpdateSubscription =
+      this.userImageService.imageUpdated$.subscribe(() => {
+        this.checkAuthentication();
+      });
   }
 
   toggleDarkMode() {
@@ -239,11 +308,22 @@ export class HeaderComponent implements OnInit {
     this.isAuthenticated = this.authService.isAuthenticated();
     if (this.isAuthenticated) {
       this.username = this.authService.getUsername();
+      this.authService.getUserImage().subscribe((image: string) => {
+        this.userImage = image;
+      });
     }
   }
 
   logout() {
     this.authService.logout();
     this.isAuthenticated = false;
   }
+
+  openSettings() {
+    this.isSettingsOpen = true;
+  }
+
+  closeSettings() {
+    this.isSettingsOpen = false;
+  }
 }