only admin can create, edit or delete project_branding entries

admin/src/components/ProjectBranding/ProjectBrandingItem.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="project-branding-item">
-    <BRow :title="item.description" @click="details = !details">
+    <BRow :title="item.description" @click="toggleDetails">
       <BCol cols="3">
         {{ item.name }}
         <br />
@@ -27,7 +27,7 @@
       <BCol cols="3" class="me-2">
         <img class="img-fluid" :src="item.logoUrl" :alt="item.logoUrl" />
       </BCol>
-      <BCol cols="1">
+      <BCol v-if="store.state.moderator.roles.includes('ADMIN')" cols="1">
         <BButton v-b-tooltip.hover variant="danger" :title="$t('delete')" @click.stop="deleteItem">
           <i class="fas fa-trash-alt"></i>
         </BButton>
@@ -47,12 +47,14 @@
 import { computed, ref, toRefs } from 'vue'
 import ProjectBrandingForm from './ProjectBrandingForm.vue'
 import { useI18n } from 'vue-i18n'
+import { useStore } from 'vuex'
 import { useMutation } from '@vue/apollo-composable'
 import CONFIG from '@/config'
 import gql from 'graphql-tag'
 import { useAppToast } from '@/composables/useToast'
 
 const { t } = useI18n()
+const store = useStore()
 const { toastSuccess, toastError } = useAppToast()
 
 const props = defineProps({
@@ -78,6 +80,12 @@ async function copyToClipboard(text) {
   }
 }
 
+function toggleDetails() {
+  if (store.state.moderator.roles.includes('ADMIN')) {
+    details.value = !details.value
+  }
+}
+
 function update(form) {
   details.value = false
   const { mutate } = useMutation(gql`

admin/src/pages/ProjectBranding.vue

@@ -4,6 +4,7 @@
       <span class="h2">{{ $t('projectBranding.title') }}</span>
       <div>
         <BButton
+          v-if="store.state.moderator.roles.includes('ADMIN')"
           variant="primary"
           data-test="project-branding-add-btn"
           font-scale="2"
@@ -32,7 +33,9 @@
           {{ $t('projectBranding.newUserToSpace') }}
         </BCol>
         <BCol cols="3">{{ $t('logo') }}</BCol>
-        <BCol cols="1">{{ $t('actions') }}</BCol>
+        <BCol v-if="store.state.moderator.roles.includes('ADMIN')" cols="1">
+          {{ $t('actions') }}
+        </BCol>
       </BRow>
       <BListGroupItem v-for="item in projectBrandings" :key="item.id">
         <project-branding-item
@@ -48,10 +51,12 @@
 <script setup>
 import { computed, watch, ref } from 'vue'
 import { useQuery } from '@vue/apollo-composable'
+import { useStore } from 'vuex'
 import { useAppToast } from '@/composables/useToast'
 import gql from 'graphql-tag'
 
 const { toastError } = useAppToast()
+const store = useStore()
 
 const { result, loading, refetch, error } = useQuery(
   gql`