diff --git a/public/app/features/auth-config/ProviderConfigForm.test.tsx b/public/app/features/auth-config/ProviderConfigForm.test.tsx index 7404f016a4ed..ac76732075cc 100644 --- a/public/app/features/auth-config/ProviderConfigForm.test.tsx +++ b/public/app/features/auth-config/ProviderConfigForm.test.tsx @@ -103,6 +103,7 @@ describe('ProviderConfigForm', () => { { ...testConfig, settings: { + name: 'GitHub', allowedOrganizations: 'test-org1,test-org2', clientId: 'test-client-id', clientSecret: 'test-client-secret', diff --git a/public/app/features/auth-config/ProviderConfigPage.tsx b/public/app/features/auth-config/ProviderConfigPage.tsx index 4204344123d4..be1c5989c379 100644 --- a/public/app/features/auth-config/ProviderConfigPage.tsx +++ b/public/app/features/auth-config/ProviderConfigPage.tsx @@ -8,6 +8,7 @@ import { GrafanaRouteComponentProps } from 'app/core/navigation/types'; import { StoreState } from '../../types'; import { ProviderConfigForm } from './ProviderConfigForm'; +import { UIMap } from './constants'; import { loadProviders } from './state/actions'; import { SSOProvider } from './types'; @@ -21,9 +22,11 @@ const getPageNav = (config?: SSOProvider): NavModelItem => { }; } + const providerDisplayName = UIMap[config.provider][1] || config.provider.toUpperCase(); + return { - text: config.settings.name || '', - subTitle: `To configure ${config.settings.name} OAuth2 you must register your application with ${config.settings.name}. ${config.settings.name} will generate a Client ID and Client Secret for you to use.`, + text: providerDisplayName || '', + subTitle: `To configure ${providerDisplayName} OAuth2 you must register your application with ${providerDisplayName}. The provider will generate a Client ID and Client Secret for you to use.`, icon: config.settings.icon || 'shield', id: config.provider, }; diff --git a/public/app/features/auth-config/components/ProviderCard.tsx b/public/app/features/auth-config/components/ProviderCard.tsx index 69e36eb291d2..e7ddee445617 100644 --- a/public/app/features/auth-config/components/ProviderCard.tsx +++ b/public/app/features/auth-config/components/ProviderCard.tsx @@ -1,8 +1,9 @@ import React from 'react'; -import { IconName, isIconName } from '@grafana/data'; +import { isIconName } from '@grafana/data'; import { Badge, Card, Icon } from '@grafana/ui'; +import { UIMap } from '../constants'; import { getProviderUrl } from '../utils/url'; type Props = { @@ -13,17 +14,6 @@ type Props = { onClick?: () => void; }; -// TODO Remove when this is available from API -const UIMap: Record = { - github: ['github', 'GitHub'], - gitlab: ['gitlab', 'GitLab'], - google: ['google', 'Google'], - generic_oauth: ['lock', 'Generic OAuth'], - grafana_com: ['grafana', 'Grafana.com'], - azuread: ['microsoft', 'Azure AD'], - okta: ['okta', 'Okta'], -}; - export function ProviderCard({ providerId, enabled, configPath, authType, onClick }: Props) { //@ts-expect-error const url = getProviderUrl({ configPath, id: providerId }); diff --git a/public/app/features/auth-config/constants.ts b/public/app/features/auth-config/constants.ts index 1bd9e7d1c6ee..dd23c2fd8cb0 100644 --- a/public/app/features/auth-config/constants.ts +++ b/public/app/features/auth-config/constants.ts @@ -1 +1,14 @@ +import { IconName } from '@grafana/data'; + export const BASE_PATH = 'admin/authentication/'; + +// TODO Remove when this is available from API +export const UIMap: Record = { + github: ['github', 'GitHub'], + gitlab: ['gitlab', 'GitLab'], + google: ['google', 'Google'], + generic_oauth: ['lock', 'Generic OAuth'], + grafana_com: ['grafana', 'Grafana.com'], + azuread: ['microsoft', 'Azure AD'], + okta: ['okta', 'Okta'], +}; diff --git a/public/app/features/auth-config/fields.tsx b/public/app/features/auth-config/fields.tsx index 60431a4b8eac..813523ffd6be 100644 --- a/public/app/features/auth-config/fields.tsx +++ b/public/app/features/auth-config/fields.tsx @@ -8,11 +8,12 @@ import { isSelectableValue } from './utils/guards'; /** Map providers to their settings */ export const fields: Record> = { - github: ['clientId', 'clientSecret', 'teamIds', 'allowedOrganizations'], - google: ['clientId', 'clientSecret', 'allowedDomains'], - gitlab: ['clientId', 'clientSecret', 'allowedOrganizations', 'teamIds'], - azuread: ['clientId', 'clientSecret', 'authUrl', 'tokenUrl', 'scopes', 'allowedGroups', 'allowedDomains'], + github: ['name', 'clientId', 'clientSecret', 'teamIds', 'allowedOrganizations'], + google: ['name', 'clientId', 'clientSecret', 'allowedDomains'], + gitlab: ['name', 'clientId', 'clientSecret', 'allowedOrganizations', 'teamIds'], + azuread: ['name', 'clientId', 'clientSecret', 'authUrl', 'tokenUrl', 'scopes', 'allowedGroups', 'allowedDomains'], okta: [ + 'name', 'clientId', 'clientSecret', 'authUrl', @@ -221,7 +222,8 @@ export function fieldMap(provider: string): Record { }, name: { label: 'Display name', - description: 'Helpful if you use more than one identity providers or SSO protocols.', + description: + 'Will be displayed on the login page as "Sign in with ...". Helpful if you use more than one identity providers or SSO protocols.', type: 'text', }, allowSignUp: { @@ -313,17 +315,17 @@ export function fieldMap(provider: string): Record { }, tlsClientCa: { label: 'TLS client ca', - description: 'The path to the trusted certificate authority list. Is not applicable on Grafana Cloud.', + description: 'The file path to the trusted certificate authority list. Is not applicable on Grafana Cloud.', type: 'text', }, tlsClientCert: { label: 'TLS client cert', - description: 'The path to the certificate. Is not applicable on Grafana Cloud.', + description: 'The file path to the certificate. Is not applicable on Grafana Cloud.', type: 'text', }, tlsClientKey: { label: 'TLS client key', - description: 'The path to the key. Is not applicable on Grafana Cloud.', + description: 'The file path to the key. Is not applicable on Grafana Cloud.', type: 'text', }, tlsSkipVerifyInsecure: {