From f1a22a8ea9a1148033e39d808fa0e8fc662bb9bc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 27 Jun 2025 11:40:03 +0200 Subject: [PATCH] Enterprise: Links that inform about enterprise auth options (#106627) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Enterprise: Links that inform about enterprise auth options * Update * fix¨ * Update links * brand color badge * update language * Update * Update --- go.work.sum | 20 +++++++ .../grafana-ui/src/components/Badge/Badge.tsx | 8 ++- .../Branding/CloudEnterpriseBadge.tsx | 32 +++++++++++ .../auth-config/AuthProvidersListPage.tsx | 8 ++- .../auth-config/components/ProviderCard.tsx | 55 ++++++++++++++++++- public/locales/en-US/grafana.json | 3 + 6 files changed, 123 insertions(+), 3 deletions(-) create mode 100644 public/app/core/components/Branding/CloudEnterpriseBadge.tsx diff --git a/go.work.sum b/go.work.sum index 7858caf4b04..d8d89004da0 100644 --- a/go.work.sum +++ b/go.work.sum @@ -777,11 +777,24 @@ github.com/aws/aws-sdk-go v1.40.45/go.mod h1:585smgzpB/KqRA+K3y/NL/oYRqQvpNJYvLm github.com/aws/aws-sdk-go-v2 v0.18.0/go.mod h1:JWVYvqSMppoMJC0x5wdwiImzgXTI9FuZwxzkQq9wy+g= github.com/aws/aws-sdk-go-v2 v1.9.1/go.mod h1:cK/D0BBs0b/oWPIcX/Z/obahJK1TT7IPVjy53i/mX/4= github.com/aws/aws-sdk-go-v2 v1.36.0/go.mod h1:5PMILGVKiW32oDzjj6RU52yrNrDPUHcbZQYr1sM7qmM= +github.com/aws/aws-sdk-go-v2 v1.36.3 h1:mJoei2CxPutQVxaATCzDUjcZEjVRdpsiiXi2o38yqWM= github.com/aws/aws-sdk-go-v2 v1.36.3/go.mod h1:LLXuLpgzEbD766Z5ECcRmi8AzSwfZItDtmABVkRLGzg= +github.com/aws/aws-sdk-go-v2/aws/protocol/eventstream v1.6.3 h1:tW1/Rkad38LA15X4UQtjXZXNKsCgkshC3EbmcUmghTg= +github.com/aws/aws-sdk-go-v2/aws/protocol/eventstream v1.6.3/go.mod h1:UbnqO+zjqk3uIt9yCACHJ9IVNhyhOCnYk8yA19SAWrM= +github.com/aws/aws-sdk-go-v2/config v1.29.4 h1:ObNqKsDYFGr2WxnoXKOhCvTlf3HhwtoGgc+KmZ4H5yg= +github.com/aws/aws-sdk-go-v2/config v1.29.4/go.mod h1:j2/AF7j/qxVmsNIChw1tWfsVKOayJoGRDjg1Tgq7NPk= +github.com/aws/aws-sdk-go-v2/credentials v1.17.66 h1:aKpEKaTy6n4CEJeYI1MNj97oSDLi4xro3UzQfwf5RWE= +github.com/aws/aws-sdk-go-v2/credentials v1.17.66/go.mod h1:xQ5SusDmHb/fy55wU0QqTy0yNfLqxzec59YcsRZB+rI= +github.com/aws/aws-sdk-go-v2/internal/configsources v1.3.34 h1:ZK5jHhnrioRkUNOc+hOgQKlUL5JeC3S6JgLxtQ+Rm0Q= github.com/aws/aws-sdk-go-v2/internal/configsources v1.3.34/go.mod h1:p4VfIceZokChbA9FzMbRGz5OV+lekcVtHlPKEO0gSZY= +github.com/aws/aws-sdk-go-v2/internal/endpoints/v2 v2.6.34 h1:SZwFm17ZUNNg5Np0ioo/gq8Mn6u9w19Mri8DnJ15Jf0= github.com/aws/aws-sdk-go-v2/internal/endpoints/v2 v2.6.34/go.mod h1:dFZsC0BLo346mvKQLWmoJxT+Sjp+qcVR1tRVHQGOH9Q= +github.com/aws/aws-sdk-go-v2/internal/ini v1.8.2 h1:Pg9URiobXy85kgFev3og2CuOZ8JZUBENF+dcgWBaYNk= +github.com/aws/aws-sdk-go-v2/internal/ini v1.8.2/go.mod h1:FbtygfRFze9usAadmnGJNc8KsP346kEe+y2/oyhGAGc= github.com/aws/aws-sdk-go-v2/service/cloudwatch v1.8.1/go.mod h1:CM+19rL1+4dFWnOQKwDc7H1KwXTz+h61oUSHyhV0b3o= +github.com/aws/aws-sdk-go-v2/service/internal/accept-encoding v1.12.3 h1:eAh2A4b5IzM/lum78bZ590jy36+d/aFLgKF/4Vd1xPE= github.com/aws/aws-sdk-go-v2/service/internal/accept-encoding v1.12.3/go.mod h1:0yKJC/kb8sAnmlYa6Zs3QVYqaC8ug2AbnNChv5Ox3uA= +github.com/aws/aws-sdk-go-v2/service/internal/presigned-url v1.12.15 h1:dM9/92u2F1JbDaGooxTq18wmmFzbJRfXfVfy96/1CXM= github.com/aws/aws-sdk-go-v2/service/internal/presigned-url v1.12.15/go.mod h1:SwFBy2vjtA0vZbjjaFtfN045boopadnoVPhu4Fv66vY= github.com/aws/aws-sdk-go-v2/service/kms v1.35.3 h1:UPTdlTOwWUX49fVi7cymEN6hDqCwe3LNv1vi7TXUutk= github.com/aws/aws-sdk-go-v2/service/kms v1.35.3/go.mod h1:gjDP16zn+WWalyaUqwCCioQ8gU8lzttCCc9jYsiQI/8= @@ -793,7 +806,10 @@ github.com/aws/aws-sdk-go-v2/service/sqs v1.34.3 h1:Vjqy5BZCOIsn4Pj8xzyqgGmsSqzz github.com/aws/aws-sdk-go-v2/service/sqs v1.34.3/go.mod h1:L0enV3GCRd5iG9B64W35C4/hwsCB00Ib+DKVGTadKHI= github.com/aws/aws-sdk-go-v2/service/ssm v1.52.4 h1:hgSBvRT7JEWx2+vEGI9/Ld5rZtl7M5lu8PqdvOmbRHw= github.com/aws/aws-sdk-go-v2/service/ssm v1.52.4/go.mod h1:v7NIzEFIHBiicOMaMTuEmbnzGnqW0d+6ulNALul6fYE= +github.com/aws/aws-sdk-go-v2/service/sts v1.33.18 h1:xz7WvTMfSStb9Y8NpCT82FXLNC3QasqBfuAFHY4Pk5g= +github.com/aws/aws-sdk-go-v2/service/sts v1.33.18/go.mod h1:cQnB8CUnxbMU82JvlqjKR2HBOm3fe9pWorWBza6MBJ4= github.com/aws/smithy-go v1.8.0/go.mod h1:SObp3lf9smib00L/v3U2eAKG8FyQ7iLrJnQiAmR5n+E= +github.com/aws/smithy-go v1.22.2 h1:6D9hW43xKFrRx/tXXfAlIZc4JI+yQe6snnWcQyxSyLQ= github.com/aws/smithy-go v1.22.2/go.mod h1:irrKGvNn1InZwb2d7fkIRNucdfwR8R+Ts3wxYa/cJHg= github.com/aymanbagabas/go-udiff v0.2.0 h1:TK0fH4MteXUDspT88n8CKzvK0X9O2xu9yQjWpi6yML8= github.com/aymanbagabas/go-udiff v0.2.0/go.mod h1:RE4Ex0qsGkTAJoQdQQCA0uG+nAzJO/pI/QwceO5fgrA= @@ -1313,6 +1329,8 @@ github.com/grafana/gomemcache v0.0.0-20250228145437-da7b95fd2ac1/go.mod h1:j/s0j github.com/grafana/grafana-app-sdk/logging v0.38.0/go.mod h1:Y/bvbDhBiV/tkIle9RW49pgfSPIPSON8Q4qjx3pyqDk= github.com/grafana/grafana-app-sdk/logging v0.39.0 h1:3GgN5+dUZYqq74Q+GT9/ET+yo+V54zWQk/Q2/JsJQB4= github.com/grafana/grafana-app-sdk/logging v0.39.0/go.mod h1:WhDENSnaGHtyVVwZGVnAR7YLvh2xlLDYR3D7E6h7XVk= +github.com/grafana/grafana-aws-sdk v0.38.2 h1:TzQD0OpWsNjtldi5G5TLDlBRk8OyDf+B5ujcoAu4Dp0= +github.com/grafana/grafana-aws-sdk v0.38.2/go.mod h1:j3vi+cXYHEFqjhBGrI6/lw1TNM+dl0Y3f0cSnDOPy+s= github.com/grafana/grafana-plugin-sdk-go v0.263.0/go.mod h1:U43Cnrj/9DNYyvFcNdeUWNjMXTKNB0jcTcQGpWKd2gw= github.com/grafana/grafana-plugin-sdk-go v0.267.0/go.mod h1:OuwS4c/JYgn0rr/w5zhJBpLo4gKm/vw15RsfpYAvK9Q= github.com/grafana/grafana-plugin-sdk-go v0.269.1/go.mod h1:yv2KbO4mlr9WuDK2f+2gHAMTwwLmLuqaEnrPXTRU+OI= @@ -1340,6 +1358,8 @@ github.com/grafana/prometheus-alertmanager v0.25.1-0.20240930132144-b5e64e81e8d3 github.com/grafana/prometheus-alertmanager v0.25.1-0.20240930132144-b5e64e81e8d3/go.mod h1:YeND+6FDA7OuFgDzYODN8kfPhXLCehcpxe4T9mdnpCY= github.com/grafana/prometheus-alertmanager v0.25.1-0.20250331083058-4563aec7a975 h1:4/BZkGObFWZf4cLbE2Vqg/1VTz67Q0AJ7LHspWLKJoQ= github.com/grafana/prometheus-alertmanager v0.25.1-0.20250331083058-4563aec7a975/go.mod h1:FGdGvhI40Dq+CTQaSzK9evuve774cgOUdGfVO04OXkw= +github.com/grafana/sqlds/v4 v4.2.0 h1:7qZmuTzLMZFtszX14NyefU3R6WVtx27i7WduRDLKKOE= +github.com/grafana/sqlds/v4 v4.2.0/go.mod h1:OyEREvYCd2U/qXiIK/iprQ/4VUF2TTemIixFdUeGsOc= github.com/grafana/tail v0.0.0-20230510142333-77b18831edf0 h1:bjh0PVYSVVFxzINqPFYJmAmJNrWPgnVjuSdYJGHmtFU= github.com/grafana/tail v0.0.0-20230510142333-77b18831edf0/go.mod h1:7t5XR+2IA8P2qggOAHTj/GCZfoLBle3OvNSYh1VkRBU= github.com/gregjones/httpcache v0.0.0-20190611155906-901d90724c79 h1:+ngKgrYPPJrOjhax5N+uePQ0Fh1Z7PheYoUI/0nzkPA= diff --git a/packages/grafana-ui/src/components/Badge/Badge.tsx b/packages/grafana-ui/src/components/Badge/Badge.tsx index e3b3162aec9..f28f4d35a1d 100644 --- a/packages/grafana-ui/src/components/Badge/Badge.tsx +++ b/packages/grafana-ui/src/components/Badge/Badge.tsx @@ -13,7 +13,7 @@ import { Icon } from '../Icon/Icon'; import { Tooltip } from '../Tooltip/Tooltip'; import { PopoverContent } from '../Tooltip/types'; -export type BadgeColor = 'blue' | 'red' | 'green' | 'orange' | 'purple' | 'darkgrey'; +export type BadgeColor = 'blue' | 'red' | 'green' | 'orange' | 'purple' | 'darkgrey' | 'brand'; export interface BadgeProps extends HTMLAttributes { text?: React.ReactNode; @@ -71,6 +71,12 @@ const getStyles = (theme: GrafanaTheme2, color: BadgeColor) => { textColor = tinycolor(sourceColor).darken(20).toString(); } + if (color === 'brand') { + bgColor = theme.colors.gradients.brandHorizontal; + borderColor = 'transparent'; + textColor = theme.colors.primary.contrastText; + } + return { wrapper: css({ display: 'inline-flex', diff --git a/public/app/core/components/Branding/CloudEnterpriseBadge.tsx b/public/app/core/components/Branding/CloudEnterpriseBadge.tsx new file mode 100644 index 00000000000..a904417053c --- /dev/null +++ b/public/app/core/components/Branding/CloudEnterpriseBadge.tsx @@ -0,0 +1,32 @@ +import { css } from '@emotion/css'; + +import { GrafanaTheme2 } from '@grafana/data'; +import { Trans } from '@grafana/i18n'; +import { Icon, useStyles2 } from '@grafana/ui'; + +export function CloudEnterpriseBadge() { + const styles = useStyles2(getStyles); + return ( +
+ + Cloud & Enterprise +
+ ); +} + +const getStyles = (theme: GrafanaTheme2) => { + return { + wrapper: css({ + display: 'inline-flex', + padding: theme.spacing(0.5, 1), + borderRadius: theme.shape.radius.pill, + background: theme.colors.gradients.brandHorizontal, + color: theme.colors.primary.contrastText, + fontWeight: theme.typography.fontWeightMedium, + gap: theme.spacing(0.5), + fontSize: theme.typography.bodySmall.fontSize, + lineHeight: theme.typography.bodySmall.lineHeight, + alignItems: 'center', + }), + }; +}; diff --git a/public/app/features/auth-config/AuthProvidersListPage.tsx b/public/app/features/auth-config/AuthProvidersListPage.tsx index 65d4f595f26..d0ae5e73ab7 100644 --- a/public/app/features/auth-config/AuthProvidersListPage.tsx +++ b/public/app/features/auth-config/AuthProvidersListPage.tsx @@ -11,7 +11,7 @@ import { StoreState } from 'app/types'; import AuthDrawer from './AuthDrawer'; import ConfigureAuthCTA from './components/ConfigureAuthCTA'; -import { ProviderCard } from './components/ProviderCard'; +import { ProviderCard, ProviderSAMLCard, ProviderSCIMCard } from './components/ProviderCard'; import { loadSettings } from './state/actions'; import { getRegisteredAuthProviders } from './index'; @@ -120,6 +120,12 @@ export const AuthConfigPageUnconnected = ({ configPath={settings.configPath} /> ))} + {config.buildInfo.edition === GrafanaEdition.OpenSource && ( + <> + + + + )} {showDrawer && setShowDrawer(false)}>} )} diff --git a/public/app/features/auth-config/components/ProviderCard.tsx b/public/app/features/auth-config/components/ProviderCard.tsx index f8495a5aa06..cb83ca8f28b 100644 --- a/public/app/features/auth-config/components/ProviderCard.tsx +++ b/public/app/features/auth-config/components/ProviderCard.tsx @@ -1,6 +1,7 @@ import { isIconName } from '@grafana/data'; import { t } from '@grafana/i18n'; -import { Badge, Card, Icon } from '@grafana/ui'; +import { Badge, Card, Icon, TextLink } from '@grafana/ui'; +import { CloudEnterpriseBadge } from 'app/core/components/Branding/CloudEnterpriseBadge'; import { UIMap } from '../constants'; import { getProviderUrl } from '../utils/url'; @@ -39,3 +40,55 @@ export function ProviderCard({ providerId, enabled, configPath, authType, onClic ); } + +export function ProviderSAMLCard() { + return ( + + {/* eslint-disable-next-line @grafana/i18n/no-untranslated-strings */} + SAML + + + {t('auth-config.provider-card.saml-learn-more', 'Single sign-on (SSO) with SAML.')} + + + + + + + + + + ); +} + +export function ProviderSCIMCard() { + return ( + + {/* eslint-disable-next-line @grafana/i18n/no-untranslated-strings */} + SCIM + +
+ + {t('auth-config.provider-card.scim-learn-more', ' Sync users and teams with SCIM.')} + +
+ + + + + + + + + ); +} diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index c4b99447c32..09b160ef067 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -3222,6 +3222,8 @@ } }, "provider-card": { + "saml-learn-more": "Single sign-on (SSO) with SAML.", + "scim-learn-more": " Sync users and teams with SCIM.", "text-badge-enabled": "Enabled", "text-badge-not-enabled": "Not enabled" }, @@ -3886,6 +3888,7 @@ "close-button": { "tooltip": "Close" }, + "cloud-enterprise-feature-badge": "Cloud & Enterprise ", "combobox": { "async": { "error": "An error occurred while loading options."