Skip to content

Commit

Permalink
[Workplace Search] Update copy for custom connector package onboarding (
Browse files Browse the repository at this point in the history 
#132669)

* Update copy for custom connector package onboarding

* Copy feedback
  • Loading branch information
Byron Hulcher authored May 23, 2022
1 parent 3491db1 commit 93de448
Show file tree
Hide file tree
Showing 4 changed files with 89 additions and 36 deletions.
77 changes: 46 additions & 31 deletions ...ons/workplace_search/views/content_sources/components/add_source/add_source_byo_intro.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ import { i18n } from '@kbn/i18n';

import { FormattedMessage } from '@kbn/i18n-react';

import { docLinks } from '../../../../../shared/doc_links';

import { EuiButtonTo } from '../../../../../shared/react_router_helpers';
import { AppLogic } from '../../../../app_logic';
import connectionIllustration from '../../../../assets/connection_illustration.svg';
Expand Down Expand Up @@ -86,23 +88,12 @@ export const AddSourceBYOIntro: React.FC = () => {
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.steps.title',
{
defaultMessage: 'How to build and deploy a Custom Connector Package',
defaultMessage:
'Build and deploy a custom connector package to add data from custom content sources, or modify the behavior of first party content sources',
}
)}
</h2>
</EuiTitle>
<EuiSpacer size="m" />
<EuiText color="subdued" grow={false}>
<p>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.steps.text',
{
defaultMessage:
'We give you all you need to help you build your own Connector to bring data into Enterprise Search from your favorite content sources.',
}
)}
</p>
</EuiText>
<EuiSpacer size="l" />
</EuiFlexItem>
<EuiFlexItem>
Expand All @@ -116,9 +107,9 @@ export const AddSourceBYOIntro: React.FC = () => {
<EuiTitle size="xs">
<h3>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option1.heading',
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step1.heading',
{
defaultMessage: 'Option 1',
defaultMessage: 'Step 1',
}
)}
</h3>
Expand All @@ -129,15 +120,28 @@ export const AddSourceBYOIntro: React.FC = () => {
<EuiText size="m" grow={false}>
<h4>
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option1.title"
defaultMessage="Start with our source code"
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step1.title"
defaultMessage="Build or modify the code"
/>
</h4>
<p>
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option1.text"
defaultMessage="Check out our repository on github {link}"
values={{ link: <EuiLink>here</EuiLink> }}
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step1.text"
defaultMessage="In the Connector Package {repositoryLink}, there’s everything you need to understand the connector framework and get set up with your coding environment."
values={{
repositoryLink: (
<EuiLink
external
target="_blank"
href="https://github.com/elastic/connectors"
>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step1.repositoryLinkLabel',
{ defaultMessage: 'repository' }
)}
</EuiLink>
),
}}
/>
</p>
</EuiText>
Expand All @@ -155,9 +159,9 @@ export const AddSourceBYOIntro: React.FC = () => {
<EuiTitle size="xs">
<h4>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option2.heading',
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step2.heading',
{
defaultMessage: 'Option 2',
defaultMessage: 'Step 2',
}
)}
</h4>
Expand All @@ -168,17 +172,28 @@ export const AddSourceBYOIntro: React.FC = () => {
<EuiText size="m" grow={false}>
<h4>
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option2.title"
defaultMessage="Use our docs and tools to write your own"
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step2.title"
defaultMessage="Deploy your custom connector package"
/>
</h4>
<p>
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.option2.text"
defaultMessage="Check out our helpful docs {link}"
values={
{ link: <EuiLink>here</EuiLink> } // TODO Update this when we have a doclink
}
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step2.text"
defaultMessage="Connector packages are self managed on the infrastructure you deploy. Review the {documentationLink} for prerequisites to get started with your deployment."
values={{
documentationLink: (
<EuiLink
external
target="_blank"
href={docLinks.workplaceSearchCustomConnectorPackage}
>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step2.documentationLinkLabel',
{ defaultMessage: 'documentation' }
)}
</EuiLink>
),
}}
/>
</p>
</EuiText>
Expand All @@ -189,8 +204,8 @@ export const AddSourceBYOIntro: React.FC = () => {
<EuiText size="m" grow={false}>
<p>
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step2.text"
defaultMessage="Once you've built and deployed your connector, come back here to register your connector, connect to your content source, and start ingesting documents."
id="xpack.enterpriseSearch.workplaceSearch.contentSource.byoConfigIntro.step3.text"
defaultMessage="Once you’ve built and deployed your connector package, come back here to register your connector package deployment, finalize configuration and connect to your content sources."
/>
</p>
</EuiText>
Expand Down
2 changes: 1 addition & 1 deletion ...ations/workplace_search/views/content_sources/components/add_source/byo_source_prompt.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export const BYOSourcePrompt: React.FC = () => {
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.addSource.byoSourcePrompt.description',
{
defaultMessage: 'Build, modify and deploy a connector package for your use case.?',
defaultMessage: 'Build, modify and deploy a connector package for your use case.',
}
)}
</p>
Expand Down
44 changes: 41 additions & 3 deletions ...applications/workplace_search/views/content_sources/components/add_source/save_config.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,13 @@ import {
EuiFlexItem,
EuiForm,
EuiFormRow,
EuiLink,
EuiSpacer,
EuiSteps,
EuiText,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';

import { LicensingLogic } from '../../../../../shared/licensing';
import { ApiKey } from '../../../../components/shared/api_key';
Expand All @@ -29,7 +32,6 @@ import { PUBLIC_KEY_LABEL, CONSUMER_KEY_LABEL, REMOVE_BUTTON } from '../../../..
import { Configuration } from '../../../../types';

import { ExternalConnectorFormFields } from './add_external_connector';
import { ExternalConnectorDocumentation } from './add_external_connector';
import { AddSourceLogic, SourceConfigFormElement } from './add_source_logic';
import { ConfigDocsLinks } from './config_docs_links';
import { OAUTH_SAVE_CONFIG_BUTTON, OAUTH_BACK_BUTTON } from './constants';
Expand Down Expand Up @@ -99,7 +101,7 @@ export const SaveConfig: React.FC<SaveConfigProps> = ({

const { sourceConfigData, buttonLoading, configuredFields } = useValues(AddSourceLogic);

const { accountContextOnly, serviceType, configurableFields = [] } = sourceConfigData;
const { accountContextOnly, serviceType, configured, configurableFields = [] } = sourceConfigData;

const formFields: SourceConfigFormElement[] =
serviceType === 'external'
Expand Down Expand Up @@ -211,7 +213,43 @@ export const SaveConfig: React.FC<SaveConfigProps> = ({
<EuiSpacer size="l" />
{serviceType === 'external' && (
<>
<ExternalConnectorDocumentation name={name} documentationUrl={documentationUrl} />
<EuiText size="s">
<p>
{configured ? (
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.saveConfig.externalConnectorDocumenation.configuredHeading"
defaultMessage="Your self managed {name} connector package is registered with Enterprise Search. Review our {documentationLink} to learn more about configuring a connector package."
values={{
name,
documentationLink: (
<EuiLink external target="_blank" href={documentationUrl}>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.saveConfig.externalConnectorDocumenation.documentationLinkLabel',
{ defaultMessage: 'documentation' }
)}
</EuiLink>
),
}}
/>
) : (
<FormattedMessage
id="xpack.enterpriseSearch.workplaceSearch.contentSource.saveConfig.externalConnectorDocumenation.unconfiguredHeading"
defaultMessage="Your self managed {name} connector package is now registered with Enterprise Search, and the configuration can now be finalized. Review our {documentationLink}, and collect the credentials from your content source provider in preparation for the next step"
values={{
name,
documentationLink: (
<EuiLink external target="_blank" href={documentationUrl}>
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.contentSource.saveConfig.externalConnectorDocumenation.documentationLinkLabel',
{ defaultMessage: 'documentation' }
)}
</EuiLink>
),
}}
/>
)}
</p>
</EuiText>
<EuiSpacer size="l" />
</>
)}
Expand Down
2 changes: 1 addition & 1 deletion ...e_search/public/applications/workplace_search/views/settings/components/source_config.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ export const SourceConfig: React.FC = () => {
{i18n.translate(
'xpack.enterpriseSearch.workplaceSearch.settings.confirmRemoveConfig.message',
{
defaultMessage: 'Are you sure you want to remove the OAuth configuration for {name}?',
defaultMessage: 'Are you sure you want to remove the configuration for {name}?',
values: { name },
}
)}
Expand Down

0 comments on commit 93de448

Please sign in to comment.