diff --git a/public/app/features/dashboard/components/VizTypePicker/PanelTypeCard.tsx b/public/app/features/dashboard/components/VizTypePicker/PanelTypeCard.tsx index 1b8ad247be0..649809406da 100644 --- a/public/app/features/dashboard/components/VizTypePicker/PanelTypeCard.tsx +++ b/public/app/features/dashboard/components/VizTypePicker/PanelTypeCard.tsx @@ -12,6 +12,7 @@ interface Props { onDelete?: () => void; disabled?: boolean; showBadge?: boolean; + description?: string; } export const PanelTypeCard: React.FC = ({ @@ -22,6 +23,7 @@ export const PanelTypeCard: React.FC = ({ onDelete, disabled, showBadge, + description, }) => { const styles = useStyles2(getStyles); const cssClass = cx({ @@ -41,6 +43,7 @@ export const PanelTypeCard: React.FC = ({
{title}
+ {description ? {description} : null}
{showBadge && (
@@ -109,6 +112,15 @@ const getStyles = (theme: GrafanaThemeV2) => { padding: 0 10px; width: 100%; `, + description: css` + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + font-size: ${theme.typography.bodySmall.fontSize}; + font-weight: ${theme.typography.fontWeightLight}; + padding: 0 ${theme.spacing(1.25)}; + width: 100%; + `, img: css` max-height: 38px; width: 38px; diff --git a/public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx b/public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx index 01d22c8c3a1..c06f1bbc534 100644 --- a/public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx +++ b/public/app/features/library-panels/components/LibraryPanelCard/LibraryPanelCard.tsx @@ -1,7 +1,8 @@ import React, { useState } from 'react'; import { PanelPluginMeta } from '@grafana/data'; -import { LibraryPanelDTO } from '../../types'; import { config } from '@grafana/runtime'; + +import { LibraryPanelDTO } from '../../types'; import { PanelTypeCard } from 'app/features/dashboard/components/VizTypePicker/PanelTypeCard'; import { DeleteLibraryPanelModal } from '../DeleteLibraryPanelModal/DeleteLibraryPanelModal'; @@ -18,7 +19,6 @@ export const LibraryPanelCard: React.FC { - //const styles = useStyles(getStyles); const [showDeletionModal, setShowDeletionModal] = useState(false); const onDeletePanel = () => { @@ -33,38 +33,11 @@ export const LibraryPanelCard: React.FC onClick(libraryPanel)} onDelete={showSecondaryActions ? () => setShowDeletionModal(true) : undefined} /> - {/* - - - - - -
- - {libraryPanel.meta.connectedDashboards} -
-
- - Last edited {formatDate?.(libraryPanel.meta.updated ?? '') ?? libraryPanel.meta.updated} by{' '} - {libraryPanel.meta.updatedBy.name} - -
- {children && {children}} - {showSecondaryActions && ( - - setShowDeletionModal(true)} - /> - - )} -
*/} {showDeletionModal && ( ); }; - -// const getStyles = (theme: GrafanaTheme) => { -// return { -// tooltip: css` -// display: inline; -// `, -// detailIcon: css` -// margin-right: 0.5ch; -// `, -// panelIcon: css` -// color: ${theme.colors.textWeak}; -// `, -// tagList: css` -// align-self: center; -// `, -// }; -// };