From 2f5bea27b1ddaa12af77a42678d94b0569739627 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Thu, 23 Apr 2020 21:39:08 +0200
Subject: [PATCH] NewDataSourcePage: Restore signature badge lost in merge
 (#23832)

---
 public/app/core/components/Card/Card.tsx      | 13 ++++++-
 .../datasources/NewDataSourcePage.tsx         | 35 +++++--------------
 2 files changed, 20 insertions(+), 28 deletions(-)

diff --git a/public/app/core/components/Card/Card.tsx b/public/app/core/components/Card/Card.tsx
index 0a1ee07f175..54a679fa0fa 100644
--- a/public/app/core/components/Card/Card.tsx
+++ b/public/app/core/components/Card/Card.tsx
@@ -5,13 +5,23 @@ export interface CardProps {
   logoUrl?: string;
   title: string;
   description?: string;
+  labels?: React.ReactNode;
   actions?: React.ReactNode;
   onClick?: () => void;
   ariaLabel?: string;
   className?: string;
 }
 
-export const Card: React.FC<CardProps> = ({ logoUrl, title, description, actions, onClick, ariaLabel, className }) => {
+export const Card: React.FC<CardProps> = ({
+  logoUrl,
+  title,
+  description,
+  labels,
+  actions,
+  onClick,
+  ariaLabel,
+  className,
+}) => {
   const mainClassName = cx('add-data-source-item', className);
 
   return (
@@ -20,6 +30,7 @@ export const Card: React.FC<CardProps> = ({ logoUrl, title, description, actions
       <div className="add-data-source-item-text-wrapper">
         <span className="add-data-source-item-text">{title}</span>
         {description && <span className="add-data-source-item-desc">{description}</span>}
+        {labels && <div>{labels}</div>}
       </div>
       {actions && <div className="add-data-source-item-actions">{actions}</div>}
     </div>
diff --git a/public/app/features/datasources/NewDataSourcePage.tsx b/public/app/features/datasources/NewDataSourcePage.tsx
index 09b7e00dc3c..647a0356151 100644
--- a/public/app/features/datasources/NewDataSourcePage.tsx
+++ b/public/app/features/datasources/NewDataSourcePage.tsx
@@ -145,36 +145,17 @@ const DataSourceTypeCard: FC<DataSourceTypeCardProps> = props => {
           {!isPhantom && <Button>Select</Button>}
         </>
       }
-      className={isPhantom && 'add-data-source-item--phantom'}
-      onClick={onClick}
-      aria-label={e2e.pages.AddDataSource.selectors.dataSourcePlugins(plugin.name)}
-    >
-      <img className="add-data-source-item-logo" src={plugin.info.logos.small} />
-      <div className="add-data-source-item-text-wrapper">
-        <span className="add-data-source-item-text">{plugin.name}</span>
-        {plugin.info.description && <span className="add-data-source-item-desc">{plugin.info.description}</span>}
-        {!isPhantom && (
+      labels={
+        !isPhantom && (
           <div>
             <PluginSignatureBadge status={plugin.signature} />
           </div>
-        )}
-      </div>
-      <div className="add-data-source-item-actions">
-        {learnMoreLink && (
-          <LinkButton
-            variant="secondary"
-            href={`${learnMoreLink.url}?utm_source=grafana_add_ds`}
-            target="_blank"
-            rel="noopener"
-            onClick={onLearnMoreClick}
-            icon="external-link-alt"
-          >
-            {learnMoreLink.name}
-          </LinkButton>
-        )}
-        {!isPhantom && <Button>Select</Button>}
-      </div>
-    </Card>
+        )
+      }
+      className={isPhantom && 'add-data-source-item--phantom'}
+      onClick={onClick}
+      aria-label={e2e.pages.AddDataSource.selectors.dataSourcePlugins(plugin.name)}
+    />
   );
 };