mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
SAML UI: metric for provider card clicked (#70894)
provider card clicked
This commit is contained in:
parent
f274484727
commit
59be79b5f4
@ -12,6 +12,7 @@ import { StoreState } from 'app/types';
|
|||||||
import ConfigureAuthCTA from './components/ConfigureAuthCTA';
|
import ConfigureAuthCTA from './components/ConfigureAuthCTA';
|
||||||
import { ProviderCard } from './components/ProviderCard';
|
import { ProviderCard } from './components/ProviderCard';
|
||||||
import { loadSettings } from './state/actions';
|
import { loadSettings } from './state/actions';
|
||||||
|
import { AuthProviderInfo } from './types';
|
||||||
import { getProviderUrl } from './utils';
|
import { getProviderUrl } from './utils';
|
||||||
|
|
||||||
import { getRegisteredAuthProviders } from '.';
|
import { getRegisteredAuthProviders } from '.';
|
||||||
@ -70,6 +71,9 @@ export const AuthConfigPageUnconnected = ({ providerStatuses, isLoading, loadSet
|
|||||||
const onCTAClick = () => {
|
const onCTAClick = () => {
|
||||||
reportInteraction('authentication_ui_created', { provider: firstAvailableProvider?.type });
|
reportInteraction('authentication_ui_created', { provider: firstAvailableProvider?.type });
|
||||||
};
|
};
|
||||||
|
const onProviderCardClick = (provider: AuthProviderInfo) => {
|
||||||
|
reportInteraction('authentication_ui_provider_clicked', { provider: provider.type });
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Page navId="authentication" subTitle={subTitle}>
|
<Page navId="authentication" subTitle={subTitle}>
|
||||||
@ -86,6 +90,9 @@ export const AuthConfigPageUnconnected = ({ providerStatuses, isLoading, loadSet
|
|||||||
enabled={providerStatuses[provider.id]?.enabled}
|
enabled={providerStatuses[provider.id]?.enabled}
|
||||||
configFoundInIniFile={providerStatuses[provider.id]?.configFoundInIniFile}
|
configFoundInIniFile={providerStatuses[provider.id]?.configFoundInIniFile}
|
||||||
configPath={provider.configPath}
|
configPath={provider.configPath}
|
||||||
|
onClick={() => {
|
||||||
|
onProviderCardClick(provider);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
@ -16,6 +16,7 @@ type Props = {
|
|||||||
configPath?: string;
|
configPath?: string;
|
||||||
authType?: string;
|
authType?: string;
|
||||||
badges?: JSX.Element[];
|
badges?: JSX.Element[];
|
||||||
|
onClick?: () => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
export function ProviderCard({
|
export function ProviderCard({
|
||||||
@ -26,12 +27,13 @@ export function ProviderCard({
|
|||||||
configPath,
|
configPath,
|
||||||
authType,
|
authType,
|
||||||
badges,
|
badges,
|
||||||
|
onClick,
|
||||||
}: Props) {
|
}: Props) {
|
||||||
const styles = useStyles2(getStyles);
|
const styles = useStyles2(getStyles);
|
||||||
configPath = BASE_PATH + (configPath || providerId);
|
configPath = BASE_PATH + (configPath || providerId);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card href={configPath} className={styles.container}>
|
<Card href={configPath} className={styles.container} onClick={() => onClick && onClick()}>
|
||||||
<Card.Heading className={styles.name}>{displayName}</Card.Heading>
|
<Card.Heading className={styles.name}>{displayName}</Card.Heading>
|
||||||
{configFoundInIniFile && (
|
{configFoundInIniFile && (
|
||||||
<>
|
<>
|
||||||
|
Loading…
Reference in New Issue
Block a user