[Workplace Search] Add sub nav and fix rendering bugs in Personal dashboard (#96100)

* Fix route for private deferated source summary

* Make schema types nullable

Federated sources don’t have counts and the server returns null so our routes have to expect that sometimes these values will be null

* Add SourceSubNav to Personal dashboard

We are able to leverage the existing component with a couple a small change; the existing componet is a subnav in the larger Enterprise Search shared navigation component and does not include its styles. This caused the list items to render with bullet points next to them. Adding this class and displaying the nav items as block elements fixes this issue.

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/components/source_sub_nav.tsx

@@ -33,7 +33,7 @@ export const SourceSubNav: React.FC = () => {
   const isCustom = serviceType === CUSTOM_SERVICE_TYPE;
 
   return (
-    <>
+    <div className="sourcesSubNav">
       <SideNavLink to={getContentSourcePath(SOURCE_DETAILS_PATH, id, isOrganization)}>
         {NAV.OVERVIEW}
       </SideNavLink>
@@ -53,6 +53,6 @@ export const SourceSubNav: React.FC = () => {
       <SideNavLink to={getContentSourcePath(SOURCE_SETTINGS_PATH, id, isOrganization)}>
         {NAV.SETTINGS}
       </SideNavLink>
-    </>
+    </div>
   );
 };

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/private_sources_layout.test.tsx

@@ -17,6 +17,8 @@ import { EuiCallOut } from '@elastic/eui';
 
 import { ViewContentHeader } from '../../components/shared/view_content_header';
 
+import { SourceSubNav } from './components/source_sub_nav';
+
 import {
   PRIVATE_CAN_CREATE_PAGE_TITLE,
   PRIVATE_VIEW_ONLY_PAGE_TITLE,
@@ -40,6 +42,7 @@ describe('PrivateSourcesLayout', () => {
     const wrapper = shallow(<PrivateSourcesLayout>{children}</PrivateSourcesLayout>);
 
     expect(wrapper.find('[data-test-subj="TestChildren"]')).toHaveLength(1);
+    expect(wrapper.find(SourceSubNav)).toHaveLength(1);
   });
 
   it('uses correct title and description when private sources are enabled', () => {

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/private_sources_layout.tsx

@@ -14,6 +14,8 @@ import { EuiPage, EuiPageSideBar, EuiPageBody, EuiCallOut } from '@elastic/eui';
 import { AppLogic } from '../../app_logic';
 import { ViewContentHeader } from '../../components/shared/view_content_header';
 
+import { SourceSubNav } from './components/source_sub_nav';
+
 import {
   PRIVATE_DASHBOARD_READ_ONLY_MODE_WARNING,
   PRIVATE_CAN_CREATE_PAGE_TITLE,
@@ -49,6 +51,7 @@ export const PrivateSourcesLayout: React.FC<LayoutProps> = ({
     <EuiPage className="enterpriseSearchLayout privateSourcesLayout">
       <EuiPageSideBar className="enterpriseSearchLayout__sideBar privateSourcesLayout__sideBar">
         <ViewContentHeader title={PAGE_TITLE} description={PAGE_DESCRIPTION} />
+        <SourceSubNav />
       </EuiPageSideBar>
       <EuiPageBody className="enterpriseSearchLayout__body" restrictWidth={restrictWidth}>
         {readOnlyMode && (

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/source_logic.test.ts

@@ -214,7 +214,7 @@ describe('SourceLogic', () => {
         SourceLogic.actions.initializeFederatedSummary(contentSource.id);
 
         expect(http.get).toHaveBeenCalledWith(
-          '/api/workplace_search/org/sources/123/federated_summary'
+          '/api/workplace_search/account/sources/123/federated_summary'
         );
         await promise;
         expect(onUpdateSummarySpy).toHaveBeenCalledWith(contentSource.summary);

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/source_logic.ts

@@ -156,7 +156,7 @@ export const SourceLogic = kea<MakeLogicType<SourceValues, SourceActions>>({
       }
     },
     initializeFederatedSummary: async ({ sourceId }) => {
-      const route = `/api/workplace_search/org/sources/${sourceId}/federated_summary`;
+      const route = `/api/workplace_search/account/sources/${sourceId}/federated_summary`;
       try {
         const response = await HttpLogic.values.http.get(route);
         actions.onUpdateSummary(response.summary);

x-pack/plugins/enterprise_search/public/applications/workplace_search/views/content_sources/sources.scss

@@ -30,3 +30,9 @@
     margin-left: -$sideBarWidth;
   }
 }
+
+.sourcesSubNav {
+  li {
+    display: block;
+  }
+}

x-pack/plugins/enterprise_search/server/routes/workplace_search/sources.ts

@@ -22,9 +22,9 @@ const schemaValuesSchema = schema.recordOf(
 );
 
 const pageSchema = schema.object({
-  current: schema.number(),
-  size: schema.number(),
-  total_pages: schema.number(),
+  current: schema.nullable(schema.number()),
+  size: schema.nullable(schema.number()),
+  total_pages: schema.nullable(schema.number()),
   total_results: schema.number(),
 });