refactor(app): add compose util + use for hocs

Author: azinit

src/app/hocs/index.ts

@@ -1,9 +1,13 @@
+import { compose } from "shared/helpers";
 import withApollo from "./with-apollo";
 import withRouter from "./with-router";
 import withAntd from "./with-antd";
 
 /**
  * @hoc Инициализирующая логика приложения
- * FIXME: Потом какой-нибудь `compose` метод заинсталлим откуда-нить и покрасивше будет
+ * @remark Содержит:
+ * - логику инициализации antd (withAntd)
+ * - логику подключения к API (withApollo)
+ * - логику инициализации роутера (withRouter)
  */
-export const withHocs = (component: Component) => withAntd(withRouter(withApollo(component)));
+export const withHocs = compose(withAntd, withRouter, withApollo);

src/app/index.tsx

@@ -11,9 +11,8 @@ const ErrorPage = lazy(() => import("pages/error"));
 
 /**
  * Entry-point приложения
- * @remark Содержит в HOC-обертке
- * - логику подключения к API (withApollo)
- * - логику инициализации роутера (withRouter)
+ * @remark Содержит в HOC-обертке инициализирующую логику приложения
+ * @see withHocs
  */
 const App = () => {
     return (

src/shared/helpers/compose.ts

@@ -0,0 +1,55 @@
+/** @see https://github.com/reduxjs/redux/blob/master/src/compose.ts */
+
+type Func<T extends any[], R> = (...a: T) => R;
+
+/**
+ * Composes single-argument functions from right to left. The rightmost
+ * function can take multiple arguments as it provides the signature for the
+ * resulting composite function.
+ *
+ * @param funcs The functions to compose.
+ * @returns A function obtained by composing the argument functions from right
+ *   to left. For example, `compose(f, g, h)` is identical to doing
+ *   `(...args) => f(g(h(...args)))`.
+ */
+function compose(): <R>(a: R) => R;
+
+function compose<F extends Function>(f: F): F;
+
+/* two functions */
+function compose<A, T extends any[], R>(f1: (a: A) => R, f2: Func<T, A>): Func<T, R>;
+
+/* three functions */
+function compose<A, B, T extends any[], R>(
+    f1: (b: B) => R,
+    f2: (a: A) => B,
+    f3: Func<T, A>,
+): Func<T, R>;
+
+/* four functions */
+function compose<A, B, C, T extends any[], R>(
+    f1: (c: C) => R,
+    f2: (b: B) => C,
+    f3: (a: A) => B,
+    f4: Func<T, A>,
+): Func<T, R>;
+
+/* rest */
+function compose<R>(f1: (a: any) => R, ...funcs: Function[]): (...args: any[]) => R;
+
+function compose<R>(...funcs: Function[]): (...args: any[]) => R;
+
+function compose(...funcs: Function[]) {
+    if (funcs.length === 0) {
+        // infer the argument type so it is usable in inference down the line
+        return <T>(arg: T) => arg;
+    }
+
+    if (funcs.length === 1) {
+        return funcs[0];
+    }
+
+    return funcs.reduce((a, b) => (...args: any) => a(b(...args)));
+}
+
+export default compose;

src/shared/helpers/index.ts

@@ -1,5 +1,6 @@
 import * as str from "./string";
 import * as dom from "./dom";
 import * as alert from "./alert";
+import compose from "./compose";
 
-export { str, dom, alert };
+export { str, dom, alert, compose };