Compose Remix routes

remix-compose-routes.ts

import type { LinksFunction, LoaderFunction, MetaFunction } from "remix";

export let composeMeta =
  (
    ...metas: (MetaFunction | { data: string; meta: MetaFunction })[]
  ): MetaFunction =>
  (args) =>
    metas.reduce<ReturnType<MetaFunction>>((res, meta) => {
      if (typeof meta === "function") {
        return { ...res, ...meta(args) };
      }
      let newArgs = { ...args, data: args.data[meta.data] };
      return { ...res, ...meta.meta(newArgs) };
    }, {});

export let composeLinks =
  (
    ...links: (LinksFunction | { data: string; links: LinksFunction })[]
  ): LinksFunction =>
  (args) =>
    links.reduce<ReturnType<LinksFunction>>((res, link) => {
      if (typeof link === "function") {
        return [...res, ...link(args)];
      }

      let newArgs = { ...args, data: args.data[link.data] };
      return [...res, ...link.links(newArgs)];
    }, []);

export let composeLoaders =
  (
    ...loaders: (LoaderFunction | { as: string; loader: LoaderFunction })[]
  ): LoaderFunction =>
  async (args) => {
    let loaderResults = await Promise.all(
      loaders.map(async (loader) => {
        if (typeof loader === "function") {
          return loader(args);
        }

        // TODO: handle Response return type
        return { [loader.as]: await loader.loader(args) };
      })
    );

    // TODO: handle Response return type
    return loaderResults.reduce(
      (res, loaderRes) => ({ ...res, ...loaderRes }),
      {}
    );
  };