Merge pull request #52 from CodeURJC-DAW-2022-23/feat/top-list-page

Feat: top list page

.gitignore

@@ -161,3 +161,4 @@ Webpack/*
 *.iml
 *.ipr
 .metals/metals.lock.db
+.metals/metals.mv.db

back/src/main/java/net/daw/alist/controllers/SPAController.java

@@ -0,0 +1,10 @@
+package net.daw.alist.controllers;
+
+import org.springframework.web.bind.annotation.GetMapping;
+
+public class SPAController {
+	@GetMapping({"/new/**/{path:[^\\.]*}", "/{path:new[^\\.]*}"})
+	public String redirect() {
+		return "forward:/new/index.html";
+	}
+}

back/src/main/java/net/daw/alist/controllers/rest/AjaxRestController.java

@@ -47,7 +47,7 @@ public ResponseEntity<Page<Post>> getNewPosts(
     @RequestParam Optional<Boolean> filter,
     @RequestParam Optional<String> username
   ) {
-    boolean validPage = page <= (int) Math.ceil(postService.count() / 2);
+    boolean validPage = page <= (int) Math.ceil((float) postService.count() / 2);
     if (validPage) {
       boolean filterPosts = false;
       if (filter.isPresent()) filterPosts = filter.get();

back/src/main/java/net/daw/alist/controllers/rest/CommentRestController.java

@@ -16,6 +16,7 @@
 import net.daw.alist.services.PostService;
 import net.daw.alist.services.UserService;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.data.domain.Page;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.security.core.Authentication;
@@ -45,11 +46,11 @@ public class CommentRestController {
   })
   @PostMapping("/{postId}")
   public ResponseEntity<Comment> createComment(@RequestBody Data content, @PathVariable long postId, Authentication auth) throws SQLException, IOException {
-    User author = (User) auth.getPrincipal();
-    User user = userService.findByID(author.getId()).orElseThrow();
-    Comment comment = new Comment(user, content.getContent(), content.getImagePath());
     Optional<Post> optionalPost = postService.findByID(postId);
-    if (optionalPost.isPresent()) {
+      if (optionalPost.isPresent()) {
+      User author = (User) auth.getPrincipal();
+      User user = userService.findByID(author.getId()).orElseThrow();
+      Comment comment = new Comment(user, content.getContent(), content.getImagePath());
       Post post = optionalPost.get();
       post.addComment(comment);
       postService.save(post);
@@ -76,6 +77,21 @@ public ResponseEntity<List<Comment>> getPostComments(@PathVariable long postId)
     return new ResponseEntity<>(HttpStatus.NOT_FOUND);
   }
 
+  @GetMapping("/posts")
+  public ResponseEntity<List<Comment>> getNewComments(@RequestParam int id, @RequestParam int page) {
+    Optional<Post> optionalPost = postService.findByID(Long.valueOf(id));
+    if (optionalPost.isPresent()){
+      int check = (int) Math.ceil((float) optionalPost.get().getComments().size()/2);
+      boolean validPage = page < check;
+      if (validPage) {
+        Post post = optionalPost.get();
+        postService.getNewComments(post.getId(), page);
+        return new ResponseEntity<>(postService.getNewComments(post.getId(), page), HttpStatus.OK);
+      }
+    }
+    return new ResponseEntity<>(HttpStatus.NOT_FOUND);
+  }
+
   @Operation(summary = "Get all the comments of an user")
   @ApiResponses(value = {
     @ApiResponse(responseCode = "200", description = "User found", content = {

back/src/main/java/net/daw/alist/models/Comment.java

@@ -21,8 +21,20 @@ public class Comment {
   @GeneratedValue(strategy = GenerationType.AUTO)
   private Long id;
 
+  public Long getImageID() {
+    return imageID;
+  }
+
+  private Long imageID;
+  @JsonIgnore
   @ManyToOne
   private User author;
+
+  public String getAuthorName() {
+    return authorName;
+  }
+
+  private String authorName;
   private Date date;
   private String content;
 
@@ -40,6 +52,8 @@ public Comment(
   ) throws IOException, SQLException {
     this.date = new Date();
     this.author = author;
+    authorName = author.getUsername();
+    imageID = author.getId();
     this.content = content;
     setImage(imagePath);
     author.addComment(this);

back/src/main/java/net/daw/alist/models/Post.java

@@ -3,6 +3,8 @@
 import com.fasterxml.jackson.annotation.JsonIdentityInfo;
 import com.fasterxml.jackson.annotation.JsonIgnore;
 import com.fasterxml.jackson.annotation.ObjectIdGenerators;
+import org.springframework.data.domain.Page;
+import org.springframework.data.domain.Pageable;
 
 import java.util.*;
 import java.util.stream.Collectors;

back/src/main/java/net/daw/alist/services/DatabaseInitializer.java

@@ -192,6 +192,14 @@ public void init() throws IOException, SQLException {
             firstPost.addComment(firstComment);
             Comment secondComment = new Comment(shanks, "Where is LeganesCF in this Top?!?", null);
             thirdPost.addComment(secondComment);
+            Comment fourthComment = new Comment(manolo, "HALA MADRID!", null);
+            thirdPost.addComment(fourthComment);
+            Comment fifthComment = new Comment(admin, "Manolo is looking to get banned...", null);
+            thirdPost.addComment(fifthComment);
+            Comment sixthComment = new Comment(admin, "FORÇA BARÇA!!!", null);
+            thirdPost.addComment(sixthComment);
+            Comment seventhComment = new Comment(peepo, "GetafeCF forever...", null);
+            thirdPost.addComment(seventhComment);
             Comment thirdComment = new Comment(peepo, "Lebron is the GOAT", null);
             fourthPost.addComment(thirdComment);
             Comment goatedComment = new Comment(peepo, "Hakiman is goated fr fr no cap top 1 ez", null);

back/src/main/java/net/daw/alist/services/PostService.java

@@ -5,11 +5,11 @@
 import net.daw.alist.models.Post;
 import net.daw.alist.repositories.PostRepository;
 import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.data.domain.Page;
-import org.springframework.data.domain.PageRequest;
-import org.springframework.data.domain.Sort;
+import org.springframework.data.domain.*;
 import org.springframework.stereotype.Service;
 
+import java.util.Collections;
+import java.util.Comparator;
 import java.util.List;
 import java.util.Optional;
 
@@ -26,6 +26,17 @@ public Page<Post> getPosts(int pageNumber) {
         return postRepository.findAll(PageRequest.of(pageNumber, pageSize,Sort.by("votes").descending()));
     }
 
+    public List<Comment> getNewComments(Long id, int pageNumber) {
+        List<Comment> comments = postRepository.getReferenceById(id).getComments();
+        comments.sort(Comparator.comparing(Comment::getDate).reversed());
+        int start = pageSize * pageNumber;
+        int end = start + pageSize;
+        if (end > comments.size()){
+            end = comments.size();
+        }
+        return comments.subList(start, end);
+    }
+
     public Page<Post> getUserPosts(int pageNumber, int user_id) {
         return postRepository.findPostsByUser(user_id, PageRequest.of(pageNumber, pageSize));
     }

front/src/app/models/comment.model.ts

@@ -1,9 +1,8 @@
-import { User } from "./user.model";
 
 export interface Comment {
-  id?: number;
-  author: User;
+  id: number;
+  imageID: number;
+  authorName: string;
   date: Date;
   content: string;
-  imagePath: string;
 }

front/src/app/post/components/comment/comment-form/CommentForm.ts

@@ -0,0 +1,5 @@
+export interface CommentForm {
+  username: string;
+  content: string;
+  date: Date;
+}

front/src/app/post/components/comment/comment-form/comment-form.component.css

@@ -0,0 +1,147 @@
+img {
+  object-fit: cover;
+}
+
+.commentTitle {
+  color: black;
+  margin: auto;
+  padding-left: 1em;
+  padding-right: 1em;
+}
+
+.commentBox {
+  background-color: white;
+}
+
+.commentSection {
+  background-color: white;
+  border-radius: var(--bs-border-radius);
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
+.post,
+.commentSection,
+.comment {
+  width: 95%;
+  margin: auto;
+}
+
+.postInfo {
+  border-top-left-radius: var(--bs-border-radius);
+  border-top-right-radius: var(--bs-border-radius);
+}
+
+.writeComment,
+.comment {
+  background-color: white;
+  border-bottom-style: solid;
+  border-width: 1px;
+  border-color: rgb(224, 224, 224);
+}
+
+.form-control {
+  margin: auto;
+  width: 90%;
+}
+
+.own-comment-image {
+  margin: auto;
+  margin-right: 0.25em;
+}
+
+.topName {
+  font-weight: 600;
+}
+
+.comment-image {
+  margin-top: 0.1em;
+}
+
+.commentBox {
+  margin: auto;
+}
+
+.OP {
+  color: black;
+  font-weight: 600;
+  font-size: 25px;
+}
+
+.username {
+  color: black;
+  font-weight: 600;
+  font-size: 20px;
+}
+
+h6 {
+  color: grey;
+}
+
+input[type='text'] {
+  min-height: 7em;
+  word-wrap: break-word;
+  word-break: break-all;
+}
+
+.list-group li + li {
+  margin-top: 1rem;
+}
+
+.list-group ol li {
+  padding: 0.5em;
+  font-size: 20px;
+  font-weight: 600;
+  text-align: left;
+}
+
+.list-group ol {
+  width: 75%;
+  list-style-position: inside;
+}
+
+.text-left {
+  margin: 0;
+}
+
+.profileImg {
+  margin-left: 1em;
+}
+
+.itemWrapper {
+  border-radius: 10px;
+  border: solid 3px;
+  border-color: #69c0a1;
+}
+
+.topic {
+  color: gray;
+  text-decoration: none;
+}
+
+.topic:hover {
+  color: black;
+}
+
+.topic,
+.upvoteIcon,
+.downvoteIcon,
+.shareIcon {
+  cursor: pointer;
+}
+
+.commentTitle {
+  border-bottom-style: solid;
+  border-width: 1px;
+  border-color: rgb(224, 224, 224);
+}
+
+@media only screen and (min-width: 768px) {
+  /* For desktop: */
+  .post,
+  .commentSection,
+  .comment {
+    width: 40%;
+    margin: auto;
+  }
+}

front/src/app/post/components/comment/comment-form/comment-form.component.html

@@ -0,0 +1,16 @@
+<form [formGroup]="commentForm" (ngSubmit)="onSubmit()">
+  <div class="writeComment p-3">
+    <div class="alert alert-info" role="info" *ngIf="commentCreated">
+      Comment posted successfully
+    </div>
+    <div class="d-flex flex-row">
+      <img [src]="fetchUserImage()" alt="pfp" width="40" height="40" class="own-comment-image rounded-circle flex-shrink-0">
+      <textarea [(ngModel)]="content" formControlName="content"
+                class="commentBox form-control ml-1 shadow-none textarea" placeholder="Write a comment..."
+                name="commentContent"></textarea>
+    </div>
+    <div class="mt-2 d-flex justify-content-center">
+      <button class="btn btn-primary btn-sm shadow-none" type="submit" [disabled]="commentForm.invalid">Post comment</button>
+    </div>
+  </div>
+</form>

front/src/app/post/components/comment/comment-form/comment-form.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommentFormComponent } from './comment-form.component';
+
+describe('CommentFormComponent', () => {
+  let component: CommentFormComponent;
+  let fixture: ComponentFixture<CommentFormComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CommentFormComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(CommentFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});