diff --git a/auth-web/package.json b/auth-web/package.json
index ac386571e..a0cea0cb4 100644
--- a/auth-web/package.json
+++ b/auth-web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "auth-web",
-  "version": "2.7.2",
+  "version": "2.7.3",
   "appName": "Auth Web",
   "sbcName": "SBC Common Components",
   "private": true,
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 235ad4203..30a1171e5 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, Pages, Permission, Role, SuspensionReason } from '@/util/constants'
+import { AccessType, AccountStatus, 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,16 +361,15 @@ export default defineComponent({
       isBusinessAccount: computed(() => orgStore.isBusinessAccount),
       baseAddress: computed(() => currentOrgAddress.value),
 
-      isStaff: computed(() => userStore.currentUser.roles.includes(Role.Staff)),
+      isStaff: computed(() => userStore.currentUser.roles.includes(Role.Staff)) || userStore.currentUser.roles.includes(Role.ContactCentreStaff),
       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),
-      editAccountUrl: Pages.EDIT_ACCOUNT_TYPE,
-      canChangeAccessType: computed(() => userStore.currentUser.roles.includes(Role.StaffManageAccounts)),
-      isAddressEditable: computed(() => [Permission.CHANGE_ADDRESS].some(per => permissions.value.includes(per))),
+      canChangeAccessType: computed(() => userStore.currentUser.roles.includes(Role.StaffManageAccounts)) &&
+      !userStore.currentUser.roles.includes(Role.ContactCentreStaff),
       isAdminContactViewable: computed(() => [Permission.VIEW_ADMIN_CONTACT].some(per => permissions.value.includes(per))),
       isAccountStatusActive: computed(() => currentOrganization.value.statusCode === AccountStatus.ACTIVE),
       accountType: computed(() => {
@@ -384,7 +383,8 @@ export default defineComponent({
       isAddressInfoIncomplete: computed(() => (
         currentOrgAddress.value ? Object.keys(currentOrgAddress.value).length === 0 : true
       )),
-      nameChangeNotAllowed: computed(() => (anonAccount.value || isGovmAccount.value))
+      nameChangeNotAllowed: computed(() => (anonAccount.value || isGovmAccount.value)) &&
+      userStore.currentUser.roles.includes(Role.ContactCentreStaff)
     })
 
     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 1c796eb75..8031cf022 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,6 +30,7 @@
     <template #[`item.action`]="{ item }">
       <!-- Resend Invitation -->
       <v-btn
+        v-can:EDIT_USER.hide
         icon
         class="mr-1"
         aria-label="Resend invitation"
@@ -42,6 +43,7 @@
 
       <!-- 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 a0abd9749..baf375c6e 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,6 +151,7 @@
         <!-- Remove User -->
         <v-btn
           v-show="canRemove(item)"
+          v-can:EDIT_USER.hide
           icon
           aria-label="Remove Team Member"
           title="Remove Team Member"
@@ -231,12 +232,13 @@
 </template>
 
 <script lang="ts">
-import { AccessType, LoginSource, Permission } from '@/util/constants'
+import { AccessType, LoginSource, Permission, Role } 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'
@@ -260,6 +262,7 @@ export interface ChangeRolePayload {
       'permissions'
     ]),
     ...mapState(useUserStore, [
+      'currentUser',
       'roleInfos'
     ])
   },
@@ -272,6 +275,7 @@ 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
@@ -401,6 +405,10 @@ 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
     }
@@ -408,9 +416,7 @@ 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 2a57cf431..a420b8b5c 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,6 +28,7 @@
     </template>
     <template #[`item.action`]="{ item }">
       <v-btn
+        v-can:EDIT_USER.hide
         icon
         class="mr-1"
         aria-label="Approve user access to this account"
@@ -38,6 +39,7 @@
         <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 b3f4b97d3..ba42f6961 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,7 +39,6 @@
         Active
       </v-tab>
       <v-tab
-        v-can:INVITE_MEMBERS.hide
         data-test="pending-approval-tab"
       >
         <v-badge
@@ -52,7 +51,6 @@
         </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 8aceda1b5..4a897a879 100644
--- a/auth-web/src/components/auth/common/ProductTOS.vue
+++ b/auth-web/src/components/auth/common/ProductTOS.vue
@@ -10,6 +10,7 @@
     </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
@@ -40,7 +41,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 aa6cf89cd..8fe49fafe 100644
--- a/auth-web/src/components/auth/common/StaffAccountsTable.vue
+++ b/auth-web/src/components/auth/common/StaffAccountsTable.vue
@@ -275,7 +275,10 @@
                         </v-btn>
                       </template>
                       <v-list>
-                        <v-list-item @click="viewInBusinessRegistryDashboard(item)">
+                        <v-list-item
+                          v-can:VIEW_BUSINESS_REGISTRY_DASHBOARD
+                          @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>
@@ -302,6 +305,7 @@
 
 <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 906a49dc4..3660b0fa6 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="canCreateAccounts">
+      <template v-if="canViewInvitations">
         <v-tab
           data-test="invitations-tab"
           :to="pagesEnum.STAFF_DASHBOARD_INVITATIONS"
@@ -115,19 +115,9 @@
 </template>
 
 <script lang="ts">
-import { Action, State } from 'pinia-class'
-import { Component, Vue } from 'vue-property-decorator'
 import { Pages, Role } from '@/util/constants'
-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 { computed, defineComponent, onMounted, reactive, toRefs } from '@vue/composition-api'
 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'
@@ -142,115 +132,100 @@ enum TAB_CODE {
     Inactive = 'inactive-tab'
 }
 
-@Component({
+export default defineComponent({
+  name: 'StaffAccountManagement',
   components: {
-    StaffActiveAccountsTable,
-    StaffPendingAccountsTable,
-    StaffRejectedAccountsTable,
-    StaffPendingAccountInvitationsTable,
-    StaffInactiveAccountsTable,
     StaffCreateAccountModal
   },
-  methods: {
-    ...mapActions(useStaffStore, [
-      'syncPendingInvitationOrgs',
-      'syncSuspendedStaffOrgs'
+  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
+      }
     ])
-  },
-  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
 
-  $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
+    function openCreateAccount () {
+      this.$refs.staffCreateAccountDialog.open()
     }
-  ]
 
-  private async mounted () {
-    await this.getCodes()
-    await this.syncTasks()
-    await this.syncSuspendedStaffOrgs()
-    if (this.canCreateAccounts) {
-      await this.syncPendingInvitationOrgs()
+    async function tabChange (tabIndex) {
+      const selected = this.tabs.filter((tab) => (tab.id === tabIndex))
+      if (selected[0]?.code === TAB_CODE.Invitations) {
+        await this.syncPendingInvitationOrgs()
+      }
     }
-  }
-
-  openCreateAccount () {
-    this.$refs.staffCreateAccountDialog.open()
-  }
 
-  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()
+    return {
+      ...toRefs(state),
+      openCreateAccount,
+      tabChange,
+      tabs,
+      pendingInvitationsCount,
+      pendingTasksCount,
+      rejectedTasksCount,
+      suspendedReviewCount
     }
   }
-}
+})
 </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 1da76456d..de96a12ea 100644
--- a/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue
+++ b/auth-web/src/components/auth/staff/account-management/StaffPendingAccountInvitationsTable.vue
@@ -18,17 +18,18 @@
         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"
@@ -38,6 +39,7 @@
             Resend
           </v-btn>
           <v-btn
+            v-can:EDIT_USER.hide
             outlined
             color="primary"
             class="action-btn"
@@ -91,10 +93,8 @@
 </template>
 
 <script lang="ts">
-import { Component, Mixins } from 'vue-property-decorator'
-import { mapActions, mapState } from 'pinia'
+import { defineComponent, reactive, ref, toRefs } from '@vue/composition-api'
 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,118 +103,115 @@ import { Organization } from '@/models/Organization'
 import PaginationMixin from '@/components/auth/mixins/PaginationMixin.vue'
 import { useStaffStore } from '@/stores/staff'
 
-@Component({
+export default defineComponent({
+  name: 'StaffPendingAccountInvitationsTable',
   components: {
     ModalDialog
   },
-  computed: {
-    ...mapState(useStaffStore, [
-      'pendingInvitationOrgs'
-    ])
-  },
-  methods: {
-    ...mapActions(useStaffStore, [
-      'resendPendingOrgInvitation',
-      'syncPendingInvitationOrgs',
-      'deleteOrg'
-    ])
-  }
-})
-export default class StaffPendingAccountInvitationsTable extends Mixins(PaginationMixin) {
-  $refs: {
-    confirmActionDialog: InstanceType<typeof ModalDialog>
-  }
-
-  private readonly pendingInvitationOrgs!: Organization[]
-  private readonly resendPendingOrgInvitation!: (invitation: Invitation) => void
-  private readonly syncPendingInvitationOrgs!: () => Organization[]
-  private readonly deleteOrg!: (org: Organization) => void
-  private tableDataOptions : Partial<DataOptions> = {}
-
-  private orgToBeRemoved: Organization = null
-
-  private columnSort = CommonUtils.customSort
-
-  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'
+  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}`
     }
-  ]
-
-  private formatDate = CommonUtils.formatDisplayDate
 
-  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)
+    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()
     }
 
-    await this.syncPendingInvitationOrgs()
-  }
+    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 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)
+    function showConfirmRemoveInviteModal (org: Organization) {
+      state.orgToBeRemoved = org
+      confirmActionDialog.value.open()
     }
-  }
 
-  private showConfirmRemoveInviteModal (org: Organization) {
-    this.orgToBeRemoved = org
-    this.$refs.confirmActionDialog.open()
-  }
+    function close () {
+      confirmActionDialog.value.close()
+    }
 
-  private close () {
-    this.$refs.confirmActionDialog.close()
+    return {
+      ...toRefs(state),
+      pendingInvitationOrgs,
+      resendPendingOrgInvitation,
+      syncPendingInvitationOrgs,
+      deleteOrg,
+      headerAccounts,
+      formatDate,
+      getIndexedTag,
+      resend,
+      deleteInvitation,
+      showConfirmRemoveInviteModal,
+      close,
+      columnSort,
+      confirmActionDialog
+    }
   }
-}
+})
 </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 b6384391a..1ecb43426 100644
--- a/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue
+++ b/auth-web/src/components/auth/staff/review-task/DownloadAffidavit.vue
@@ -7,6 +7,7 @@
       {{ subTitle }}
     </p>
     <v-btn
+      v-can:EDIT_USER.hide
       x-large=""
       outlined
       color="primary"
@@ -34,6 +35,7 @@ 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 bc68cbb3b..c06eca0cb 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
 }
 
-const getNumberOfItemsFromSessionStorage = (key: SessionStorageKeys): number | undefined => {
+export 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 ae1deb244..a435fb47a 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 && to.meta.allowedRoles[0] === Role.Staff) {
+      if (to.meta.allowedRoles?.length === 1 && [Role.Staff, Role.ContactCentreStaff].includes(to.meta.allowedRoles[0])) {
         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 e19e2c838..176d90854 100644
--- a/auth-web/src/routes/router.ts
+++ b/auth-web/src/routes/router.ts
@@ -131,8 +131,9 @@ function mapPendingDetails (route: any) {
 }
 
 function isStaff (): boolean {
-  const kcUserProfile = KeyCloakService.getUserInfo()
-  return kcUserProfile?.roles?.includes(Role.Staff) || false
+  const userProfile = KeyCloakService.getUserInfo()
+  const roles = userProfile?.roles || []
+  return roles.includes('Staff') || roles.includes('ContactCentreStaff')
 }
 
 export function getRoutes (): RouteConfig[] {
@@ -237,7 +238,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()
@@ -467,7 +468,7 @@ export function getRoutes (): RouteConfig[] {
       path: '/review-account/:orgId',
       name: 'review-account',
       component: ReviewAccountView,
-      meta: { requiresAuth: true, allowedRoles: [Role.StaffManageAccounts] },
+      meta: { requiresAuth: true, allowedRoles: [Role.StaffManageAccounts, Role.ContactCentreStaff] },
       props: true
     },
     {
@@ -644,7 +645,7 @@ export function getRoutes (): RouteConfig[] {
       path: Pages.STAFF_DASHBOARD,
       component: StaffDashboardView,
       props: true,
-      meta: { requiresAuth: true, allowedRoles: [Role.Staff] },
+      meta: { requiresAuth: true, allowedRoles: [Role.Staff, Role.ContactCentreStaff] },
       children: [
         {
           path: '',
@@ -657,7 +658,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffActiveAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -673,7 +674,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffPendingAccountInvitationsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -689,7 +690,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffPendingAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -705,7 +706,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffRejectedAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -721,7 +722,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffSuspendedAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
@@ -737,7 +738,7 @@ export function getRoutes (): RouteConfig[] {
           component: StaffInactiveAccountsTable,
           meta: {
             requiresAuth: true,
-            allowedRoles: [Role.Staff],
+            allowedRoles: [Role.Staff, Role.ContactCentreStaff],
             breadcrumb: [
               {
                 text: StaffDashboardBreadcrumb.text,
diff --git a/auth-web/src/stores/org.ts b/auth-web/src/stores/org.ts
index e0f2ec87d..33dda83e7 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)) {
+    if (!kcUserProfile.roles.includes(Role.Staff) && !kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
       response = await UserService.getMembership(orgId)
       membership = response?.data
       // const org: Organization = state.currentOrganization']
@@ -329,14 +329,18 @@ export const useOrgStore = defineStore('org', () => {
     } else {
       // Check for better approach
       // Create permissions to enable actions for staff
-      if (kcUserProfile.roles.includes(Role.StaffManageAccounts)) {
+      if (kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
+        permissions = CommonUtils.getContactCentreStaffPermissions()
+      } else 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.StaffManageAccounts)) {
+      if (kcUserProfile.roles.includes(Role.ContactCentreStaff)) {
+        membershipTypeCode = MembershipType.Admin
+      } else 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 48c347770..fc8d60ecb 100644
--- a/auth-web/src/util/common-util.ts
+++ b/auth-web/src/util/common-util.ts
@@ -229,6 +229,31 @@ 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 9a98d5fdf..99deddd0b 100644
--- a/auth-web/src/util/constants.ts
+++ b/auth-web/src/util/constants.ts
@@ -63,7 +63,8 @@ export enum Role {
     EftRefundApprover = 'eft_refund_approver',
     CreateCredits = 'create_credits',
     FasRefund = 'fas_refund',
-    BcolStaffAdmin = 'bcol_staff_admin'
+    BcolStaffAdmin = 'bcol_staff_admin',
+    ContactCentreStaff = 'contact_centre_staff'
 }
 
 export enum Pages {
@@ -456,6 +457,10 @@ 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 f7f90282d..a243d7035 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)
+    return this.currentUser.roles.includes(Role.Staff) || this.currentUser.roles.includes(Role.ContactCentreStaff)
   }
 
   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 f7f39eefa..7f355e560 100644
--- a/auth-web/src/views/auth/staff/ReviewAccountView.vue
+++ b/auth-web/src/views/auth/staff/ReviewAccountView.vue
@@ -62,40 +62,48 @@
               />
             </template>
 
-            <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>
+            <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>
                 </div>
               </div>
             </template>
diff --git a/auth-web/src/views/auth/staff/StaffDashboardView.vue b/auth-web/src/views/auth/staff/StaffDashboardView.vue
index b519ce446..cc18d022b 100644
--- a/auth-web/src/views/auth/staff/StaffDashboardView.vue
+++ b/auth-web/src/views/auth/staff/StaffDashboardView.vue
@@ -144,6 +144,7 @@
 
     <!-- Continuation Applications -->
     <v-card
+      v-can:VIEW_CONTINUATION_AUTHORIZATION_REVIEWS.hide
       flat
       class="mb-4 pa-8"
     >
@@ -287,7 +288,9 @@
     </BaseVExpansionPanel>
 
     <!-- Feature Launch Tiles: ie Involuntary Dissolution, Document Record Service -->
-    <v-row>
+    <v-row
+      v-can:VIEW_LAUNCH_TITLES.hide
+    >
       <v-col
         v-for="tile in launchTileConfig"
         :key="tile.title"
@@ -376,6 +379,7 @@ 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)),