Explore/Loki: Remove regex parsing errors for huge logs (#26405)

* Remove hihglihting for logs with more than 5000 characters

* Update limitt, include also parsing for details

* Update

packages/grafana-ui/src/components/Logs/LogDetails.tsx

@@ -20,6 +20,7 @@ import { selectThemeVariant } from '../../themes/selectThemeVariant';
 
 
 //Components
 //Components
 import { LogDetailsRow } from './LogDetailsRow';
 import { LogDetailsRow } from './LogDetailsRow';
+import { MAX_CHARACTERS } from './LogRowMessage';
 
 
 type FieldDef = {
 type FieldDef = {
   key: string;
   key: string;
@@ -64,6 +65,9 @@ class UnThemedLogDetails extends PureComponent<Props> {
   getParser = memoizeOne(getParser);
   getParser = memoizeOne(getParser);
 
 
   parseMessage = memoizeOne((rowEntry): FieldDef[] => {
   parseMessage = memoizeOne((rowEntry): FieldDef[] => {
+    if (rowEntry.length > MAX_CHARACTERS) {
+      return [];
+    }
     const parser = this.getParser(rowEntry);
     const parser = this.getParser(rowEntry);
     if (!parser) {
     if (!parser) {
       return [];
       return [];

packages/grafana-ui/src/components/Logs/LogRowMessage.tsx

@@ -17,6 +17,8 @@ import { stylesFactory } from '../../themes/stylesFactory';
 import { LogRowContext } from './LogRowContext';
 import { LogRowContext } from './LogRowContext';
 import { LogMessageAnsi } from './LogMessageAnsi';
 import { LogMessageAnsi } from './LogMessageAnsi';
 
 
+export const MAX_CHARACTERS = 100000;
+
 interface Props extends Themeable {
 interface Props extends Themeable {
   row: LogRowModel;
   row: LogRowModel;
   hasMoreContextRows?: HasMoreContextRows;
   hasMoreContextRows?: HasMoreContextRows;
@@ -86,7 +88,8 @@ class UnThemedLogRowMessage extends PureComponent<Props> {
 
 
     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 && highlights[0] && highlights[0].length > 0;
+    const needsHighlighter =
+      highlights && highlights.length > 0 && highlights[0] && highlights[0].length > 0 && entry.length < MAX_CHARACTERS;
     const highlightClassName = previewHighlights
     const highlightClassName = previewHighlights
       ? cx([style.logsRowMatchHighLight, style.logsRowMatchHighLightPreview])
       ? cx([style.logsRowMatchHighLight, style.logsRowMatchHighLightPreview])
       : cx([style.logsRowMatchHighLight]);
       : cx([style.logsRowMatchHighLight]);

public/app/features/explore/Logs.tsx

@@ -22,6 +22,7 @@ import store from 'app/core/store';
 import { ExploreGraphPanel } from './ExploreGraphPanel';
 import { ExploreGraphPanel } from './ExploreGraphPanel';
 import { MetaInfoText } from './MetaInfoText';
 import { MetaInfoText } from './MetaInfoText';
 import { RowContextOptions } from '@grafana/ui/src/components/Logs/LogRowContextProvider';
 import { RowContextOptions } from '@grafana/ui/src/components/Logs/LogRowContextProvider';
+import { MAX_CHARACTERS } from '@grafana/ui/src/components/Logs/LogRowMessage';
 
 
 const SETTINGS_KEYS = {
 const SETTINGS_KEYS = {
   showLabels: 'grafana.explore.logs.showLabels',
   showLabels: 'grafana.explore.logs.showLabels',
@@ -181,6 +182,14 @@ export class Logs extends PureComponent<Props, State> {
       });
       });
     }
     }
 
 
+    if (logRows.some(r => r.entry.length > MAX_CHARACTERS)) {
+      meta.push({
+        label: 'Info',
+        value: 'Logs with more than 100,000 characters could not be parsed and highlighted',
+        kind: LogsMetaKind.String,
+      });
+    }
+
     const scanText = scanRange ? `Scanning ${rangeUtil.describeTimeRange(scanRange)}` : 'Scanning...';
     const scanText = scanRange ? `Scanning ${rangeUtil.describeTimeRange(scanRange)}` : 'Scanning...';
     const series = logsSeries ? logsSeries : [];
     const series = logsSeries ? logsSeries : [];