[Workplace Search] Misc bugfixes (#94612) (#94708)

* Fix incorrect copy * Fix incorrect copy * Update Box icon to match other icon sizes * Add missing spacer on connector configuration screen * Add missing spacer to Manage Source modal on Group page * Remove shadows on Security page * Align the last column content in tables to the right * Fix colors on save custom source page "Secondary" is greenish in new version is EUI, we need "subdued" * Fix link to personal dashboard * Add missing breadcrumbs to Security and Settings pages * Deduplicate Security tests on Basic and Platinum licenses * Prevent range slider from shifting to left when priority is 10 When priority is 10, the number become wider and it pushes the range slider to the left. This commit is a quick fix for that. We could improve it later by adding a proper input. * Fix i18n duplicate ID * Revert "Fix link to personal dashboard" This reverts commit 5fc3ad2. Co-authored-by: Vadim Yakhin <[email protected]>
elastic · Mar 16, 2021 · 0c5cd74 · 0c5cd74
1 parent 6eee0a6
commit 0c5cd74
Show file tree

Hide file tree

Showing 17 changed files with 38 additions and 26 deletions.
diff --git a/...lic/applications/workplace_search/components/shared/assets/source_icons/box.svg b/...lic/applications/workplace_search/components/shared/assets/source_icons/box.svg
diff --git a/..._search/public/applications/workplace_search/components/shared/source_row/source_row.scss b/..._search/public/applications/workplace_search/components/shared/source_row/source_row.scss
@@ -8,10 +8,6 @@
     font-weight: 500;
   }
 
-  &__actions {
-    width: 100px;
-  }
-
   &__actions a {
     opacity: 1.0;
     pointer-events: auto;

diff --git a/...e_search/public/applications/workplace_search/components/shared/source_row/source_row.tsx b/...e_search/public/applications/workplace_search/components/shared/source_row/source_row.tsx
@@ -164,7 +164,7 @@ export const SourceRow: React.FC<SourceRowProps> = ({
           />
         </EuiTableRowCell>
       )}
-      <EuiTableRowCell className="source-row__actions">
+      <EuiTableRowCell align="right">
         <EuiFlexGroup justifyContent="flexEnd" alignItems="center" gutterSize="s">
           {showFix && <EuiFlexItem grow={false}>{fixLink}</EuiFlexItem>}
           <EuiFlexItem grow={false}>

diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/constants.ts b/x-pack/plugins/enterprise_search/public/applications/workplace_search/constants.ts
@@ -574,7 +574,7 @@ export const CUSTOMIZE_HEADER_DESCRIPTION = i18n.translate(
 export const CUSTOMIZE_NAME_LABEL = i18n.translate(
   'xpack.enterpriseSearch.workplaceSearch.customize.name.label',
   {
-    defaultMessage: 'Personalize general organization settings.',
+    defaultMessage: 'Organization name',
   }
 );
 

diff --git a/...applications/workplace_search/views/content_sources/components/add_source/save_config.tsx b/...applications/workplace_search/views/content_sources/components/add_source/save_config.tsx
@@ -224,6 +224,7 @@ export const SaveConfig: React.FC<SaveConfigProps> = ({
   return (
     <>
       {header}
+      <EuiSpacer size="l" />
       <form onSubmit={handleFormSubmission}>
         <EuiSteps steps={configSteps} className="adding-a-source__config-steps" />
       </form>

diff --git a/...applications/workplace_search/views/content_sources/components/add_source/save_custom.tsx b/...applications/workplace_search/views/content_sources/components/add_source/save_custom.tsx
@@ -102,7 +102,7 @@ export const SaveCustom: React.FC<SaveCustomProps> = ({
               <EuiTitle size="xs">
                 <h4>{SAVE_CUSTOM_API_KEYS_TITLE}</h4>
               </EuiTitle>
-              <EuiText grow={false} size="s" color="secondary">
+              <EuiText grow={false} size="s" color="subdued">
                 <p>{SAVE_CUSTOM_API_KEYS_BODY}</p>
               </EuiText>
               <EuiSpacer />
@@ -126,7 +126,7 @@ export const SaveCustom: React.FC<SaveCustomProps> = ({
                 <h4>{SAVE_CUSTOM_VISUAL_WALKTHROUGH_TITLE}</h4>
               </EuiTitle>
               <EuiSpacer size="xs" />
-              <EuiText color="secondary" size="s">
+              <EuiText color="subdued" size="s">
                 <p>
                   <FormattedMessage
                     id="xpack.enterpriseSearch.workplaceSearch.contentSource.saveCustom.documentation.text"
@@ -148,7 +148,7 @@ export const SaveCustom: React.FC<SaveCustomProps> = ({
                 <h4>{SAVE_CUSTOM_STYLING_RESULTS_TITLE}</h4>
               </EuiTitle>
               <EuiSpacer size="xs" />
-              <EuiText color="secondary" size="s">
+              <EuiText color="subdued" size="s">
                 <p>
                   <FormattedMessage
                     id="xpack.enterpriseSearch.workplaceSearch.contentSource.saveCustom.displaySettings.text"
@@ -179,7 +179,7 @@ export const SaveCustom: React.FC<SaveCustomProps> = ({
                 <h4>{SAVE_CUSTOM_DOC_PERMISSIONS_TITLE}</h4>
               </EuiTitle>
               <EuiSpacer size="xs" />
-              <EuiText color="secondary" size="s">
+              <EuiText color="subdued" size="s">
                 <p>
                   <FormattedMessage
                     id="xpack.enterpriseSearch.workplaceSearch.contentSource.saveCustom.permissions.text"

diff --git a/...search/public/applications/workplace_search/views/content_sources/components/overview.tsx b/...search/public/applications/workplace_search/views/content_sources/components/overview.tsx
@@ -180,7 +180,7 @@ export const Overview: React.FC = () => {
         <EuiTableHeader>
           <EuiTableHeaderCell>{EVENT_HEADER}</EuiTableHeaderCell>
           {!custom && <EuiTableHeaderCell>{STATUS_HEADER}</EuiTableHeaderCell>}
-          <EuiTableHeaderCell>{TIME_HEADER}</EuiTableHeaderCell>
+          <EuiTableHeaderCell align="right">{TIME_HEADER}</EuiTableHeaderCell>
         </EuiTableHeader>
         <EuiTableBody>
           {activities.map(({ details: activityDetails, event, time, status }, i) => (
@@ -203,7 +203,7 @@ export const Overview: React.FC = () => {
                   </EuiText>
                 </EuiTableRowCell>
               )}
-              <EuiTableRowCell>
+              <EuiTableRowCell align="right">
                 <EuiText size="xs">{time}</EuiText>
               </EuiTableRowCell>
             </EuiTableRow>

diff --git a/.../public/applications/workplace_search/views/content_sources/components/source_content.tsx b/.../public/applications/workplace_search/views/content_sources/components/source_content.tsx
@@ -151,7 +151,9 @@ export const SourceContent: React.FC = () => {
             </EuiLink>
           )}
         </EuiTableRowCell>
-        <EuiTableRowCell>{moment(updated).format('M/D/YYYY, h:mm:ss A')}</EuiTableRowCell>
+        <EuiTableRowCell align="right">
+          {moment(updated).format('M/D/YYYY, h:mm:ss A')}
+        </EuiTableRowCell>
       </EuiTableRow>
     );
   };
@@ -164,7 +166,7 @@ export const SourceContent: React.FC = () => {
         <EuiTableHeader>
           <EuiTableHeaderCell>{TITLE_HEADING}</EuiTableHeaderCell>
           <EuiTableHeaderCell>{startCase(urlField)}</EuiTableHeaderCell>
-          <EuiTableHeaderCell>{LAST_UPDATED_HEADING}</EuiTableHeaderCell>
+          <EuiTableHeaderCell align="right">{LAST_UPDATED_HEADING}</EuiTableHeaderCell>
         </EuiTableHeader>
         <EuiTableBody>{contentItems.map(contentItem)}</EuiTableBody>
       </EuiTable>

diff --git a/...enterprise_search/public/applications/workplace_search/views/content_sources/constants.ts b/...enterprise_search/public/applications/workplace_search/views/content_sources/constants.ts
@@ -300,9 +300,9 @@ export const SOURCE_REMOVE_TITLE = i18n.translate(
 );
 
 export const SOURCE_REMOVE_DESCRIPTION = i18n.translate(
-  'xpack.enterpriseSearch.workplaceSearch.sources.config.description',
+  'xpack.enterpriseSearch.workplaceSearch.sources.remove.description',
   {
-    defaultMessage: 'Edit content source connector settings to change.',
+    defaultMessage: 'This action cannot be undone.',
   }
 );
 

diff --git a/...erprise_search/public/applications/workplace_search/views/groups/components/group_row.tsx b/...erprise_search/public/applications/workplace_search/views/groups/components/group_row.tsx
@@ -91,7 +91,7 @@ export const GroupRow: React.FC<Group> = ({
           </div>
         </EuiTableRowCell>
       )}
-      <EuiTableRowCell>
+      <EuiTableRowCell align="right">
         <strong>
           <EuiLinkTo to={getGroupPath(id)}>
             <EuiIcon type="pencil" />

diff --git a/...lic/applications/workplace_search/views/groups/components/group_source_prioritization.tsx b/...lic/applications/workplace_search/views/groups/components/group_source_prioritization.tsx
@@ -164,7 +164,7 @@ export const GroupSourcePrioritization: React.FC = () => {
                     }
                   />
                 </EuiFlexItem>
-                <EuiFlexItem grow={false} style={{ paddingLeft: 10 }}>
+                <EuiFlexItem grow={false} style={{ paddingLeft: 10, width: 32 }}>
                   <div style={{ margin: 0 }} className="input-container--range__count">
                     {activeSourcePriorities[id]}
                   </div>

diff --git a/...rch/public/applications/workplace_search/views/groups/components/shared_sources_modal.tsx b/...rch/public/applications/workplace_search/views/groups/components/shared_sources_modal.tsx
@@ -9,6 +9,7 @@ import React from 'react';
 
 import { useActions, useValues } from 'kea';
 
+import { EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 
 import { GroupLogic } from '../group_logic';
@@ -53,6 +54,7 @@ export const SharedSourcesModal: React.FC = () => {
             values: { groupName: group.name },
           })}
         </p>
+        <EuiSpacer size="m" />
         <SourcesList
           contentSources={contentSources}
           filteredSources={selectedGroupSources}

diff --git a/.../public/applications/workplace_search/views/security/components/private_sources_table.tsx b/.../public/applications/workplace_search/views/security/components/private_sources_table.tsx
@@ -103,7 +103,7 @@ export const PrivateSourcesTable: React.FC<PrivateSourcesTableProps> = ({
   const emptyState = (
     <>
       <EuiSpacer />
-      <EuiPanel className="euiPanel--inset euiPanel--noShadow euiPanel--outline">
+      <EuiPanel className="euiPanel--inset euiPanel--outline" hasShadow={false} color="subdued">
         <EuiText textAlign="center" color="subdued" size="s">
           <strong>
             {isRemote ? REMOTE_SOURCES_EMPTY_TABLE_TITLE : STANDARD_SOURCES_EMPTY_TABLE_TITLE}
@@ -175,7 +175,7 @@ export const PrivateSourcesTable: React.FC<PrivateSourcesTableProps> = ({
   );
 
   return (
-    <EuiPanel className={panelClass}>
+    <EuiPanel hasShadow={false} className={panelClass}>
       {sectionHeading}
       {hasSources && sourcesTable}
     </EuiPanel>

diff --git a/...s/enterprise_search/public/applications/workplace_search/views/security/security.test.tsx b/...s/enterprise_search/public/applications/workplace_search/views/security/security.test.tsx
@@ -14,6 +14,8 @@ import { shallow } from 'enzyme';
 
 import { EuiSwitch, EuiConfirmModal } from '@elastic/eui';
 
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
+
 import { Loading } from '../../../shared/loading';
 import { UnsavedChangesPrompt } from '../../../shared/unsaved_changes_prompt';
 import { ViewContentHeader } from '../../components/shared/view_content_header';
@@ -53,20 +55,19 @@ describe('Security', () => {
     });
   });
 
-  it('renders on Basic license', () => {
+  it('renders', () => {
     setMockValues({ ...mockValues, hasPlatinumLicense: false });
     const wrapper = shallow(<Security />);
 
+    expect(wrapper.find(SetPageChrome)).toHaveLength(1);
     expect(wrapper.find(UnsavedChangesPrompt)).toHaveLength(1);
     expect(wrapper.find(ViewContentHeader)).toHaveLength(1);
     expect(wrapper.find(EuiSwitch).prop('disabled')).toEqual(true);
   });
 
-  it('renders on Platinum license', () => {
+  it('does not disable switch on Platinum license', () => {
     const wrapper = shallow(<Security />);
 
-    expect(wrapper.find(UnsavedChangesPrompt)).toHaveLength(1);
-    expect(wrapper.find(ViewContentHeader)).toHaveLength(1);
     expect(wrapper.find(EuiSwitch).prop('disabled')).toEqual(false);
   });
 

diff --git a/...lugins/enterprise_search/public/applications/workplace_search/views/security/security.tsx b/...lugins/enterprise_search/public/applications/workplace_search/views/security/security.tsx
@@ -23,6 +23,7 @@ import {
 } from '@elastic/eui';
 
 import { FlashMessages } from '../../../shared/flash_messages';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { LicensingLogic } from '../../../shared/licensing';
 import { Loading } from '../../../shared/loading';
 import { UnsavedChangesPrompt } from '../../../shared/unsaved_changes_prompt';
@@ -40,6 +41,7 @@ import {
   PRIVATE_PLATINUM_LICENSE_CALLOUT,
   CONFIRM_CHANGES_TEXT,
   PRIVATE_SOURCES_UPDATE_CONFIRMATION_TEXT,
+  NAV,
 } from '../../constants';
 
 import { PrivateSourcesTable } from './components/private_sources_table';
@@ -114,7 +116,7 @@ export const Security: React.FC = () => {
   );
 
   const allSourcesToggle = (
-    <EuiPanel paddingSize="none" className={panelClass}>
+    <EuiPanel paddingSize="none" hasShadow={false} className={panelClass}>
       <EuiFlexGroup alignItems="center" justifyContent="flexStart" gutterSize="m">
         <EuiFlexItem grow={false}>
           <EuiSwitch
@@ -176,6 +178,7 @@ export const Security: React.FC = () => {
 
   return (
     <>
+      <SetPageChrome trail={[NAV.SECURITY]} />
       <FlashMessages />
       <UnsavedChangesPrompt
         hasUnsavedChanges={unsavedChanges}

diff --git a/...prise_search/public/applications/workplace_search/views/settings/settings_router.test.tsx b/...prise_search/public/applications/workplace_search/views/settings/settings_router.test.tsx
@@ -15,6 +15,7 @@ import { Route, Redirect, Switch } from 'react-router-dom';
 import { shallow } from 'enzyme';
 
 import { FlashMessages } from '../../../shared/flash_messages';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { staticSourceData } from '../content_sources/source_data';
 
 import { Connectors } from './components/connectors';
@@ -37,6 +38,7 @@ describe('SettingsRouter', () => {
     const wrapper = shallow(<SettingsRouter />);
 
     expect(wrapper.find(FlashMessages)).toHaveLength(1);
+    expect(wrapper.find(SetPageChrome)).toHaveLength(3);
     expect(wrapper.find(Switch)).toHaveLength(1);
     expect(wrapper.find(Route)).toHaveLength(NUM_ROUTES);
     expect(wrapper.find(Redirect)).toHaveLength(1);

diff --git a/...enterprise_search/public/applications/workplace_search/views/settings/settings_router.tsx b/...enterprise_search/public/applications/workplace_search/views/settings/settings_router.tsx
@@ -11,6 +11,8 @@ import { Redirect, Route, Switch } from 'react-router-dom';
 import { useActions } from 'kea';
 
 import { FlashMessages } from '../../../shared/flash_messages';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
+import { NAV } from '../../constants';
 import {
   ORG_SETTINGS_PATH,
   ORG_SETTINGS_CUSTOMIZE_PATH,
@@ -38,12 +40,15 @@ export const SettingsRouter: React.FC = () => {
       <Switch>
         <Redirect exact from={ORG_SETTINGS_PATH} to={ORG_SETTINGS_CUSTOMIZE_PATH} />
         <Route exact path={ORG_SETTINGS_CUSTOMIZE_PATH}>
+          <SetPageChrome trail={[NAV.SETTINGS]} />
           <Customize />
         </Route>
         <Route exact path={ORG_SETTINGS_CONNECTORS_PATH}>
+          <SetPageChrome trail={[NAV.SETTINGS, NAV.SETTINGS_SOURCE_PRIORITIZATION]} />
           <Connectors />
         </Route>
         <Route exact path={ORG_SETTINGS_OAUTH_APPLICATION_PATH}>
+          <SetPageChrome trail={[NAV.SETTINGS, NAV.SETTINGS_OAUTH]} />
           <OauthApplication />
         </Route>
         {staticSourceData.map(({ editPath }, i) => (