@modern-js/plugin-data-loader 2.5.0 → 2.5.1-alpha.0

package/dist/cjs/cli/generate-client.js

@@ -17,6 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/cli/loader.js

@@ -28,6 +28,9 @@ async function loader(source) {
   if (target === "node") {
     return source;
   }
+  if (target === "webworker") {
+    return source;
+  }
   const options = this.getOptions();
   const code = (0, import_generate_client.generateClient)({
     mapFile: options.mapFile,

package/dist/cjs/server/index.js

@@ -17,6 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -37,6 +41,20 @@ var import_utils = require("@modern-js/utils");
 var import_constants = require("../common/constants");
 (0, import_node.installGlobals)();
 const redirectStatusCodes = /* @__PURE__ */ new Set([301, 302, 303, 307, 308]);
+function sortByUrlPath(entries) {
+  entries.sort(function(a, b) {
+    const length1 = a.urlPath.length;
+    const length2 = b.urlPath.length;
+    if (length1 < length2) {
+      return 1;
+    }
+    if (length1 > length2) {
+      return -1;
+    }
+    return 0;
+  });
+  return entries;
+}
 function isRedirectResponse(response) {
   return redirectStatusCodes.has(response.status);
 }
@@ -59,6 +77,7 @@ const callRouteLoader = async ({
   loader,
   params,
   request,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   loadContext
 }) => {
   if (!loader) {
@@ -130,7 +149,8 @@ const getPathWithoutEntry = (pathname, entryPath) => {
   return pathname.replace(entryPath, "");
 };
 const matchEntry = (pathname, entries) => {
-  return entries.find((entry) => pathname.startsWith(entry.urlPath));
+  const newEntries = sortByUrlPath(entries);
+  return newEntries.find((entry) => pathname.startsWith(entry.urlPath));
 };
 const handleRequest = async ({
   context,

package/dist/esm/cli/loader.js

@@ -138,6 +138,12 @@ function _loader() {
                     source
                 ];
             }
+            if (target === "webworker") {
+                return [
+                    2,
+                    source
+                ];
+            }
             options = this.getOptions();
             code = generateClient({
                 mapFile: options.mapFile,

package/dist/esm/server/index.js

@@ -233,6 +233,20 @@ var redirectStatusCodes = /* @__PURE__ */ new Set([
     307,
     308
 ]);
+function sortByUrlPath(entries) {
+    entries.sort(function(a, b) {
+        var length1 = a.urlPath.length;
+        var length2 = b.urlPath.length;
+        if (length1 < length2) {
+            return 1;
+        }
+        if (length1 > length2) {
+            return -1;
+        }
+        return 0;
+    });
+    return entries;
+}
 function isRedirectResponse(response) {
     return redirectStatusCodes.has(response.status);
 }
@@ -254,7 +268,8 @@ var json = function(data) {
 };
 var callRouteLoader = function() {
     var _ref = _asyncToGenerator(function(param) {
-        var routeId, loader, params, request, loadContext, result, error;
+        var routeId, loader, params, request, // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        loadContext, result, error;
         return __generator(this, function(_state) {
             switch(_state.label){
                 case 0:
@@ -431,7 +446,8 @@ var getPathWithoutEntry = function(pathname, entryPath) {
     return pathname.replace(entryPath, "");
 };
 var matchEntry = function(pathname, entries) {
-    return entries.find(function(entry) {
+    var newEntries = sortByUrlPath(entries);
+    return newEntries.find(function(entry) {
         return pathname.startsWith(entry.urlPath);
     });
 };

package/dist/esm-node/cli/loader.js

@@ -6,6 +6,9 @@ async function loader(source) {
   if (target === "node") {
     return source;
   }
+  if (target === "webworker") {
+    return source;
+  }
   const options = this.getOptions();
   const code = generateClient({
     mapFile: options.mapFile,

package/dist/esm-node/server/index.js

@@ -11,6 +11,20 @@ import { MAIN_ENTRY_NAME, SERVER_BUNDLE_DIRECTORY } from "@modern-js/utils";
 import { LOADER_ID_PARAM } from "../common/constants";
 installGlobals();
 const redirectStatusCodes = /* @__PURE__ */ new Set([301, 302, 303, 307, 308]);
+function sortByUrlPath(entries) {
+  entries.sort(function(a, b) {
+    const length1 = a.urlPath.length;
+    const length2 = b.urlPath.length;
+    if (length1 < length2) {
+      return 1;
+    }
+    if (length1 > length2) {
+      return -1;
+    }
+    return 0;
+  });
+  return entries;
+}
 function isRedirectResponse(response) {
   return redirectStatusCodes.has(response.status);
 }
@@ -33,6 +47,7 @@ const callRouteLoader = async ({
   loader,
   params,
   request,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   loadContext
 }) => {
   if (!loader) {
@@ -104,7 +119,8 @@ const getPathWithoutEntry = (pathname, entryPath) => {
   return pathname.replace(entryPath, "");
 };
 const matchEntry = (pathname, entries) => {
-  return entries.find((entry) => pathname.startsWith(entry.urlPath));
+  const newEntries = sortByUrlPath(entries);
+  return newEntries.find((entry) => pathname.startsWith(entry.urlPath));
 };
 const handleRequest = async ({
   context,

package/dist/js/modern/cli/create-request.js

@@ -0,0 +1,66 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { compile } from "path-to-regexp";
+import { redirect } from "react-router-dom";
+import { LOADER_ID_PARAM, DIRECT_PARAM } from "../common/constants";
+const getRequestUrl = ({
+  params,
+  request,
+  routeId
+}) => {
+  const url = new URL(request.url);
+  const toPath = compile(url.pathname, {
+    encode: encodeURIComponent
+  });
+  const newPathName = toPath(params);
+  url.pathname = newPathName;
+  url.searchParams.append(LOADER_ID_PARAM, routeId);
+  url.searchParams.append(DIRECT_PARAM, "true");
+  return url;
+};
+const handleRedirectResponse = (res) => {
+  const { headers } = res;
+  const location = headers.get("X-Modernjs-Redirect");
+  if (location) {
+    return redirect(location);
+  }
+  return res;
+};
+const createRequest = (routeId, method = "get") => {
+  return (_0) => __async(void 0, [_0], function* ({
+    params,
+    request
+  }) {
+    const url = getRequestUrl({ params, request, routeId });
+    const res = yield fetch(url, {
+      method,
+      signal: request.signal
+    });
+    if (!res.ok) {
+      throw res;
+    }
+    return handleRedirectResponse(res);
+  });
+};
+export {
+  createRequest,
+  getRequestUrl
+};

package/dist/js/modern/cli/generate-client.js

@@ -0,0 +1,42 @@
+import path from "path";
+const generateClient = ({
+  mapFile,
+  loaderId
+}) => {
+  delete require.cache[mapFile];
+  const loadersMap = require(mapFile);
+  let requestCode = ``;
+  let exportsCode = ``;
+  const requestCreatorPath = path.join(__dirname, "./create-request").replace("/node/cli/", "/treeshaking/cli/").replace(/\\/g, "/");
+  const importCode = `
+    import { createRequest } from '${requestCreatorPath}';
+  `;
+  if (!loaderId) {
+    requestCode = Object.keys(loadersMap).map((loaderId2) => {
+      const { routeId } = loadersMap[loaderId2];
+      return `
+      const ${loaderId2} = createRequest('${routeId}');
+    `;
+    }).join("");
+    exportsCode = `export {`;
+    for (const loader of Object.keys(loadersMap)) {
+      exportsCode += `${loader},`;
+    }
+    exportsCode += "}";
+  } else {
+    const loader = loadersMap[loaderId];
+    requestCode = `
+      const loader = createRequest('${loader.routeId}');
+    `;
+    exportsCode = `export default loader;`;
+  }
+  const generatedCode = `
+    ${importCode}
+    ${requestCode}
+    ${exportsCode}
+  `;
+  return generatedCode;
+};
+export {
+  generateClient
+};

package/dist/js/modern/cli/loader.js

@@ -0,0 +1,40 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { generateClient } from "./generate-client";
+function loader(source) {
+  return __async(this, null, function* () {
+    var _a;
+    this.cacheable();
+    const target = (_a = this._compiler) == null ? void 0 : _a.options.target;
+    if (target === "node") {
+      return source;
+    }
+    const options = this.getOptions();
+    const code = generateClient({
+      mapFile: options.mapFile,
+      loaderId: options.loaderId
+    });
+    return code;
+  });
+}
+export {
+  loader as default
+};

package/dist/js/modern/common/constants.js

@@ -0,0 +1,6 @@
+const LOADER_ID_PARAM = "__loader";
+const DIRECT_PARAM = "__ssrDirect";
+export {
+  DIRECT_PARAM,
+  LOADER_ID_PARAM
+};

package/dist/js/modern/server/index.js

@@ -0,0 +1,237 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import path from "path";
+import {
+  installGlobals,
+  writeReadableStreamToWritable,
+  Response as NodeResponse
+} from "@remix-run/node";
+import {
+  matchRoutes
+} from "react-router-dom";
+import { MAIN_ENTRY_NAME, SERVER_BUNDLE_DIRECTORY } from "@modern-js/utils";
+import { LOADER_ID_PARAM } from "../common/constants";
+installGlobals();
+const redirectStatusCodes = /* @__PURE__ */ new Set([301, 302, 303, 307, 308]);
+function isRedirectResponse(response) {
+  return redirectStatusCodes.has(response.status);
+}
+function isResponse(value) {
+  return value != null && typeof value.status === "number" && typeof value.statusText === "string" && typeof value.headers === "object" && typeof value.body !== "undefined";
+}
+const json = (data, init = {}) => {
+  const responseInit = typeof init === "number" ? { status: init } : init;
+  const headers = new Headers(responseInit.headers);
+  if (!headers.has("Content-Type")) {
+    headers.set("Content-Type", "application/json; charset=utf-8");
+  }
+  return new NodeResponse(JSON.stringify(data), __spreadProps(__spreadValues({}, responseInit), {
+    headers
+  }));
+};
+const callRouteLoader = (_0) => __async(void 0, [_0], function* ({
+  routeId,
+  loader,
+  params,
+  request,
+  loadContext
+}) {
+  if (!loader) {
+    throw new Error(
+      `You made a ${request.method} request to ${request.url} but did not provide a default component or \`loader\` for route "${routeId}", so there is no way to handle the request.`
+    );
+  }
+  let result;
+  try {
+    result = yield loader({
+      request,
+      params
+    });
+  } catch (error) {
+    if (!isResponse(error)) {
+      throw error;
+    }
+    result = error;
+  }
+  if (result === void 0) {
+    throw new Error(
+      `You defined a loader for route "${routeId}" but didn't return anything from your \`loader\` function. Please return a value or \`null\`.`
+    );
+  }
+  return isResponse(result) ? result : json(result);
+});
+const createLoaderHeaders = (requestHeaders) => {
+  const headers = new Headers();
+  for (const [key, values] of Object.entries(requestHeaders)) {
+    if (values) {
+      if (Array.isArray(values)) {
+        for (const value of values) {
+          headers.append(key, value);
+        }
+      } else {
+        headers.set(key, values);
+      }
+    }
+  }
+  return headers;
+};
+const createLoaderRequest = (context) => {
+  const origin = `${context.protocol}://${context.host}`;
+  const url = new URL(context.url, origin);
+  const controller = new AbortController();
+  const init = {
+    method: context.method,
+    headers: createLoaderHeaders(context.headers),
+    signal: controller.signal
+  };
+  return new Request(url.href, init);
+};
+const sendLoaderResponse = (res, nodeResponse) => __async(void 0, null, function* () {
+  res.statusMessage = nodeResponse.statusText;
+  res.statusCode = nodeResponse.status;
+  for (const [key, value] of nodeResponse.headers.entries()) {
+    res.setHeader(key, value);
+  }
+  if (nodeResponse.body) {
+    yield writeReadableStreamToWritable(nodeResponse.body, res);
+  } else {
+    res.end();
+  }
+});
+const getPathWithoutEntry = (pathname, entryPath) => {
+  if (entryPath === "/") {
+    return pathname;
+  }
+  return pathname.replace(entryPath, "");
+};
+const matchEntry = (pathname, entries) => {
+  return entries.find((entry) => pathname.startsWith(entry.urlPath));
+};
+const handleRequest = (_0) => __async(void 0, [_0], function* ({
+  context,
+  serverRoutes,
+  distDir
+}) {
+  const { method, query } = context;
+  const routeId = query[LOADER_ID_PARAM];
+  if (!routeId || method.toLowerCase() !== "get") {
+    return;
+  }
+  const entry = matchEntry(context.path, serverRoutes);
+  if (!entry) {
+    return;
+  }
+  const routesPath = path.join(
+    distDir,
+    SERVER_BUNDLE_DIRECTORY,
+    `${entry.entryName || MAIN_ENTRY_NAME}-server-loaders`
+  );
+  const { routes } = yield import(routesPath);
+  if (!routes) {
+    return;
+  }
+  const { res } = context;
+  const pathname = getPathWithoutEntry(context.path, entry.urlPath);
+  const matches = matchRoutes(routes, pathname);
+  if (!matches) {
+    res.statusCode = 403;
+    res.end(`Route ${pathname} was not matched`);
+    return;
+  }
+  const match = matches == null ? void 0 : matches.find((match2) => match2.route.id === routeId);
+  if (!match) {
+    res.statusCode = 403;
+    res.end(`Route ${routeId} does not match URL ${context.path}`);
+    return;
+  }
+  const request = createLoaderRequest(context);
+  let response;
+  try {
+    response = yield callRouteLoader({
+      loader: match.route.loader,
+      routeId: match.route.id,
+      params: match.params,
+      request,
+      loadContext: {}
+    });
+    if (isRedirectResponse(response)) {
+      const headers = new Headers(response.headers);
+      headers.set("X-Modernjs-Redirect", headers.get("Location"));
+      headers.delete("Location");
+      response = new NodeResponse(null, {
+        status: 204,
+        headers
+      });
+    }
+  } catch (error) {
+    const message = String(error);
+    response = new NodeResponse(message, {
+      status: 500,
+      headers: {
+        "Content-Type": "text/plain"
+      }
+    });
+  }
+  sendLoaderResponse(res, response);
+});
+var server_default = () => ({
+  name: "@modern-js/plugin-data-loader",
+  setup: () => ({
+    preparebeforeRouteHandler({
+      serverRoutes,
+      distDir
+    }) {
+      return (context) => __async(this, null, function* () {
+        return handleRequest({
+          serverRoutes,
+          distDir,
+          context
+        });
+      });
+    }
+  })
+});
+export {
+  server_default as default,
+  getPathWithoutEntry,
+  handleRequest,
+  isRedirectResponse,
+  isResponse
+};

package/dist/js/node/cli/create-request.js

@@ -0,0 +1,90 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var create_request_exports = {};
+__export(create_request_exports, {
+  createRequest: () => createRequest,
+  getRequestUrl: () => getRequestUrl
+});
+module.exports = __toCommonJS(create_request_exports);
+var import_path_to_regexp = require("path-to-regexp");
+var import_react_router_dom = require("react-router-dom");
+var import_constants = require("../common/constants");
+const getRequestUrl = ({
+  params,
+  request,
+  routeId
+}) => {
+  const url = new URL(request.url);
+  const toPath = (0, import_path_to_regexp.compile)(url.pathname, {
+    encode: encodeURIComponent
+  });
+  const newPathName = toPath(params);
+  url.pathname = newPathName;
+  url.searchParams.append(import_constants.LOADER_ID_PARAM, routeId);
+  url.searchParams.append(import_constants.DIRECT_PARAM, "true");
+  return url;
+};
+const handleRedirectResponse = (res) => {
+  const { headers } = res;
+  const location = headers.get("X-Modernjs-Redirect");
+  if (location) {
+    return (0, import_react_router_dom.redirect)(location);
+  }
+  return res;
+};
+const createRequest = (routeId, method = "get") => {
+  return (_0) => __async(void 0, [_0], function* ({
+    params,
+    request
+  }) {
+    const url = getRequestUrl({ params, request, routeId });
+    const res = yield fetch(url, {
+      method,
+      signal: request.signal
+    });
+    if (!res.ok) {
+      throw res;
+    }
+    return handleRedirectResponse(res);
+  });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createRequest,
+  getRequestUrl
+});