Skip to content

Commit

Permalink
code cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
@alisonelizabeth
alisonelizabeth committed Aug 29, 2023
1 parent c13f7a5 commit 6f28be4
Show file tree
Hide file tree
Showing 7 changed files with 87 additions and 30 deletions.
1 change: 1 addition & 0 deletions packages/kbn-doc-links/src/get_doc_links.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -622,6 +622,7 @@ export const getDocLinks = ({ kibanaBranch }: GetDocLinkOptions): DocLinks => {
},
apis: {
bulkIndexAlias: `${ELASTICSEARCH_DOCS}indices-aliases.html`,
indexStats: `${ELASTICSEARCH_DOCS}indices-stats.html`,
byteSizeUnits: `${ELASTICSEARCH_DOCS}api-conventions.html#byte-units`,
createAutoFollowPattern: `${ELASTICSEARCH_DOCS}ccr-put-auto-follow-pattern.html`,
createFollower: `${ELASTICSEARCH_DOCS}ccr-put-follow.html`,
Expand Down
1 change: 1 addition & 0 deletions packages/kbn-doc-links/src/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -361,6 +361,7 @@ export interface DocLinks {
readonly visualize: Record<string, string>;
readonly apis: Readonly<{
bulkIndexAlias: string;
indexStats: string;
byteSizeUnits: string;
createAutoFollowPattern: string;
createFollower: string;
Expand Down
15 changes: 10 additions & 5 deletions ...ndex_management/public/application/sections/home/index_list/details_page/details_page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
*/

import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { css } from '@emotion/react';
import { Redirect, RouteComponentProps } from 'react-router-dom';
import { Route, Routes } from '@kbn/shared-ux-router';
import { FormattedMessage } from '@kbn/i18n-react';
Expand All @@ -25,7 +26,7 @@ import { DiscoverLink } from '../../../../lib/discover_link';
import { Section } from '../../home';
import { DetailsPageError } from './details_page_error';
import { ManageIndexButton } from './manage_index_button';
import { StatsTab } from './tabs';
import { DetailsPageStats } from './tabs';

export enum IndexDetailsSection {
Overview = 'overview',
Expand Down Expand Up @@ -139,7 +140,6 @@ export const DetailsPage: React.FunctionComponent<
if (error || !index) {
return <DetailsPageError indexName={indexName} resendRequest={fetchIndexDetails} />;
}

return (
<>
<EuiPageSection paddingSize="none">
Expand Down Expand Up @@ -176,7 +176,12 @@ export const DetailsPage: React.FunctionComponent<

<EuiSpacer size="l" />

<div data-test-subj={`indexDetailsContent`}>
<div
data-test-subj={`indexDetailsContent`}
css={css`
height: 100%;
`}
>
<Routes>
<Route
path={`/${Section.Indices}/${indexName}/${IndexDetailsSection.Overview}`}
Expand All @@ -200,8 +205,8 @@ export const DetailsPage: React.FunctionComponent<
/>
{config.enableIndexStats && (
<Route
path={`/${Section.Indices}/${indexName}/${IndexDetailsSection.Stats}`}
render={() => <StatsTab indexName={indexName} />}
path={`/${Section.Indices}/:indexName/${IndexDetailsSection.Stats}`}
component={DetailsPageStats}
/>
)}
<Redirect
Expand Down
2 changes: 1 addition & 1 deletion ...s/index_management/public/application/sections/home/index_list/details_page/tabs/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@
* 2.0.
*/

export { StatsTab } from './stats';
export { DetailsPageStats } from './stats';
91 changes: 67 additions & 24 deletions .../index_management/public/application/sections/home/index_list/details_page/tabs/stats.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@
* 2.0.
*/

import React from 'react';
import React, { FunctionComponent } from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { FormattedMessage } from '@kbn/i18n-react';
import {
EuiSpacer,
Expand All @@ -19,23 +20,25 @@ import {
EuiIcon,
EuiButton,
EuiPageTemplate,
EuiLink,
} from '@elastic/eui';

import { css } from '@emotion/react';
import { SectionLoading } from '../../../../../../shared_imports';
import { useLoadIndexStats } from '../../../../../services';
import { useLoadIndexStats, documentationService } from '../../../../../services';

interface Props {
indexName: string;
}

export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
export const DetailsPageStats: FunctionComponent<RouteComponentProps<{ indexName: string }>> = ({
match: {
params: { indexName },
},
}) => {
const { data: indexStats, isLoading, error, resendRequest } = useLoadIndexStats(indexName);

if (isLoading) {
return (
<SectionLoading>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.loadingIndexStats"
id="xpack.idxMgmt.indexDetails.stats.loadingIndexStats"
defaultMessage="Loading index stats…"
/>
</SectionLoading>
Expand All @@ -51,7 +54,7 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
title={
<h2>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.errorTitle"
id="xpack.idxMgmt.indexDetails.stats.errorTitle"
defaultMessage="Unable to load index stats"
/>
</h2>
Expand All @@ -60,7 +63,7 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
<>
<EuiText color="subdued">
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.errorDescription"
id="xpack.idxMgmt.indexDetails.stats.errorDescription"
defaultMessage="There was an error loading stats for index {indexName}."
values={{
indexName,
Expand All @@ -76,7 +79,7 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
data-test-subj="reloadIndexStatsButton"
>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.reloadButtonLabel"
id="xpack.idxMgmt.indexDetails.stats.reloadButtonLabel"
defaultMessage="Reload"
/>
</EuiButton>
Expand All @@ -87,18 +90,23 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
}

if (indexStats) {
// using "rowReverse" to keep docs links on the top of the stats code block on smaller screen
return (
<EuiFlexGroup alignItems="flexStart" data-test-subj="statsTabContent">
<EuiFlexItem grow={7}>
<EuiPanel>
<EuiCodeBlock isCopyable language="json" fontSize="m" paddingSize="m">
{JSON.stringify(indexStats, null, 2)}
</EuiCodeBlock>
</EuiPanel>
</EuiFlexItem>

<EuiFlexItem grow={3}>
<EuiPanel>
<EuiFlexGroup
wrap
direction="rowReverse"
css={css`
height: 100%;
`}
data-test-subj="statsTabContent"
>
<EuiFlexItem
grow={1}
css={css`
min-width: 400px;
`}
>
<EuiPanel grow={false} paddingSize="l">
<EuiFlexGroup alignItems="center" gutterSize="s">
<EuiFlexItem grow={false}>
<EuiIcon type="iInCircle" />
Expand All @@ -108,18 +116,20 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
<EuiTitle size="xs">
<h2>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.indexStatsTitle"
id="xpack.idxMgmt.indexDetails.stats.indexStatsTitle"
defaultMessage="About index stats"
/>
</h2>
</EuiTitle>
</EuiFlexItem>
</EuiFlexGroup>

<EuiSpacer size="s" />

<EuiText>
<p>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.indexStatsTab.indexStatsDescription"
id="xpack.idxMgmt.indexDetails.stats.indexStatsDescription"
defaultMessage="Index stats contain high-level aggregation and statistics for an index. The {primariesField} field represents the values for only primary shards, while the {totalField} field contains the accumulated values for both primary and replica shards."
values={{
primariesField: <EuiCode>primaries</EuiCode>,
Expand All @@ -128,6 +138,39 @@ export const StatsTab: React.FunctionComponent<Props> = ({ indexName }) => {
/>
</p>
</EuiText>

<EuiSpacer size="m" />
<EuiLink
data-test-subj="indexDetailsStatsDocsLink"
href={documentationService.getIndexStats()}
target="_blank"
external
>
<FormattedMessage
id="xpack.idxMgmt.indexDetails.stats.learnMoreLink"
defaultMessage="Learn more"
/>
</EuiLink>
</EuiPanel>
</EuiFlexItem>

<EuiFlexItem
grow={3}
css={css`
min-width: 600px;
`}
>
<EuiPanel>
<EuiCodeBlock
isCopyable
language="json"
paddingSize="m"
css={css`
height: 100%;
`}
>
{JSON.stringify(indexStats, null, 2)}
</EuiCodeBlock>
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
Expand Down
6 changes: 6 additions & 0 deletions x-pack/plugins/index_management/public/application/services/documentation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@ class DocumentationService {
private runtimeFields: string = '';
private indicesComponentTemplate: string = '';
private bulkIndexAlias: string = '';
private indexStats: string = '';

public setup(docLinks: DocLinksStart): void {
const { links } = docLinks;
Expand Down Expand Up @@ -111,6 +112,7 @@ class DocumentationService {
this.runtimeFields = links.runtimeFields.overview;
this.indicesComponentTemplate = links.apis.putComponentTemplate;
this.bulkIndexAlias = links.apis.bulkIndexAlias;
this.indexStats = links.apis.indexStats;
}

public getEsDocsBase() {
Expand Down Expand Up @@ -311,6 +313,10 @@ class DocumentationService {
return this.bulkIndexAlias;
}

public getIndexStats() {
return this.indexStats;
}

public getWellKnownTextLink() {
return 'http://docs.opengeospatial.org/is/12-063r5/12-063r5.html';
}
Expand Down
1 change: 1 addition & 0 deletions x-pack/plugins/index_management/public/application/services/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,3 +33,4 @@ export { sortTable } from './sort_table';
export { UiMetricService } from './ui_metric';
export { HttpService } from './http';
export { NotificationService } from './notification';
export { documentationService } from './documentation';

0 comments on commit 6f28be4

Please sign in to comment.