From 284fc337b3d99830a6be11bbf17730c2b12cf973 Mon Sep 17 00:00:00 2001
From: Travis Semple <travis8814@gmail.com>
Date: Fri, 17 Jan 2025 11:11:03 -0800
Subject: [PATCH] Revert contact staff changes for now (#3211)

---
 .../account-info/AccountInfo.vue              |  12 +-
 .../team-management/InvitationsDataTable.vue  |   2 -
 .../team-management/MemberDataTable.vue       |  14 +-
 .../PendingMemberDataTable.vue                |   2 -
 .../team-management/UserManagement.vue        |   2 +
 .../src/components/auth/common/ProductTOS.vue |   3 +-
 .../auth/common/StaffAccountsTable.vue        |   6 +-
 .../StaffAccountManagement.vue                | 199 +++++++++--------
 .../StaffPendingAccountInvitationsTable.vue   | 209 +++++++++---------
 .../staff/review-task/DownloadAffidavit.vue   |   2 -
 .../components/datatable/resources/index.ts   |   2 +-
 auth-web/src/routes/index.ts                  |   2 +-
 auth-web/src/routes/router.ts                 |  23 +-
 auth-web/src/stores/org.ts                    |  10 +-
 auth-web/src/util/common-util.ts              |  25 ---
 auth-web/src/util/constants.ts                |   7 +-
 auth-web/src/views/auth/AccountSettings.vue   |   2 +-
 .../views/auth/staff/ReviewAccountView.vue    |  76 +++----
 .../views/auth/staff/StaffDashboardView.vue   |   6 +-
 19 files changed, 285 insertions(+), 319 deletions(-)

diff --git a/auth-web/src/components/auth/account-settings/account-info/AccountInfo.vue b/auth-web/src/components/auth/account-settings/account-info/AccountInfo.vue
index 30a1171e5f..235ad42032 100644
--- a/auth-web/src/components/auth/account-settings/account-info/AccountInfo.vue
+++ b/auth-web/src/components/auth/account-settings/account-info/AccountInfo.vue
@@ -291,7 +291,7 @@
 </template>
 
 <script lang="ts">
-import { AccessType, AccountStatus, Permission, Role, SuspensionReason } from '@/util/constants'
+import { AccessType, AccountStatus, Pages, Permission, Role, SuspensionReason } from '@/util/constants'
 import { CreateRequestBody, OrgBusinessType } from '@/models/Organization'
 import { computed, defineComponent, onBeforeUnmount, onMounted, reactive, toRefs } from '@vue/composition-api'
 import { useAccount, useAccountChangeHandler } from '@/composables'
@@ -361,15 +361,16 @@ export default defineComponent({
       isBusinessAccount: computed(() => orgStore.isBusinessAccount),
       baseAddress: computed(() => currentOrgAddress.value),
 
-      isStaff: computed(() => userStore.currentUser.roles.includes(Role.Staff)) || userStore.currentUser.roles.includes(Role.ContactCentreStaff),
+      isStaff: computed(() => userStore.currentUser.roles.includes(Role.Staff)),
       isSuspendButtonVisible: computed(() => (
         (currentOrganization.value.statusCode === AccountStatus.ACTIVE ||
         currentOrganization.value.statusCode === AccountStatus.SUSPENDED) &&
         userStore.currentUser.roles.includes(Role.StaffSuspendAccounts)
       )),
       isDeactivateButtonVisible: computed(() => currentOrganization.value?.statusCode !== AccountStatus.INACTIVE),
-      canChangeAccessType: computed(() => userStore.currentUser.roles.includes(Role.StaffManageAccounts)) &&
-      !userStore.currentUser.roles.includes(Role.ContactCentreStaff),
+      editAccountUrl: Pages.EDIT_ACCOUNT_TYPE,
+      canChangeAccessType: computed(() => userStore.currentUser.roles.includes(Role.StaffManageAccounts)),
+      isAddressEditable: computed(() => [Permission.CHANGE_ADDRESS].some(per => permissions.value.includes(per))),
       isAdminContactViewable: computed(() => [Permission.VIEW_ADMIN_CONTACT].some(per => permissions.value.includes(per))),
       isAccountStatusActive: computed(() => currentOrganization.value.statusCode === AccountStatus.ACTIVE),
       accountType: computed(() => {
@@ -383,8 +384,7 @@ export default defineComponent({
       isAddressInfoIncomplete: computed(() => (
         currentOrgAddress.value ? Object.keys(currentOrgAddress.value).length === 0 : true
       )),
-      nameChangeNotAllowed: computed(() => (anonAccount.value || isGovmAccount.value)) &&
-      userStore.currentUser.roles.includes(Role.ContactCentreStaff)
+      nameChangeNotAllowed: computed(() => (anonAccount.value || isGovmAccount.value))
     })
 
     const suspensionSelectRules = [
diff --git a/auth-web/src/components/auth/account-settings/team-management/InvitationsDataTable.vue b/auth-web/src/components/auth/account-settings/team-management/InvitationsDataTable.vue
index 8031cf022f..1c796eb753 100644
--- a/auth-web/src/components/auth/account-settings/team-management/InvitationsDataTable.vue
+++ b/auth-web/src/components/auth/account-settings/team-management/InvitationsDataTable.vue
@@ -30,7 +30,6 @@
     <template #[`item.action`]="{ item }">
       <!-- Resend Invitation -->
       <v-btn
-        v-can:EDIT_USER.hide
         icon
         class="mr-1"
         aria-label="Resend invitation"
@@ -43,7 +42,6 @@
 
       <!-- Remove Invitation -->
       <v-btn
-        v-can:EDIT_USER.hide
         icon
         aria-label="Remove Invitation"
         title="Remove Invitation"
diff --git a/auth-web/src/components/auth/account-settings/team-management/MemberDataTable.vue b/auth-web/src/components/auth/account-settings/team-management/MemberDataTable.vue
index baf375c6e3..a0abd9749a 100644
--- a/auth-web/src/components/auth/account-settings/team-management/MemberDataTable.vue
+++ b/auth-web/src/components/auth/account-settings/team-management/MemberDataTable.vue
@@ -151,7 +151,6 @@
         <!-- Remove User -->
         <v-btn
           v-show="canRemove(item)"
-          v-can:EDIT_USER.hide
           icon
           aria-label="Remove Team Member"
           title="Remove Team Member"
@@ -232,13 +231,12 @@
 </template>
 
 <script lang="ts">
-import { AccessType, LoginSource, Permission, Role } from '@/util/constants'
+import { AccessType, LoginSource, Permission } from '@/util/constants'
 import { Component, Emit, Prop, Vue } from 'vue-property-decorator'
 import { Member, MembershipStatus, MembershipType, Organization, RoleInfo } from '@/models/Organization'
 import { mapActions, mapState } from 'pinia'
 import { Business } from '@/models/business'
 import CommonUtils from '@/util/common-util'
-import { KCUserProfile } from 'sbc-common-components/src/models/KCUserProfile'
 import ModalDialog from '@/components/auth/common/ModalDialog.vue'
 import { useBusinessStore } from '@/stores/business'
 import { useOrgStore } from '@/stores/org'
@@ -262,7 +260,6 @@ export interface ChangeRolePayload {
       'permissions'
     ]),
     ...mapState(useUserStore, [
-      'currentUser',
       'roleInfos'
     ])
   },
@@ -275,7 +272,6 @@ export interface ChangeRolePayload {
 })
 export default class MemberDataTable extends Vue {
   @Prop({ default: '' }) private userNamefilterText: string
-  protected readonly currentUser!: KCUserProfile
   private readonly businesses!: Business[]
   private activeOrgMembers!: Member[]
   private readonly currentMembership!: Member
@@ -405,10 +401,6 @@ export default class MemberDataTable extends Vue {
   }
 
   private canChangeRole (memberBeingChanged: Member): boolean {
-    if (this.currentUser.roles?.includes(Role.ContactCentreStaff)) {
-      return false
-    }
-
     if (this.currentMembership.membershipStatus !== MembershipStatus.Active) {
       return false
     }
@@ -416,7 +408,9 @@ export default class MemberDataTable extends Vue {
     switch (this.currentMembership.membershipTypeCode) {
       case MembershipType.Admin:
         // Owners can change roles of other users who are not owners
-        if (!this.isOwnMembership(memberBeingChanged)) {
+        if (
+          !this.isOwnMembership(memberBeingChanged)
+        ) {
           return true
         }
         // And they can downgrade their own role if there is another owner on the team
diff --git a/auth-web/src/components/auth/account-settings/team-management/PendingMemberDataTable.vue b/auth-web/src/components/auth/account-settings/team-management/PendingMemberDataTable.vue
index a420b8b5c9..2a57cf4310 100644
--- a/auth-web/src/components/auth/account-settings/team-management/PendingMemberDataTable.vue
+++ b/auth-web/src/components/auth/account-settings/team-management/PendingMemberDataTable.vue
@@ -28,7 +28,6 @@
     </template>
     <template #[`item.action`]="{ item }">
       <v-btn
-        v-can:EDIT_USER.hide
         icon
         class="mr-1"
         aria-label="Approve user access to this account"
@@ -39,7 +38,6 @@
         <v-icon>mdi-check-circle-outline</v-icon>
       </v-btn>
       <v-btn
-        v-can:EDIT_USER.hide
         icon
         aria-label="Deny access to this account"
         title="Deny access to this account"
diff --git a/auth-web/src/components/auth/account-settings/team-management/UserManagement.vue b/auth-web/src/components/auth/account-settings/team-management/UserManagement.vue
index ba42f69617..b3f4b97d37 100644
--- a/auth-web/src/components/auth/account-settings/team-management/UserManagement.vue
+++ b/auth-web/src/components/auth/account-settings/team-management/UserManagement.vue
@@ -39,6 +39,7 @@
         Active
       </v-tab>
       <v-tab
+        v-can:INVITE_MEMBERS.hide
         data-test="pending-approval-tab"
       >
         <v-badge
@@ -51,6 +52,7 @@
         </v-badge>
       </v-tab>
       <v-tab
+        v-can:INVITE_MEMBERS.hide
         data-test="invitations-tab"
       >
         Invitations
diff --git a/auth-web/src/components/auth/common/ProductTOS.vue b/auth-web/src/components/auth/common/ProductTOS.vue
index 4a897a879d..8aceda1b5b 100644
--- a/auth-web/src/components/auth/common/ProductTOS.vue
+++ b/auth-web/src/components/auth/common/ProductTOS.vue
@@ -10,7 +10,6 @@
     </div>
     <v-checkbox
       v-model="termsAccepted"
-      v-can:EDIT_USER.disabled
       color="primary"
       class="terms-checkbox align-checkbox-label--top ma-0 pa-0"
       hide-details
@@ -41,7 +40,7 @@
 <script lang="ts">
 import { Component, Emit, Prop, Vue, Watch } from 'vue-property-decorator'
 
-@Component({})
+@Component
 export default class ProductTOS extends Vue {
   @Prop({ default: '' }) userName: string
   @Prop({ default: '' }) orgName: string
diff --git a/auth-web/src/components/auth/common/StaffAccountsTable.vue b/auth-web/src/components/auth/common/StaffAccountsTable.vue
index 8fe49fafed..aa6cf89cdc 100644
--- a/auth-web/src/components/auth/common/StaffAccountsTable.vue
+++ b/auth-web/src/components/auth/common/StaffAccountsTable.vue
@@ -275,10 +275,7 @@
                         </v-btn>
                       </template>
                       <v-list>
-                        <v-list-item
-                          v-can:VIEW_BUSINESS_REGISTRY_DASHBOARD
-                          @click="viewInBusinessRegistryDashboard(item)"
-                        >
+                        <v-list-item @click="viewInBusinessRegistryDashboard(item)">
                           <v-list-item-subtitle>
                             <v-icon style="font-size: 14px">mdi-view-dashboard</v-icon>
                             <span class="pl-2">Business Registry Dashboard</span>
@@ -305,7 +302,6 @@
 
 <script lang="ts">
 import { AccessType, Account, AccountStatus, LoginSource, SessionStorageKeys } from '@/util/constants'
-
 import {
   DEFAULT_DATA_OPTIONS,
   cachePageInfo,
diff --git a/auth-web/src/components/auth/staff/account-management/StaffAccountManagement.vue b/auth-web/src/components/auth/staff/account-management/StaffAccountManagement.vue
index 3660b0fa60..906a49dc41 100644
--- a/auth-web/src/components/auth/staff/account-management/StaffAccountManagement.vue
+++ b/auth-web/src/components/auth/staff/account-management/StaffAccountManagement.vue
@@ -36,7 +36,7 @@
         Active
       </v-tab>
 
-      <template v-if="canViewInvitations">
+      <template v-if="canCreateAccounts">
         <v-tab
           data-test="invitations-tab"
           :to="pagesEnum.STAFF_DASHBOARD_INVITATIONS"
@@ -115,9 +115,19 @@
 </template>
 
 <script lang="ts">
+import { Action, State } from 'pinia-class'
+import { Component, Vue } from 'vue-property-decorator'
 import { Pages, Role } from '@/util/constants'
-import { computed, defineComponent, onMounted, reactive, toRefs } from '@vue/composition-api'
+import { mapActions, mapState } from 'pinia'
+import { Code } from '@/models/Code'
+import { KCUserProfile } from 'sbc-common-components/src/models/KCUserProfile'
+import { Organization } from '@/models/Organization'
+import StaffActiveAccountsTable from '@/components/auth/staff/account-management/StaffActiveAccountsTable.vue'
 import StaffCreateAccountModal from '@/components/auth/staff/account-management/StaffCreateAccountModal.vue'
+import StaffInactiveAccountsTable from '@/components/auth/staff/account-management/StaffInactiveAccountsTable.vue'
+import StaffPendingAccountInvitationsTable from '@/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue'
+import StaffPendingAccountsTable from '@/components/auth/staff/account-management/StaffPendingAccountsTable.vue'
+import StaffRejectedAccountsTable from '@/components/auth/staff/account-management/StaffRejectedAccountsTable.vue'
 import { useCodesStore } from '@/stores/codes'
 import { useStaffStore } from '@/stores/staff'
 import { useTaskStore } from '@/stores/task'
@@ -132,100 +142,115 @@ enum TAB_CODE {
     Inactive = 'inactive-tab'
 }
 
-export default defineComponent({
-  name: 'StaffAccountManagement',
+@Component({
   components: {
+    StaffActiveAccountsTable,
+    StaffPendingAccountsTable,
+    StaffRejectedAccountsTable,
+    StaffPendingAccountInvitationsTable,
+    StaffInactiveAccountsTable,
     StaffCreateAccountModal
   },
-  setup () {
-    const { currentUser } = useUserStore()
-    const { syncPendingInvitationOrgs, syncSuspendedStaffOrgs } = useStaffStore()
-    const { getCodes } = useCodesStore()
-    const { syncTasks } = useTaskStore()
-    const staffStore = useStaffStore()
-    const taskStore = useTaskStore()
-    const pendingInvitationsCount = computed(() => staffStore.pendingInvitationsCount)
-    const suspendedReviewCount = computed(() => staffStore.suspendedReviewCount)
-    const pendingTasksCount = computed(() => taskStore.pendingTasksCount)
-    const rejectedTasksCount = computed(() => taskStore.rejectedTasksCount)
-
-    const state = reactive({
-      tab: 0,
-      pagesEnum: Pages,
-      canManageAccounts: computed(() => currentUser?.roles?.includes(Role.StaffManageAccounts) ||
-      currentUser?.roles?.includes(Role.ContactCentreStaff)),
-      canViewInvitations: computed(() => currentUser?.roles?.includes(Role.StaffCreateAccounts) ||
-        currentUser?.roles?.includes(Role.ContactCentreStaff)),
-      canCreateAccounts: computed(() => currentUser?.roles?.includes(Role.StaffCreateAccounts) &&
-      !currentUser?.roles?.includes(Role.ContactCentreStaff)),
-      canViewAccounts: computed(() => currentUser?.roles?.includes(Role.StaffViewAccounts)),
-      canSuspendAccounts: computed(() => currentUser?.roles?.includes(Role.StaffSuspendAccounts) ||
-        currentUser?.roles?.includes(Role.StaffViewAccounts))
-    })
-
-    onMounted(async () => {
-      await getCodes()
-      await syncTasks()
-      await syncSuspendedStaffOrgs()
-      if (state.canManageAccounts) {
-        await syncPendingInvitationOrgs()
-      }
-    })
-
-    const tabs = reactive([
-      {
-        id: 0,
-        tabName: 'Active',
-        code: TAB_CODE.Active
-      },
-      {
-        id: 1,
-        tabName: 'Invitations',
-        code: TAB_CODE.Invitations
-      },
-      {
-        id: 2,
-        tabName: 'Pending Review',
-        code: TAB_CODE.PendingReview
-      },
-      {
-        id: 3,
-        tabName: 'Rejected',
-        code: TAB_CODE.Rejected
-      },
-      {
-        id: 4,
-        tabName: 'Suspended',
-        code: TAB_CODE.Suspended
-      },
-      {
-        id: 5,
-        tabName: 'Inactive',
-        code: TAB_CODE.Inactive
-      }
+  methods: {
+    ...mapActions(useStaffStore, [
+      'syncPendingInvitationOrgs',
+      'syncSuspendedStaffOrgs'
     ])
+  },
+  computed: {
+    ...mapState(useUserStore, ['currentUser']),
+    ...mapState(useStaffStore, [
+      'pendingInvitationsCount',
+      'suspendedReviewCount'
+    ])
+  }
+})
+export default class StaffAccountManagement extends Vue {
+  private tab = 0
+  private readonly currentUser!: KCUserProfile
+  private readonly syncRejectedStaffOrgs!: () => Organization[]
+  private readonly syncPendingInvitationOrgs!: () => Organization[]
+  private readonly syncSuspendedStaffOrgs!: () => Organization[]
+  @Action(useCodesStore) readonly getCodes!: () => Promise<Code[]>
+  @Action(useTaskStore) readonly syncTasks!: () => Promise<void>
+  @State(useTaskStore) private pendingTasksCount: number
+  @State(useTaskStore) private rejectedTasksCount: number
+
+  private readonly pendingInvitationsCount!: number
+  private readonly suspendedReviewCount!: number
+  private pagesEnum = Pages
 
-    function openCreateAccount () {
-      this.$refs.staffCreateAccountDialog.open()
+  $refs: {
+      staffCreateAccountDialog: any
+  }
+
+  private tabs = [
+    {
+      id: 0,
+      tabName: 'Active',
+      code: TAB_CODE.Active
+    },
+    {
+      id: 1,
+      tabName: 'Invitations',
+      code: TAB_CODE.Invitations
+    },
+    {
+      id: 2,
+      tabName: 'Pending Review',
+      code: TAB_CODE.PendingReview
+    },
+    {
+      id: 3,
+      tabName: 'Rejected',
+      code: TAB_CODE.Rejected
+    },
+    {
+      id: 4,
+      tabName: 'Suspended',
+      code: TAB_CODE.Suspended
+    },
+    {
+      id: 5,
+      tabName: 'Inactive',
+      code: TAB_CODE.Inactive
     }
+  ]
 
-    async function tabChange (tabIndex) {
-      const selected = this.tabs.filter((tab) => (tab.id === tabIndex))
-      if (selected[0]?.code === TAB_CODE.Invitations) {
-        await this.syncPendingInvitationOrgs()
-      }
+  private async mounted () {
+    await this.getCodes()
+    await this.syncTasks()
+    await this.syncSuspendedStaffOrgs()
+    if (this.canCreateAccounts) {
+      await this.syncPendingInvitationOrgs()
     }
+  }
+
+  openCreateAccount () {
+    this.$refs.staffCreateAccountDialog.open()
+  }
 
-    return {
-      ...toRefs(state),
-      openCreateAccount,
-      tabChange,
-      tabs,
-      pendingInvitationsCount,
-      pendingTasksCount,
-      rejectedTasksCount,
-      suspendedReviewCount
+  private get canManageAccounts () {
+    return this.currentUser?.roles?.includes(Role.StaffManageAccounts)
+  }
+
+  private get canCreateAccounts () {
+    return this.currentUser?.roles?.includes(Role.StaffCreateAccounts)
+  }
+
+  private get canViewAccounts () {
+    return this.currentUser?.roles?.includes(Role.StaffViewAccounts)
+  }
+
+  private get canSuspendAccounts () {
+    return this.currentUser?.roles?.includes(Role.StaffSuspendAccounts) || this.currentUser?.roles?.includes(Role.StaffViewAccounts)
+  }
+
+  private async tabChange (tabIndex) {
+    const selected = this.tabs.filter((tab) => (tab.id === tabIndex))
+    if (selected[0]?.code === TAB_CODE.Invitations) {
+      await this.syncPendingInvitationOrgs()
     }
   }
-})
+}
 </script>
diff --git a/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue b/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue
index de96a12ea6..1da76456d4 100644
--- a/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue
+++ b/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue
@@ -18,18 +18,17 @@
         Loading...
       </template>
       <template #[`item.expires`]="{ item }">
-        {{ formatDate(item.invitations[0]?.expiresOn, 'MMM DD, YYYY') }}
+        {{ formatDate(item.invitations[0].expiresOn, 'MMM DD, YYYY') }}
       </template>
       <template #[`item.contactEmail`]="{ item }">
         <!-- {{item.invitations[0].recipientEmail}} -->
-        <a :href="'mailto:' + item.invitations[0]?.recipientEmail">
-          {{ item.invitations[0]?.recipientEmail }}
+        <a :href="'mailto:' + item.invitations[0].recipientEmail">
+          {{ item.invitations[0].recipientEmail }}
         </a>
       </template>
       <template #[`item.action`]="{ item }">
         <div class="table-actions">
           <v-btn
-            v-can:EDIT_USER.hide
             outlined
             color="primary"
             class="action-btn"
@@ -39,7 +38,6 @@
             Resend
           </v-btn>
           <v-btn
-            v-can:EDIT_USER.hide
             outlined
             color="primary"
             class="action-btn"
@@ -93,8 +91,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref, toRefs } from '@vue/composition-api'
+import { Component, Mixins } from 'vue-property-decorator'
+import { mapActions, mapState } from 'pinia'
 import CommonUtils from '@/util/common-util'
+import { DataOptions } from 'vuetify'
 import { Event } from '@/models/event'
 import { EventBus } from '@/event-bus'
 import { Invitation } from '@/models/Invitation'
@@ -103,115 +103,118 @@ import { Organization } from '@/models/Organization'
 import PaginationMixin from '@/components/auth/mixins/PaginationMixin.vue'
 import { useStaffStore } from '@/stores/staff'
 
-export default defineComponent({
-  name: 'StaffPendingAccountInvitationsTable',
+@Component({
   components: {
     ModalDialog
   },
-  mixins: [PaginationMixin],
-  setup () {
-    const formatDate = CommonUtils.formatDisplayDate
-    const columnSort = CommonUtils.customSort
-
-    const confirmActionDialog = ref<InstanceType<typeof ModalDialog>>()
-    const state = reactive({
-      orgToBeRemoved: null,
-      tableDataOptions: {}
-    })
-    const { pendingInvitationOrgs, resendPendingOrgInvitation, syncPendingInvitationOrgs, deleteOrg } = useStaffStore()
-
-    const headerAccounts = [
-      {
-        text: 'Expiry Date',
-        align: 'left',
-        value: 'expires',
-        sortable: false,
-        width: '150'
-      },
-      {
-        text: 'Name',
-        align: 'left',
-        sortable: false,
-        value: 'name'
-      },
-      {
-        text: 'Contact Email',
-        align: 'left',
-        sortable: false,
-        value: 'contactEmail'
-      },
-      {
-        text: 'Created By',
-        align: 'left',
-        sortable: false,
-        value: 'createdBy'
-      },
-      {
-        text: 'Actions',
-        align: 'left',
-        value: 'action',
-        sortable: false,
-        width: '210'
-      }
-    ]
-
-    function getIndexedTag (tag, index): string {
-      return `${tag}-${index}`
-    }
+  computed: {
+    ...mapState(useStaffStore, [
+      'pendingInvitationOrgs'
+    ])
+  },
+  methods: {
+    ...mapActions(useStaffStore, [
+      'resendPendingOrgInvitation',
+      'syncPendingInvitationOrgs',
+      'deleteOrg'
+    ])
+  }
+})
+export default class StaffPendingAccountInvitationsTable extends Mixins(PaginationMixin) {
+  $refs: {
+    confirmActionDialog: InstanceType<typeof ModalDialog>
+  }
 
-    async function resend (invitation: Invitation) {
-      try {
-        await resendPendingOrgInvitation(invitation)
-        const event:Event = { message: `Invitation resent to ${invitation.recipientEmail}`, type: 'success', timeout: 1000 }
-        EventBus.$emit('show-toast', event)
-      } catch (err) {
-        const event:Event = { message: 'Invitation resend failed', type: 'error', timeout: 1000 }
-        EventBus.$emit('show-toast', event)
-      }
-
-      await syncPendingInvitationOrgs()
-    }
+  private readonly pendingInvitationOrgs!: Organization[]
+  private readonly resendPendingOrgInvitation!: (invitation: Invitation) => void
+  private readonly syncPendingInvitationOrgs!: () => Organization[]
+  private readonly deleteOrg!: (org: Organization) => void
+  private tableDataOptions : Partial<DataOptions> = {}
 
-    async function deleteInvitation () {
-      try {
-        await deleteOrg(state.orgToBeRemoved)
-        close()
-        const event:Event = { message: 'Invitation removed', type: 'success', timeout: 1000 }
-        EventBus.$emit('show-toast', event)
-        await syncPendingInvitationOrgs()
-      } catch (err) {
-        const event:Event = { message: 'Invitation remove failed', type: 'error', timeout: 1000 }
-        EventBus.$emit('show-toast', event)
-      }
-    }
+  private orgToBeRemoved: Organization = null
+
+  private columnSort = CommonUtils.customSort
 
-    function showConfirmRemoveInviteModal (org: Organization) {
-      state.orgToBeRemoved = org
-      confirmActionDialog.value.open()
+  mounted () {
+    this.tableDataOptions = this.DEFAULT_DATA_OPTIONS
+  }
+
+  private readonly headerAccounts = [
+    {
+      text: 'Expiry Date',
+      align: 'left',
+      value: 'expires',
+      sortable: false,
+      width: '150'
+    },
+    {
+      text: 'Name',
+      align: 'left',
+      sortable: false,
+      value: 'name'
+    },
+    {
+      text: 'Contact Email',
+      align: 'left',
+      sortable: false,
+      value: 'contactEmail'
+    },
+    {
+      text: 'Created By',
+      align: 'left',
+      sortable: false,
+      value: 'createdBy'
+    },
+    {
+      text: 'Actions',
+      align: 'left',
+      value: 'action',
+      sortable: false,
+      width: '210'
     }
+  ]
+
+  private formatDate = CommonUtils.formatDisplayDate
 
-    function close () {
-      confirmActionDialog.value.close()
+  private getIndexedTag (tag, index): string {
+    return `${tag}-${index}`
+  }
+
+  private async resend (invitation: Invitation) {
+    try {
+      await this.resendPendingOrgInvitation(invitation)
+      const event:Event = { message: `Invitation resent to ${invitation.recipientEmail}`, type: 'success', timeout: 1000 }
+      EventBus.$emit('show-toast', event)
+    } catch (err) {
+      const event:Event = { message: 'Invitation resend failed', type: 'error', timeout: 1000 }
+      EventBus.$emit('show-toast', event)
     }
 
-    return {
-      ...toRefs(state),
-      pendingInvitationOrgs,
-      resendPendingOrgInvitation,
-      syncPendingInvitationOrgs,
-      deleteOrg,
-      headerAccounts,
-      formatDate,
-      getIndexedTag,
-      resend,
-      deleteInvitation,
-      showConfirmRemoveInviteModal,
-      close,
-      columnSort,
-      confirmActionDialog
+    await this.syncPendingInvitationOrgs()
+  }
+
+  private async deleteInvitation () {
+    try {
+      await this.deleteOrg(this.orgToBeRemoved)
+      this.close()
+      const event:Event = { message: 'Invitation removed', type: 'success', timeout: 1000 }
+      EventBus.$emit('show-toast', event)
+      await this.syncPendingInvitationOrgs()
+    } catch (err) {
+      const event:Event = { message: 'Invitation remove failed', type: 'error', timeout: 1000 }
+      EventBus.$emit('show-toast', event)
     }
   }
-})
+
+  private showConfirmRemoveInviteModal (org: Organization) {
+    this.orgToBeRemoved = org
+    this.$refs.confirmActionDialog.open()
+  }
+
+  private close () {
+    this.$refs.confirmActionDialog.close()
+  }
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue b/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue
index 1ecb434264..b6384391a7 100644
--- a/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue
+++ b/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue
@@ -7,7 +7,6 @@
       {{ subTitle }}
     </p>
     <v-btn
-      v-can:EDIT_USER.hide
       x-large=""
       outlined
       color="primary"
@@ -35,7 +34,6 @@ export default class DownloadAffidavit extends Vue {
   @Prop({ default: 'Download the notarized affidavit associated with this account to verify the account creators ' +
     'identity and associated information.' }) subTitle: string
   @Prop({ default: '' }) affidavitName: string
-  canDownloadAffidavit: boolean = false
 }
 </script>
 
diff --git a/auth-web/src/components/datatable/resources/index.ts b/auth-web/src/components/datatable/resources/index.ts
index c06eca0cb3..bc68cbb3b4 100644
--- a/auth-web/src/components/datatable/resources/index.ts
+++ b/auth-web/src/components/datatable/resources/index.ts
@@ -16,7 +16,7 @@ export const DEFAULT_DATA_OPTIONS: DataOptions = {
   mustSort: false
 }
 
-export const getNumberOfItemsFromSessionStorage = (key: SessionStorageKeys): number | undefined => {
+const getNumberOfItemsFromSessionStorage = (key: SessionStorageKeys): number | undefined => {
   const items = +ConfigHelper.getFromSession(key)
   return !isNaN(items) ? items : undefined
 }
diff --git a/auth-web/src/routes/index.ts b/auth-web/src/routes/index.ts
index a435fb47a5..ae1deb2448 100644
--- a/auth-web/src/routes/index.ts
+++ b/auth-web/src/routes/index.ts
@@ -43,7 +43,7 @@ router.beforeEach(async (to, from, next) => {
         })
       }
     } else {
-      if (to.meta.allowedRoles?.length === 1 && [Role.Staff, Role.ContactCentreStaff].includes(to.meta.allowedRoles[0])) {
+      if (to.meta.allowedRoles?.length === 1 && to.meta.allowedRoles[0] === Role.Staff) {
         return next({
           path: `/signin/idir${to.path}`,
           query: { redirect: to.fullPath }
diff --git a/auth-web/src/routes/router.ts b/auth-web/src/routes/router.ts
index 176d908545..e19e2c838d 100644
--- a/auth-web/src/routes/router.ts
+++ b/auth-web/src/routes/router.ts
@@ -131,9 +131,8 @@ function mapPendingDetails (route: any) {
 }
 
 function isStaff (): boolean {
-  const userProfile = KeyCloakService.getUserInfo()
-  const roles = userProfile?.roles || []
-  return roles.includes('Staff') || roles.includes('ContactCentreStaff')
+  const kcUserProfile = KeyCloakService.getUserInfo()
+  return kcUserProfile?.roles?.includes(Role.Staff) || false
 }
 
 export function getRoutes (): RouteConfig[] {
@@ -238,7 +237,7 @@ export function getRoutes (): RouteConfig[] {
           // Preserve query parameters when redirecting
           const queryString = new URLSearchParams(to.query as Record<string, string>).toString()
           const redirectUrl = queryString ? `${baseUrl}?${queryString}` : baseUrl
-
+          
           window.location.href = redirectUrl
         } else {
           next()
@@ -468,7 +467,7 @@ export function getRoutes (): RouteConfig[] {
       path: '/review-account/:orgId',
       name: 'review-account',
       component: ReviewAccountView,
-      meta: { requiresAuth: true, allowedRoles: [Role.StaffManageAccounts, Role.ContactCentreStaff] },
+      meta: { requiresAuth: true, allowedRoles: [Role.StaffManageAccounts] },
       props: true
     },
     {
@@ -645,7 +644,7 @@ export function getRoutes (): RouteConfig[] {
       path: Pages.STAFF_DASHBOARD,
       component: StaffDashboardView,
       props: true,
-      meta: { requiresAuth: true, allowedRoles: [Role.Staff, Role.ContactCentreStaff] },
+      meta: { requiresAuth: true, allowedRoles: [Role.Staff] },
       children: [
         {
           path: '',
@@ -658,7 +657,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffActiveAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -674,7 +673,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffPendingAccountInvitationsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -690,7 +689,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffPendingAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -706,7 +705,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffRejectedAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -722,7 +721,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffSuspendedAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -738,7 +737,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffInactiveAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
+            allowedRoles: [Role.Staff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
diff --git a/auth-web/src/stores/org.ts b/auth-web/src/stores/org.ts
index 33dda83e70..e0f2ec87d7 100644
--- a/auth-web/src/stores/org.ts
+++ b/auth-web/src/stores/org.ts
@@ -316,7 +316,7 @@ export const useOrgStore = defineStore('org', () => {
     let response
     let membership:Member = null
     const kcUserProfile = KeyCloakService.getUserInfo()
-    if (!kcUserProfile.roles.includes(Role.Staff) && !kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
+    if (!kcUserProfile.roles.includes(Role.Staff)) {
       response = await UserService.getMembership(orgId)
       membership = response?.data
       // const org: Organization = state.currentOrganization']
@@ -329,18 +329,14 @@ export const useOrgStore = defineStore('org', () => {
     } else {
       // Check for better approach
       // Create permissions to enable actions for staff
-      if (kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
-        permissions = CommonUtils.getContactCentreStaffPermissions()
-      } else if (kcUserProfile.roles.includes(Role.StaffManageAccounts)) {
+      if (kcUserProfile.roles.includes(Role.StaffManageAccounts)) {
         permissions = CommonUtils.getAdminPermissions()
       } else if (kcUserProfile.roles.includes(Role.StaffViewAccounts)) {
         permissions = CommonUtils.getViewOnlyPermissions()
       }
       // Create an empty membership model for staff. Map view_account as User and manage_accounts as Admin
       let membershipTypeCode = null
-      if (kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
-        membershipTypeCode = MembershipType.Admin
-      } else if (kcUserProfile.roles.includes(Role.StaffManageAccounts)) {
+      if (kcUserProfile.roles.includes(Role.StaffManageAccounts)) {
         membershipTypeCode = MembershipType.Admin
       } else if (kcUserProfile.roles.includes(Role.StaffViewAccounts)) {
         membershipTypeCode = MembershipType.User
diff --git a/auth-web/src/util/common-util.ts b/auth-web/src/util/common-util.ts
index fc8d60ecbf..48c3477700 100644
--- a/auth-web/src/util/common-util.ts
+++ b/auth-web/src/util/common-util.ts
@@ -229,31 +229,6 @@ export default class CommonUtils {
       Permission.VIEW_AUTH_OPTIONS,
       Permission.VIEW_PAYMENT_METHODS,
       Permission.VIEW_REQUEST_PRODUCT_PACKAGE,
-      Permission.VIEW_USER_LOGINSOURCE,
-      Permission.EDIT_USER,
-      Permission.VIEW_BUSINESS_REGISTRY_DASHBOARD,
-      Permission.VIEW_LAUNCH_TITLES,
-      Permission.VIEW_CONTINUATION_AUTHORIZATION_REVIEWS
-    ]
-  }
-
-  static getContactCentreStaffPermissions (): string[] {
-    return [
-      Permission.CHANGE_ORG_NAME,
-      Permission.CHANGE_ROLE,
-      Permission.GENERATE_INVOICE,
-      Permission.MAKE_PAYMENT,
-      Permission.MANAGE_STATEMENTS,
-      Permission.REMOVE_BUSINESS,
-      Permission.RESET_OTP,
-      Permission.RESET_PASSWORD,
-      Permission.TRANSACTION_HISTORY,
-      Permission.VIEW_ACTIVITYLOG,
-      Permission.VIEW_ADDRESS,
-      Permission.VIEW_ADMIN_CONTACT,
-      Permission.VIEW_AUTH_OPTIONS,
-      Permission.VIEW_PAYMENT_METHODS,
-      Permission.VIEW_REQUEST_PRODUCT_PACKAGE,
       Permission.VIEW_USER_LOGINSOURCE
     ]
   }
diff --git a/auth-web/src/util/constants.ts b/auth-web/src/util/constants.ts
index 99deddd0b1..9a98d5fdf9 100644
--- a/auth-web/src/util/constants.ts
+++ b/auth-web/src/util/constants.ts
@@ -63,8 +63,7 @@ export enum Role {
     EftRefundApprover = 'eft_refund_approver',
     CreateCredits = 'create_credits',
     FasRefund = 'fas_refund',
-    BcolStaffAdmin = 'bcol_staff_admin',
-    ContactCentreStaff = 'contact_centre_staff'
+    BcolStaffAdmin = 'bcol_staff_admin'
 }
 
 export enum Pages {
@@ -457,10 +456,6 @@ export enum Permission {
     VIEW_USER_LOGINSOURCE='VIEW_USER_LOGINSOURCE',
     EDIT_BUSINESS_INFO = 'EDIT_BUSINESS_INFO',
     VIEW_DEVELOPER_ACCESS = 'VIEW_DEVELOPER_ACCESS',
-    EDIT_USER = 'EDIT_USER',
-    VIEW_BUSINESS_REGISTRY_DASHBOARD = 'VIEW_BUSINESS_REGISTRY_DASHBOARD',
-    VIEW_LAUNCH_TITLES = 'VIEW_LAUNCH_TITLES',
-    VIEW_CONTINUATION_AUTHORIZATION_REVIEWS = 'VIEW_CONTINUATION_AUTHORIZATION_REVIEWS'
 }
 
 export enum LDFlags {
diff --git a/auth-web/src/views/auth/AccountSettings.vue b/auth-web/src/views/auth/AccountSettings.vue
index a243d70354..f7f90282dd 100644
--- a/auth-web/src/views/auth/AccountSettings.vue
+++ b/auth-web/src/views/auth/AccountSettings.vue
@@ -408,7 +408,7 @@ export default class AccountSettings extends Mixins(AccountMixin) {
   }
 
   private get isStaff ():boolean {
-    return this.currentUser.roles.includes(Role.Staff) || this.currentUser.roles.includes(Role.ContactCentreStaff)
+    return this.currentUser.roles.includes(Role.Staff)
   }
 
   private get accountInfoUrl (): string {
diff --git a/auth-web/src/views/auth/staff/ReviewAccountView.vue b/auth-web/src/views/auth/staff/ReviewAccountView.vue
index 7f355e5608..f7f39eefaf 100644
--- a/auth-web/src/views/auth/staff/ReviewAccountView.vue
+++ b/auth-web/src/views/auth/staff/ReviewAccountView.vue
@@ -62,48 +62,40 @@
               />
             </template>
 
-            <template
-              v-if="canSelect"
-            >
-              <div
-                v-can:EDIT_USER.hide
-              >
-                <v-divider class="mt-11 mb-8" />
-                <div
-                  class="form-btns d-flex justify-end"
-                >
-                  <div v-display-mode="!canEdit ? viewOnly : false ">
-                    <v-btn
-                      large
-                      color="primary"
-                      class="font-weight-bold mr-2 select-button"
-                      @click="openModal()"
-                    >
-                      <span v-if="isTaskRejected">Re-Approve</span>
-                      <span v-else>Approve</span>
-                    </v-btn>
-                    <v-btn
-                      v-if="!isTaskRejected"
-                      large
-                      outlined
-                      color="primary"
-                      class="font-weight-bold white--text select-button"
-                      @click="openModal(true)"
-                    >
-                      <span v-if="isAffidavitReview && !isTaskOnHold">Reject/On Hold</span>
-                      <span v-else>Reject</span>
-                    </v-btn>
-                    <v-btn
-                      v-else-if="!isMhrSubProductReview"
-                      large
-                      outlined
-                      color="primary"
-                      class="font-weight-bold white--text select-button"
-                      @click="openModal(false, false, false, true)"
-                    >
-                      <span>Move to pending</span>
-                    </v-btn>
-                  </div>
+            <template v-if="canSelect">
+              <v-divider class="mt-11 mb-8" />
+              <div class="form-btns d-flex justify-end">
+                <div v-display-mode="!canEdit ? viewOnly : false ">
+                  <v-btn
+                    large
+                    color="primary"
+                    class="font-weight-bold mr-2 select-button"
+                    @click="openModal()"
+                  >
+                    <span v-if="isTaskRejected">Re-Approve</span>
+                    <span v-else>Approve</span>
+                  </v-btn>
+                  <v-btn
+                    v-if="!isTaskRejected"
+                    large
+                    outlined
+                    color="primary"
+                    class="font-weight-bold white--text select-button"
+                    @click="openModal(true)"
+                  >
+                    <span v-if="isAffidavitReview && !isTaskOnHold">Reject/On Hold</span>
+                    <span v-else>Reject</span>
+                  </v-btn>
+                  <v-btn
+                    v-else-if="!isMhrSubProductReview"
+                    large
+                    outlined
+                    color="primary"
+                    class="font-weight-bold white--text select-button"
+                    @click="openModal(false, false, false, true)"
+                  >
+                    <span>Move to pending</span>
+                  </v-btn>
                 </div>
               </div>
             </template>
diff --git a/auth-web/src/views/auth/staff/StaffDashboardView.vue b/auth-web/src/views/auth/staff/StaffDashboardView.vue
index cc18d022b9..b519ce4463 100644
--- a/auth-web/src/views/auth/staff/StaffDashboardView.vue
+++ b/auth-web/src/views/auth/staff/StaffDashboardView.vue
@@ -144,7 +144,6 @@
 
     <!-- Continuation Applications -->
     <v-card
-      v-can:VIEW_CONTINUATION_AUTHORIZATION_REVIEWS.hide
       flat
       class="mb-4 pa-8"
     >
@@ -288,9 +287,7 @@
     </BaseVExpansionPanel>
 
     <!-- Feature Launch Tiles: ie Involuntary Dissolution, Document Record Service -->
-    <v-row
-      v-can:VIEW_LAUNCH_TITLES.hide
-    >
+    <v-row>
       <v-col
         v-for="tile in launchTileConfig"
         :key="tile.title"
@@ -379,7 +376,6 @@ export default defineComponent({
       canViewAllTransactions: computed((): boolean => currentUser.value?.roles?.includes(Role.ViewAllTransactions)),
       canViewEFTPayments: computed((): boolean => currentUser.value?.roles?.includes(Role.ManageEft)),
       canViewGLCodes: computed((): boolean => currentUser.value?.roles?.includes(Role.ManageGlCodes)),
-      isContactCentreStaff: computed(() => currentUser.value?.roles?.includes(Role.ContactCentreStaff)),
       canViewIncorporationSearchResult: false,
       errorMessage: '',
       isFasDashboardEnabled: computed((): boolean => currentUser.value?.roles?.includes(Role.FasSearch)),