WIP: delete alert modal prototype.

src/stores/acctMgmt.js

@@ -1,6 +1,5 @@
 import { defineStore } from "pinia";
 import apiError from '@/module/apiError.js';
-import iconDeleteGray from '@/assets/icon-delete-gray.svg';
 
 export default defineStore('acctMgmtStore', {
   state: () => ({
@@ -34,6 +33,17 @@ export default defineStore('acctMgmtStore', {
       const userFind = this.allUserAccoutList.find(user => user.username === username);
       this.currentViewingUser = userFind ? userFind : {};
     },
+    /**
+     * We have this method because we want to handle create new modal case.
+     */
+    clearCurrentViewingUser() {
+      this.currentViewingUser = {
+        username: '',
+        name: '',
+        is_admin: false,
+        is_sso: false,
+      };
+    },
     /**
      * Get all user accounts
      */
@@ -81,16 +91,27 @@ export default defineStore('acctMgmtStore', {
         userToChange.isRowHovered = isRowHovered;
       }
     },
-        /**
+    /**
      * According to mouseover or mouseleave status, change the bool value.
      * @param {string} username 
      * @param {boolean} isEditHovered 
      */
-      changeIsEditHoveredByUser(username, isEditHovered) {
-        const userToChange = this.allUserAccoutList.find(user => user.username === username);
-        if (userToChange) {
-          userToChange.isEditHovered = isEditHovered;
-        }
-      },
+    changeIsEditHoveredByUser(username, isEditHovered) {
+      const userToChange = this.allUserAccoutList.find(user => user.username === username);
+      if (userToChange) {
+        userToChange.isEditHovered = isEditHovered;
+      }
+    },
+    /**
+     * According to mouseover or mouseleave status, change the bool value.
+     * @param {string} username 
+     * @param {boolean} isEditHovered 
+     */
+    changeIsDetailHoveredByUser(username, isDetailHovered) {
+      const userToChange = this.allUserAccoutList.find(user => user.username === username);
+      if (userToChange) {
+        userToChange.isDetailHovered = isDetailHovered;
+      }
+    },
   },
 })