Remove state from the provider context

elastic · Feb 16, 2022 · ff64286 · ff64286
1 parent a256d8f
commit ff64286
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 12 deletions.
diff --git a/x-pack/plugins/cases/public/components/cases_context/cases_context_ui.tsx b/x-pack/plugins/cases/public/components/cases_context/cases_context_ui.tsx
@@ -9,13 +9,13 @@ import React from 'react';
 import { getCreateCaseFlyoutLazyNoProvider } from '../../methods';
 import { CasesContextState } from './cases_context_reducer';
 
-export const CasesContextUI = ({ state }: { state: CasesContextState }) => {
+export const CasesContextUI = React.memo(({ state }: { state: CasesContextState }) => {
   return (
     <>
       {state.createCaseFlyout.isFlyoutOpen && state.createCaseFlyout.props !== undefined
         ? getCreateCaseFlyoutLazyNoProvider(state.createCaseFlyout.props)
         : null}
     </>
   );
-};
+});
 CasesContextUI.displayName = 'CasesContextUi';
diff --git a/x-pack/plugins/cases/public/components/cases_context/index.tsx b/x-pack/plugins/cases/public/components/cases_context/index.tsx
@@ -13,7 +13,6 @@ import { useApplication } from './use_application';
 import {
   CasesContextStoreAction,
   casesContextReducer,
-  CasesContextState,
   initialCasesContextState,
 } from './cases_context_reducer';
 import { CasesContextFeatures, CasesFeatures } from '../../containers/types';
@@ -26,7 +25,6 @@ export interface CasesContextValue {
   userCanCrud: boolean;
   basePath: string;
   features: CasesContextFeatures;
-  state: CasesContextState;
   dispatch: (action: CasesContextStoreAction) => void;
 }
 
@@ -78,12 +76,12 @@ export const CasesProvider: React.FC<{ value: CasesContextProps }> = ({
   }, [appTitle, appId, userCanCrud]);
 
   const value = useMemo(() => {
-    return { ...baseValue, state, dispatch };
-  }, [baseValue, state]);
+    return { ...baseValue, dispatch };
+  }, [baseValue]);
 
   return isCasesContextValue(value) ? (
     <CasesContext.Provider value={value}>
-      <CasesContextUI state={value.state} />
+      <CasesContextUI state={state} />
       {children}
     </CasesContext.Provider>
   ) : null;

diff --git a/...k/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx b/...k/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx
@@ -10,10 +10,7 @@
 import { renderHook } from '@testing-library/react-hooks';
 import React from 'react';
 import { CasesContext } from '../../cases_context';
-import {
-  CasesContextStoreActionsList,
-  initialCasesContextState,
-} from '../../cases_context/cases_context_reducer';
+import { CasesContextStoreActionsList } from '../../cases_context/cases_context_reducer';
 import { useCasesAddToNewCaseFlyout } from './use_cases_add_to_new_case_flyout';
 
 describe('use cases add to new case flyout hook', () => {
@@ -30,7 +27,6 @@ describe('use cases add to new case flyout hook', () => {
             appId: 'test',
             appTitle: 'jest',
             basePath: '/jest',
-            state: initialCasesContextState(),
             dispatch,
             features: { alerts: { sync: true }, metrics: [] },
           }}