[8.14] [Search] Fix search index rerendering unnecessarily (#186412) (#187558)

# Backport

This will backport the following commits from `main` to `8.14`:
- [[Search] Fix search index rerendering unnecessarily
(#186412)](https://github.com/elastic/kibana/pull/186412)

<!--- Backport version: 8.9.7 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Sander
Philipse","email":"94373878+sphilipse@users.noreply.github.com"},"sourceCommit":{"committedDate":"2024-06-18T21:35:24Z","message":"[Search]
Fix search index rerendering unnecessarily (#186412)\n\n##
Summary\r\n\r\nThis fixes the search index rerendering on every change,
even if nothing\r\nactually
changed.","sha":"141044e51ec77ea7c5e68c9311a381aecb515497","branchLabelMapping":{"^v8.15.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","backport
missing","Team:Search","auto-backport","v8.15.0","v8.14.2"],"number":186412,"url":"https://github.com/elastic/kibana/pull/186412","mergeCommit":{"message":"[Search]
Fix search index rerendering unnecessarily (#186412)\n\n##
Summary\r\n\r\nThis fixes the search index rerendering on every change,
even if nothing\r\nactually
changed.","sha":"141044e51ec77ea7c5e68c9311a381aecb515497"}},"sourceBranch":"main","suggestedTargetBranches":["8.14"],"targetPullRequestStates":[{"branch":"main","label":"v8.15.0","labelRegex":"^v8.15.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/186412","number":186412,"mergeCommit":{"message":"[Search]
Fix search index rerendering unnecessarily (#186412)\n\n##
Summary\r\n\r\nThis fixes the search index rerendering on every change,
even if nothing\r\nactually
changed.","sha":"141044e51ec77ea7c5e68c9311a381aecb515497"}},{"branch":"8.14","label":"v8.14.2","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Sander Philipse <94373878+sphilipse@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2024-07-04 14:26:25 +02:00 committed by GitHub
parent cfd36e1877
commit 86899c64a0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -5,7 +5,7 @@
* 2.0.
*/
import React, { useEffect } from 'react';
import React, { useEffect, useMemo } from 'react';
import { useParams } from 'react-router-dom';
@ -15,12 +15,15 @@ import { EuiTabbedContent, EuiTabbedContentTab } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { ClientConfigType } from '../../../../../common/types';
import { generateEncodedPath } from '../../../shared/encode_path_params';
import { ErrorStatePrompt } from '../../../shared/error_state';
import { HttpLogic } from '../../../shared/http';
import { KibanaLogic } from '../../../shared/kibana';
import { SEARCH_INDEX_PATH, SEARCH_INDEX_TAB_PATH } from '../../routes';
import { ElasticsearchViewIndex } from '../../types';
import { isConnectorIndex, isCrawlerIndex } from '../../utils/indices';
import { ConnectorConfiguration } from '../connector_detail/connector_configuration';
import { EnterpriseSearchContentPageTemplate } from '../layout/page_template';
@ -207,20 +210,6 @@ export const SearchIndex: React.FC = () => {
...(hasDefaultIngestPipeline ? [PIPELINES_TAB] : []),
];
const selectedTab = tabs.find((tab) => tab.id === tabId);
const onTabClick = (tab: EuiTabbedContentTab) => {
KibanaLogic.values.navigateToUrl(
generateEncodedPath(
tab.id === SearchIndexTabId.OVERVIEW ? SEARCH_INDEX_PATH : SEARCH_INDEX_TAB_PATH,
{
indexName,
tabId: tab.id,
}
)
);
};
return (
<EnterpriseSearchContentPageTemplate
pageChrome={[...baseBreadcrumbs, indexName]}
@ -234,18 +223,56 @@ export const SearchIndex: React.FC = () => {
rightSideItems: getHeaderActions(index),
}}
>
{isCrawlerIndex(index) && !index.connector ? (
<NoConnectorRecord />
) : isCrawlerIndex(index) && (Boolean(errorConnectingMessage) || !config.host) ? (
<ErrorStatePrompt />
) : (
<>
{indexName === index?.name && (
<EuiTabbedContent tabs={tabs} selectedTab={selectedTab} onTabClick={onTabClick} />
)}
{isCrawlerIndex(index) && <CrawlCustomSettingsFlyout />}
</>
)}
<Content
index={index}
errorConnectingMessage={errorConnectingMessage}
config={config}
tabs={tabs}
tabId={tabId}
/>
</EnterpriseSearchContentPageTemplate>
);
};
interface ContentProps {
config?: ClientConfigType;
errorConnectingMessage: string;
index?: ElasticsearchViewIndex;
tabId?: string;
tabs: EuiTabbedContentTab[];
}
const Content: React.FC<ContentProps> = ({
config,
errorConnectingMessage,
index,
tabs,
tabId,
}) => {
const selectedTab = useMemo(() => tabs.find((tab) => tab.id === tabId), [tabId]);
const onTabClick = (tab: EuiTabbedContentTab) => {
KibanaLogic.values.navigateToUrl(
generateEncodedPath(
tab.id === SearchIndexTabId.OVERVIEW ? SEARCH_INDEX_PATH : SEARCH_INDEX_TAB_PATH,
{
indexName: index?.name || '',
tabId: tab.id,
}
)
);
};
if (isCrawlerIndex(index) && !index.connector) {
return <NoConnectorRecord />;
}
if (isCrawlerIndex(index) && (Boolean(errorConnectingMessage) || !config?.host)) {
return <ErrorStatePrompt />;
}
return (
<>
<EuiTabbedContent tabs={tabs} selectedTab={selectedTab} onTabClick={onTabClick} />
{isCrawlerIndex(index) && <CrawlCustomSettingsFlyout />}
</>
);
};