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

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

@ -346,23 +346,8 @@
background-color: #6ed0e0;
}
.logs-row-level__duplicates {
position: absolute;
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-row-duplicates {
text-align: right;
}
.logs-label {