dn-react-router-toolkit 0.4.2 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/api/create_api_handler.d.mts +28 -0
- package/dist/api/create_api_handler.d.ts +28 -0
- package/dist/api/create_api_handler.js +148 -0
- package/dist/api/create_api_handler.mjs +132 -0
- package/dist/api/create_handler.d.mts +1 -1
- package/dist/api/create_handler.d.ts +1 -1
- package/dist/api/create_handler.js +29 -26
- package/dist/api/create_handler.mjs +29 -26
- package/dist/api/index.js +29 -26
- package/dist/api/index.mjs +29 -26
- package/dist/api/item_api_handler.d.mts +18 -0
- package/dist/api/item_api_handler.d.ts +18 -0
- package/dist/api/item_api_handler.js +55 -0
- package/dist/api/item_api_handler.mjs +30 -0
- package/dist/auth/index.d.mts +1 -1
- package/dist/auth/index.d.ts +1 -1
- package/dist/auth/index.js +62 -16
- package/dist/auth/index.mjs +60 -15
- package/dist/auth/with_auth.d.mts +8 -3
- package/dist/auth/with_auth.d.ts +8 -3
- package/dist/auth/with_auth.js +62 -16
- package/dist/auth/with_auth.mjs +60 -15
- package/dist/crud/crud_form.d.mts +13 -0
- package/dist/crud/crud_form.d.ts +13 -0
- package/dist/crud/crud_form.js +88 -0
- package/dist/crud/crud_form.mjs +55 -0
- package/dist/crud/crud_form_provider.d.mts +34 -0
- package/dist/crud/crud_form_provider.d.ts +34 -0
- package/dist/crud/crud_form_provider.js +160 -0
- package/dist/crud/crud_form_provider.mjs +124 -0
- package/dist/crud/crud_loader.d.mts +21 -0
- package/dist/crud/crud_loader.d.ts +21 -0
- package/dist/crud/crud_loader.js +288 -0
- package/dist/crud/crud_loader.mjs +273 -0
- package/dist/crud/crud_page.d.mts +25 -0
- package/dist/crud/crud_page.d.ts +25 -0
- package/dist/crud/crud_page.js +645 -0
- package/dist/crud/crud_page.mjs +616 -0
- package/dist/crud/generate_handlers.d.mts +15 -0
- package/dist/crud/generate_handlers.d.ts +15 -0
- package/dist/crud/generate_handlers.js +39 -0
- package/dist/crud/generate_handlers.mjs +14 -0
- package/dist/crud/generate_pages.d.mts +11 -0
- package/dist/crud/generate_pages.d.ts +11 -0
- package/dist/crud/generate_pages.js +52 -0
- package/dist/crud/generate_pages.mjs +17 -0
- package/dist/crud/generate_routes.d.mts +5 -0
- package/dist/crud/generate_routes.d.ts +5 -0
- package/dist/crud/generate_routes.js +62 -0
- package/dist/crud/generate_routes.mjs +27 -0
- package/dist/crud/index.d.mts +21 -0
- package/dist/crud/index.d.ts +21 -0
- package/dist/crud/index.js +970 -0
- package/dist/crud/index.mjs +945 -0
- package/dist/db/index.d.mts +4 -0
- package/dist/db/index.d.ts +4 -0
- package/dist/db/index.js +46 -0
- package/dist/db/index.mjs +8 -0
- package/dist/index.d.mts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/table/buttons.d.mts +10 -0
- package/dist/table/buttons.d.ts +10 -0
- package/dist/table/buttons.js +102 -0
- package/dist/table/buttons.mjs +71 -0
- package/dist/table/index.d.mts +9 -0
- package/dist/table/index.d.ts +9 -0
- package/dist/table/index.js +570 -0
- package/dist/table/index.mjs +543 -0
- package/dist/table/item_loader.d.mts +12 -0
- package/dist/table/item_loader.d.ts +12 -0
- package/dist/table/item_loader.js +51 -0
- package/dist/table/item_loader.mjs +26 -0
- package/dist/table/loader.d.mts +28 -0
- package/dist/table/loader.d.ts +28 -0
- package/dist/table/loader.js +70 -0
- package/dist/table/loader.mjs +48 -0
- package/dist/table/page.d.mts +27 -0
- package/dist/table/page.d.ts +27 -0
- package/dist/table/page.js +444 -0
- package/dist/table/page.mjs +415 -0
- package/dist/table/repository.d.mts +38 -0
- package/dist/table/repository.d.ts +38 -0
- package/dist/table/repository.js +76 -0
- package/dist/table/repository.mjs +56 -0
- package/dist/table/table.d.mts +27 -0
- package/dist/table/table.d.ts +27 -0
- package/dist/table/table.js +290 -0
- package/dist/table/table.mjs +255 -0
- package/package.json +78 -59
package/dist/auth/with_auth.d.ts
CHANGED
|
@@ -1,12 +1,17 @@
|
|
|
1
1
|
import { AccessTokenPayload } from 'dn-react-toolkit/auth';
|
|
2
|
-
import { AuthService } from 'dn-react-toolkit/auth/server';
|
|
2
|
+
import { AuthService, JWTManager, CookieManager } from 'dn-react-toolkit/auth/server';
|
|
3
3
|
import { LoaderFunctionArgs, ActionFunctionArgs } from 'react-router';
|
|
4
4
|
|
|
5
5
|
type Handler<T extends LoaderFunctionArgs | ActionFunctionArgs> = (arg: T) => Promise<unknown> | unknown;
|
|
6
6
|
type InputFN = (auth?: AccessTokenPayload) => Handler<LoaderFunctionArgs> | Handler<ActionFunctionArgs>;
|
|
7
7
|
type WithAuthHandler<T extends LoaderFunctionArgs | ActionFunctionArgs> = (fn: InputFN) => Handler<T>;
|
|
8
|
-
declare function
|
|
8
|
+
declare function createWithStrictAuthHandler<T extends LoaderFunctionArgs | ActionFunctionArgs>({ authService }: {
|
|
9
9
|
authService: AuthService;
|
|
10
10
|
}): <THandler extends Handler<T>>(fn: (auth?: AccessTokenPayload) => THandler) => THandler;
|
|
11
|
+
declare function createWithAuthHandler<T extends LoaderFunctionArgs | ActionFunctionArgs>({ authService, tempUserTokenManager, tempUserCookieManager, }: {
|
|
12
|
+
authService: AuthService;
|
|
13
|
+
tempUserTokenManager: JWTManager<AccessTokenPayload>;
|
|
14
|
+
tempUserCookieManager: CookieManager;
|
|
15
|
+
}): <THandler extends Handler<T>>(fn: (auth: AccessTokenPayload) => THandler) => THandler;
|
|
11
16
|
|
|
12
|
-
export { type WithAuthHandler, createWithAuthHandler };
|
|
17
|
+
export { type WithAuthHandler, createWithAuthHandler, createWithStrictAuthHandler };
|
package/dist/auth/with_auth.js
CHANGED
|
@@ -20,16 +20,18 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
20
20
|
// src/auth/with_auth.ts
|
|
21
21
|
var with_auth_exports = {};
|
|
22
22
|
__export(with_auth_exports, {
|
|
23
|
-
createWithAuthHandler: () => createWithAuthHandler
|
|
23
|
+
createWithAuthHandler: () => createWithAuthHandler,
|
|
24
|
+
createWithStrictAuthHandler: () => createWithStrictAuthHandler
|
|
24
25
|
});
|
|
25
26
|
module.exports = __toCommonJS(with_auth_exports);
|
|
27
|
+
var import_uuid = require("uuid");
|
|
26
28
|
var toResponse = (result) => {
|
|
27
29
|
if (result instanceof Response) {
|
|
28
30
|
return result;
|
|
29
31
|
}
|
|
30
32
|
return Response.json(result);
|
|
31
33
|
};
|
|
32
|
-
function
|
|
34
|
+
function createWithStrictAuthHandler({ authService }) {
|
|
33
35
|
return function(fn) {
|
|
34
36
|
const handler = async function(arg) {
|
|
35
37
|
const respond = async (auth, headers = new Headers()) => {
|
|
@@ -38,7 +40,7 @@ function createWithAuthHandler({ authService }) {
|
|
|
38
40
|
};
|
|
39
41
|
const setHeader = (res, headers) => {
|
|
40
42
|
headers.forEach((value, key) => {
|
|
41
|
-
res.headers.
|
|
43
|
+
res.headers.append(key, value);
|
|
42
44
|
});
|
|
43
45
|
return res;
|
|
44
46
|
};
|
|
@@ -46,9 +48,7 @@ function createWithAuthHandler({ authService }) {
|
|
|
46
48
|
arg.request
|
|
47
49
|
);
|
|
48
50
|
if (accessToken) {
|
|
49
|
-
const payload = await authService.accessTokenManager.verify(
|
|
50
|
-
accessToken
|
|
51
|
-
);
|
|
51
|
+
const payload = await authService.accessTokenManager.verify(accessToken);
|
|
52
52
|
if (payload) {
|
|
53
53
|
return respond(payload);
|
|
54
54
|
}
|
|
@@ -58,23 +58,17 @@ function createWithAuthHandler({ authService }) {
|
|
|
58
58
|
);
|
|
59
59
|
if (refreshToken) {
|
|
60
60
|
try {
|
|
61
|
-
const newAccessToken = await authService.refreshAccessToken(
|
|
62
|
-
refreshToken
|
|
63
|
-
);
|
|
61
|
+
const newAccessToken = await authService.refreshAccessToken(refreshToken);
|
|
64
62
|
const setCookieHeader = await authService.getAccessTokenSetCookie(
|
|
65
63
|
newAccessToken
|
|
66
64
|
);
|
|
67
65
|
const headers = new Headers();
|
|
68
66
|
headers.append("Set-Cookie", setCookieHeader);
|
|
69
|
-
const payload = authService.accessTokenManager.decode(
|
|
70
|
-
newAccessToken
|
|
71
|
-
);
|
|
67
|
+
const payload = authService.accessTokenManager.decode(newAccessToken);
|
|
72
68
|
return respond(payload, headers);
|
|
73
69
|
} catch (e) {
|
|
74
70
|
console.log(e);
|
|
75
|
-
const setCookieHeader = await authService.getRefreshTokenSetCookie(
|
|
76
|
-
null
|
|
77
|
-
);
|
|
71
|
+
const setCookieHeader = await authService.getRefreshTokenSetCookie(null);
|
|
78
72
|
const headers = new Headers();
|
|
79
73
|
headers.append("Set-Cookie", setCookieHeader);
|
|
80
74
|
return respond(void 0, headers);
|
|
@@ -85,7 +79,59 @@ function createWithAuthHandler({ authService }) {
|
|
|
85
79
|
return handler;
|
|
86
80
|
};
|
|
87
81
|
}
|
|
82
|
+
function createWithAuthHandler({
|
|
83
|
+
authService,
|
|
84
|
+
tempUserTokenManager,
|
|
85
|
+
tempUserCookieManager
|
|
86
|
+
}) {
|
|
87
|
+
return function(fn) {
|
|
88
|
+
const withAuthHandler = createWithStrictAuthHandler({
|
|
89
|
+
authService
|
|
90
|
+
});
|
|
91
|
+
const handler = withAuthHandler((auth) => async (args) => {
|
|
92
|
+
if (auth) {
|
|
93
|
+
return fn(auth)(args);
|
|
94
|
+
}
|
|
95
|
+
const respond = async (auth2, headers2 = new Headers()) => {
|
|
96
|
+
const result = await fn(auth2)(args);
|
|
97
|
+
return setHeader(toResponse(result), headers2);
|
|
98
|
+
};
|
|
99
|
+
const setHeader = (res, headers2) => {
|
|
100
|
+
headers2.forEach((value, key) => {
|
|
101
|
+
res.headers.append(key, value);
|
|
102
|
+
});
|
|
103
|
+
return res;
|
|
104
|
+
};
|
|
105
|
+
const tempUserToken = await tempUserCookieManager.parse(
|
|
106
|
+
args.request
|
|
107
|
+
);
|
|
108
|
+
if (tempUserToken) {
|
|
109
|
+
const tempUserPayload = await tempUserTokenManager.verify(tempUserToken);
|
|
110
|
+
if (tempUserPayload) {
|
|
111
|
+
return respond(tempUserPayload);
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
const user = await authService.authRepository.createUser({
|
|
115
|
+
id: (0, import_uuid.v4)(),
|
|
116
|
+
role: "temp",
|
|
117
|
+
name: "\uC775\uBA85"
|
|
118
|
+
});
|
|
119
|
+
const newTempUserToken = await tempUserTokenManager.sign({
|
|
120
|
+
userId: user.id,
|
|
121
|
+
name: user.name,
|
|
122
|
+
role: user.role
|
|
123
|
+
});
|
|
124
|
+
const headers = new Headers();
|
|
125
|
+
const setCookie = await tempUserCookieManager.serialize(newTempUserToken);
|
|
126
|
+
headers.append("Set-Cookie", setCookie);
|
|
127
|
+
const newTempUserPayload = tempUserTokenManager.decode(newTempUserToken);
|
|
128
|
+
return respond(newTempUserPayload, headers);
|
|
129
|
+
});
|
|
130
|
+
return handler;
|
|
131
|
+
};
|
|
132
|
+
}
|
|
88
133
|
// Annotate the CommonJS export names for ESM import in node:
|
|
89
134
|
0 && (module.exports = {
|
|
90
|
-
createWithAuthHandler
|
|
135
|
+
createWithAuthHandler,
|
|
136
|
+
createWithStrictAuthHandler
|
|
91
137
|
});
|
package/dist/auth/with_auth.mjs
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
// src/auth/with_auth.ts
|
|
2
|
+
import { v4 } from "uuid";
|
|
2
3
|
var toResponse = (result) => {
|
|
3
4
|
if (result instanceof Response) {
|
|
4
5
|
return result;
|
|
5
6
|
}
|
|
6
7
|
return Response.json(result);
|
|
7
8
|
};
|
|
8
|
-
function
|
|
9
|
+
function createWithStrictAuthHandler({ authService }) {
|
|
9
10
|
return function(fn) {
|
|
10
11
|
const handler = async function(arg) {
|
|
11
12
|
const respond = async (auth, headers = new Headers()) => {
|
|
@@ -14,7 +15,7 @@ function createWithAuthHandler({ authService }) {
|
|
|
14
15
|
};
|
|
15
16
|
const setHeader = (res, headers) => {
|
|
16
17
|
headers.forEach((value, key) => {
|
|
17
|
-
res.headers.
|
|
18
|
+
res.headers.append(key, value);
|
|
18
19
|
});
|
|
19
20
|
return res;
|
|
20
21
|
};
|
|
@@ -22,9 +23,7 @@ function createWithAuthHandler({ authService }) {
|
|
|
22
23
|
arg.request
|
|
23
24
|
);
|
|
24
25
|
if (accessToken) {
|
|
25
|
-
const payload = await authService.accessTokenManager.verify(
|
|
26
|
-
accessToken
|
|
27
|
-
);
|
|
26
|
+
const payload = await authService.accessTokenManager.verify(accessToken);
|
|
28
27
|
if (payload) {
|
|
29
28
|
return respond(payload);
|
|
30
29
|
}
|
|
@@ -34,23 +33,17 @@ function createWithAuthHandler({ authService }) {
|
|
|
34
33
|
);
|
|
35
34
|
if (refreshToken) {
|
|
36
35
|
try {
|
|
37
|
-
const newAccessToken = await authService.refreshAccessToken(
|
|
38
|
-
refreshToken
|
|
39
|
-
);
|
|
36
|
+
const newAccessToken = await authService.refreshAccessToken(refreshToken);
|
|
40
37
|
const setCookieHeader = await authService.getAccessTokenSetCookie(
|
|
41
38
|
newAccessToken
|
|
42
39
|
);
|
|
43
40
|
const headers = new Headers();
|
|
44
41
|
headers.append("Set-Cookie", setCookieHeader);
|
|
45
|
-
const payload = authService.accessTokenManager.decode(
|
|
46
|
-
newAccessToken
|
|
47
|
-
);
|
|
42
|
+
const payload = authService.accessTokenManager.decode(newAccessToken);
|
|
48
43
|
return respond(payload, headers);
|
|
49
44
|
} catch (e) {
|
|
50
45
|
console.log(e);
|
|
51
|
-
const setCookieHeader = await authService.getRefreshTokenSetCookie(
|
|
52
|
-
null
|
|
53
|
-
);
|
|
46
|
+
const setCookieHeader = await authService.getRefreshTokenSetCookie(null);
|
|
54
47
|
const headers = new Headers();
|
|
55
48
|
headers.append("Set-Cookie", setCookieHeader);
|
|
56
49
|
return respond(void 0, headers);
|
|
@@ -61,6 +54,58 @@ function createWithAuthHandler({ authService }) {
|
|
|
61
54
|
return handler;
|
|
62
55
|
};
|
|
63
56
|
}
|
|
57
|
+
function createWithAuthHandler({
|
|
58
|
+
authService,
|
|
59
|
+
tempUserTokenManager,
|
|
60
|
+
tempUserCookieManager
|
|
61
|
+
}) {
|
|
62
|
+
return function(fn) {
|
|
63
|
+
const withAuthHandler = createWithStrictAuthHandler({
|
|
64
|
+
authService
|
|
65
|
+
});
|
|
66
|
+
const handler = withAuthHandler((auth) => async (args) => {
|
|
67
|
+
if (auth) {
|
|
68
|
+
return fn(auth)(args);
|
|
69
|
+
}
|
|
70
|
+
const respond = async (auth2, headers2 = new Headers()) => {
|
|
71
|
+
const result = await fn(auth2)(args);
|
|
72
|
+
return setHeader(toResponse(result), headers2);
|
|
73
|
+
};
|
|
74
|
+
const setHeader = (res, headers2) => {
|
|
75
|
+
headers2.forEach((value, key) => {
|
|
76
|
+
res.headers.append(key, value);
|
|
77
|
+
});
|
|
78
|
+
return res;
|
|
79
|
+
};
|
|
80
|
+
const tempUserToken = await tempUserCookieManager.parse(
|
|
81
|
+
args.request
|
|
82
|
+
);
|
|
83
|
+
if (tempUserToken) {
|
|
84
|
+
const tempUserPayload = await tempUserTokenManager.verify(tempUserToken);
|
|
85
|
+
if (tempUserPayload) {
|
|
86
|
+
return respond(tempUserPayload);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
const user = await authService.authRepository.createUser({
|
|
90
|
+
id: v4(),
|
|
91
|
+
role: "temp",
|
|
92
|
+
name: "\uC775\uBA85"
|
|
93
|
+
});
|
|
94
|
+
const newTempUserToken = await tempUserTokenManager.sign({
|
|
95
|
+
userId: user.id,
|
|
96
|
+
name: user.name,
|
|
97
|
+
role: user.role
|
|
98
|
+
});
|
|
99
|
+
const headers = new Headers();
|
|
100
|
+
const setCookie = await tempUserCookieManager.serialize(newTempUserToken);
|
|
101
|
+
headers.append("Set-Cookie", setCookie);
|
|
102
|
+
const newTempUserPayload = tempUserTokenManager.decode(newTempUserToken);
|
|
103
|
+
return respond(newTempUserPayload, headers);
|
|
104
|
+
});
|
|
105
|
+
return handler;
|
|
106
|
+
};
|
|
107
|
+
}
|
|
64
108
|
export {
|
|
65
|
-
createWithAuthHandler
|
|
109
|
+
createWithAuthHandler,
|
|
110
|
+
createWithStrictAuthHandler
|
|
66
111
|
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
type Props = {
|
|
4
|
+
AdminLayout: React.FC<{
|
|
5
|
+
title: string;
|
|
6
|
+
actions?: React.ReactNode;
|
|
7
|
+
className?: string;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
}>;
|
|
10
|
+
};
|
|
11
|
+
declare function CrudForm<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>({ AdminLayout }: Props): React.JSX.Element;
|
|
12
|
+
|
|
13
|
+
export { CrudForm as default };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
type Props = {
|
|
4
|
+
AdminLayout: React.FC<{
|
|
5
|
+
title: string;
|
|
6
|
+
actions?: React.ReactNode;
|
|
7
|
+
className?: string;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
}>;
|
|
10
|
+
};
|
|
11
|
+
declare function CrudForm<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>({ AdminLayout }: Props): React.JSX.Element;
|
|
12
|
+
|
|
13
|
+
export { CrudForm as default };
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/crud/crud_form.tsx
|
|
31
|
+
var crud_form_exports = {};
|
|
32
|
+
__export(crud_form_exports, {
|
|
33
|
+
default: () => CrudForm
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(crud_form_exports);
|
|
36
|
+
|
|
37
|
+
// src/crud/crud_form_provider.tsx
|
|
38
|
+
var import_react_router = require("react-router");
|
|
39
|
+
var import_store = require("dn-react-toolkit/store");
|
|
40
|
+
var import_react = require("react");
|
|
41
|
+
var import_react2 = __toESM(require("react"));
|
|
42
|
+
var FormContext = (0, import_react.createContext)({});
|
|
43
|
+
function useFormContext() {
|
|
44
|
+
return (0, import_react.useContext)(FormContext);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
// src/crud/crud_form.tsx
|
|
48
|
+
var import_store2 = require("dn-react-toolkit/store");
|
|
49
|
+
var import_react3 = __toESM(require("react"));
|
|
50
|
+
function CrudForm({ AdminLayout }) {
|
|
51
|
+
const form = useFormContext();
|
|
52
|
+
return /* @__PURE__ */ import_react3.default.createElement(
|
|
53
|
+
AdminLayout,
|
|
54
|
+
{
|
|
55
|
+
title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
|
|
56
|
+
actions: /* @__PURE__ */ import_react3.default.createElement(
|
|
57
|
+
"button",
|
|
58
|
+
{
|
|
59
|
+
type: "button",
|
|
60
|
+
className: "button-primary",
|
|
61
|
+
onClick: form.submit
|
|
62
|
+
},
|
|
63
|
+
"\uC800\uC7A5\uD558\uAE30"
|
|
64
|
+
),
|
|
65
|
+
className: "max-w-3xl mx-auto"
|
|
66
|
+
},
|
|
67
|
+
Object.keys(form.columns).length > 0 && /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, Object.entries(form.columns).map(
|
|
68
|
+
([key, value]) => /* @__PURE__ */ import_react3.default.createElement("label", { key }, value.label, value.component ? /* @__PURE__ */ import_react3.default.createElement(value.component, null) : /* @__PURE__ */ import_react3.default.createElement(
|
|
69
|
+
import_store2.SyncInput,
|
|
70
|
+
{
|
|
71
|
+
store: form.store,
|
|
72
|
+
property: key,
|
|
73
|
+
className: "input-form"
|
|
74
|
+
}
|
|
75
|
+
))
|
|
76
|
+
)),
|
|
77
|
+
form.item && /* @__PURE__ */ import_react3.default.createElement(
|
|
78
|
+
"button",
|
|
79
|
+
{
|
|
80
|
+
className: "button-dangerous mt-8",
|
|
81
|
+
onClick: () => {
|
|
82
|
+
form.delete();
|
|
83
|
+
}
|
|
84
|
+
},
|
|
85
|
+
"\uC0AD\uC81C\uD558\uAE30"
|
|
86
|
+
)
|
|
87
|
+
);
|
|
88
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
// src/crud/crud_form_provider.tsx
|
|
2
|
+
import { useNavigate } from "react-router";
|
|
3
|
+
import { useStore } from "dn-react-toolkit/store";
|
|
4
|
+
import { createContext, useContext } from "react";
|
|
5
|
+
import React from "react";
|
|
6
|
+
var FormContext = createContext({});
|
|
7
|
+
function useFormContext() {
|
|
8
|
+
return useContext(FormContext);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
// src/crud/crud_form.tsx
|
|
12
|
+
import { SyncInput } from "dn-react-toolkit/store";
|
|
13
|
+
import React2 from "react";
|
|
14
|
+
function CrudForm({ AdminLayout }) {
|
|
15
|
+
const form = useFormContext();
|
|
16
|
+
return /* @__PURE__ */ React2.createElement(
|
|
17
|
+
AdminLayout,
|
|
18
|
+
{
|
|
19
|
+
title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
|
|
20
|
+
actions: /* @__PURE__ */ React2.createElement(
|
|
21
|
+
"button",
|
|
22
|
+
{
|
|
23
|
+
type: "button",
|
|
24
|
+
className: "button-primary",
|
|
25
|
+
onClick: form.submit
|
|
26
|
+
},
|
|
27
|
+
"\uC800\uC7A5\uD558\uAE30"
|
|
28
|
+
),
|
|
29
|
+
className: "max-w-3xl mx-auto"
|
|
30
|
+
},
|
|
31
|
+
Object.keys(form.columns).length > 0 && /* @__PURE__ */ React2.createElement(React2.Fragment, null, Object.entries(form.columns).map(
|
|
32
|
+
([key, value]) => /* @__PURE__ */ React2.createElement("label", { key }, value.label, value.component ? /* @__PURE__ */ React2.createElement(value.component, null) : /* @__PURE__ */ React2.createElement(
|
|
33
|
+
SyncInput,
|
|
34
|
+
{
|
|
35
|
+
store: form.store,
|
|
36
|
+
property: key,
|
|
37
|
+
className: "input-form"
|
|
38
|
+
}
|
|
39
|
+
))
|
|
40
|
+
)),
|
|
41
|
+
form.item && /* @__PURE__ */ React2.createElement(
|
|
42
|
+
"button",
|
|
43
|
+
{
|
|
44
|
+
className: "button-dangerous mt-8",
|
|
45
|
+
onClick: () => {
|
|
46
|
+
form.delete();
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
"\uC0AD\uC81C\uD558\uAE30"
|
|
50
|
+
)
|
|
51
|
+
);
|
|
52
|
+
}
|
|
53
|
+
export {
|
|
54
|
+
CrudForm as default
|
|
55
|
+
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { RxStore } from 'dn-react-toolkit/store';
|
|
2
|
+
import { PgTableWithColumns } from 'drizzle-orm/pg-core';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
|
|
5
|
+
type FormState<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never> = Omit<TModel, TPrimaryKey> & {
|
|
6
|
+
[K in TPrimaryKey]?: TModel[K];
|
|
7
|
+
};
|
|
8
|
+
type FormColumnValue = {
|
|
9
|
+
label: string;
|
|
10
|
+
component?: React.FC;
|
|
11
|
+
};
|
|
12
|
+
type FormColumns<T> = Partial<{
|
|
13
|
+
[K in T extends PgTableWithColumns<infer U> ? keyof U["columns"] : never]: FormColumnValue;
|
|
14
|
+
}>;
|
|
15
|
+
declare const FormContext: React.Context<{}>;
|
|
16
|
+
declare function useFormContext<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>(): {
|
|
17
|
+
name: string;
|
|
18
|
+
item?: TModel;
|
|
19
|
+
store: RxStore<FormState<TModel, TPrimaryKey>>;
|
|
20
|
+
submit: () => Promise<void>;
|
|
21
|
+
delete: () => Promise<void>;
|
|
22
|
+
columns: FormColumns<TModel>;
|
|
23
|
+
};
|
|
24
|
+
type CrudFormProps<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never> = {
|
|
25
|
+
primaryKey?: TPrimaryKey;
|
|
26
|
+
name: string;
|
|
27
|
+
prefix: string;
|
|
28
|
+
item?: TModel;
|
|
29
|
+
columns?: FormColumns<TModel>;
|
|
30
|
+
children?: React.ReactNode;
|
|
31
|
+
};
|
|
32
|
+
declare function CrudFormProvider<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>({ primaryKey, name, prefix, item, columns, children, }: CrudFormProps<TModel, TPrimaryKey>): React.JSX.Element;
|
|
33
|
+
|
|
34
|
+
export { type CrudFormProps, type FormColumnValue, type FormColumns, FormContext, type FormState, CrudFormProvider as default, useFormContext };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { RxStore } from 'dn-react-toolkit/store';
|
|
2
|
+
import { PgTableWithColumns } from 'drizzle-orm/pg-core';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
|
|
5
|
+
type FormState<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never> = Omit<TModel, TPrimaryKey> & {
|
|
6
|
+
[K in TPrimaryKey]?: TModel[K];
|
|
7
|
+
};
|
|
8
|
+
type FormColumnValue = {
|
|
9
|
+
label: string;
|
|
10
|
+
component?: React.FC;
|
|
11
|
+
};
|
|
12
|
+
type FormColumns<T> = Partial<{
|
|
13
|
+
[K in T extends PgTableWithColumns<infer U> ? keyof U["columns"] : never]: FormColumnValue;
|
|
14
|
+
}>;
|
|
15
|
+
declare const FormContext: React.Context<{}>;
|
|
16
|
+
declare function useFormContext<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>(): {
|
|
17
|
+
name: string;
|
|
18
|
+
item?: TModel;
|
|
19
|
+
store: RxStore<FormState<TModel, TPrimaryKey>>;
|
|
20
|
+
submit: () => Promise<void>;
|
|
21
|
+
delete: () => Promise<void>;
|
|
22
|
+
columns: FormColumns<TModel>;
|
|
23
|
+
};
|
|
24
|
+
type CrudFormProps<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never> = {
|
|
25
|
+
primaryKey?: TPrimaryKey;
|
|
26
|
+
name: string;
|
|
27
|
+
prefix: string;
|
|
28
|
+
item?: TModel;
|
|
29
|
+
columns?: FormColumns<TModel>;
|
|
30
|
+
children?: React.ReactNode;
|
|
31
|
+
};
|
|
32
|
+
declare function CrudFormProvider<TModel, TPrimaryKey extends keyof TModel = "id" extends keyof TModel ? "id" : never>({ primaryKey, name, prefix, item, columns, children, }: CrudFormProps<TModel, TPrimaryKey>): React.JSX.Element;
|
|
33
|
+
|
|
34
|
+
export { type CrudFormProps, type FormColumnValue, type FormColumns, FormContext, type FormState, CrudFormProvider as default, useFormContext };
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/crud/crud_form_provider.tsx
|
|
31
|
+
var crud_form_provider_exports = {};
|
|
32
|
+
__export(crud_form_provider_exports, {
|
|
33
|
+
FormContext: () => FormContext,
|
|
34
|
+
default: () => CrudFormProvider,
|
|
35
|
+
useFormContext: () => useFormContext
|
|
36
|
+
});
|
|
37
|
+
module.exports = __toCommonJS(crud_form_provider_exports);
|
|
38
|
+
var import_react_router = require("react-router");
|
|
39
|
+
var import_store = require("dn-react-toolkit/store");
|
|
40
|
+
var import_react = require("react");
|
|
41
|
+
var import_react2 = __toESM(require("react"));
|
|
42
|
+
var FormContext = (0, import_react.createContext)({});
|
|
43
|
+
function useFormContext() {
|
|
44
|
+
return (0, import_react.useContext)(FormContext);
|
|
45
|
+
}
|
|
46
|
+
function CrudFormProvider({
|
|
47
|
+
primaryKey = "id",
|
|
48
|
+
name,
|
|
49
|
+
prefix,
|
|
50
|
+
item,
|
|
51
|
+
columns = {},
|
|
52
|
+
children
|
|
53
|
+
}) {
|
|
54
|
+
const apiPrefix = `/api${prefix}`;
|
|
55
|
+
const store = (0, import_store.useStore)({
|
|
56
|
+
...item || {}
|
|
57
|
+
});
|
|
58
|
+
const navigate = (0, import_react_router.useNavigate)();
|
|
59
|
+
const submit = async () => {
|
|
60
|
+
const res = await fetch(apiPrefix, {
|
|
61
|
+
method: "POST",
|
|
62
|
+
headers: {
|
|
63
|
+
"Content-Type": "application/json"
|
|
64
|
+
},
|
|
65
|
+
body: JSON.stringify(
|
|
66
|
+
Object.entries(store.state).reduce(
|
|
67
|
+
function reducer(acc, [key, value]) {
|
|
68
|
+
const converter = (value2) => {
|
|
69
|
+
if (value2 === void 0) {
|
|
70
|
+
return void 0;
|
|
71
|
+
}
|
|
72
|
+
if (value2 === null) {
|
|
73
|
+
return {
|
|
74
|
+
type: "null",
|
|
75
|
+
value: null
|
|
76
|
+
};
|
|
77
|
+
}
|
|
78
|
+
if (typeof value2 === "string") {
|
|
79
|
+
return {
|
|
80
|
+
type: "string",
|
|
81
|
+
value: value2
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
if (typeof value2 === "number") {
|
|
85
|
+
return {
|
|
86
|
+
type: "number",
|
|
87
|
+
value: value2
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
if (typeof value2 === "boolean") {
|
|
91
|
+
return {
|
|
92
|
+
type: "boolean",
|
|
93
|
+
value: value2
|
|
94
|
+
};
|
|
95
|
+
}
|
|
96
|
+
if (value2 instanceof Date) {
|
|
97
|
+
return {
|
|
98
|
+
type: "date",
|
|
99
|
+
value: value2.toISOString()
|
|
100
|
+
};
|
|
101
|
+
}
|
|
102
|
+
if (Array.isArray(value2)) {
|
|
103
|
+
return value2.map((v) => converter(v));
|
|
104
|
+
}
|
|
105
|
+
if (typeof value2 === "object") {
|
|
106
|
+
return Object.entries(
|
|
107
|
+
value2
|
|
108
|
+
).reduce(reducer, {});
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
return {
|
|
112
|
+
...acc,
|
|
113
|
+
[key]: converter(value)
|
|
114
|
+
};
|
|
115
|
+
},
|
|
116
|
+
{}
|
|
117
|
+
)
|
|
118
|
+
)
|
|
119
|
+
});
|
|
120
|
+
if (!res.ok) {
|
|
121
|
+
const { message } = await res.json();
|
|
122
|
+
alert(message);
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
alert(`${name}\uB97C \uC800\uC7A5\uD588\uC2B5\uB2C8\uB2E4.`);
|
|
126
|
+
const { id } = await res.json();
|
|
127
|
+
navigate(`${prefix}/${id}`);
|
|
128
|
+
};
|
|
129
|
+
const deleteItem = async () => {
|
|
130
|
+
if (!item || !primaryKey) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
const ok = confirm("\uC815\uB9D0\uB85C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?");
|
|
134
|
+
if (!ok) {
|
|
135
|
+
return;
|
|
136
|
+
}
|
|
137
|
+
const res = await fetch(`${apiPrefix}/${item[primaryKey]}`, {
|
|
138
|
+
method: "DELETE"
|
|
139
|
+
});
|
|
140
|
+
if (!res.ok) {
|
|
141
|
+
const { message } = await res.json();
|
|
142
|
+
alert(message);
|
|
143
|
+
return;
|
|
144
|
+
}
|
|
145
|
+
alert(`${name}\uB97C \uC0AD\uC81C\uD588\uC2B5\uB2C8\uB2E4.`);
|
|
146
|
+
navigate(`${prefix}`);
|
|
147
|
+
};
|
|
148
|
+
return /* @__PURE__ */ import_react2.default.createElement(
|
|
149
|
+
FormContext.Provider,
|
|
150
|
+
{
|
|
151
|
+
value: { name, item, store, submit, delete: deleteItem, columns }
|
|
152
|
+
},
|
|
153
|
+
children
|
|
154
|
+
);
|
|
155
|
+
}
|
|
156
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
157
|
+
0 && (module.exports = {
|
|
158
|
+
FormContext,
|
|
159
|
+
useFormContext
|
|
160
|
+
});
|