commentaire dashboard.js

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "liveServer.settings.port": 8080
+}

src/__tests__/Dashboard.js

@@ -237,4 +237,3 @@ describe("Given I am a user connected as Admin", () => {
     })
   })
 })
-

src/containers/Dashboard.js

@@ -4,12 +4,17 @@ import BigBilledIcon from '../assets/svg/big_billed.js'
 import { ROUTES_PATH } from '../constants/routes.js'
 import USERS_TEST from '../constants/usersTest.js'
 import Logout from "./Logout.js"
-
+// ???
+/**
+ * 
+ * @param {Object} data données a traiter 
+ * @param {string} status status de la note de frais
+ * @returns 
+ */
 export const filteredBills = (data, status) => {
   return (data && data.length) ?
     data.filter(bill => {
       let selectCondition
-
       // in jest environment
       if (typeof jest !== 'undefined') {
         selectCondition = (bill.status === status)
@@ -18,13 +23,18 @@ export const filteredBills = (data, status) => {
         const userEmail = JSON.parse(localStorage.getItem("user")).email
         selectCondition =
           (bill.status === status) &&
-          ![...USERS_TEST, userEmail].includes(bill.email)
-      }
-
+          ![...USERS_TEST, userEmail].includes(bill.email)       
+
+      }     
+
       return selectCondition
     }) : []
 }
-
+/**
+ * 
+ * @param {Object} bill note de frais a afficher
+ * @returns 
+ */
 export const card = (bill) => {
   const firstAndLastNames = bill.email.split('@')[0]
   const firstName = firstAndLastNames.includes('.') ?
@@ -49,7 +59,11 @@ export const card = (bill) => {
     </div>
   `)
 }
-
+/**
+ * 
+ * @param {Object} bills tableau d'objets a afficher
+ * @returns 
+ */
 export const cards = (bills) => {
   return bills && bills.length ? bills.map(bill => card(bill)).join("") : ""
 }
@@ -70,11 +84,12 @@ export default class {
     this.document = document
     this.onNavigate = onNavigate
     this.store = store
-    $('#arrow-icon1').click((e) => this.handleShowTickets(e, bills, 1))
+    $('#arrow-icon1').click((e) => this.handleShowTickets(e, bills, 1)) // lance la méthode handleShowTicket au click sur la flèche
     $('#arrow-icon2').click((e) => this.handleShowTickets(e, bills, 2))
     $('#arrow-icon3').click((e) => this.handleShowTickets(e, bills, 3))
     this.getBillsAllUsers()
     new Logout({ localStorage, onNavigate })
+
   }
 
   handleClickIconEye = () => {
@@ -88,8 +103,8 @@ export default class {
     if (this.counter === undefined || this.id !== bill.id) this.counter = 0
     if (this.id === undefined || this.id !== bill.id) this.id = bill.id
     if (this.counter % 2 === 0) {
-      bills.forEach(b => {
-        $(`#open-bill${b.id}`).css({ background: '#0D5AE5' })
+      bills.forEach(bill => { //modif b en bill
+        $(`#open-bill${bill.id}`).css({ background: '#0D5AE5' }) // modif b en bill
       })
       $(`#open-bill${bill.id}`).css({ background: '#2A2B35' })
       $('.dashboard-right-container div').html(DashboardFormUI(bill))
@@ -128,15 +143,23 @@ export default class {
     this.updateBill(newBill)
     this.onNavigate(ROUTES_PATH['Dashboard'])
   }
-
+  /**
+   * 
+   * @param {Event} e 
+   * @param {Object} bills données a traiter récupérées de la bdd
+   * @param {*} index index de la flèche cliquée
+   * @returns 
+   */
   handleShowTickets(e, bills, index) {
-    if (this.counter === undefined || this.index !== index) this.counter = 0
-    if (this.index === undefined || this.index !== index) this.index = index
-    if (this.counter % 2 === 0) {
+    if (this.counter === undefined || this.index !== index) this.counter = 0 // declare un compteur de click, si on ne clique pas sur la même flèeche le compteur se remet a 0
+    if (this.index === undefined || this.index !== index) this.index = index // défini l'index de la flèche sur laquelle on clique    
+    if (this.counter % 2 === 0) {                                            // crée un toggle pour afficher ou masquer le contenu
       $(`#arrow-icon${this.index}`).css({ transform: 'rotate(0deg)'})
+      console.log($(`#arrow-icon${this.index}`));
       $(`#status-bills-container${this.index}`)
         .html(cards(filteredBills(bills, getStatus(this.index))))
       this.counter ++
+      console.log(this.counter);
     } else {
       $(`#arrow-icon${this.index}`).css({ transform: 'rotate(90deg)'})
       $(`#status-bills-container${this.index}`)
@@ -147,6 +170,7 @@ export default class {
     bills.forEach(bill => {
       $(`#open-bill${bill.id}`).click((e) => this.handleEditTicket(e, bill, bills))
     })
+    console.log(bills.length);
 
     return bills
 
@@ -166,7 +190,7 @@ export default class {
           date: doc.date,
           status: doc.status
         }))
-        return bills
+        return bills  //retourne les données a traiter de la bdd
       })
       .catch(console.log)
     }