mirror of
https://github.com/grafana/grafana.git
synced 2025-02-12 00:25:46 -06:00
76a3b1a793
- use react-highlight-words - add highlighting (color and border) to the matching substring of the suggested items in the typeahead - extracted match finding from logging datasource - created new utils/text.ts class for text-related functions - added more types
33 lines
930 B
TypeScript
33 lines
930 B
TypeScript
import { TextMatch } from 'app/types/explore';
|
|
|
|
/**
|
|
* Adapt findMatchesInText for react-highlight-words findChunks handler.
|
|
* See https://github.com/bvaughn/react-highlight-words#props
|
|
*/
|
|
export function findHighlightChunksInText({ searchWords, textToHighlight }) {
|
|
return findMatchesInText(textToHighlight, searchWords.join(' '));
|
|
}
|
|
|
|
/**
|
|
* Returns a list of substring regexp matches.
|
|
*/
|
|
export function findMatchesInText(haystack: string, needle: string): TextMatch[] {
|
|
// Empty search can send re.exec() into infinite loop, exit early
|
|
if (!haystack || !needle) {
|
|
return [];
|
|
}
|
|
const regexp = new RegExp(`(?:${needle})`, 'g');
|
|
const matches = [];
|
|
let match = regexp.exec(haystack);
|
|
while (match) {
|
|
matches.push({
|
|
text: match[0],
|
|
start: match.index,
|
|
length: match[0].length,
|
|
end: match.index + match[0].length,
|
|
});
|
|
match = regexp.exec(haystack);
|
|
}
|
|
return matches;
|
|
}
|