diff --git a/src/stores/acctMgmt.ts b/src/stores/acctMgmt.ts index 5565de0..d66f1c7 100644 --- a/src/stores/acctMgmt.ts +++ b/src/stores/acctMgmt.ts @@ -39,7 +39,7 @@ interface EditDetail { export const useAcctMgmtStore = defineStore('acctMgmtStore', { persist: true, state: () => ({ - allUserAccoutList: [] as User[], + allUserAccountList: [] as User[], isAcctMenuOpen: false, currentViewingUser: { username: '', @@ -74,7 +74,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {string} username */ setCurrentViewingUser(username: string) { - const userFind = this.allUserAccoutList.find(user => user.username === username); + const userFind = this.allUserAccountList.find(user => user.username === username); this.currentViewingUser = userFind; }, /** @@ -101,7 +101,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { try { const response = await apiClient.get(apiGetUserList); const customizedResponseData = await this.customizeAllUserList(response.data); - this.allUserAccoutList = await this.moveCurrentLoginUserToFirstRow(customizedResponseData); + this.allUserAccountList = await this.moveCurrentLoginUserToFirstRow(customizedResponseData); } catch (error) { apiError(error, 'Failed to get all users.'); } @@ -278,7 +278,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {boolean} isDeleteHovered */ changeIsDeleteHoveredByUser(username: string, isDeleteHovered: boolean) { - const userToChange = this.allUserAccoutList.find(user => user.username === username); + const userToChange = this.allUserAccountList.find(user => user.username === username); if (userToChange) { userToChange.isDeleteHovered = isDeleteHovered; } @@ -289,7 +289,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {boolean} isRowHovered */ changeIsRowHoveredByUser(username: string, isRowHovered: boolean) { - const userToChange = this.allUserAccoutList.find(user => user.username === username); + const userToChange = this.allUserAccountList.find(user => user.username === username); if (userToChange) { userToChange.isRowHovered = isRowHovered; } @@ -300,7 +300,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {boolean} isEditHovered */ changeIsEditHoveredByUser(username: string, isEditHovered: boolean) { - const userToChange = this.allUserAccoutList.find(user => user.username === username); + const userToChange = this.allUserAccountList.find(user => user.username === username); if (userToChange) { userToChange.isEditHovered = isEditHovered; } @@ -311,7 +311,7 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {boolean} isEditHovered */ changeIsDetailHoveredByUser(username: string, isDetailHovered: boolean) { - const userToChange = this.allUserAccoutList.find(user => user.username === username); + const userToChange = this.allUserAccountList.find(user => user.username === username); if (userToChange) { userToChange.isDetailHovered = isDetailHovered; } @@ -332,9 +332,9 @@ export const useAcctMgmtStore = defineStore('acctMgmtStore', { * @param {object} userDataToReplace */ updateSingleAccountPiniaState(userDataToReplace: User) { - const userIndex = this.allUserAccoutList.findIndex(user => user.username === userDataToReplace.username); + const userIndex = this.allUserAccountList.findIndex(user => user.username === userDataToReplace.username); if (userIndex !== -1) { - this.allUserAccoutList[userIndex] = { ...this.allUserAccoutList[userIndex], ...userDataToReplace }; + this.allUserAccountList[userIndex] = { ...this.allUserAccountList[userIndex], ...userDataToReplace }; } } }, diff --git a/src/views/AccountManagement/AccountAdmin/AccountAdmin.vue b/src/views/AccountManagement/AccountAdmin/AccountAdmin.vue index 199da58..34db97c 100644 --- a/src/views/AccountManagement/AccountAdmin/AccountAdmin.vue +++ b/src/views/AccountManagement/AccountAdmin/AccountAdmin.vue @@ -154,7 +154,7 @@ const infiniteStart = ref(0); const shouldUpdateList = computed(() => acctMgmtStore.shouldUpdateList); -const allAccountResponsive = computed(() => acctMgmtStore.allUserAccoutList); +const allAccountResponsive = computed(() => acctMgmtStore.allUserAccountList); const infiniteAcctData = computed(() => allAccountResponsive.value.slice(0, infiniteStart.value + ONCE_RENDER_NUM_OF_DATA)); const loginUserData = ref(null); @@ -170,9 +170,9 @@ const fetchLoginUserData = async () => { const moveJustCreateUserToFirstRow = () => { if(infiniteAcctData.value && infiniteAcctData.value.length){ - const index = acctMgmtStore.allUserAccoutList.findIndex(user => user.username === acctMgmtStore.justCreateUsername); + const index = acctMgmtStore.allUserAccountList.findIndex(user => user.username === acctMgmtStore.justCreateUsername); if (index !== -1) { - const [justCreateUser] = acctMgmtStore.allUserAccoutList[index]; + const [justCreateUser] = acctMgmtStore.allUserAccountList[index]; infiniteAcctData.value.unshift(justCreateUser); } } @@ -182,7 +182,7 @@ const accountSearchResults = computed(() => { if(!inputQuery.value) { return infiniteAcctData.value; } - return acctMgmtStore.allUserAccoutList.filter (user => user.username.includes(inputQuery.value)); + return acctMgmtStore.allUserAccountList.filter (user => user.username.includes(inputQuery.value)); }); const onCreateNewClick = () => { @@ -311,7 +311,7 @@ const handleScroll = (event) => { }; const fetchMoreDataVue3 = () => { - if(infiniteAcctData.value.length < acctMgmtStore.allUserAccoutList.length) { + if(infiniteAcctData.value.length < acctMgmtStore.allUserAccountList.length) { infiniteStart.value += ONCE_RENDER_NUM_OF_DATA; } }; diff --git a/tests/stores/acctMgmt.test.js b/tests/stores/acctMgmt.test.js index 3cbe637..cf73fc2 100644 --- a/tests/stores/acctMgmt.test.js +++ b/tests/stores/acctMgmt.test.js @@ -44,7 +44,7 @@ describe('acctMgmtStore', () => { }); it('has correct default state', () => { - expect(store.allUserAccoutList).toEqual([]); + expect(store.allUserAccountList).toEqual([]); expect(store.isAcctMenuOpen).toBe(false); }); @@ -70,7 +70,7 @@ describe('acctMgmtStore', () => { describe('setCurrentViewingUser', () => { it('finds user by username', () => { - store.allUserAccoutList = [ + store.allUserAccountList = [ { username: 'alice', name: 'Alice', detail: {} }, { username: 'bob', name: 'Bob', detail: {} }, ]; @@ -216,7 +216,7 @@ describe('acctMgmtStore', () => { describe('hover state actions', () => { beforeEach(() => { - store.allUserAccoutList = [ + store.allUserAccountList = [ { username: 'alice', isDeleteHovered: false, @@ -229,22 +229,22 @@ describe('acctMgmtStore', () => { it('changeIsDeleteHoveredByUser', () => { store.changeIsDeleteHoveredByUser('alice', true); - expect(store.allUserAccoutList[0].isDeleteHovered).toBe(true); + expect(store.allUserAccountList[0].isDeleteHovered).toBe(true); }); it('changeIsRowHoveredByUser', () => { store.changeIsRowHoveredByUser('alice', true); - expect(store.allUserAccoutList[0].isRowHovered).toBe(true); + expect(store.allUserAccountList[0].isRowHovered).toBe(true); }); it('changeIsEditHoveredByUser', () => { store.changeIsEditHoveredByUser('alice', true); - expect(store.allUserAccoutList[0].isEditHovered).toBe(true); + expect(store.allUserAccountList[0].isEditHovered).toBe(true); }); it('changeIsDetailHoveredByUser', () => { store.changeIsDetailHoveredByUser('alice', true); - expect(store.allUserAccoutList[0].isDetailHovered).toBe(true); + expect(store.allUserAccountList[0].isDetailHovered).toBe(true); }); }); @@ -260,12 +260,12 @@ describe('acctMgmtStore', () => { }); it('updateSingleAccountPiniaState updates user', () => { - store.allUserAccoutList = [ + store.allUserAccountList = [ { username: 'alice', name: 'Old' }, ]; store.updateSingleAccountPiniaState({ username: 'alice', name: 'New', }); - expect(store.allUserAccoutList[0].name).toBe('New'); + expect(store.allUserAccountList[0].name).toBe('New'); }); });