[7.x] [Ingest pipelines] Address copy feedback (#65175) (#65410)

x-pack/plugins/ingest_pipelines/public/application/app.tsx

@@ -71,7 +71,7 @@ export const App: FunctionComponent = () => {
                 title={
                   <FormattedMessage
                     id="xpack.ingestPipelines.app.deniedPrivilegeTitle"
-                    defaultMessage="You're missing cluster privileges"
+                    defaultMessage="Cluster privileges required"
                   />
                 }
                 message={

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_form_fields.tsx

@@ -95,7 +95,7 @@ export const PipelineFormFields: React.FunctionComponent<Props> = ({
         description={
           <FormattedMessage
             id="xpack.ingestPipelines.form.descriptionFieldDescription"
-            defaultMessage="The description to apply to the pipeline."
+            defaultMessage="A description of what this pipeline does."
           />
         }
       >
@@ -122,12 +122,16 @@ export const PipelineFormFields: React.FunctionComponent<Props> = ({
           <>
             <FormattedMessage
               id="xpack.ingestPipelines.form.processorsFieldDescription"
-              defaultMessage="The processors used to pre-process documents before indexing. {learnMoreLink}"
+              defaultMessage="The processors to use to transform the documents before indexing. {learnMoreLink}"
               values={{
                 learnMoreLink: (
-                  <EuiLink href={services.documentation.getProcessorsUrl()} target="_blank">
+                  <EuiLink
+                    href={services.documentation.getProcessorsUrl()}
+                    target="_blank"
+                    external
+                  >
                     {i18n.translate('xpack.ingestPipelines.form.processorsDocumentionLink', {
-                      defaultMessage: 'Learn more.',
+                      defaultMessage: 'Learn more',
                     })}
                   </EuiLink>
                 ),
@@ -172,12 +176,16 @@ export const PipelineFormFields: React.FunctionComponent<Props> = ({
           <>
             <FormattedMessage
               id="xpack.ingestPipelines.form.onFailureDescription"
-              defaultMessage="The processors to be executed following a failed processor. {learnMoreLink}"
+              defaultMessage="The alternate processors to execute after a processor fails. {learnMoreLink}"
               values={{
                 learnMoreLink: (
-                  <EuiLink href={services.documentation.getHandlingFailureUrl()} target="_blank">
+                  <EuiLink
+                    href={services.documentation.getHandlingFailureUrl()}
+                    target="_blank"
+                    external
+                  >
                     {i18n.translate('xpack.ingestPipelines.form.onFailureDocumentionLink', {
-                      defaultMessage: 'Learn more.',
+                      defaultMessage: 'Learn more',
                     })}
                   </EuiLink>
                 ),
@@ -188,7 +196,7 @@ export const PipelineFormFields: React.FunctionComponent<Props> = ({
               label={
                 <FormattedMessage
                   id="xpack.ingestPipelines.form.onFailureToggleDescription"
-                  defaultMessage="Add on-failure processors"
+                  defaultMessage="Add failure processors"
                 />
               }
               checked={isOnFailureEditorVisible}
@@ -207,7 +215,7 @@ export const PipelineFormFields: React.FunctionComponent<Props> = ({
               euiCodeEditorProps: {
                 height: '300px',
                 'aria-label': i18n.translate('xpack.ingestPipelines.form.onFailureFieldAriaLabel', {
-                  defaultMessage: 'On-failure processors JSON editor',
+                  defaultMessage: 'Failure processors JSON editor',
                 }),
               },
             }}

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_request_flyout/pipeline_request_flyout.tsx

@@ -65,7 +65,7 @@ export const PipelineRequestFlyout: React.FunctionComponent<Props> = ({
           <p>
             <FormattedMessage
               id="xpack.ingestPipelines.requestFlyout.descriptionText"
-              defaultMessage="This Elasticsearch request will create or update this pipeline."
+              defaultMessage="This Elasticsearch request will create or update the pipeline."
             />
           </p>
         </EuiText>

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_test_flyout/tabs/tab_documents.tsx

@@ -8,7 +8,7 @@ import React from 'react';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
 
-import { EuiSpacer, EuiText, EuiButton, EuiHorizontalRule, EuiLink } from '@elastic/eui';
+import { EuiSpacer, EuiText, EuiButton, EuiLink } from '@elastic/eui';
 
 import {
   getUseField,
@@ -72,14 +72,18 @@ export const DocumentsTab: React.FunctionComponent<Props> = ({
         <p>
           <FormattedMessage
             id="xpack.ingestPipelines.testPipelineFlyout.documentsTab.tabDescriptionText"
-            defaultMessage="Provide an array of documents to be ingested by the pipeline. {learnMoreLink}"
+            defaultMessage="Provide an array of documents for the pipeline to ingest. {learnMoreLink}"
             values={{
               learnMoreLink: (
-                <EuiLink href={services.documentation.getSimulatePipelineApiUrl()} target="_blank">
+                <EuiLink
+                  href={services.documentation.getSimulatePipelineApiUrl()}
+                  target="_blank"
+                  external
+                >
                   {i18n.translate(
                     'xpack.ingestPipelines.testPipelineFlyout.documentsTab.simulateDocumentionLink',
                     {
-                      defaultMessage: 'Learn more.',
+                      defaultMessage: 'Learn more',
                     }
                   )}
                 </EuiLink>
@@ -115,17 +119,6 @@ export const DocumentsTab: React.FunctionComponent<Props> = ({
           }}
         />
 
-        <EuiHorizontalRule />
-
-        <EuiText>
-          <p>
-            <FormattedMessage
-              id="xpack.ingestPipelines.testPipelineFlyout.documentsTab.runDescriptionText"
-              defaultMessage="Execute the pipeline."
-            />
-          </p>
-        </EuiText>
-
         <EuiSpacer size="m" />
 
         <EuiButton
@@ -142,7 +135,7 @@ export const DocumentsTab: React.FunctionComponent<Props> = ({
           ) : (
             <FormattedMessage
               id="xpack.ingestPipelines.testPipelineFlyout.documentsTab.runButtonLabel"
-              defaultMessage="Run"
+              defaultMessage="Run the pipeline"
             />
           )}
         </EuiButton>

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/pipeline_test_flyout/tabs/tab_output.tsx

@@ -11,10 +11,10 @@ import {
   EuiSpacer,
   EuiText,
   EuiSwitch,
-  EuiLink,
-  EuiIcon,
+  EuiButton,
   EuiLoadingSpinner,
-  EuiIconTip,
+  EuiFlexGroup,
+  EuiFlexItem,
 } from '@elastic/eui';
 import { useTestConfigContext } from '../../test_config_context';
 
@@ -59,44 +59,39 @@ export const OutputTab: React.FunctionComponent<Props> = ({
         <p>
           <FormattedMessage
             id="xpack.ingestPipelines.testPipelineFlyout.outputTab.descriptionText"
-            defaultMessage="The output of the executed pipeline. {runLink}"
-            values={{
-              runLink: (
-                <EuiLink onClick={() => handleExecute(cachedDocuments!, cachedVerbose)}>
-                  <FormattedMessage
-                    id="xpack.ingestPipelines.testPipelineFlyout.outputTab.descriptionLinkLabel"
-                    defaultMessage="Refresh output"
-                  />{' '}
-                  <EuiIcon type="refresh" />
-                </EuiLink>
-              ),
-            }}
+            defaultMessage="View the output data, or see how each processor affects the document as it passes through the pipeline."
           />
         </p>
       </EuiText>
 
-      <EuiSpacer size="m" />
+      <EuiSpacer size="l" />
 
-      <EuiSwitch
-        label={
-          <>
+      <EuiFlexGroup justifyContent="spaceBetween" alignItems="center">
+        <EuiFlexItem grow={false}>
+          <EuiSwitch
+            label={
+              <FormattedMessage
+                id="xpack.ingestPipelines.testPipelineFlyout.outputTab.verboseSwitchLabel"
+                defaultMessage="View verbose output"
+              />
+            }
+            checked={cachedVerbose}
+            onChange={e => onEnableVerbose(e.target.checked)}
+          />
+        </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          <EuiButton
+            size="s"
+            onClick={() => handleExecute(cachedDocuments!, cachedVerbose)}
+            iconType="refresh"
+          >
             <FormattedMessage
-              id="xpack.ingestPipelines.testPipelineFlyout.outputTab.verboseSwitchLabel"
-              defaultMessage="View verbose output"
-            />{' '}
-            <EuiIconTip
-              content={
-                <FormattedMessage
-                  id="xpack.ingestPipelines.testPipelineFlyout.outputTab.verboseSwitchTooltipLabel"
-                  defaultMessage="Include output data for each processor in the executed pipeline response"
-                />
-              }
+              id="xpack.ingestPipelines.testPipelineFlyout.outputTab.descriptionLinkLabel"
+              defaultMessage="Refresh output"
             />
-          </>
-        }
-        checked={cachedVerbose}
-        onChange={e => onEnableVerbose(e.target.checked)}
-      />
+          </EuiButton>
+        </EuiFlexItem>
+      </EuiFlexGroup>
 
       <EuiSpacer size="m" />
 

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_form/schema.tsx

@@ -25,7 +25,7 @@ export const pipelineFormSchema: FormSchema = {
       {
         validator: emptyField(
           i18n.translate('xpack.ingestPipelines.form.pipelineNameRequiredError', {
-            defaultMessage: 'A pipeline name is required.',
+            defaultMessage: 'Name is required.',
           })
         ),
       },
@@ -40,7 +40,7 @@ export const pipelineFormSchema: FormSchema = {
       {
         validator: emptyField(
           i18n.translate('xpack.ingestPipelines.form.pipelineDescriptionRequiredError', {
-            defaultMessage: 'A pipeline description is required.',
+            defaultMessage: 'A description is required.',
           })
         ),
       },
@@ -83,7 +83,7 @@ export const pipelineFormSchema: FormSchema = {
       {
         validator: isJsonField(
           i18n.translate('xpack.ingestPipelines.form.processorsJsonError', {
-            defaultMessage: 'The processors JSON is not valid.',
+            defaultMessage: 'The input is not valid.',
           })
         ),
       },
@@ -91,7 +91,7 @@ export const pipelineFormSchema: FormSchema = {
   },
   on_failure: {
     label: i18n.translate('xpack.ingestPipelines.form.onFailureFieldLabel', {
-      defaultMessage: 'On-failure processors (optional)',
+      defaultMessage: 'Failure processors (optional)',
     }),
     helpText: (
       <FormattedMessage
@@ -130,7 +130,7 @@ export const pipelineFormSchema: FormSchema = {
           }
           return isJsonField(
             i18n.translate('xpack.ingestPipelines.form.onFailureProcessorsJsonError', {
-              defaultMessage: 'The on-failure processors JSON is not valid.',
+              defaultMessage: 'The input is not valid.',
             })
           )(validationArg);
         },

x-pack/plugins/ingest_pipelines/public/application/sections/pipelines_list/details_flyout.tsx

@@ -142,7 +142,7 @@ export const PipelineDetailsFlyout: FunctionComponent<Props> = ({
           {/* Processors JSON */}
           <EuiDescriptionListTitle>
             {i18n.translate('xpack.ingestPipelines.list.pipelineDetails.processorsTitle', {
-              defaultMessage: 'Processors JSON',
+              defaultMessage: 'Processors',
             })}
           </EuiDescriptionListTitle>
           <EuiDescriptionListDescription>
@@ -156,7 +156,7 @@ export const PipelineDetailsFlyout: FunctionComponent<Props> = ({
                 {i18n.translate(
                   'xpack.ingestPipelines.list.pipelineDetails.failureProcessorsTitle',
                   {
-                    defaultMessage: 'On failure processors JSON',
+                    defaultMessage: 'Failure processors',
                   }
                 )}
               </EuiDescriptionListTitle>

x-pack/plugins/ingest_pipelines/public/application/sections/pipelines_list/empty_list.tsx

@@ -5,25 +5,49 @@
  */
 import React, { FunctionComponent } from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiButton, EuiEmptyPrompt } from '@elastic/eui';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { EuiButton, EuiEmptyPrompt, EuiLink, EuiPageBody, EuiPageContent } from '@elastic/eui';
 import { BASE_PATH } from '../../../../common/constants';
+import { useKibana } from '../../../shared_imports';
 
-export const EmptyList: FunctionComponent = () => (
-  <EuiEmptyPrompt
-    iconType="managementApp"
-    title={
-      <h2>
-        {i18n.translate('xpack.ingestPipelines.list.table.emptyPromptTitle', {
-          defaultMessage: 'Start by creating a pipeline',
-        })}
-      </h2>
-    }
-    actions={
-      <EuiButton href={`#${BASE_PATH}/create`} iconType="plusInCircle" fill>
-        {i18n.translate('xpack.ingestPipelines.list.table.emptyPrompt.createButtonLabel', {
-          defaultMessage: 'Create a pipeline',
-        })}
-      </EuiButton>
-    }
-  />
-);
+export const EmptyList: FunctionComponent = () => {
+  const { services } = useKibana();
+
+  return (
+    <EuiPageBody>
+      <EuiPageContent>
+        <EuiEmptyPrompt
+          iconType="managementApp"
+          title={
+            <h2>
+              {i18n.translate('xpack.ingestPipelines.list.table.emptyPromptTitle', {
+                defaultMessage: 'Start by creating a pipeline',
+              })}
+            </h2>
+          }
+          body={
+            <p>
+              <FormattedMessage
+                id="xpack.ingestPipelines.list.table.emptyPromptDescription"
+                defaultMessage="For example, you might create a pipeline with one processor that removes a field and another processor that renames a field."
+              />
+              <br />
+              <EuiLink href={services.documentation.getIngestNodeUrl()} target="_blank" external>
+                {i18n.translate('xpack.ingestPipelines.list.table.emptyPromptDocumentionLink', {
+                  defaultMessage: 'Learn more',
+                })}
+              </EuiLink>
+            </p>
+          }
+          actions={
+            <EuiButton href={`#${BASE_PATH}/create`} iconType="plusInCircle" fill>
+              {i18n.translate('xpack.ingestPipelines.list.table.emptyPrompt.createButtonLabel', {
+                defaultMessage: 'Create a pipeline',
+              })}
+            </EuiButton>
+          }
+        />
+      </EuiPageContent>
+    </EuiPageBody>
+  );
+};

x-pack/plugins/ingest_pipelines/public/application/sections/pipelines_list/main.tsx

@@ -6,7 +6,6 @@
 
 import React, { useEffect, useState } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
-import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { Location } from 'history';
 import { parse } from 'query-string';
@@ -19,10 +18,11 @@ import {
   EuiFlexItem,
   EuiButtonEmpty,
   EuiCallOut,
+  EuiLink,
+  EuiSpacer,
+  EuiText,
 } from '@elastic/eui';
 
-import { EuiSpacer, EuiText } from '@elastic/eui';
-
 import { Pipeline } from '../../../../common/types';
 import { BASE_PATH } from '../../../../common/constants';
 import { useKibana, SectionLoading } from '../../../shared_imports';
@@ -102,7 +102,7 @@ export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({
       />
     );
   } else {
-    content = <EmptyList />;
+    return <EmptyList />;
   }
 
   const renderFlyout = (): React.ReactNode => {
@@ -162,7 +162,7 @@ export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({
             <EuiText color="subdued">
               <FormattedMessage
                 id="xpack.ingestPipelines.list.pipelinesDescription"
-                defaultMessage="Use ingest node pipelines to pre-process documents before indexing."
+                defaultMessage="Define a pipeline for preprocessing documents before indexing."
               />
             </EuiText>
           </EuiTitle>
@@ -172,9 +172,22 @@ export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({
             <EuiCallOut
               iconType="faceSad"
               color="danger"
-              title={i18n.translate('xpack.ingestPipelines.list.loadErrorTitle', {
-                defaultMessage: 'Cannot load pipelines, please refresh the page to try again.',
-              })}
+              title={
+                <FormattedMessage
+                  id="xpack.ingestPipelines.list.loadErrorTitle"
+                  defaultMessage="Unable to load pipelines. {reloadLink}"
+                  values={{
+                    reloadLink: (
+                      <EuiLink onClick={sendRequest}>
+                        <FormattedMessage
+                          id="xpack.ingestPipelines.list.loadErrorReloadLinkLabel"
+                          defaultMessage="Try again."
+                        />
+                      </EuiLink>
+                    ),
+                  }}
+                />
+              }
             />
           ) : (
             content