OTel quicksetup: Disable option to create passwords without permissions

CMK-34207

Change-Id: Ib49f5eb8634b0310aeeb180cf5cc3a453fabd072
(cherry picked from commit b215f1a)

Author: rseltmann

packages/cmk-frontend-vue/src/mode-otel/ModeCreateOTelConfApp.vue

@@ -51,6 +51,7 @@ const props = defineProps<{
   event_console_allowed: boolean
   collector_activation_allowed: boolean
   metric_backend_allowed: boolean
+  may_create_password: boolean
   overview_url: string
   cloud_grpc_receiver_endpoint?: string | null
   cloud_http_receiver_endpoint?: string | null
@@ -390,6 +391,7 @@ async function onSaveClick(): Promise<void> {
           :endpoint-config-allowed="endpoint_config_allowed"
           :encryption-allowed="encryption_allowed"
           :event-console-allowed="event_console_allowed"
+          :may-create-password="may_create_password"
           :grpc-default-port="GRPC_DEFAULT_PORT"
           :http-default-port="HTTP_DEFAULT_PORT"
         />

packages/cmk-frontend-vue/src/mode-otel/otel-configuration-steps/CollectorAuthConfig.vue

@@ -10,6 +10,7 @@ import usei18n from '@/lib/i18n'
 import useId from '@/lib/useId'
 
 import CmkDropdown from '@/components/CmkDropdown/CmkDropdown.vue'
+import CmkHelpText from '@/components/CmkHelpText.vue'
 import CmkLabel from '@/components/CmkLabel.vue'
 import type { Suggestion } from '@/components/CmkSuggestions'
 import CmkInlineButton from '@/components/user-input/CmkInlineButton.vue'
@@ -30,6 +31,7 @@ const props = defineProps<{
   noAuthAllowed: boolean
   availablePasswords: Suggestion[]
   showErrors: boolean
+  mayCreatePassword: boolean
 }>()
 
 const emit = defineEmits<{ createPassword: [] }>()
@@ -128,7 +130,25 @@ const passwordErrors = computed<string[]>(() => {
           :form-validation="passwordErrors.length > 0"
           :no-elements-text="_t('No passwords available')"
         />
-        <CmkInlineButton @click="emit('createPassword')">{{ _t('Create') }}</CmkInlineButton>
+        <CmkInlineButton :disabled="!mayCreatePassword" @click="emit('createPassword')">{{
+          _t('Create')
+        }}</CmkInlineButton>
+        <CmkHelpText
+          v-if="!mayCreatePassword"
+          :aria-label="_t('Why is creating a password unavailable?')"
+          :help="
+            _t(
+              'Creating a new password is not available for your account. ' +
+                'All of the following are required:' +
+                '<ul>' +
+                '<li>The permission \'Make changes, perform actions\'.</li>' +
+                '<li>The permission \'Password management\'.</li>' +
+                '<li>Either the permission \'Write access to all passwords\', ' +
+                'or membership in a contact group that could own the new password.</li>' +
+                '</ul>'
+            )
+          "
+        />
       </div>
       <CmkInlineValidation v-if="passwordErrors.length" :validation="passwordErrors" />
     </div>

packages/cmk-frontend-vue/src/mode-otel/otel-configuration-steps/ConfigureCollector.vue

@@ -33,6 +33,7 @@ const props = defineProps<{
   endpointConfigAllowed: boolean
   encryptionAllowed: boolean
   eventConsoleAllowed: boolean
+  mayCreatePassword: boolean
   grpcDefaultPort: number
   httpDefaultPort: number
 }>()
@@ -279,6 +280,7 @@ defineExpose({ validate, onPasswordCreated })
               :no-auth-allowed="noAuthAllowed"
               :available-passwords="availablePasswords"
               :show-errors="displayErrors"
+              :may-create-password="mayCreatePassword"
               @create-password="openPasswordSlideIn('grpc')"
             />
             <CollectorConnectionOptions
@@ -318,6 +320,7 @@ defineExpose({ validate, onPasswordCreated })
               :no-auth-allowed="noAuthAllowed"
               :available-passwords="availablePasswords"
               :show-errors="displayErrors"
+              :may-create-password="mayCreatePassword"
               @create-password="openPasswordSlideIn('http')"
             />
             <CollectorConnectionOptions

packages/cmk-frontend-vue/tests/mode-otel/ConfigureCollector.test.ts

@@ -37,7 +37,8 @@ function renderComponent(
   grpcDefaultPort = 4317,
   httpDefaultPort = 4318,
   initialGrpcEnabled = true,
-  initialHttpEnabled = false
+  initialHttpEnabled = false,
+  mayCreatePassword = true
 ) {
   const grpcEnabled = ref<boolean>(initialGrpcEnabled)
   const httpEnabled = ref<boolean>(initialHttpEnabled)
@@ -89,9 +90,10 @@ function renderComponent(
         encryptionAllowed,
         eventConsoleAllowed,
         grpcDefaultPort,
-        httpDefaultPort
+        httpDefaultPort,
+        mayCreatePassword
       }),
-      template: `<ConfigureCollector ref="compRef" :no-auth-allowed="noAuthAllowed" :endpoint-config-allowed="endpointConfigAllowed" :encryption-allowed="encryptionAllowed" :event-console-allowed="eventConsoleAllowed" :grpc-default-port="grpcDefaultPort" :http-default-port="httpDefaultPort" v-model:grpc-enabled="grpcEnabled" v-model:http-enabled="httpEnabled" v-model:grpc-auth="grpcAuth" v-model:http-auth="httpAuth" v-model:grpc-endpoint="grpcEndpoint" v-model:http-endpoint="httpEndpoint" v-model:grpc-encryption="grpcEncryption" v-model:http-encryption="httpEncryption" v-model:grpc-event-console="grpcEventConsole" v-model:http-event-console="httpEventConsole" v-model:pending-passwords="pendingPasswords" v-model:available-passwords="availablePasswords" />`
+      template: `<ConfigureCollector ref="compRef" :no-auth-allowed="noAuthAllowed" :endpoint-config-allowed="endpointConfigAllowed" :encryption-allowed="encryptionAllowed" :event-console-allowed="eventConsoleAllowed" :may-create-password="mayCreatePassword" :grpc-default-port="grpcDefaultPort" :http-default-port="httpDefaultPort" v-model:grpc-enabled="grpcEnabled" v-model:http-enabled="httpEnabled" v-model:grpc-auth="grpcAuth" v-model:http-auth="httpAuth" v-model:grpc-endpoint="grpcEndpoint" v-model:http-endpoint="httpEndpoint" v-model:grpc-encryption="grpcEncryption" v-model:http-encryption="httpEncryption" v-model:grpc-event-console="grpcEventConsole" v-model:http-event-console="httpEventConsole" v-model:pending-passwords="pendingPasswords" v-model:available-passwords="availablePasswords" />`
     })
   )
 
@@ -766,6 +768,29 @@ describe('ConfigureCollector', () => {
     })
   })
 
+  describe('password creation permission', () => {
+    test('Create button is enabled and no hint is shown when password creation is allowed', async () => {
+      mockPasswordsResponse()
+      // noAuthAllowed=false makes basicauth the default, so the Create button is rendered
+      renderComponent(false, true, true, true, 4317, 4318, true, false, true)
+
+      const createButton = await screen.findByRole('button', { name: 'Create' })
+      expect(createButton).toBeEnabled()
+      expect(
+        screen.queryByLabelText('Why is creating a password unavailable?')
+      ).not.toBeInTheDocument()
+    })
+
+    test('Create button is disabled and a hint is shown when password creation is not allowed', async () => {
+      mockPasswordsResponse()
+      renderComponent(false, true, true, true, 4317, 4318, true, false, false)
+
+      const createButton = await screen.findByRole('button', { name: 'Create' })
+      expect(createButton).toBeDisabled()
+      expect(screen.getByLabelText('Why is creating a password unavailable?')).toBeInTheDocument()
+    })
+  })
+
   describe('enabled/disabled tab behaviour', () => {
     test('validate() returns false when both tabs are disabled', async () => {
       mockPasswordsResponse()