From 85072b78a4edf947a3d1b9a1f5269474f6455076 Mon Sep 17 00:00:00 2001
From: okhowang <3352585+okhowang@users.noreply.github.com>
Date: Thu, 2 Jan 2020 17:36:15 +0800
Subject: [PATCH] Fix: tooltips value disappear when label has too long word
 (#21267)

---
 .../src/components/Graph/GraphTooltip/SeriesTable.tsx        | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/grafana-ui/src/components/Graph/GraphTooltip/SeriesTable.tsx b/packages/grafana-ui/src/components/Graph/GraphTooltip/SeriesTable.tsx
index 96da578b48d..efa6ec2dc94 100644
--- a/packages/grafana-ui/src/components/Graph/GraphTooltip/SeriesTable.tsx
+++ b/packages/grafana-ui/src/components/Graph/GraphTooltip/SeriesTable.tsx
@@ -26,6 +26,9 @@ const getSeriesTableRowStyles = stylesFactory((theme: GrafanaTheme) => {
     seriesTableCell: css`
       display: table-cell;
     `,
+    label: css`
+      word-break: break-all;
+    `,
     value: css`
       padding-left: ${theme.spacing.md};
     `,
@@ -45,7 +48,7 @@ const SeriesTableRow: React.FC<SeriesTableRowProps> = ({ color, label, value, is
           <SeriesIcon color={color} className={styles.icon} />
         </div>
       )}
-      <div className={styles.seriesTableCell}>{label}</div>
+      <div className={cx(styles.seriesTableCell, styles.label)}>{label}</div>
       <div className={cx(styles.seriesTableCell, styles.value)}>{value}</div>
     </div>
   );