Loki: Show configured log line limit (#61291)

* feat: show configured line limit

* test: correct failing test

* refactor: update variable names

* fix: ui renders the wrong value given a falsy value

* refactor: use nullish coalescing operator
This commit is contained in:
Gareth Dawson 2023-01-17 08:45:23 +00:00 committed by GitHub
parent 2324597d8d
commit 54fd1b634f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 21 additions and 7 deletions

View File

@ -165,7 +165,13 @@ export const LokiQueryEditor = React.memo<LokiQueryEditorProps>((props) => {
showExplain={explain}
/>
)}
<LokiQueryBuilderOptions query={query} onChange={onChange} onRunQuery={onRunQuery} app={app} />
<LokiQueryBuilderOptions
query={query}
onChange={onChange}
onRunQuery={onRunQuery}
app={app}
maxLines={datasource.maxLines}
/>
</EditorRows>
</>
);

View File

@ -20,6 +20,7 @@ function setup(app: CoreApp): RenderResult {
},
getQueryHints: () => [],
getDataSamples: () => [],
maxLines: 20,
} as unknown as LokiDatasource;
return render(

View File

@ -46,6 +46,7 @@ function setup(queryOverrides: Partial<LokiQuery> = {}) {
},
onRunQuery: jest.fn(),
onChange: jest.fn(),
maxLines: 20,
};
const { container } = render(<LokiQueryBuilderOptions {...props} />);

View File

@ -14,10 +14,11 @@ export interface Props {
query: LokiQuery;
onChange: (update: LokiQuery) => void;
onRunQuery: () => void;
maxLines: number;
app?: CoreApp;
}
export const LokiQueryBuilderOptions = React.memo<Props>(({ app, query, onChange, onRunQuery }) => {
export const LokiQueryBuilderOptions = React.memo<Props>(({ app, query, onChange, onRunQuery, maxLines }) => {
const onQueryTypeChange = (value: LokiQueryType) => {
onChange({ ...query, queryType: value });
onRunQuery();
@ -50,7 +51,7 @@ export const LokiQueryBuilderOptions = React.memo<Props>(({ app, query, onChange
return (
<EditorRow>
<QueryOptionGroup title="Options" collapsedInfo={getCollapsedInfo(query, queryType, showMaxLines)}>
<QueryOptionGroup title="Options" collapsedInfo={getCollapsedInfo(query, queryType, showMaxLines, maxLines)}>
<EditorField
label="Legend"
tooltip="Series name override or template. Ex. {{hostname}} will be replaced with label value for hostname."
@ -71,7 +72,7 @@ export const LokiQueryBuilderOptions = React.memo<Props>(({ app, query, onChange
<EditorField label="Line limit" tooltip="Upper limit for number of log lines returned by query.">
<AutoSizeInput
className="width-4"
placeholder="auto"
placeholder={maxLines.toString()}
type="number"
min={0}
defaultValue={query.maxLines?.toString() ?? ''}
@ -93,7 +94,12 @@ export const LokiQueryBuilderOptions = React.memo<Props>(({ app, query, onChange
);
});
function getCollapsedInfo(query: LokiQuery, queryType: LokiQueryType, showMaxLines: boolean): string[] {
function getCollapsedInfo(
query: LokiQuery,
queryType: LokiQueryType,
showMaxLines: boolean,
maxLines: number
): string[] {
const queryTypeLabel = queryTypeOptions.find((x) => x.value === queryType);
const resolutionLabel = RESOLUTION_OPTIONS.find((x) => x.value === (query.resolution ?? 1));
@ -109,8 +115,8 @@ function getCollapsedInfo(query: LokiQuery, queryType: LokiQueryType, showMaxLin
items.push(`Type: ${queryTypeLabel?.label}`);
if (showMaxLines && query.maxLines) {
items.push(`Line limit: ${query.maxLines}`);
if (showMaxLines) {
items.push(`Line limit: ${query.maxLines ?? maxLines}`);
}
return items;