瀏覽代碼

feature(explore/table): Add tooltips to explore table (#16007)

Longer labels are now viewable as a tooltip in the Explore table

Signed-off-by: Steven Sheehy <ssheehy@firescope.com>
Steven Sheehy 6 年之前
父節點
當前提交
fff6e0a522
共有 1 個文件被更改,包括 6 次插入2 次删除
  1. 6 2
      public/app/features/explore/Table.tsx

+ 6 - 2
public/app/features/explore/Table.tsx

@@ -40,11 +40,15 @@ export default class Table extends PureComponent<TableProps> {
     const tableModel = data || EMPTY_TABLE;
     const columnNames = tableModel.columns.map(({ text }) => text);
     const columns = tableModel.columns.map(({ filterable, text }) => ({
-      Header: text,
+      Header: () => <span title={text}>{text}</span>,
       accessor: text,
       className: VALUE_REGEX.test(text) ? 'text-right' : '',
       show: text !== 'Time',
-      Cell: row => <span className={filterable ? 'link' : ''}>{row.value}</span>,
+      Cell: row => (
+        <span className={filterable ? 'link' : ''} title={text + ': ' + row.value}>
+          {row.value}
+        </span>
+      ),
     }));
     const noDataText = data ? 'The queries returned no data for a table.' : '';