hide actions and pages in the frontend according to permissions

resources/js/Components/Common/Member/MemberMoreOptionsDropdown.vue

@@ -2,6 +2,7 @@
 import Dropdown from '@/Components/Dropdown.vue';
 import { TrashIcon } from '@heroicons/vue/20/solid';
 import type { Member } from '@/utils/api';
+import { canDeleteMembers } from '@/utils/permissions';
 
 const emit = defineEmits<{
     delete: [];
@@ -31,6 +32,7 @@ const props = defineProps<{
         </template>
         <template #content>
             <button
+                v-if="canDeleteMembers()"
                 @click="emit('delete')"
                 :aria-label="'Delete Member ' + props.member.name"
                 data-testid="client_delete"

resources/js/Components/Common/Member/MemberTableRow.vue

@@ -9,6 +9,7 @@ import SecondaryButton from '@/Components/SecondaryButton.vue';
 import { api } from '../../../../../openapi.json.client';
 import { getCurrentOrganizationId } from '@/utils/useUser';
 import { useNotificationsStore } from '@/utils/notification';
+import { canInvitePlaceholderMembers } from '@/utils/permissions';
 
 const props = defineProps<{
     member: Member;
@@ -70,7 +71,10 @@ async function invitePlaceholder(id: string) {
         <div
             class="relative whitespace-nowrap flex items-center pl-3 text-right text-sm font-medium sm:pr-0 pr-4 sm:pr-6 lg:pr-8 3xl:pr-12">
             <SecondaryButton
-                v-if="member.is_placeholder === true"
+                v-if="
+                    member.is_placeholder === true &&
+                    canInvitePlaceholderMembers()
+                "
                 @click="invitePlaceholder(member.id)"
                 size="small"
                 >Invite</SecondaryButton