Fixed links to meta engine documents (#86702) (#87222)

x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.test.tsx

@@ -23,17 +23,22 @@ import { EngineOverview } from '../engine_overview';
 import { EngineRouter } from './';
 
 describe('EngineRouter', () => {
-  const values = { dataLoading: false, engineNotFound: false, myRole: {} };
+  const values = {
+    dataLoading: false,
+    engineNotFound: false,
+    myRole: {},
+    engineName: 'some-engine',
+  };
   const actions = { setEngineName: jest.fn(), initializeEngine: jest.fn(), clearEngine: jest.fn() };
 
   beforeEach(() => {
     setMockValues(values);
     setMockActions(actions);
+    (useParams as jest.Mock).mockReturnValue({ engineName: 'some-engine' });
   });
 
   describe('useEffect', () => {
     beforeEach(() => {
-      (useParams as jest.Mock).mockReturnValue({ engineName: 'some-engine' });
       shallow(<EngineRouter />);
     });
 
@@ -45,7 +50,7 @@ describe('EngineRouter', () => {
       expect(actions.initializeEngine).toHaveBeenCalled();
     });
 
-    it('clears engine on unmount', () => {
+    it('clears engine on unmount and on update', () => {
       unmountHandler();
       expect(actions.clearEngine).toHaveBeenCalled();
     });
@@ -68,6 +73,16 @@ describe('EngineRouter', () => {
     expect(wrapper.find(Loading)).toHaveLength(1);
   });
 
+  // This would happen if a user jumps around from one engine route to another. If the engine name
+  // on the path has changed, but we still have an engine stored in state, we do not want to load
+  // any route views as they would be rendering with the wrong data.
+  it('renders a loading component if the engine stored in state is stale', () => {
+    setMockValues({ ...values, engineName: 'some-engine' });
+    (useParams as jest.Mock).mockReturnValue({ engineName: 'some-new-engine' });
+    const wrapper = shallow(<EngineRouter />);
+    expect(wrapper.find(Loading)).toHaveLength(1);
+  });
+
   it('renders a default engine overview', () => {
     const wrapper = shallow(<EngineRouter />);
 
@@ -76,7 +91,7 @@ describe('EngineRouter', () => {
   });
 
   it('renders an analytics view', () => {
-    setMockValues({ myRole: { canViewEngineAnalytics: true } });
+    setMockValues({ ...values, myRole: { canViewEngineAnalytics: true } });
     const wrapper = shallow(<EngineRouter />);
 
     expect(wrapper.find('[data-test-subj="AnalyticsTODO"]')).toHaveLength(1);

x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.tsx

@@ -69,29 +69,31 @@ export const EngineRouter: React.FC = () => {
     },
   } = useValues(AppLogic);
 
-  const { dataLoading, engineNotFound } = useValues(EngineLogic);
+  const { engineName, dataLoading, engineNotFound } = useValues(EngineLogic);
   const { setEngineName, initializeEngine, clearEngine } = useActions(EngineLogic);
 
-  const { engineName } = useParams() as { engineName: string };
-  const engineBreadcrumb = [ENGINES_TITLE, engineName];
+  const { engineName: engineNameParam } = useParams() as { engineName: string };
+  const engineBreadcrumb = [ENGINES_TITLE, engineNameParam];
+
+  const isEngineInStateStale = () => engineName !== engineNameParam;
 
   useEffect(() => {
-    setEngineName(engineName);
+    setEngineName(engineNameParam);
     initializeEngine();
     return clearEngine;
-  }, [engineName]);
+  }, [engineNameParam]);
 
   if (engineNotFound) {
     setQueuedErrorMessage(
       i18n.translate('xpack.enterpriseSearch.appSearch.engine.notFound', {
-        defaultMessage: "No engine with name '{engineName}' could be found.",
-        values: { engineName },
+        defaultMessage: "No engine with name '{engineNameParam}' could be found.",
+        values: { engineNameParam },
       })
     );
     return <Redirect to={ENGINES_PATH} />;
   }
 
-  if (dataLoading) return <Loading />;
+  if (isEngineInStateStale() || dataLoading) return <Loading />;
 
   return (
     <Switch>