github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Enterprise Search] Handle loading state on Credentials page (#80035)

Browse source
This commit is contained in:
Jason Stoltzfus 2020-10-19 15:10:27 -04:00 • committed by GitHub
parent 3f97872055
commit 4c81b1a64b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

7
x-pack/plugins/enterprise_search/public/applications/app_search/components/credentials/credentials.test.tsx
View file

@ -11,7 +11,7 @@ import React from 'react';
import { shallow } from 'enzyme';
import { Credentials } from './credentials';
import { EuiCopy, EuiPageContentBody } from '@elastic/eui';
import { EuiCopy, EuiLoadingContent, EuiPageContentBody } from '@elastic/eui';
import { externalUrl } from '../../../shared/enterprise_search_url';
@ -48,10 +48,11 @@ describe('Credentials', () => {
expect(actions.resetCredentials).toHaveBeenCalledTimes(1);
});
it('renders nothing if data is still loading', () => {
it('renders a limited UI if data is still loading', () => {
setMockValues({ dataLoading: true });
const wrapper = shallow(<Credentials />);
expect(wrapper.find(EuiPageContentBody)).toHaveLength(0);
expect(wrapper.find('[data-test-subj="CreateAPIKeyButton"]')).toHaveLength(0);
expect(wrapper.find(EuiLoadingContent)).toHaveLength(1);
});
it('renders the API endpoint and a button to copy it', () => {

32
x-pack/plugins/enterprise_search/public/applications/app_search/components/credentials/credentials.tsx
View file

@ -19,6 +19,7 @@ import {
EuiButton,
EuiPageContentHeader,
EuiPageContentHeaderSection,
EuiLoadingContent,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
@ -41,11 +42,6 @@ export const Credentials: React.FC = () => {
};
}, []);
// TODO
// if (dataLoading) { return <Loading /> }
if (dataLoading) {
return null;
}
return (
<>
<SetPageChrome
@ -110,22 +106,22 @@ export const Credentials: React.FC = () => {
</EuiTitle>
</EuiPageContentHeaderSection>
<EuiPageContentHeaderSection>
<EuiButton
color="primary"
data-test-subj="CreateAPIKeyButton"
fill={true}
onClick={() => showCredentialsForm()}
>
{i18n.translate('xpack.enterpriseSearch.appSearch.credentials.createKey', {
defaultMessage: 'Create a key',
})}
</EuiButton>
{!dataLoading && (
<EuiButton
color="primary"
data-test-subj="CreateAPIKeyButton"
fill={true}
onClick={() => showCredentialsForm()}
>
{i18n.translate('xpack.enterpriseSearch.appSearch.credentials.createKey', {
defaultMessage: 'Create a key',
})}
</EuiButton>
)}
</EuiPageContentHeaderSection>
</EuiPageContentHeader>
<EuiSpacer size="s" />
<EuiPanel>
<CredentialsList />
</EuiPanel>
<EuiPanel>{!!dataLoading ? <EuiLoadingContent lines={3} /> : <CredentialsList />}</EuiPanel>
</EuiPageContentBody>
</>
);