[Enterprise Search] Migrate shared SourceConfigFields component

scottybollinger · scottybollinger · commit 969d5e9a4f10 · 2020-11-04T08:28:55.000-06:00
diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/index.ts b/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/index.ts
@@ -0,0 +1,7 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export { SourceConfigFields } from './source_config_fields';
diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/source_config_fields.test.tsx b/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/source_config_fields.test.tsx
@@ -0,0 +1,45 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { ApiKey } from '../api_key';
+import { CredentialItem } from '../credential_item';
+
+import { SourceConfigFields } from './';
+
+describe('SourceConfigFields', () => {
+  it('renders empty with no items', () => {
+    const wrapper = shallow(<SourceConfigFields />);
+
+    expect(wrapper.find(ApiKey)).toHaveLength(0);
+    expect(wrapper.find(CredentialItem)).toHaveLength(0);
+  });
+
+  it('renders with all items, hiding API Keys', () => {
+    const wrapper = shallow(
+      <SourceConfigFields
+        clientId="123"
+        clientSecret="456"
+        publicKey="abc"
+        consumerKey="def"
+        baseUrl="ghi"
+      />
+    );
+
+    expect(wrapper.find(ApiKey)).toHaveLength(0);
+    expect(wrapper.find(CredentialItem)).toHaveLength(3);
+  });
+
+  it('shows API keys', () => {
+    const wrapper = shallow(
+      <SourceConfigFields clientSecret="456" publicKey="abc" consumerKey="def" baseUrl="ghi" />
+    );
+
+    expect(wrapper.find(ApiKey)).toHaveLength(2);
+  });
+});
diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/source_config_fields.tsx b/x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/source_config_fields/source_config_fields.tsx
@@ -0,0 +1,61 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+
+import { EuiSpacer } from '@elastic/eui';
+
+import { ApiKey } from '../api_key';
+import { CredentialItem } from '../credential_item';
+
+interface ISourceConfigFieldsProps {
+  clientId?: string;
+  clientSecret?: string;
+  publicKey?: string;
+  consumerKey?: string;
+  baseUrl?: string;
+}
+
+export const SourceConfigFields: React.FC<ISourceConfigFieldsProps> = ({
+  clientId,
+  clientSecret,
+  publicKey,
+  consumerKey,
+  baseUrl,
+}) => {
+  const showApiKey = (publicKey || consumerKey) && !clientId;
+
+  const credentialItem = (label: string, item?: string) =>
+    item && <CredentialItem label={label} value={item} testSubj={label} hideCopy />;
+
+  const keyElement = (
+    <>
+      {publicKey && (
+        <>
+          <ApiKey label="Public Key" apiKey={publicKey} />
+          <EuiSpacer />
+        </>
+      )}
+      {consumerKey && (
+        <>
+          <ApiKey label="Consumer Key" apiKey={consumerKey} />
+          <EuiSpacer />
+        </>
+      )}
+    </>
+  );
+
+  return (
+    <>
+      {showApiKey && keyElement}
+      {credentialItem('Client id', clientId)}
+      <EuiSpacer size="s" />
+      {credentialItem('Client secret', clientSecret)}
+      <EuiSpacer size="s" />
+      {credentialItem('Base URL', baseUrl)}
+    </>
+  );
+};
