disable "add vault" button if role is missing

frontend/src/components/VaultList.vue

@@ -40,7 +40,7 @@
 
     <Menu as="div" class="relative inline-block text-left">
       <div>
-        <MenuButton :disabled="isLicenseViolated" class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary hover:bg-primary-d1 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary" :class="{ 'cursor-not-allowed opacity-50': isLicenseViolated }">
+        <MenuButton :disabled="isLicenseViolated || !canCreateVaults" class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary hover:bg-primary-d1 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary" :class="{ 'cursor-not-allowed opacity-50': isLicenseViolated || !canCreateVaults }">
           {{ t('vaultList.addVault') }}
           <ChevronDownIcon class="-mr-1 ml-2 h-5 w-5" aria-hidden="true" />
         </MenuButton>
@@ -148,6 +148,7 @@ const roleOfSelectedVault = computed<VaultRole | 'NONE'>(() => {
 });
 
 const isAdmin = ref<boolean>();
+const canCreateVaults = ref<boolean>();
 const licenseStatus = ref<LicenseUserInfoDto>();
 const isLicenseViolated = computed(() => {
   if (licenseStatus.value) {
@@ -178,6 +179,7 @@ async function fetchData() {
   onFetchError.value = null;
   try {
     isAdmin.value = (await auth).hasRole('admin');
+    canCreateVaults.value = (await auth).hasRole('create-vaults');
 
     if (isAdmin.value) {
       filterOptions.value['allVaults'] = t('vaultList.filter.entry.allVaults');