Annotations: Add custom label for custom values in builtin annotations (#36691)

This commit is contained in:
Maria Alexandra 2021-07-13 13:30:07 +02:00 committed by GitHub
parent 702fd1cad9
commit da7f5864f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 0 deletions

View File

@ -15,6 +15,7 @@ export interface TermCount {
export interface Props {
allowCustomValue?: boolean;
formatCreateLabel?: (input: string) => string;
/** Do not show selected values inside Select. Useful when the values need to be shown in some other components */
hideValues?: boolean;
inputId?: string;
@ -33,6 +34,7 @@ const filterOption = (option: any, searchQuery: string) => {
export const TagFilter: FC<Props> = ({
allowCustomValue = false,
formatCreateLabel,
hideValues,
inputId,
isClearable,
@ -65,6 +67,7 @@ export const TagFilter: FC<Props> = ({
const selectOptions = {
allowCustomValue,
formatCreateLabel,
defaultOptions: true,
filterOption,
getOptionLabel: (i: any) => i.label,

View File

@ -65,6 +65,8 @@ export default function AnnotationQueryEditor({ query, onChange }: Props) {
tags,
});
const onFormatCreateLabel = (input: string) => `Use custom value: ${input}`;
return (
<FieldSet className={styles.container}>
<Field label="Filter by">
@ -92,6 +94,7 @@ export default function AnnotationQueryEditor({ query, onChange }: Props) {
<Field label="Tags" description={tagsTooltipContent}>
<TagFilter
allowCustomValue
formatCreateLabel={onFormatCreateLabel}
inputId="grafana-annotations__tags"
onChange={onTagsChange}
tagOptions={getAnnotationTags}