fix(withalien): pass alienModule

src/app/components/pages/Home/index.tsx

@@ -4,6 +4,9 @@ import withAlien from '~/store/config/alienStore/withAlien';
 import HomeComponent from './Home';
 
 const Home: FunctionComponent = () =>
-  withAlien(HomeComponent, () => import('~/store/modules/products/products.module'));
+  withAlien(HomeComponent, {
+    id: 'products',
+    getModule: () => import('~/store/modules/products/products.module'),
+  });
 
 export default Home;

src/app/store/config/alienStore/useAlien.tsx

@@ -19,7 +19,7 @@ export interface ReduxModule<T = {}> {
 
 export type AlienResult = Omit<ReduxModule, 'reducers'>;
 
-interface AlienModule<T> {
+export interface AlienModule<T = {}> {
   id: string;
   getModule: () => Promise<ReduxModule<T>>;
   initialActions?: Array<string>;

src/app/store/config/alienStore/withAlien.test.tsx

@@ -23,8 +23,11 @@ describe('test "withAlien"', () => {
     const Example = (): ReactElement => <div>some component</div>;
 
     const getModule = (): Promise<typeof reduxModule> => Promise.resolve(reduxModule);
-
-    const { result, waitForNextUpdate } = renderHook(() => withAlien(Example, getModule), {
+    const alienModule = {
+      id: 'with',
+      getModule,
+    };
+    const { result, waitForNextUpdate } = renderHook(() => withAlien(Example, alienModule), {
       wrapper,
     });
 

src/app/store/config/alienStore/withAlien.tsx

@@ -1,30 +1,22 @@
-import React, { ReactElement, ComponentType, ReactNode } from 'react';
+import React, { ReactElement, ComponentType } from 'react';
 
-import useAlien, { ReduxModule, AlienResult } from './useAlien';
+import useAlien, { AlienResult, AlienModule } from './useAlien';
 
 interface WithAlienProps {
-  children?: ReactNode;
   actions: AlienResult['actions'];
 }
 
 function WithAlien<P extends object>(
   Component: ComponentType<P>,
-  getModule: () => Promise<ReduxModule>,
+  alienModule: AlienModule,
 ): ReactElement<P & WithAlienProps> | null {
-  // it complains just beacause the function doesn't start with Capital case
-  // so it thinks it not a React component
-  // eslint-disable-next-line react-hooks/rules-of-hooks
-  const alienResult = useAlien({
-    getModule,
-  });
+  const alienResult = useAlien(alienModule);
 
   if (alienResult) {
     return <Component {...(alienResult as P)} />;
   }
 
   return null;
-  // return <Component {...((alienResult && alienResult) as P)} />;
-  // return typeof props.children === 'function' ? props.children() : props.children;
 }
 
 export default WithAlien;