@anansi/core 0.13.0 → 0.14.0

package/src/spouts/json.server.tsx

@@ -1,23 +1,24 @@
 import React from 'react';
 
-import type { ServerProps, ResolveProps } from './types';
+import type { ServerSpout } from './types';
 
 type NeededNext = {
   initData?: Record<string, () => unknown>;
   scripts?: React.ReactNode[];
-} & ResolveProps;
+};
 
 export default function JSONSpout({
   id = 'anansi-json',
-}: { id?: string } = {}) {
-  return function <N extends NeededNext, I extends ServerProps>(
-    next: (props: I) => Promise<N>,
-  ) {
-    return async (props: I) => {
-      const nextProps = await next(props);
+}: { id?: string } = {}): ServerSpout<
+  Record<string, unknown>,
+  Record<string, unknown>,
+  NeededNext
+> {
+  return next => async props => {
+    const nextProps = await next(props);
 
-      const scripts: React.ReactNode[] = nextProps.scripts ?? [];
-      /*
+    const scripts: React.ReactNode[] = nextProps.scripts ?? [];
+    /*
       Object.entries(nextProps.initData ?? {}).forEach(([key, data]) => {
         try {
           const encoded = JSON.stringify(data);
@@ -37,37 +38,36 @@ export default function JSONSpout({
           console.error(e);
         }
       });*/
-      const Script = () => {
-        try {
-          const data: any = {};
-          Object.entries(nextProps.initData ?? {}).forEach(([key, getData]) => {
-            data[key] = getData();
-          });
-          const encoded = JSON.stringify(data);
-          return (
-            <script
-              key={id}
-              id={id}
-              type="application/json"
-              dangerouslySetInnerHTML={{
-                __html: encoded,
-              }}
-              nonce={props.nonce}
-            />
-          );
-        } catch (e) {
-          // TODO: Use unified logging
-          console.error('Error serializing json');
-          console.error(e);
-          return null;
-        }
-      };
-      scripts.push(<Script />);
+    const Script = () => {
+      try {
+        const data: any = {};
+        Object.entries(nextProps.initData ?? {}).forEach(([key, getData]) => {
+          data[key] = getData();
+        });
+        const encoded = JSON.stringify(data);
+        return (
+          <script
+            key={id}
+            id={id}
+            type="application/json"
+            dangerouslySetInnerHTML={{
+              __html: encoded,
+            }}
+            nonce={props.nonce}
+          />
+        );
+      } catch (e) {
+        // TODO: Use unified logging
+        console.error('Error serializing json');
+        console.error(e);
+        return null;
+      }
+    };
+    scripts.push(<Script />);
 
-      return {
-        ...nextProps,
-        scripts,
-      };
+    return {
+      ...nextProps,
+      scripts,
     };
   };
 }

package/src/spouts/json.tsx

@@ -1,17 +1,14 @@
-import type { ResolveProps } from './types';
-
-type NeededNext = ResolveProps;
+import type { ClientSpout } from './types';
 
 export default function JSONSpout({
   id = 'anansi-json',
-}: { id?: string } = {}) {
-  return function <N extends NeededNext, I extends Record<string, unknown>>(
-    next: (props: I & { initData: Record<string, unknown> }) => Promise<N>,
-  ) {
-    return async (props: I) => {
-      const initData = getDatafromDOM(id);
-      return await next({ ...props, initData });
-    };
+}: { id?: string } = {}): ClientSpout<
+  Record<string, unknown>,
+  { initData: Record<string, unknown> }
+> {
+  return next => async props => {
+    const initData = getDatafromDOM(id);
+    return { ...(await next({ ...props, initData })), initData };
   };
 }
 function getDatafromDOM(id: string): Record<string, unknown> {

package/src/spouts/restHooks.server.tsx

@@ -2,42 +2,38 @@ import { Controller, Manager, NetworkManager, State } from '@rest-hooks/core';
 import type { Store } from 'redux';
 
 import { createPersistedStore } from './rhHelp';
-import type { ResolveProps, ServerProps } from './types';
-
-type NeededNext = { initData?: Record<string, () => unknown> } & ResolveProps;
+import type { ServerSpout } from './types';
 
 export default function restHooksSpout(
   options: {
     getManagers: () => Manager[];
   } = { getManagers: () => [new NetworkManager()] },
-) {
-  return function <N extends NeededNext, I extends ServerProps>(
-    next: (
-      props: I & { controller: Controller; store: Store<State<unknown>> },
-    ) => Promise<N>,
-  ) {
-    return async (props: I) => {
-      const [ServerCacheProvider, controller, store] = createPersistedStore(
-        options.getManagers(),
-      );
+): ServerSpout<
+  Record<string, unknown>,
+  { controller: Controller; store: Store<State<unknown>> },
+  { initData?: Record<string, () => unknown> }
+> {
+  return next => async props => {
+    const [ServerCacheProvider, controller, store] = createPersistedStore(
+      options.getManagers(),
+    );
 
-      const nextProps = await next({
-        ...props,
-        controller,
-        store,
-      });
+    const nextProps = await next({
+      ...props,
+      controller,
+      store,
+    });
 
-      return {
-        ...nextProps,
-        initData: {
-          ...nextProps.initData,
-          resthooks: () => store.getState(),
-        },
-        app: <ServerCacheProvider>{nextProps.app}</ServerCacheProvider>,
-        // TODO: figure out how to only inject in next and not have to also put here
-        controller,
-        store,
-      };
+    return {
+      ...nextProps,
+      initData: {
+        ...nextProps.initData,
+        resthooks: () => store.getState(),
+      },
+      app: <ServerCacheProvider>{nextProps.app}</ServerCacheProvider>,
+      // TODO: figure out how to only inject in next and not have to also put here
+      controller,
+      store,
     };
   };
 }

package/src/spouts/restHooks.tsx

@@ -5,31 +5,25 @@ import {
   State,
 } from '@rest-hooks/core';
 
-import type { ResolveProps } from './types';
-
-type NeededNext = ResolveProps;
+import type { ClientSpout } from './types';
 
 export default function restHooksSpout(
   options: {
     getManagers: () => Manager[];
   } = { getManagers: () => [new NetworkManager()] },
-) {
-  return function <N extends NeededNext, I extends Record<string, unknown>>(
-    next: (props: I) => Promise<N>,
-  ) {
-    return async (props: I & { initData: Record<string, unknown> }) => {
-      const data = props.initData.resthooks as State<unknown>;
+): ClientSpout<{ initData: Record<string, unknown> }> {
+  return next => async props => {
+    const data = props.initData.resthooks as State<unknown>;
 
-      const nextProps = await next(props);
+    const nextProps = await next(props);
 
-      return {
-        ...nextProps,
-        app: (
-          <CacheProvider initialState={data} managers={options.getManagers()}>
-            {nextProps.app}
-          </CacheProvider>
-        ),
-      };
+    return {
+      ...nextProps,
+      app: (
+        <CacheProvider initialState={data} managers={options.getManagers()}>
+          {nextProps.app}
+        </CacheProvider>
+      ),
     };
   };
 }

package/src/spouts/router.server.tsx

@@ -2,15 +2,19 @@ import { Route, RouteProvider, RouteController } from '@anansi/router';
 import React from 'react';
 import { createMemoryHistory } from 'history';
 
-import type { ResolveProps, ServerProps, CreateRouter } from './types';
-
-type NeededNext = ResolveProps;
+import type { CreateRouter, ServerSpout } from './types';
 
 export default function routerSpout<ResolveWith>(options: {
   resolveWith?: any;
   useResolveWith: () => ResolveWith;
   createRouter: CreateRouter<ResolveWith>;
-}) {
+}): ServerSpout<
+  Record<string, unknown>,
+  {
+    matchedRoutes: Route<ResolveWith>[];
+    router: RouteController<Route<ResolveWith, any>>;
+  }
+> {
   const createRouteComponent = (
     router: RouteController<Route<ResolveWith, any>>,
   ) =>
@@ -24,36 +28,27 @@ export default function routerSpout<ResolveWith>(options: {
       );
     };
 
-  return function <N extends NeededNext, I extends ServerProps>(
-    next: (
-      props: I & {
-        matchedRoutes: Route<ResolveWith>[];
-        router: RouteController<Route<ResolveWith, any>>;
-      },
-    ) => Promise<N>,
-  ) {
-    return async (props: I) => {
-      const url = props.req.url || '';
-      const router = options.createRouter(
-        createMemoryHistory({ initialEntries: [url] }),
-      );
-      const matchedRoutes: Route<ResolveWith>[] = router.getMatchedRoutes(url);
-
-      const nextProps = await next({
-        ...props,
-        matchedRoutes,
-        router,
-      });
-
-      const Router = createRouteComponent(router);
-
-      return {
-        ...nextProps,
-        app: <Router>{nextProps.app}</Router>,
-        // TODO: figure out how to only inject in next and not have to also put here
-        matchedRoutes,
-        router,
-      };
+  return next => async props => {
+    const url = props.req.url || '';
+    const router = options.createRouter(
+      createMemoryHistory({ initialEntries: [url] }),
+    );
+    const matchedRoutes: Route<ResolveWith>[] = router.getMatchedRoutes(url);
+
+    const nextProps = await next({
+      ...props,
+      matchedRoutes,
+      router,
+    });
+
+    const Router = createRouteComponent(router);
+
+    return {
+      ...nextProps,
+      app: <Router>{nextProps.app}</Router>,
+      // TODO: figure out how to only inject in next and not have to also put here
+      matchedRoutes,
+      router,
     };
   };
 }

package/src/spouts/router.tsx

@@ -3,16 +3,20 @@ import React from 'react';
 import { createBrowserHistory } from 'history';
 import type { Update } from 'history';
 
-import type { ResolveProps, CreateRouter } from './types';
-
-type NeededNext = ResolveProps;
+import type { CreateRouter, ClientSpout } from './types';
 
 export default function routerSpout<ResolveWith>(options: {
   resolveWith?: any;
   useResolveWith: () => ResolveWith;
   createRouter: CreateRouter<ResolveWith>;
   onChange?: (update: Update, callback: () => void | undefined) => void;
-}) {
+}): ClientSpout<
+  Record<string, unknown>,
+  {
+    matchedRoutes: Route<ResolveWith, any>[];
+    router: RouteController<Route<ResolveWith, any>>;
+  }
+> {
   const createRouteComponent = (
     router: RouteController<Route<ResolveWith, any>>,
   ) =>
@@ -30,23 +34,19 @@ export default function routerSpout<ResolveWith>(options: {
       );
     };
 
-  return function <N extends NeededNext, I extends Record<string, unknown>>(
-    next: (initData: Record<string, unknown>) => Promise<N>,
-  ) {
-    return async (props: I) => {
-      const history = createBrowserHistory();
-      const router = options.createRouter(history);
-      const matchedRoutes = router.getMatchedRoutes(history.location.pathname);
+  return next => async props => {
+    const history = createBrowserHistory();
+    const router = options.createRouter(history);
+    const matchedRoutes = router.getMatchedRoutes(history.location.pathname);
 
-      const nextProps = await next(props);
+    const nextProps = await next({ ...props, matchedRoutes, router });
 
-      const Router = createRouteComponent(router);
-      return {
-        ...nextProps,
-        matchedRoutes,
-        router,
-        app: <Router>{nextProps.app}</Router>,
-      };
+    const Router = createRouteComponent(router);
+    return {
+      ...nextProps,
+      matchedRoutes,
+      router,
+      app: <Router>{nextProps.app}</Router>,
     };
   };
 }

package/src/spouts/types.ts

@@ -20,3 +20,21 @@ export type ResolveProps = {
 export type CreateRouter<T> = (
   history: History,
 ) => RouteController<Route<T, any>>;
+
+/* Spouts are middleware for Anansi */
+export type ServerSpout<
+  NeededProps extends Record<string, unknown> = Record<string, unknown>,
+  ProvidedProps extends Record<string, unknown> = Record<string, unknown>,
+  NeededNext extends Record<string, unknown> = NeededProps,
+> = <N extends NeededNext & ResolveProps, I extends NeededProps & ServerProps>(
+  next: (props: I & ProvidedProps) => Promise<N>,
+) => (props: I) => Promise<N & ProvidedProps>;
+
+/* Spouts are middleware for Anansi */
+export type ClientSpout<
+  NeededProps extends Record<string, unknown> = Record<string, unknown>,
+  ProvidedProps extends Record<string, unknown> = Record<string, unknown>,
+  NeededNext extends Record<string, unknown> = NeededProps,
+> = <N extends NeededNext & ResolveProps, I extends NeededProps>(
+  next: (props: I & ProvidedProps) => Promise<N>,
+) => (props: I) => Promise<N & ProvidedProps>;