Remove user feature on app

Author: Throyer

src/main/java/com/github/throyer/common/springboot/controllers/app/UserController.java

@@ -2,16 +2,21 @@
 
 import com.github.throyer.common.springboot.domain.models.pagination.Page;
 import com.github.throyer.common.springboot.domain.models.pagination.Pagination;
+import com.github.throyer.common.springboot.domain.models.shared.Type;
 import com.github.throyer.common.springboot.domain.repositories.UserRepository;
-import com.github.throyer.common.springboot.domain.services.user.FindUserService;
+import com.github.throyer.common.springboot.domain.services.user.RemoveUserService;
 import com.github.throyer.common.springboot.domain.services.user.dto.SearchUser;
+import com.github.throyer.common.springboot.utils.Toasts;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.data.domain.Sort;
 import org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.servlet.mvc.support.RedirectAttributes;
 
 @Controller
 @PreAuthorize("hasAnyAuthority('ADM')")
@@ -21,13 +26,25 @@ public class UserController {
     @Autowired
     private UserRepository repository;
 
+    @Autowired
+    private RemoveUserService removeService;
+    
     @GetMapping
-    public String idnex(Model model, Pagination pagination, Sort sort, SearchUser search) {
+    public String index(Model model, Pagination pagination, Sort sort, SearchUser search) {
 
         var page = Page.of(repository.findSimplifiedUsers(pagination.build()));
 
         model.addAttribute("page", page);
 
         return "app/users/index";
     }
+    
+    @PostMapping("/delete/{id}")
+    public String delete(@PathVariable Long id, RedirectAttributes redirect) {
+        removeService.remove(id);
+        
+        Toasts.add(redirect, "Usuário deletado com sucesso.", Type.SUCCESS);
+        
+        return "redirect:/app/users";
+    }
 }

src/main/resources/static/css/users.css

@@ -0,0 +1,8 @@
+.modal-dialog {
+    height: 90%;
+    max-width: 385px;
+}
+
+.modal-content {
+    top: 40%;
+}

src/main/resources/static/js/users-modal.js

@@ -1 +1,7 @@
-console.log("gg")
+document.querySelector("#delete-confirm")
+    .addEventListener("show.bs.modal", ({ target: modal, relatedTarget: button }) => {
+        const { id, name } = button.dataset;
+
+        modal.querySelector("h5 > span").innerHTML = name;
+        modal.querySelector("form").action = `/app/users/delete/${id}`;
+    });

src/main/resources/templates/app/users/fragments/modal.html

@@ -1,17 +1,23 @@
 <div th:fragment="delete-confirm" class="modal fade" tabindex="-1" role="dialog" id="delete-confirm">
-    <div class="modal-dialog" role="document">
+    <div class="modal-sm modal-dialog" role="document">
         <div class="modal-content rounded-4 shadow">
             <div class="modal-body p-4 text-center">
-                <h5 class="mb-0">Enable this setting?</h5>
-                <p class="mb-0">You can always change your mind in your account settings.</p>
-            </div>
-            <div class="modal-footer flex-nowrap p-0">
-                <button type="button"
-                    class="btn btn-lg btn-link fs-6 text-decoration-none col-6 m-0 rounded-0 border-right"><strong>Yes,
-                        enable</strong></button>
-                <button type="button" class="btn btn-lg btn-link fs-6 text-decoration-none col-6 m-0 rounded-0"
-                    data-bs-dismiss="modal">No thanks</button>
+                <h5 class="mb-0">Deseja remover <span>username</span>?</h5>
+                <p class="mb-0">Caso o usuário seja deletado, esta ação não pode ser desfeita.</p>
             </div>
+            <form action="" method="post" class="modal-footer mb-0 flex-nowrap p-0">
+                <button
+                    type="submit"
+                    class="btn btn-lg btn-link fs-6 text-decoration-none col-6 m-0 rounded-0 border-end">
+                    <strong>Sim, remover</strong>
+                </button>
+                <button
+                    type="button"
+                    data-bs-dismiss="modal"
+                    class="btn btn-lg btn-link fs-6 text-decoration-none col-6 m-0 rounded-0">
+                    Cancelar
+                </button>
+            </form>
         </div>
     </div>
 </div>

src/main/resources/templates/app/users/fragments/table.html

@@ -13,7 +13,13 @@
                 <td th:text="*{email}" class="align-middle">email</td>
                 <td width="130" class="text-center">
                     <div class="btn-group">
-                        <button type="button" class="btn-sm btn btn-outline-dark">
+                        <button
+                            type="button"
+                            class="btn-sm btn btn-outline-dark"
+                            data-bs-toggle="modal"
+                            data-bs-target="#delete-confirm"
+                            th:data-id="*{id}"
+                            th:data-name="*{name}">
                             <i class="far fa-trash-alt"></i>
                         </button>
                     </div>

src/main/resources/templates/app/users/index.html

@@ -1,5 +1,8 @@
-<layout th:replace="~{app/fragments/layout :: layout(~{::title}, ~{}, ~{::section}, ~{::scripts}, ~{::modal})}">
+<layout th:replace="~{app/fragments/layout :: layout(~{::title}, ~{::styles}, ~{::section}, ~{::scripts}, ~{::modal})}">
     <title>Users</title>
+    <styles>
+        <link rel="stylesheet" type="text/css" th:href="@{/css/users.css}">
+    </styles>
     <section class="container">
         <table
             th:replace="~{__${execInfo.templateName}__/../fragments/table :: table(${page})}">