[App Search] Minor var names follow-up (#87258)

Constance · web-flow · commit 3fba4763fb33 · 2021-01-05T08:36:40.000-08:00
* Var rename

- so it doesn't sound negative or like a bug, but is instead an anticipated load/use case
- remove unncessary function
- move declaration down to right before it's used

* [Proposal] Other misc cleanup

- Rename engineNameParam to engineNameFromUrl to make reading flow a little bit more nicely + hopefully make the var source a bit clearer

- Change other references back to engineName for simplicity (they should really only be running after engineName has already been set, so there shouldn't be any race conditions there - moving engineBreadcrumb to after Loading should also solve that)
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.test.tsx
@@ -57,8 +57,7 @@ describe('EngineRouter', () => {
   });
 
   it('redirects to engines list and flashes an error if the engine param was not found', () => {
-    (useParams as jest.Mock).mockReturnValue({ engineName: '404-engine' });
-    setMockValues({ ...values, engineNotFound: true });
+    setMockValues({ ...values, engineNotFound: true, engineName: '404-engine' });
     const wrapper = shallow(<EngineRouter />);
 
     expect(wrapper.find(Redirect).prop('to')).toEqual('/engines');
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.tsx
@@ -69,31 +69,30 @@ export const EngineRouter: React.FC = () => {
     },
   } = useValues(AppLogic);
 
+  const { engineName: engineNameFromUrl } = useParams() as { engineName: string };
   const { engineName, dataLoading, engineNotFound } = useValues(EngineLogic);
   const { setEngineName, initializeEngine, clearEngine } = useActions(EngineLogic);
 
-  const { engineName: engineNameParam } = useParams() as { engineName: string };
-  const engineBreadcrumb = [ENGINES_TITLE, engineNameParam];
-
-  const isEngineInStateStale = () => engineName !== engineNameParam;
-
   useEffect(() => {
-    setEngineName(engineNameParam);
+    setEngineName(engineNameFromUrl);
     initializeEngine();
     return clearEngine;
-  }, [engineNameParam]);
+  }, [engineNameFromUrl]);
 
   if (engineNotFound) {
     setQueuedErrorMessage(
       i18n.translate('xpack.enterpriseSearch.appSearch.engine.notFound', {
-        defaultMessage: "No engine with name '{engineNameParam}' could be found.",
-        values: { engineNameParam },
+        defaultMessage: "No engine with name '{engineName}' could be found.",
+        values: { engineName },
       })
     );
     return <Redirect to={ENGINES_PATH} />;
   }
 
-  if (isEngineInStateStale() || dataLoading) return <Loading />;
+  const isLoadingNewEngine = engineName !== engineNameFromUrl;
+  if (isLoadingNewEngine || dataLoading) return <Loading />;
+
+  const engineBreadcrumb = [ENGINES_TITLE, engineName];
 
   return (
     <Switch>
