dn-react-router-toolkit 0.4.4 → 0.5.0

package/dist/crud/crud_form_provider.mjs

@@ -0,0 +1,124 @@
+// src/crud/crud_form_provider.tsx
+import { useNavigate } from "react-router";
+import { useStore } from "dn-react-toolkit/store";
+import { createContext, useContext } from "react";
+import React from "react";
+var FormContext = createContext({});
+function useFormContext() {
+  return useContext(FormContext);
+}
+function CrudFormProvider({
+  primaryKey = "id",
+  name,
+  prefix,
+  item,
+  columns = {},
+  children
+}) {
+  const apiPrefix = `/api${prefix}`;
+  const store = useStore({
+    ...item || {}
+  });
+  const navigate = useNavigate();
+  const submit = async () => {
+    const res = await fetch(apiPrefix, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify(
+        Object.entries(store.state).reduce(
+          function reducer(acc, [key, value]) {
+            const converter = (value2) => {
+              if (value2 === void 0) {
+                return void 0;
+              }
+              if (value2 === null) {
+                return {
+                  type: "null",
+                  value: null
+                };
+              }
+              if (typeof value2 === "string") {
+                return {
+                  type: "string",
+                  value: value2
+                };
+              }
+              if (typeof value2 === "number") {
+                return {
+                  type: "number",
+                  value: value2
+                };
+              }
+              if (typeof value2 === "boolean") {
+                return {
+                  type: "boolean",
+                  value: value2
+                };
+              }
+              if (value2 instanceof Date) {
+                return {
+                  type: "date",
+                  value: value2.toISOString()
+                };
+              }
+              if (Array.isArray(value2)) {
+                return value2.map((v) => converter(v));
+              }
+              if (typeof value2 === "object") {
+                return Object.entries(
+                  value2
+                ).reduce(reducer, {});
+              }
+            };
+            return {
+              ...acc,
+              [key]: converter(value)
+            };
+          },
+          {}
+        )
+      )
+    });
+    if (!res.ok) {
+      const { message } = await res.json();
+      alert(message);
+      return;
+    }
+    alert(`${name}\uB97C \uC800\uC7A5\uD588\uC2B5\uB2C8\uB2E4.`);
+    const { id } = await res.json();
+    navigate(`${prefix}/${id}`);
+  };
+  const deleteItem = async () => {
+    if (!item || !primaryKey) {
+      return;
+    }
+    const ok = confirm("\uC815\uB9D0\uB85C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?");
+    if (!ok) {
+      return;
+    }
+    const res = await fetch(`${apiPrefix}/${item[primaryKey]}`, {
+      method: "DELETE"
+    });
+    if (!res.ok) {
+      const { message } = await res.json();
+      alert(message);
+      return;
+    }
+    alert(`${name}\uB97C \uC0AD\uC81C\uD588\uC2B5\uB2C8\uB2E4.`);
+    navigate(`${prefix}`);
+  };
+  return /* @__PURE__ */ React.createElement(
+    FormContext.Provider,
+    {
+      value: { name, item, store, submit, delete: deleteItem, columns }
+    },
+    children
+  );
+}
+export {
+  FormContext,
+  CrudFormProvider as default,
+  useFormContext
+};

package/dist/crud/crud_loader.d.mts

@@ -0,0 +1,21 @@
+import { LoaderFunctionArgs } from 'react-router';
+import { TableLoaderOptions } from '../table/loader.mjs';
+import { TableItemLoaderOptions } from '../table/item_loader.mjs';
+import { Table } from 'drizzle-orm';
+import { TableRepository } from '../table/repository.mjs';
+import { APIHandlerOptions } from '../api/create_api_handler.mjs';
+import 'drizzle-orm/pg-core';
+import '../auth/with_auth.mjs';
+import 'dn-react-toolkit/auth';
+import 'dn-react-toolkit/auth/server';
+
+type CrudHandlerOptions<T extends Table, TSelect> = {
+    repository: TableRepository<T, TSelect>;
+    apiHandlerOptions: Omit<APIHandlerOptions<T, TSelect>, "repository">;
+    loaderOptions: Omit<TableLoaderOptions<T, TSelect>, "repository">;
+    itemLoaderOptions: Omit<TableItemLoaderOptions<T, TSelect>, "repository">;
+};
+type CrudHandler = (prefix: string) => (args: LoaderFunctionArgs) => Promise<any>;
+declare function crudHandler<T extends Table, TSelect>({ repository, apiHandlerOptions, loaderOptions, itemLoaderOptions, }: CrudHandlerOptions<T, TSelect>): (prefix: string) => (args: LoaderFunctionArgs) => Promise<any>;
+
+export { type CrudHandler, type CrudHandlerOptions, crudHandler };

package/dist/crud/crud_loader.d.ts

@@ -0,0 +1,21 @@
+import { LoaderFunctionArgs } from 'react-router';
+import { TableLoaderOptions } from '../table/loader.js';
+import { TableItemLoaderOptions } from '../table/item_loader.js';
+import { Table } from 'drizzle-orm';
+import { TableRepository } from '../table/repository.js';
+import { APIHandlerOptions } from '../api/create_api_handler.js';
+import 'drizzle-orm/pg-core';
+import '../auth/with_auth.js';
+import 'dn-react-toolkit/auth';
+import 'dn-react-toolkit/auth/server';
+
+type CrudHandlerOptions<T extends Table, TSelect> = {
+    repository: TableRepository<T, TSelect>;
+    apiHandlerOptions: Omit<APIHandlerOptions<T, TSelect>, "repository">;
+    loaderOptions: Omit<TableLoaderOptions<T, TSelect>, "repository">;
+    itemLoaderOptions: Omit<TableItemLoaderOptions<T, TSelect>, "repository">;
+};
+type CrudHandler = (prefix: string) => (args: LoaderFunctionArgs) => Promise<any>;
+declare function crudHandler<T extends Table, TSelect>({ repository, apiHandlerOptions, loaderOptions, itemLoaderOptions, }: CrudHandlerOptions<T, TSelect>): (prefix: string) => (args: LoaderFunctionArgs) => Promise<any>;
+
+export { type CrudHandler, type CrudHandlerOptions, crudHandler };

package/dist/crud/crud_loader.js

@@ -0,0 +1,288 @@
+"use strict";
+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);
+
+// src/crud/crud_loader.tsx
+var crud_loader_exports = {};
+__export(crud_loader_exports, {
+  crudHandler: () => crudHandler
+});
+module.exports = __toCommonJS(crud_loader_exports);
+
+// src/table/loader.tsx
+var import_drizzle_orm = require("drizzle-orm");
+function tableLoader({
+  repository,
+  tableOptions
+}) {
+  return async ({ request }) => {
+    const searchParams = new URL(request.url).searchParams;
+    const { where, searchKey, defaultOrderBy, defaultDirection } = tableOptions;
+    const query = searchParams.get("query") ?? void 0;
+    const limit = Number(searchParams.get("limit") ?? "10");
+    const offset = Number(searchParams.get("offset") ?? "0");
+    const orderBy = searchParams.get("orderBy") ?? defaultOrderBy;
+    const direction = searchParams.get("direction") ?? defaultDirection;
+    const whereClauses = (0, import_drizzle_orm.and)(
+      searchKey && query ? (0, import_drizzle_orm.ilike)(
+        repository.schema[searchKey],
+        `%${query}%`
+      ) : void 0,
+      ...where ?? []
+    );
+    const total = await repository.countTotal({ where: whereClauses });
+    const items = await repository.findAll({
+      orderBy,
+      direction,
+      limit,
+      offset,
+      where: whereClauses
+    });
+    return {
+      table: {
+        items,
+        total,
+        limit,
+        offset,
+        orderBy,
+        direction,
+        searchKey
+      }
+    };
+  };
+}
+
+// src/table/item_loader.tsx
+var tableItemloader = ({
+  loader,
+  repository
+}) => {
+  return async ({ params }) => {
+    const body = loader ? await (async () => {
+      const result = await loader({ params });
+      if (result instanceof Response) {
+        return result.json();
+      }
+      return result;
+    })() : {};
+    if (params["itemId"] === "new") {
+      return { item: void 0, ...body };
+    }
+    const item = params["itemId"] ? await repository.find(params["itemId"]) : void 0;
+    return {
+      item,
+      ...body
+    };
+  };
+};
+
+// src/api/create_api_handler.ts
+var import_http = require("dn-react-toolkit/http");
+var import_drizzle_orm2 = require("drizzle-orm");
+var import_react_router = require("react-router");
+var import_uuid = require("uuid");
+function apiHandler({
+  withAuthAction,
+  repository,
+  validators,
+  existingConditions,
+  injectUserId
+}) {
+  const loader = async ({ request }) => {
+    return {};
+  };
+  const action = withAuthAction((auth) => async ({ request }) => {
+    if (!auth || auth.role !== "admin") {
+      return (0, import_react_router.redirect)("/login");
+    }
+    switch (request.method) {
+      case "POST":
+      case "PUT": {
+        const serilaizedParams = await request.json();
+        const params = Object.entries(serilaizedParams).reduce(
+          function reducer(acc, [key, value]) {
+            const converter = (value2) => {
+              if (value2.type === "null") {
+                return null;
+              }
+              if (value2.type === "string") {
+                return value2.value;
+              }
+              if (value2.type === "number") {
+                return value2.value;
+              }
+              if (value2.type === "boolean") {
+                return value2.value;
+              }
+              if (value2.type === "date") {
+                return new Date(value2.value);
+              }
+              if (Array.isArray(value2)) {
+                return value2.map((v) => converter(v));
+              }
+              if (typeof value2 === "object") {
+                return Object.entries(value2).reduce(
+                  reducer,
+                  {}
+                );
+              }
+            };
+            const result = converter(value);
+            if (result === void 0) {
+              return acc;
+            }
+            return {
+              ...acc,
+              [key]: result
+            };
+          },
+          {}
+        );
+        if (validators) {
+          const paramsForValidation = Object.keys(validators).filter(
+            (key) => Object.prototype.hasOwnProperty.call(
+              validators,
+              key
+            )
+          );
+          for (const paramKey of paramsForValidation) {
+            const value = params[paramKey];
+            const validator = validators[paramKey];
+            if (validator?.validate && !validator.validate(value)) {
+              throw (0, import_http.BAD_REQUEST)(
+                validator.message ? validator.message(value) : void 0
+              );
+            }
+          }
+        }
+        const itemId = params.id || (0, import_uuid.v4)();
+        if (!params.id && existingConditions) {
+          const paramsForExistenceCheck = Object.keys(
+            existingConditions
+          ).filter(
+            (key) => Object.prototype.hasOwnProperty.call(params, key)
+          );
+          const where = (0, import_drizzle_orm2.and)(
+            ...paramsForExistenceCheck.reduce((acc, key) => {
+              const condition = existingConditions[key];
+              if (condition) {
+                acc.push(condition(params[key]));
+              }
+              return acc;
+            }, [])
+          );
+          const existing = await repository.findAll({
+            limit: 1,
+            where
+          });
+          if (existing.length > 0) {
+            throw (0, import_http.CONFLICT)("\uC790\uB8CC\uAC00 \uC774\uBBF8 \uC874\uC7AC\uD569\uB2C8\uB2E4.");
+          }
+        }
+        const values = {
+          id: itemId,
+          userId: injectUserId ? auth.userId : void 0,
+          ...params
+        };
+        const item = await repository.save(values);
+        return (0, import_http.CREATED)(item);
+      }
+      default:
+        throw (0, import_http.METHOD_NOT_ALLOWED)();
+    }
+  });
+  return {
+    loader,
+    action
+  };
+}
+
+// src/api/item_api_handler.ts
+var import_http2 = require("dn-react-toolkit/http");
+var import_react_router2 = require("react-router");
+function itemApiHandler({
+  withAuthAction,
+  repository
+}) {
+  const loader = async ({ request }) => {
+    return {};
+  };
+  const action = withAuthAction((auth) => async ({ params, request }) => {
+    if (!auth || auth.role !== "admin") {
+      return (0, import_http2.UNAUTHORIZED)();
+    }
+    switch (request.method) {
+      case "DELETE": {
+        const itemId = params.itemId;
+        await repository.delete(itemId);
+        return {};
+      }
+    }
+  });
+  return {
+    loader,
+    action
+  };
+}
+
+// src/crud/crud_loader.tsx
+function crudHandler({
+  repository,
+  apiHandlerOptions,
+  loaderOptions,
+  itemLoaderOptions
+}) {
+  return (prefix) => async (args) => {
+    const pattern = args.unstable_pattern;
+    if (pattern === `/api${prefix}`) {
+      const { loader, action } = apiHandler({
+        repository,
+        ...apiHandlerOptions
+      });
+      if (args.request.method === "GET") {
+        return loader(args);
+      } else {
+        return action(args);
+      }
+    }
+    if (pattern.startsWith(`/api${prefix}`)) {
+      const { loader, action } = itemApiHandler({
+        repository,
+        ...apiHandlerOptions
+      });
+      if (args.request.method === "GET") {
+        return loader(args);
+      } else {
+        return action(args);
+      }
+    }
+    if (pattern === prefix) {
+      return tableLoader({
+        ...loaderOptions,
+        repository
+      })(args);
+    }
+    if (pattern.startsWith(prefix)) {
+      return tableItemloader({ ...itemLoaderOptions, repository })(args);
+    }
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  crudHandler
+});