Remove “Open in search comparison” button from Query Details & Query Group Details (#396) (#415)

(cherry picked from commit 67377d2)

Signed-off-by: Kishore Kumaar Natarajan <kkumaarn@amazon.com>
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Kishore Kumaar Natarajan <kkumaarn@amazon.com>

Author: 3 people

public/pages/QueryDetails/QueryDetails.test.tsx

@@ -122,19 +122,6 @@ describe('QueryDetails component', () => {
     });
   });
 
-  it('renders the search comparison button', async () => {
-    renderQueryDetails();
-
-    await waitFor(() => {
-      const button = screen.getByText('Open in search comparison');
-      expect(button).toBeInTheDocument();
-      expect(button.closest('a')).toHaveAttribute(
-        'href',
-        'https://playground.opensearch.org/app/searchRelevance#/'
-      );
-    });
-  });
-
   it('matches snapshot', async () => {
     const { container } = renderQueryDetails();
 

public/pages/QueryDetails/QueryDetails.tsx

@@ -7,7 +7,6 @@ import React, { useCallback, useContext, useEffect, useState } from 'react';
 // @ts-ignore
 import Plotly from 'plotly.js-dist';
 import {
-  EuiButton,
   EuiCodeBlock,
   EuiFlexGrid,
   EuiFlexGroup,
@@ -173,17 +172,6 @@ const QueryDetails = ({
                     <h2>Query</h2>
                   </EuiTitle>
                 </EuiFlexItem>
-                <EuiFlexItem grow={false}>
-                  <EuiButton
-                    size="s"
-                    iconSide="right"
-                    iconType="popout"
-                    target="_blank"
-                    href="https://playground.opensearch.org/app/searchRelevance#/"
-                  >
-                    Open in search comparison
-                  </EuiButton>
-                </EuiFlexItem>
               </EuiFlexGroup>
               <EuiHorizontalRule margin="xs" />
               <EuiSpacer size="xs" />

public/pages/QueryDetails/__snapshots__/QueryDetails.test.tsx.snap

@@ -216,40 +216,6 @@ exports[`QueryDetails component matches snapshot 1`] = `
                   Query
                 </h2>
               </div>
-              <div
-                class="euiFlexItem euiFlexItem--flexGrowZero"
-              >
-                <a
-                  class="euiButton euiButton--primary euiButton--small"
-                  href="https://playground.opensearch.org/app/searchRelevance#/"
-                  rel="noopener noreferrer"
-                  target="_blank"
-                >
-                  <span
-                    class="euiButtonContent euiButtonContent--iconRight euiButton__content"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="euiIcon euiIcon--medium euiIcon--inherit euiButtonContent__icon"
-                      focusable="false"
-                      height="16"
-                      role="img"
-                      viewBox="0 0 16 16"
-                      width="16"
-                      xmlns="http://www.w3.org/2000/svg"
-                    >
-                      <path
-                        d="M13 8.5a.5.5 0 1 1 1 0V12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h3.5a.5.5 0 0 1 0 1H4a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8.5Zm-5.12.339a.5.5 0 1 1-.706-.707L13.305 2H10.5a.5.5 0 1 1 0-1H14a1 1 0 0 1 1 1v3.5a.5.5 0 1 1-1 0V2.72L7.88 8.838Z"
-                      />
-                    </svg>
-                    <span
-                      class="euiButton__text"
-                    >
-                      Open in search comparison
-                    </span>
-                  </span>
-                </a>
-              </div>
             </div>
             <hr
               class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginXSmall"

public/pages/QueryGroupDetails/QueryGroupDetails.test.tsx

@@ -122,20 +122,6 @@ describe('QueryGroupDetails', () => {
     expect(document.getElementById('latency')).toBeInTheDocument();
   });
 
-  it('displays query details', async () => {
-    const { container } = renderComponent();
-
-    await waitFor(() => {
-      expect(screen.getByText('Open in search comparision')).toBeInTheDocument();
-    });
-
-    const codeBlock = container.querySelector('.euiCodeBlock__pre');
-    expect(codeBlock).toBeInTheDocument();
-
-    expect(codeBlock?.textContent).toContain('"query"');
-    expect(codeBlock?.textContent).toMatch(/{\s*"query":/);
-  });
-
   it('renders tooltips', () => {
     renderComponent();
 

public/pages/QueryGroupDetails/QueryGroupDetails.tsx

@@ -10,7 +10,6 @@ import Plotly from 'plotly.js-dist';
 import { useHistory, useLocation } from 'react-router-dom';
 import React, { useContext, useEffect, useState } from 'react';
 import {
-  EuiButton,
   EuiCodeBlock,
   EuiFlexGrid,
   EuiFlexGroup,
@@ -204,17 +203,6 @@ export const QueryGroupDetails = ({
                     <h2>Query</h2>
                   </EuiTitle>
                 </EuiFlexItem>
-                <EuiFlexItem grow={false}>
-                  <EuiButton
-                    size="s"
-                    iconSide="right"
-                    iconType="popout"
-                    target="_blank"
-                    href="https://playground.opensearch.org/app/searchRelevance#/"
-                  >
-                    Open in search comparision
-                  </EuiButton>
-                </EuiFlexItem>
               </EuiFlexGroup>
               <EuiHorizontalRule margin="xs" />
               <EuiSpacer size="xs" />

public/pages/QueryGroupDetails/__snapshots__/QueryGroupDetails.test.tsx.snap

@@ -339,40 +339,6 @@ exports[`QueryGroupDetails matches snapshot 1`] = `
                   Query
                 </h2>
               </div>
-              <div
-                class="euiFlexItem euiFlexItem--flexGrowZero"
-              >
-                <a
-                  class="euiButton euiButton--primary euiButton--small"
-                  href="https://playground.opensearch.org/app/searchRelevance#/"
-                  rel="noopener noreferrer"
-                  target="_blank"
-                >
-                  <span
-                    class="euiButtonContent euiButtonContent--iconRight euiButton__content"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="euiIcon euiIcon--medium euiIcon--inherit euiButtonContent__icon"
-                      focusable="false"
-                      height="16"
-                      role="img"
-                      viewBox="0 0 16 16"
-                      width="16"
-                      xmlns="http://www.w3.org/2000/svg"
-                    >
-                      <path
-                        d="M13 8.5a.5.5 0 1 1 1 0V12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h3.5a.5.5 0 0 1 0 1H4a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V8.5Zm-5.12.339a.5.5 0 1 1-.706-.707L13.305 2H10.5a.5.5 0 1 1 0-1H14a1 1 0 0 1 1 1v3.5a.5.5 0 1 1-1 0V2.72L7.88 8.838Z"
-                      />
-                    </svg>
-                    <span
-                      class="euiButton__text"
-                    >
-                      Open in search comparision
-                    </span>
-                  </span>
-                </a>
-              </div>
             </div>
             <hr
               class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginXSmall"