mirror of
https://github.com/grafana/grafana.git
synced 2025-02-11 08:05:43 -06:00
* update eslint, tsconfig + esbuild to handle new jsx transform * remove thing that breaks the new jsx transform * remove react imports * adjust grafana-icons build * is this the correct syntax? * try this * well this was much easier than expected... * change grafana-plugin-configs webpack config * fixes * fix lockfile * fix 2 more violations * use path.resolve instead of require.resolve * remove react import * fix react imports * more fixes * remove React import * remove import React from docs * remove another react import
34 lines
1011 B
TypeScript
34 lines
1011 B
TypeScript
import { isIconName } from '@grafana/data';
|
|
import { Badge, Card, Icon } from '@grafana/ui';
|
|
|
|
import { UIMap } from '../constants';
|
|
import { getProviderUrl } from '../utils/url';
|
|
|
|
type Props = {
|
|
providerId: string;
|
|
enabled: boolean;
|
|
configPath?: string;
|
|
authType?: string;
|
|
onClick?: () => void;
|
|
};
|
|
|
|
export function ProviderCard({ providerId, enabled, configPath, authType, onClick }: Props) {
|
|
//@ts-expect-error
|
|
const url = getProviderUrl({ configPath, id: providerId });
|
|
const [iconName, displayName] = UIMap[providerId] || ['lock', providerId.toUpperCase()];
|
|
return (
|
|
<Card href={url} onClick={onClick}>
|
|
<Card.Heading>{displayName}</Card.Heading>
|
|
<Card.Meta>{authType}</Card.Meta>
|
|
{isIconName(iconName) && (
|
|
<Card.Figure>
|
|
<Icon name={iconName} size={'xxxl'} />
|
|
</Card.Figure>
|
|
)}
|
|
<Card.Actions>
|
|
<Badge text={enabled ? 'Enabled' : 'Not enabled'} color={enabled ? 'green' : 'blue'} />
|
|
</Card.Actions>
|
|
</Card>
|
|
);
|
|
}
|