IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14308 from grafana/davkal/explore-dedup-number

Browse Source 
Explore: Display duplicate row count as number
This commit is contained in:
Torkel Ödegaard 2018-12-04 17:57:09 +01:00 committed by GitHub
commit 0c855fb974
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
public/app/features/explore/Logs.tsx
View File

@ -40,13 +40,23 @@ interface RowProps {
allRows: LogRow[]; allRows: LogRow[];
highlighterExpressions?: string[]; highlighterExpressions?: string[];
row: LogRow; row: LogRow;
showDuplicates: boolean;
showLabels: boolean | null; // Tristate: null means auto showLabels: boolean | null; // Tristate: null means auto
showLocalTime: boolean; showLocalTime: boolean;
showUtc: boolean; showUtc: boolean;
onClickLabel?: (label: string, value: string) => void; onClickLabel?: (label: string, value: string) => void;
} }
function Row({ allRows, highlighterExpressions, onClickLabel, row, showLabels, showLocalTime, showUtc }: RowProps) { function Row({
allRows,
highlighterExpressions,
onClickLabel,
row,
showDuplicates,
showLabels,
showLocalTime,
showUtc,
}: RowProps) {
const previewHighlights = highlighterExpressions && !_.isEqual(highlighterExpressions, row.searchWords); const previewHighlights = highlighterExpressions && !_.isEqual(highlighterExpressions, row.searchWords);
const highlights = previewHighlights ? highlighterExpressions : row.searchWords; const highlights = previewHighlights ? highlighterExpressions : row.searchWords;
const needsHighlighter = highlights && highlights.length > 0; const needsHighlighter = highlights && highlights.length > 0;
@ -55,15 +65,10 @@ function Row({ allRows, highlighterExpressions, onClickLabel, row, showLabels, s
}); });
return ( return (
<> <>
<div className={row.logLevel ? `logs-row-level logs-row-level-${row.logLevel}` : ''}> {showDuplicates && (
{row.duplicates > 0 && ( <div className="logs-row-duplicates">{row.duplicates > 0 ? `${row.duplicates + 1}x` : null}</div>
<div className="logs-row-level__duplicates" title={`${row.duplicates} duplicates`}> )}
{Array.apply(null, { length: row.duplicates }).map((bogus, index) => ( <div className={row.logLevel ? `logs-row-level logs-row-level-${row.logLevel}` : ''} />
<div className="logs-row-level__duplicate" key={`${index}`} />
))}
</div>
)}
</div>
{showUtc && ( {showUtc && (
<div className="logs-row-time" title={`Local: ${row.timeLocal} (${row.timeFromNow})`}> <div className="logs-row-time" title={`Local: ${row.timeLocal} (${row.timeFromNow})`}>
{row.timestamp} {row.timestamp}
@ -228,6 +233,7 @@ export default class Logs extends PureComponent<LogsProps, LogsState> {
const { dedup, deferLogs, hiddenLogLevels, renderAll, showLocalTime, showUtc } = this.state; const { dedup, deferLogs, hiddenLogLevels, renderAll, showLocalTime, showUtc } = this.state;
let { showLabels } = this.state; let { showLabels } = this.state;
const hasData = data && data.rows && data.rows.length > 0; const hasData = data && data.rows && data.rows.length > 0;
const showDuplicates = dedup !== LogsDedupStrategy.none;
// Filtering // Filtering
const filteredData = filterLogLevels(data, hiddenLogLevels); const filteredData = filterLogLevels(data, hiddenLogLevels);
@ -257,7 +263,12 @@ export default class Logs extends PureComponent<LogsProps, LogsState> {
} }
// Grid options // Grid options
const cssColumnSizes = ['3px']; // Log-level indicator line const cssColumnSizes = [];
if (showDuplicates) {
cssColumnSizes.push('max-content');
}
// Log-level indicator line
cssColumnSizes.push('3px');
if (showUtc) { if (showUtc) {
cssColumnSizes.push('minmax(100px, max-content)'); cssColumnSizes.push('minmax(100px, max-content)');
} }
@ -341,6 +352,7 @@ export default class Logs extends PureComponent<LogsProps, LogsState> {
allRows={processedRows} allRows={processedRows}
highlighterExpressions={highlighterExpressions} highlighterExpressions={highlighterExpressions}
row={row} row={row}
showDuplicates={showDuplicates}
showLabels={showLabels} showLabels={showLabels}
showLocalTime={showLocalTime} showLocalTime={showLocalTime}
showUtc={showUtc} showUtc={showUtc}
@ -355,6 +367,7 @@ export default class Logs extends PureComponent<LogsProps, LogsState> {
key={row.key + row.duplicates} key={row.key + row.duplicates}
allRows={processedRows} allRows={processedRows}
row={row} row={row}
showDuplicates={showDuplicates}
showLabels={showLabels} showLabels={showLabels}
showLocalTime={showLocalTime} showLocalTime={showLocalTime}
showUtc={showUtc} showUtc={showUtc}

19
public/sass/pages/_explore.scss
View File

@ -346,23 +346,8 @@
background-color: #6ed0e0; background-color: #6ed0e0;
} }
.logs-row-level__duplicates { .logs-row-duplicates {
position: absolute; text-align: right;
width: 9px;
height: 100%;
top: 0;
left: 5px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
.logs-row-level__duplicate {
width: 2px;
height: 3px;
background-color: #1f78c1;
margin: 0 1px 1px 0;
} }
.logs-label { .logs-label {