From a320e942a6a000527fbad05fe0e970fa3c7ac620 Mon Sep 17 00:00:00 2001
From: Kristina <kristina.durivage@grafana.com>
Date: Wed, 27 Apr 2022 07:47:33 -0500
Subject: [PATCH] Explore Split Logs - use unique IDs and save state vals to
 unique place (#48300)

* Explore Split Logs - use unique IDs and save state vals to unique place

* Remove exploreID from store
---
 public/app/features/explore/Logs.test.tsx     |  2 ++
 public/app/features/explore/Logs.tsx          | 11 +++++++----
 public/app/features/explore/LogsContainer.tsx |  1 +
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/public/app/features/explore/Logs.test.tsx b/public/app/features/explore/Logs.test.tsx
index c63c4e909a2..fcac21c1ce5 100644
--- a/public/app/features/explore/Logs.test.tsx
+++ b/public/app/features/explore/Logs.test.tsx
@@ -2,6 +2,7 @@ import { render, screen, fireEvent } from '@testing-library/react';
 import React from 'react';
 
 import { LoadingState, LogLevel, LogRowModel, MutableDataFrame, toUtc } from '@grafana/data';
+import { ExploreId } from 'app/types';
 
 import { Logs } from './Logs';
 
@@ -15,6 +16,7 @@ describe('Logs', () => {
 
     return render(
       <Logs
+        exploreId={ExploreId.left}
         logRows={rows}
         timeZone={'utc'}
         width={50}
diff --git a/public/app/features/explore/Logs.tsx b/public/app/features/explore/Logs.tsx
index 6e7f1ef8e39..1d4ba367bb2 100644
--- a/public/app/features/explore/Logs.tsx
+++ b/public/app/features/explore/Logs.tsx
@@ -35,6 +35,7 @@ import {
 import { RowContextOptions } from '@grafana/ui/src/components/Logs/LogRowContextProvider';
 import { dedupLogRows, filterLogLevels } from 'app/core/logs_model';
 import store from 'app/core/store';
+import { ExploreId } from 'app/types/explore';
 
 import { ExploreGraph } from './ExploreGraph';
 import { LogsMetaRow } from './LogsMetaRow';
@@ -62,6 +63,7 @@ interface Props extends Themeable2 {
   timeZone: TimeZone;
   scanning?: boolean;
   scanRange?: RawTimeRange;
+  exploreId: ExploreId;
   showContextToggle?: (row?: LogRowModel) => boolean;
   onChangeTime: (range: AbsoluteTimeRange) => void;
   onClickFilterLabel?: (key: string, value: string) => void;
@@ -271,6 +273,7 @@ class UnthemedLogs extends PureComponent<Props, State> {
       logsQueries,
       clearCache,
       addResultsToCache,
+      exploreId,
     } = this.props;
 
     const {
@@ -324,7 +327,7 @@ class UnthemedLogs extends PureComponent<Props, State> {
                 onChange={this.onChangeTime}
                 className={styles.horizontalInlineSwitch}
                 transparent
-                id="show-time"
+                id={`show-time_${exploreId}`}
               />
             </InlineField>
             <InlineField label="Unique labels" className={styles.horizontalInlineLabel} transparent>
@@ -333,7 +336,7 @@ class UnthemedLogs extends PureComponent<Props, State> {
                 onChange={this.onChangeLabels}
                 className={styles.horizontalInlineSwitch}
                 transparent
-                id="unique-labels"
+                id={`unique-labels_${exploreId}`}
               />
             </InlineField>
             <InlineField label="Wrap lines" className={styles.horizontalInlineLabel} transparent>
@@ -342,7 +345,7 @@ class UnthemedLogs extends PureComponent<Props, State> {
                 onChange={this.onChangewrapLogMessage}
                 className={styles.horizontalInlineSwitch}
                 transparent
-                id="wrap-lines"
+                id={`wrap-lines_${exploreId}`}
               />
             </InlineField>
             <InlineField label="Prettify JSON" className={styles.horizontalInlineLabel} transparent>
@@ -351,7 +354,7 @@ class UnthemedLogs extends PureComponent<Props, State> {
                 onChange={this.onChangePrettifyLogMessage}
                 className={styles.horizontalInlineSwitch}
                 transparent
-                id="prettify"
+                id={`prettify_${exploreId}`}
               />
             </InlineField>
             <InlineField label="Dedup" className={styles.horizontalInlineLabel} transparent>
diff --git a/public/app/features/explore/LogsContainer.tsx b/public/app/features/explore/LogsContainer.tsx
index fb27a793e0d..cc9660f7d82 100644
--- a/public/app/features/explore/LogsContainer.tsx
+++ b/public/app/features/explore/LogsContainer.tsx
@@ -127,6 +127,7 @@ class LogsContainer extends PureComponent<LogsContainerProps> {
         <LogsCrossFadeTransition visible={!isLive}>
           <Collapse label="Logs" loading={loading} isOpen className={styleOverridesForStickyNavigation}>
             <Logs
+              exploreId={exploreId}
               logRows={logRows}
               logsMeta={logsMeta}
               logsSeries={logsSeries}