msw-dev-tool 1.0.18 → 1.0.20
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/cjs/hook/useFlattenHandlersTable.js +41 -0
- package/dist/cjs/hook/useFlattenHandlersTable.js.map +1 -0
- package/dist/cjs/lib/handlerStore.js +7 -25
- package/dist/cjs/lib/handlerStore.js.map +1 -1
- package/dist/cjs/lib/util.js +32 -0
- package/dist/cjs/lib/util.js.map +1 -1
- package/dist/cjs/ui/DevToolContent/HttpControl.js +2 -30
- package/dist/cjs/ui/DevToolContent/HttpControl.js.map +1 -1
- package/dist/esm/hook/useFlattenHandlersTable.js +39 -0
- package/dist/esm/hook/useFlattenHandlersTable.js.map +1 -0
- package/dist/esm/lib/handlerStore.js +8 -26
- package/dist/esm/lib/handlerStore.js.map +1 -1
- package/dist/esm/lib/util.js +30 -1
- package/dist/esm/lib/util.js.map +1 -1
- package/dist/esm/ui/DevToolContent/HttpControl.js +4 -32
- package/dist/esm/ui/DevToolContent/HttpControl.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('../node_modules/@tanstack/react-table/build/lib/index.js');
|
|
4
|
+
var handlerStore = require('../lib/handlerStore.js');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var index$1 = require('../node_modules/@tanstack/table-core/build/lib/index.js');
|
|
7
|
+
|
|
8
|
+
const useFlattenHandlersTable = () => {
|
|
9
|
+
const { flattenHandlers, handlerRowSelection, handleHandlerRowSelectionChange, } = handlerStore.useHandlerStore();
|
|
10
|
+
const columnHelper = index$1.createColumnHelper();
|
|
11
|
+
const columns = React.useMemo(() => {
|
|
12
|
+
return [
|
|
13
|
+
columnHelper.accessor("enabled", {
|
|
14
|
+
header: ({ table }) => (React.createElement("input", { type: "checkbox", checked: table.getIsAllRowsSelected(), onChange: (e) => table.toggleAllRowsSelected(e.target.checked) })),
|
|
15
|
+
cell: ({ row }) => (React.createElement("input", { type: "checkbox", checked: row.getIsSelected(), onChange: (e) => row.toggleSelected(e.target.checked) })),
|
|
16
|
+
}),
|
|
17
|
+
columnHelper.accessor("path", {
|
|
18
|
+
header: "End point",
|
|
19
|
+
}),
|
|
20
|
+
columnHelper.accessor("method", {
|
|
21
|
+
header: "Method",
|
|
22
|
+
cell: ({ row }) => (React.createElement("div", { className: "msw-dev-tool-center" }, row.original.method)),
|
|
23
|
+
}),
|
|
24
|
+
];
|
|
25
|
+
}, []);
|
|
26
|
+
const table = index.useReactTable({
|
|
27
|
+
columns,
|
|
28
|
+
data: flattenHandlers,
|
|
29
|
+
getCoreRowModel: index$1.getCoreRowModel(),
|
|
30
|
+
state: {
|
|
31
|
+
rowSelection: handlerRowSelection,
|
|
32
|
+
},
|
|
33
|
+
onRowSelectionChange: handleHandlerRowSelectionChange,
|
|
34
|
+
getRowId: (row) => row.id,
|
|
35
|
+
enableRowSelection: true,
|
|
36
|
+
});
|
|
37
|
+
return table;
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
exports.useFlattenHandlersTable = useFlattenHandlersTable;
|
|
41
|
+
//# sourceMappingURL=useFlattenHandlersTable.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlattenHandlersTable.js","sources":["../../../src/hook/useFlattenHandlersTable.tsx"],"sourcesContent":["import {\n ColumnDef,\n createColumnHelper,\n getCoreRowModel,\n useReactTable,\n} from \"@tanstack/react-table\";\nimport { useHandlerStore } from \"../lib/handlerStore\";\nimport { FlattenHandler } from \"../lib\";\nimport React, { useMemo } from \"react\";\n\nexport const useFlattenHandlersTable = () => {\n const {\n flattenHandlers,\n handlerRowSelection,\n handleHandlerRowSelectionChange,\n } = useHandlerStore();\n\n const columnHelper = createColumnHelper<FlattenHandler>();\n const columns: ColumnDef<FlattenHandler, any>[] = useMemo(() => {\n return [\n columnHelper.accessor(\"enabled\", {\n header: ({ table }) => (\n <input\n type=\"checkbox\"\n checked={table.getIsAllRowsSelected()}\n onChange={(e) => table.toggleAllRowsSelected(e.target.checked)}\n />\n ),\n cell: ({ row }) => (\n <input\n type=\"checkbox\"\n checked={row.getIsSelected()}\n onChange={(e) => row.toggleSelected(e.target.checked)}\n />\n ),\n }),\n columnHelper.accessor(\"path\", {\n header: \"End point\",\n }),\n columnHelper.accessor(\"method\", {\n header: \"Method\",\n cell: ({ row }) => (\n <div className=\"msw-dev-tool-center\">{row.original.method}</div>\n ),\n }),\n ];\n }, []);\n\n const table = useReactTable({\n columns,\n data: flattenHandlers,\n getCoreRowModel: getCoreRowModel(),\n state: {\n rowSelection: handlerRowSelection,\n },\n onRowSelectionChange: handleHandlerRowSelectionChange,\n getRowId: (row) => row.id,\n enableRowSelection: true,\n });\n\n return table;\n};\n"],"names":["useHandlerStore","createColumnHelper","useMemo","useReactTable","getCoreRowModel"],"mappings":";;;;;;;AAUO,MAAM,uBAAuB,GAAG,MAAK;IAC1C,MAAM,EACJ,eAAe,EACf,mBAAmB,EACnB,+BAA+B,GAChC,GAAGA,4BAAe,EAAE,CAAC;AAEtB,IAAA,MAAM,YAAY,GAAGC,0BAAkB,EAAkB,CAAC;AAC1D,IAAA,MAAM,OAAO,GAAqCC,aAAO,CAAC,MAAK;QAC7D,OAAO;AACL,YAAA,YAAY,CAAC,QAAQ,CAAC,SAAS,EAAE;AAC/B,gBAAA,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAChB,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,KAAK,CAAC,oBAAoB,EAAE,EACrC,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GAC9D,CACH;AACD,gBAAA,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,MACZ,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,GAAG,CAAC,aAAa,EAAE,EAC5B,QAAQ,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GACrD,CACH;aACF,CAAC;AACF,YAAA,YAAY,CAAC,QAAQ,CAAC,MAAM,EAAE;AAC5B,gBAAA,MAAM,EAAE,WAAW;aACpB,CAAC;AACF,YAAA,YAAY,CAAC,QAAQ,CAAC,QAAQ,EAAE;AAC9B,gBAAA,MAAM,EAAE,QAAQ;gBAChB,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,MACZ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,IAAE,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAO,CACjE;aACF,CAAC;SACH,CAAC;KACH,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,KAAK,GAAGC,mBAAa,CAAC;QAC1B,OAAO;AACP,QAAA,IAAI,EAAE,eAAe;QACrB,eAAe,EAAEC,uBAAe,EAAE;AAClC,QAAA,KAAK,EAAE;AACL,YAAA,YAAY,EAAE,mBAAmB;AAClC,SAAA;AACD,QAAA,oBAAoB,EAAE,+BAA+B;QACrD,QAAQ,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE;AACzB,QAAA,kBAAkB,EAAE,IAAI;AACzB,KAAA,CAAC,CAAC;AAEH,IAAA,OAAO,KAAK,CAAC;AACf;;;;"}
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
var zustand = require('zustand');
|
|
4
4
|
var util = require('./util.js');
|
|
5
|
-
var handler = require('../const/handler.js');
|
|
6
5
|
var lodash = require('../node_modules/lodash/lodash.js');
|
|
7
6
|
|
|
8
7
|
const useHandlerStore = zustand.create((set, get) => ({
|
|
@@ -11,21 +10,17 @@ const useHandlerStore = zustand.create((set, get) => ({
|
|
|
11
10
|
restHandlers: [],
|
|
12
11
|
handlerRowSelection: {},
|
|
13
12
|
initMSWDevTool: (_worker) => {
|
|
14
|
-
const worker = _worker;
|
|
13
|
+
const { worker, flattenHandlers, handlerRowSelection, unsupportedHandlers, } = util.initMSWDevToolStore(_worker);
|
|
15
14
|
set({ worker });
|
|
16
|
-
const handlers = worker.listHandlers();
|
|
17
|
-
const { flattenHandlers, unsupportedHandlers } = util.convertHandlers(handlers);
|
|
18
15
|
set({ flattenHandlers });
|
|
19
16
|
set({
|
|
20
|
-
handlerRowSelection
|
|
21
|
-
acc[handler.id] = handler.enabled;
|
|
22
|
-
return acc;
|
|
23
|
-
}, {}),
|
|
17
|
+
handlerRowSelection,
|
|
24
18
|
});
|
|
25
19
|
set({ restHandlers: unsupportedHandlers });
|
|
26
20
|
return worker;
|
|
27
21
|
},
|
|
28
22
|
handleHandlerRowSelectionChange: (updater) => {
|
|
23
|
+
const worker = get().getWorker();
|
|
29
24
|
if (lodash.lodashExports.isFunction(updater)) {
|
|
30
25
|
set(({ handlerRowSelection }) => {
|
|
31
26
|
const next = updater(handlerRowSelection);
|
|
@@ -41,7 +36,10 @@ const useHandlerStore = zustand.create((set, get) => ({
|
|
|
41
36
|
: { ...handler, enabled: false });
|
|
42
37
|
set({ handlerRowSelection: updater, flattenHandlers: current });
|
|
43
38
|
}
|
|
44
|
-
get().
|
|
39
|
+
const flattenHandlers = get().flattenHandlers;
|
|
40
|
+
const restHandlers = get().restHandlers;
|
|
41
|
+
const totalEnableHandlers = util.getTotalEnableHandlers(flattenHandlers, restHandlers);
|
|
42
|
+
util.updateEnableHandlers(worker, totalEnableHandlers);
|
|
45
43
|
},
|
|
46
44
|
getWorker: () => {
|
|
47
45
|
const worker = get().worker;
|
|
@@ -49,22 +47,6 @@ const useHandlerStore = zustand.create((set, get) => ({
|
|
|
49
47
|
throw new Error("Worker is not initialized");
|
|
50
48
|
return worker;
|
|
51
49
|
},
|
|
52
|
-
getTotalEnableHandlers: () => {
|
|
53
|
-
const checkedHttpHandlers = get()
|
|
54
|
-
.flattenHandlers.filter((h) => h.enabled)
|
|
55
|
-
.map((h) => h.handler);
|
|
56
|
-
const otherProtocolHandlers = get().restHandlers;
|
|
57
|
-
return [...checkedHttpHandlers, ...otherProtocolHandlers];
|
|
58
|
-
},
|
|
59
|
-
updateEnableHandlers: () => {
|
|
60
|
-
const worker = get().getWorker();
|
|
61
|
-
const totalEnableHandlers = get().getTotalEnableHandlers();
|
|
62
|
-
if (totalEnableHandlers.length === 0) {
|
|
63
|
-
worker.resetHandlers(handler.dummyHandler);
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
worker.resetHandlers(...totalEnableHandlers);
|
|
67
|
-
},
|
|
68
50
|
}));
|
|
69
51
|
const initMSWDevTool = useHandlerStore.getState().initMSWDevTool;
|
|
70
52
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"handlerStore.js","sources":["../../../src/lib/handlerStore.ts"],"sourcesContent":["import { SetupWorker } from \"msw/browser\";\nimport { create } from \"zustand\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport {
|
|
1
|
+
{"version":3,"file":"handlerStore.js","sources":["../../../src/lib/handlerStore.ts"],"sourcesContent":["import { SetupWorker } from \"msw/browser\";\nimport { create } from \"zustand\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport {\n convertHandlers,\n getTotalEnableHandlers,\n initMSWDevToolStore,\n updateEnableHandlers,\n} from \"./util\";\nimport { OnChangeFn, RowSelectionState, Updater } from \"@tanstack/react-table\";\nimport { isFunction } from \"lodash\";\n\nexport interface HandlerStoreState {\n worker: SetupWorker | null;\n /**\n * GraphQL or WebSocketHandler\n *\n * **Currently not supported**\n */\n restHandlers: Handler[];\n flattenHandlers: FlattenHandler[];\n handlerRowSelection: RowSelectionState;\n initMSWDevTool: (worker: SetupWorker) => SetupWorker;\n handleHandlerRowSelectionChange: OnChangeFn<RowSelectionState>;\n getWorker: () => SetupWorker;\n}\nexport const useHandlerStore = create<HandlerStoreState>((set, get) => ({\n flattenHandlers: [],\n worker: null,\n restHandlers: [],\n handlerRowSelection: {},\n initMSWDevTool: (_worker) => {\n const {\n worker,\n flattenHandlers,\n handlerRowSelection,\n unsupportedHandlers,\n } = initMSWDevToolStore(_worker);\n\n set({ worker });\n set({ flattenHandlers });\n set({\n handlerRowSelection,\n });\n set({ restHandlers: unsupportedHandlers });\n\n return worker;\n },\n handleHandlerRowSelectionChange: (updater) => {\n const worker = get().getWorker();\n\n if (isFunction(updater)) {\n set(({ handlerRowSelection }) => {\n const next = updater(handlerRowSelection);\n const current = get().flattenHandlers.map((handler) =>\n next[handler.id]\n ? { ...handler, enabled: true }\n : { ...handler, enabled: false }\n );\n return { handlerRowSelection: next, flattenHandlers: current };\n });\n } else {\n const current = get().flattenHandlers.map((handler) =>\n updater[handler.id]\n ? { ...handler, enabled: true }\n : { ...handler, enabled: false }\n );\n set({ handlerRowSelection: updater, flattenHandlers: current });\n }\n\n const flattenHandlers = get().flattenHandlers;\n const restHandlers = get().restHandlers;\n const totalEnableHandlers = getTotalEnableHandlers(\n flattenHandlers,\n restHandlers\n );\n updateEnableHandlers(worker, totalEnableHandlers);\n },\n getWorker: () => {\n const worker = get().worker;\n if (!worker) throw new Error(\"Worker is not initialized\");\n return worker;\n },\n}));\n\nexport const initMSWDevTool = useHandlerStore.getState().initMSWDevTool;\n"],"names":["create","initMSWDevToolStore","isFunction","getTotalEnableHandlers","updateEnableHandlers"],"mappings":";;;;;;AA0BO,MAAM,eAAe,GAAGA,cAAM,CAAoB,CAAC,GAAG,EAAE,GAAG,MAAM;AACtE,IAAA,eAAe,EAAE,EAAE;AACnB,IAAA,MAAM,EAAE,IAAI;AACZ,IAAA,YAAY,EAAE,EAAE;AAChB,IAAA,mBAAmB,EAAE,EAAE;AACvB,IAAA,cAAc,EAAE,CAAC,OAAO,KAAI;AAC1B,QAAA,MAAM,EACJ,MAAM,EACN,eAAe,EACf,mBAAmB,EACnB,mBAAmB,GACpB,GAAGC,wBAAmB,CAAC,OAAO,CAAC,CAAC;AAEjC,QAAA,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;AAChB,QAAA,GAAG,CAAC,EAAE,eAAe,EAAE,CAAC,CAAC;AACzB,QAAA,GAAG,CAAC;YACF,mBAAmB;AACpB,SAAA,CAAC,CAAC;AACH,QAAA,GAAG,CAAC,EAAE,YAAY,EAAE,mBAAmB,EAAE,CAAC,CAAC;AAE3C,QAAA,OAAO,MAAM,CAAC;KACf;AACD,IAAA,+BAA+B,EAAE,CAAC,OAAO,KAAI;AAC3C,QAAA,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC;AAEjC,QAAA,IAAIC,+BAAU,CAAC,OAAO,CAAC,EAAE;AACvB,YAAA,GAAG,CAAC,CAAC,EAAE,mBAAmB,EAAE,KAAI;AAC9B,gBAAA,MAAM,IAAI,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAC1C,gBAAA,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,OAAO,KAChD,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;sBACZ,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;sBAC7B,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CACnC,CAAC;gBACF,OAAO,EAAE,mBAAmB,EAAE,IAAI,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC;AACjE,aAAC,CAAC,CAAC;SACJ;aAAM;AACL,YAAA,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,OAAO,KAChD,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;kBACf,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;kBAC7B,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CACnC,CAAC;YACF,GAAG,CAAC,EAAE,mBAAmB,EAAE,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,CAAC;SACjE;AAED,QAAA,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC;AAC9C,QAAA,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC;QACxC,MAAM,mBAAmB,GAAGC,2BAAsB,CAChD,eAAe,EACf,YAAY,CACb,CAAC;AACF,QAAAC,yBAAoB,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;KACnD;IACD,SAAS,EAAE,MAAK;AACd,QAAA,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,MAAM,CAAC;AAC5B,QAAA,IAAI,CAAC,MAAM;AAAE,YAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;AAC1D,QAAA,OAAO,MAAM,CAAC;KACf;AACF,CAAA,CAAC,EAAE;AAES,MAAA,cAAc,GAAG,eAAe,CAAC,QAAQ,EAAE,CAAC;;;;;"}
|
package/dist/cjs/lib/util.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var handler = require('../const/handler.js');
|
|
4
|
+
|
|
3
5
|
const getRowId = ({ path, method }) => JSON.stringify({
|
|
4
6
|
path,
|
|
5
7
|
method,
|
|
@@ -26,7 +28,37 @@ const convertHandlers = (handlers) => {
|
|
|
26
28
|
}, []);
|
|
27
29
|
return { flattenHandlers, unsupportedHandlers };
|
|
28
30
|
};
|
|
31
|
+
const getTotalEnableHandlers = (flattenHandlers, restHandlers) => {
|
|
32
|
+
const checkedHttpHandlers = flattenHandlers
|
|
33
|
+
.filter((h) => h.enabled)
|
|
34
|
+
.map((h) => h.handler);
|
|
35
|
+
return [...checkedHttpHandlers, ...restHandlers];
|
|
36
|
+
};
|
|
37
|
+
/**
|
|
38
|
+
* This has to do with `msw` internal workings.
|
|
39
|
+
* If I spread an empty array in `resetHandlers`, it will be replaced by `initialHandler`.
|
|
40
|
+
* Therefore, I proposed the `clear` method, but unfortunately it was not accepted!
|
|
41
|
+
*/
|
|
42
|
+
const updateEnableHandlers = (worker, totalEnableHandlers) => {
|
|
43
|
+
if (totalEnableHandlers.length === 0) {
|
|
44
|
+
worker.resetHandlers(handler.dummyHandler);
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
worker.resetHandlers(...totalEnableHandlers);
|
|
48
|
+
};
|
|
49
|
+
const initMSWDevToolStore = (worker) => {
|
|
50
|
+
const handlers = worker.listHandlers();
|
|
51
|
+
const { flattenHandlers, unsupportedHandlers } = convertHandlers(handlers);
|
|
52
|
+
const handlerRowSelection = flattenHandlers.reduce((acc, handler) => {
|
|
53
|
+
acc[handler.id] = handler.enabled;
|
|
54
|
+
return acc;
|
|
55
|
+
}, {});
|
|
56
|
+
return { worker, flattenHandlers, unsupportedHandlers, handlerRowSelection };
|
|
57
|
+
};
|
|
29
58
|
|
|
30
59
|
exports.convertHandlers = convertHandlers;
|
|
31
60
|
exports.getRowId = getRowId;
|
|
61
|
+
exports.getTotalEnableHandlers = getTotalEnableHandlers;
|
|
62
|
+
exports.initMSWDevToolStore = initMSWDevToolStore;
|
|
63
|
+
exports.updateEnableHandlers = updateEnableHandlers;
|
|
32
64
|
//# sourceMappingURL=util.js.map
|
package/dist/cjs/lib/util.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../src/lib/util.ts"],"sourcesContent":["import { HttpHandler } from \"msw\";\nimport { FlattenHandler, Handler } from \"./type\";\n\nexport const getRowId = ({ path, method }: { path: string; method: string }) =>\n JSON.stringify({\n path,\n method,\n });\n\nexport const getObjFromRowId = (rowId: string) =>\n JSON.parse(rowId) as { path: string; method: string };\n\nexport const convertHandlers = (handlers: Handler[]) => {\n const unsupportedHandlers: Handler[] = [];\n const flattenHandlers: FlattenHandler[] = handlers.reduce((acc, _handler) => {\n // Current, GraphQL & WebSocketHandler is not supported.\n const handler = _handler as HttpHandler;\n if (!(\"info\" in handler && handler.info.method && handler.info.path)) {\n unsupportedHandlers.push(handler);\n return acc;\n }\n const { method: _method, path: _path } = handler.info;\n const [method, path] = [_method.toString(), _path.toString()];\n acc.push({\n id: getRowId({ path, method }),\n path,\n method,\n enabled: true,\n handler,\n });\n return acc;\n }, [] as FlattenHandler[]);\n return { flattenHandlers, unsupportedHandlers };\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../src/lib/util.ts"],"sourcesContent":["import { HttpHandler } from \"msw\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport { dummyHandler } from \"../const/handler\";\nimport { SetupWorker } from \"msw/lib/browser\";\nimport { initial } from \"lodash\";\nimport { RowSelectionState } from \"@tanstack/react-table\";\n\nexport const getRowId = ({ path, method }: { path: string; method: string }) =>\n JSON.stringify({\n path,\n method,\n });\n\nexport const getObjFromRowId = (rowId: string) =>\n JSON.parse(rowId) as { path: string; method: string };\n\nexport const convertHandlers = (handlers: Handler[]) => {\n const unsupportedHandlers: Handler[] = [];\n const flattenHandlers: FlattenHandler[] = handlers.reduce((acc, _handler) => {\n // Current, GraphQL & WebSocketHandler is not supported.\n const handler = _handler as HttpHandler;\n if (!(\"info\" in handler && handler.info.method && handler.info.path)) {\n unsupportedHandlers.push(handler);\n return acc;\n }\n\n const { method: _method, path: _path } = handler.info;\n const [method, path] = [_method.toString(), _path.toString()];\n acc.push({\n id: getRowId({ path, method }),\n path,\n method,\n enabled: true,\n handler,\n });\n\n return acc;\n }, [] as FlattenHandler[]);\n return { flattenHandlers, unsupportedHandlers };\n};\n\nexport const getTotalEnableHandlers = (\n flattenHandlers: FlattenHandler[],\n restHandlers: Handler[]\n) => {\n const checkedHttpHandlers = flattenHandlers\n .filter((h) => h.enabled)\n .map((h) => h.handler);\n return [...checkedHttpHandlers, ...restHandlers];\n};\n\n/**\n * This has to do with `msw` internal workings.\n * If I spread an empty array in `resetHandlers`, it will be replaced by `initialHandler`.\n * Therefore, I proposed the `clear` method, but unfortunately it was not accepted!\n */\nexport const updateEnableHandlers = (\n worker: SetupWorker,\n totalEnableHandlers: Handler[]\n) => {\n if (totalEnableHandlers.length === 0) {\n worker.resetHandlers(dummyHandler);\n return;\n }\n\n worker.resetHandlers(...totalEnableHandlers);\n};\n\nexport const initMSWDevToolStore = (worker: SetupWorker) => {\n const handlers = worker.listHandlers() as Handler[];\n const { flattenHandlers, unsupportedHandlers } = convertHandlers(handlers);\n const handlerRowSelection = flattenHandlers.reduce((acc, handler) => {\n acc[handler.id] = handler.enabled;\n return acc;\n }, {} as RowSelectionState);\n\n return { worker, flattenHandlers, unsupportedHandlers, handlerRowSelection };\n};\n"],"names":["dummyHandler"],"mappings":";;;;AAOa,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAoC,KACzE,IAAI,CAAC,SAAS,CAAC;IACb,IAAI;IACJ,MAAM;AACP,CAAA,EAAE;AAKQ,MAAA,eAAe,GAAG,CAAC,QAAmB,KAAI;IACrD,MAAM,mBAAmB,GAAc,EAAE,CAAC;IAC1C,MAAM,eAAe,GAAqB,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,QAAQ,KAAI;;QAE1E,MAAM,OAAO,GAAG,QAAuB,CAAC;AACxC,QAAA,IAAI,EAAE,MAAM,IAAI,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpE,YAAA,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AAClC,YAAA,OAAO,GAAG,CAAC;SACZ;AAED,QAAA,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC;AACtD,QAAA,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC9D,GAAG,CAAC,IAAI,CAAC;YACP,EAAE,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;YAC9B,IAAI;YACJ,MAAM;AACN,YAAA,OAAO,EAAE,IAAI;YACb,OAAO;AACR,SAAA,CAAC,CAAC;AAEH,QAAA,OAAO,GAAG,CAAC;KACZ,EAAE,EAAsB,CAAC,CAAC;AAC3B,IAAA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,CAAC;AAClD,EAAE;MAEW,sBAAsB,GAAG,CACpC,eAAiC,EACjC,YAAuB,KACrB;IACF,MAAM,mBAAmB,GAAG,eAAe;SACxC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC;SACxB,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC;AACzB,IAAA,OAAO,CAAC,GAAG,mBAAmB,EAAE,GAAG,YAAY,CAAC,CAAC;AACnD,EAAE;AAEF;;;;AAIG;MACU,oBAAoB,GAAG,CAClC,MAAmB,EACnB,mBAA8B,KAC5B;AACF,IAAA,IAAI,mBAAmB,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,QAAA,MAAM,CAAC,aAAa,CAACA,oBAAY,CAAC,CAAC;QACnC,OAAO;KACR;AAED,IAAA,MAAM,CAAC,aAAa,CAAC,GAAG,mBAAmB,CAAC,CAAC;AAC/C,EAAE;AAEW,MAAA,mBAAmB,GAAG,CAAC,MAAmB,KAAI;AACzD,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,EAAe,CAAC;IACpD,MAAM,EAAE,eAAe,EAAE,mBAAmB,EAAE,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC3E,MAAM,mBAAmB,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,OAAO,KAAI;QAClE,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,OAAO,CAAC;AAClC,QAAA,OAAO,GAAG,CAAC;KACZ,EAAE,EAAuB,CAAC,CAAC;IAE5B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAC;AAC/E;;;;;;;;"}
|
|
@@ -2,38 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var index = require('../../node_modules/@tanstack/react-table/build/lib/index.js');
|
|
5
|
-
var
|
|
6
|
-
var index$1 = require('../../node_modules/@tanstack/table-core/build/lib/index.js');
|
|
5
|
+
var useFlattenHandlersTable = require('../../hook/useFlattenHandlersTable.js');
|
|
7
6
|
|
|
8
7
|
const HttpControl = () => {
|
|
9
|
-
const
|
|
10
|
-
const columnHelper = index$1.createColumnHelper();
|
|
11
|
-
const columns = React.useMemo(() => {
|
|
12
|
-
return [
|
|
13
|
-
columnHelper.accessor("enabled", {
|
|
14
|
-
header: ({ table }) => (React.createElement("input", { type: "checkbox", checked: table.getIsAllRowsSelected(), onChange: (e) => table.toggleAllRowsSelected(e.target.checked) })),
|
|
15
|
-
cell: ({ row }) => (React.createElement("input", { type: "checkbox", checked: row.getIsSelected(), onChange: (e) => row.toggleSelected(e.target.checked) })),
|
|
16
|
-
}),
|
|
17
|
-
columnHelper.accessor("path", {
|
|
18
|
-
header: "End point",
|
|
19
|
-
}),
|
|
20
|
-
columnHelper.accessor("method", {
|
|
21
|
-
header: "Method",
|
|
22
|
-
cell: ({ row }) => (React.createElement("div", { className: "msw-dev-tool-center" }, row.original.enabled)),
|
|
23
|
-
}),
|
|
24
|
-
];
|
|
25
|
-
}, []);
|
|
26
|
-
const table = index.useReactTable({
|
|
27
|
-
columns,
|
|
28
|
-
data: flattenHandlers,
|
|
29
|
-
getCoreRowModel: index$1.getCoreRowModel(),
|
|
30
|
-
state: {
|
|
31
|
-
rowSelection: handlerRowSelection,
|
|
32
|
-
},
|
|
33
|
-
onRowSelectionChange: handleHandlerRowSelectionChange,
|
|
34
|
-
getRowId: (row) => row.id,
|
|
35
|
-
enableRowSelection: true,
|
|
36
|
-
});
|
|
8
|
+
const table = useFlattenHandlersTable.useFlattenHandlersTable();
|
|
37
9
|
return (React.createElement("div", null,
|
|
38
10
|
React.createElement("table", null,
|
|
39
11
|
React.createElement("thead", null, table.getHeaderGroups().map((headerGroup) => (React.createElement("tr", { key: headerGroup.id }, headerGroup.headers.map((header) => (React.createElement("th", { key: header.id }, header.isPlaceholder
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HttpControl.js","sources":["../../../../src/ui/DevToolContent/HttpControl.tsx"],"sourcesContent":["import React
|
|
1
|
+
{"version":3,"file":"HttpControl.js","sources":["../../../../src/ui/DevToolContent/HttpControl.tsx"],"sourcesContent":["import React from \"react\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useFlattenHandlersTable } from \"../../hook/useFlattenHandlersTable\";\n\nexport const HttpControl = () => {\n const table = useFlattenHandlersTable();\n\n return (\n <div>\n <table>\n <thead>\n {table.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map((header) => (\n <th key={header.id}>\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </th>\n ))}\n </tr>\n ))}\n </thead>\n <tbody>\n {table.getRowModel().rows.map((row) => (\n <tr key={row.id}>\n {row.getVisibleCells().map((cell) => (\n <td key={cell.id}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n );\n};\n"],"names":["useFlattenHandlersTable","flexRender"],"mappings":";;;;;;AAIO,MAAM,WAAW,GAAG,MAAK;AAC9B,IAAA,MAAM,KAAK,GAAGA,+CAAuB,EAAE,CAAC;AAExC,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;AACE,QAAA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA;AACE,YAAA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EACG,KAAK,CAAC,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC,WAAW,MACvC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,GAAG,EAAE,WAAW,CAAC,EAAE,EAAA,EACpB,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAC9B,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,MAAM,CAAC,EAAE,EACf,EAAA,MAAM,CAAC,aAAa;AACnB,kBAAE,IAAI;kBACJC,gBAAU,CACR,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAC9B,MAAM,CAAC,UAAU,EAAE,CACpB,CACF,CACN,CAAC,CACC,CACN,CAAC,CACI;AACR,YAAA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EACG,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MAChC,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,GAAG,CAAC,EAAE,IACZ,GAAG,CAAC,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,MAC9B,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,IAAI,CAAC,EAAE,EAAA,EACbA,gBAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CACvD,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACJ,EACN;AACJ;;;;"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { useReactTable } from '../node_modules/@tanstack/react-table/build/lib/index.js';
|
|
2
|
+
import { useHandlerStore } from '../lib/handlerStore.js';
|
|
3
|
+
import React__default, { useMemo } from 'react';
|
|
4
|
+
import { createColumnHelper, getCoreRowModel } from '../node_modules/@tanstack/table-core/build/lib/index.js';
|
|
5
|
+
|
|
6
|
+
const useFlattenHandlersTable = () => {
|
|
7
|
+
const { flattenHandlers, handlerRowSelection, handleHandlerRowSelectionChange, } = useHandlerStore();
|
|
8
|
+
const columnHelper = createColumnHelper();
|
|
9
|
+
const columns = useMemo(() => {
|
|
10
|
+
return [
|
|
11
|
+
columnHelper.accessor("enabled", {
|
|
12
|
+
header: ({ table }) => (React__default.createElement("input", { type: "checkbox", checked: table.getIsAllRowsSelected(), onChange: (e) => table.toggleAllRowsSelected(e.target.checked) })),
|
|
13
|
+
cell: ({ row }) => (React__default.createElement("input", { type: "checkbox", checked: row.getIsSelected(), onChange: (e) => row.toggleSelected(e.target.checked) })),
|
|
14
|
+
}),
|
|
15
|
+
columnHelper.accessor("path", {
|
|
16
|
+
header: "End point",
|
|
17
|
+
}),
|
|
18
|
+
columnHelper.accessor("method", {
|
|
19
|
+
header: "Method",
|
|
20
|
+
cell: ({ row }) => (React__default.createElement("div", { className: "msw-dev-tool-center" }, row.original.method)),
|
|
21
|
+
}),
|
|
22
|
+
];
|
|
23
|
+
}, []);
|
|
24
|
+
const table = useReactTable({
|
|
25
|
+
columns,
|
|
26
|
+
data: flattenHandlers,
|
|
27
|
+
getCoreRowModel: getCoreRowModel(),
|
|
28
|
+
state: {
|
|
29
|
+
rowSelection: handlerRowSelection,
|
|
30
|
+
},
|
|
31
|
+
onRowSelectionChange: handleHandlerRowSelectionChange,
|
|
32
|
+
getRowId: (row) => row.id,
|
|
33
|
+
enableRowSelection: true,
|
|
34
|
+
});
|
|
35
|
+
return table;
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
export { useFlattenHandlersTable };
|
|
39
|
+
//# sourceMappingURL=useFlattenHandlersTable.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlattenHandlersTable.js","sources":["../../../src/hook/useFlattenHandlersTable.tsx"],"sourcesContent":["import {\n ColumnDef,\n createColumnHelper,\n getCoreRowModel,\n useReactTable,\n} from \"@tanstack/react-table\";\nimport { useHandlerStore } from \"../lib/handlerStore\";\nimport { FlattenHandler } from \"../lib\";\nimport React, { useMemo } from \"react\";\n\nexport const useFlattenHandlersTable = () => {\n const {\n flattenHandlers,\n handlerRowSelection,\n handleHandlerRowSelectionChange,\n } = useHandlerStore();\n\n const columnHelper = createColumnHelper<FlattenHandler>();\n const columns: ColumnDef<FlattenHandler, any>[] = useMemo(() => {\n return [\n columnHelper.accessor(\"enabled\", {\n header: ({ table }) => (\n <input\n type=\"checkbox\"\n checked={table.getIsAllRowsSelected()}\n onChange={(e) => table.toggleAllRowsSelected(e.target.checked)}\n />\n ),\n cell: ({ row }) => (\n <input\n type=\"checkbox\"\n checked={row.getIsSelected()}\n onChange={(e) => row.toggleSelected(e.target.checked)}\n />\n ),\n }),\n columnHelper.accessor(\"path\", {\n header: \"End point\",\n }),\n columnHelper.accessor(\"method\", {\n header: \"Method\",\n cell: ({ row }) => (\n <div className=\"msw-dev-tool-center\">{row.original.method}</div>\n ),\n }),\n ];\n }, []);\n\n const table = useReactTable({\n columns,\n data: flattenHandlers,\n getCoreRowModel: getCoreRowModel(),\n state: {\n rowSelection: handlerRowSelection,\n },\n onRowSelectionChange: handleHandlerRowSelectionChange,\n getRowId: (row) => row.id,\n enableRowSelection: true,\n });\n\n return table;\n};\n"],"names":["React"],"mappings":";;;;;AAUO,MAAM,uBAAuB,GAAG,MAAK;IAC1C,MAAM,EACJ,eAAe,EACf,mBAAmB,EACnB,+BAA+B,GAChC,GAAG,eAAe,EAAE,CAAC;AAEtB,IAAA,MAAM,YAAY,GAAG,kBAAkB,EAAkB,CAAC;AAC1D,IAAA,MAAM,OAAO,GAAqC,OAAO,CAAC,MAAK;QAC7D,OAAO;AACL,YAAA,YAAY,CAAC,QAAQ,CAAC,SAAS,EAAE;AAC/B,gBAAA,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAChBA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,KAAK,CAAC,oBAAoB,EAAE,EACrC,QAAQ,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GAC9D,CACH;AACD,gBAAA,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,MACZA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,GAAG,CAAC,aAAa,EAAE,EAC5B,QAAQ,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,GACrD,CACH;aACF,CAAC;AACF,YAAA,YAAY,CAAC,QAAQ,CAAC,MAAM,EAAE;AAC5B,gBAAA,MAAM,EAAE,WAAW;aACpB,CAAC;AACF,YAAA,YAAY,CAAC,QAAQ,CAAC,QAAQ,EAAE;AAC9B,gBAAA,MAAM,EAAE,QAAQ;gBAChB,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,MACZA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,IAAE,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAO,CACjE;aACF,CAAC;SACH,CAAC;KACH,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,KAAK,GAAG,aAAa,CAAC;QAC1B,OAAO;AACP,QAAA,IAAI,EAAE,eAAe;QACrB,eAAe,EAAE,eAAe,EAAE;AAClC,QAAA,KAAK,EAAE;AACL,YAAA,YAAY,EAAE,mBAAmB;AAClC,SAAA;AACD,QAAA,oBAAoB,EAAE,+BAA+B;QACrD,QAAQ,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE;AACzB,QAAA,kBAAkB,EAAE,IAAI;AACzB,KAAA,CAAC,CAAC;AAEH,IAAA,OAAO,KAAK,CAAC;AACf;;;;"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { create } from 'zustand';
|
|
2
|
-
import {
|
|
3
|
-
import { dummyHandler } from '../const/handler.js';
|
|
2
|
+
import { initMSWDevToolStore, getTotalEnableHandlers, updateEnableHandlers } from './util.js';
|
|
4
3
|
import { l as lodashExports } from '../node_modules/lodash/lodash.js';
|
|
5
4
|
|
|
6
5
|
const useHandlerStore = create((set, get) => ({
|
|
@@ -9,21 +8,17 @@ const useHandlerStore = create((set, get) => ({
|
|
|
9
8
|
restHandlers: [],
|
|
10
9
|
handlerRowSelection: {},
|
|
11
10
|
initMSWDevTool: (_worker) => {
|
|
12
|
-
const worker = _worker;
|
|
11
|
+
const { worker, flattenHandlers, handlerRowSelection, unsupportedHandlers, } = initMSWDevToolStore(_worker);
|
|
13
12
|
set({ worker });
|
|
14
|
-
const handlers = worker.listHandlers();
|
|
15
|
-
const { flattenHandlers, unsupportedHandlers } = convertHandlers(handlers);
|
|
16
13
|
set({ flattenHandlers });
|
|
17
14
|
set({
|
|
18
|
-
handlerRowSelection
|
|
19
|
-
acc[handler.id] = handler.enabled;
|
|
20
|
-
return acc;
|
|
21
|
-
}, {}),
|
|
15
|
+
handlerRowSelection,
|
|
22
16
|
});
|
|
23
17
|
set({ restHandlers: unsupportedHandlers });
|
|
24
18
|
return worker;
|
|
25
19
|
},
|
|
26
20
|
handleHandlerRowSelectionChange: (updater) => {
|
|
21
|
+
const worker = get().getWorker();
|
|
27
22
|
if (lodashExports.isFunction(updater)) {
|
|
28
23
|
set(({ handlerRowSelection }) => {
|
|
29
24
|
const next = updater(handlerRowSelection);
|
|
@@ -39,7 +34,10 @@ const useHandlerStore = create((set, get) => ({
|
|
|
39
34
|
: { ...handler, enabled: false });
|
|
40
35
|
set({ handlerRowSelection: updater, flattenHandlers: current });
|
|
41
36
|
}
|
|
42
|
-
get().
|
|
37
|
+
const flattenHandlers = get().flattenHandlers;
|
|
38
|
+
const restHandlers = get().restHandlers;
|
|
39
|
+
const totalEnableHandlers = getTotalEnableHandlers(flattenHandlers, restHandlers);
|
|
40
|
+
updateEnableHandlers(worker, totalEnableHandlers);
|
|
43
41
|
},
|
|
44
42
|
getWorker: () => {
|
|
45
43
|
const worker = get().worker;
|
|
@@ -47,22 +45,6 @@ const useHandlerStore = create((set, get) => ({
|
|
|
47
45
|
throw new Error("Worker is not initialized");
|
|
48
46
|
return worker;
|
|
49
47
|
},
|
|
50
|
-
getTotalEnableHandlers: () => {
|
|
51
|
-
const checkedHttpHandlers = get()
|
|
52
|
-
.flattenHandlers.filter((h) => h.enabled)
|
|
53
|
-
.map((h) => h.handler);
|
|
54
|
-
const otherProtocolHandlers = get().restHandlers;
|
|
55
|
-
return [...checkedHttpHandlers, ...otherProtocolHandlers];
|
|
56
|
-
},
|
|
57
|
-
updateEnableHandlers: () => {
|
|
58
|
-
const worker = get().getWorker();
|
|
59
|
-
const totalEnableHandlers = get().getTotalEnableHandlers();
|
|
60
|
-
if (totalEnableHandlers.length === 0) {
|
|
61
|
-
worker.resetHandlers(dummyHandler);
|
|
62
|
-
return;
|
|
63
|
-
}
|
|
64
|
-
worker.resetHandlers(...totalEnableHandlers);
|
|
65
|
-
},
|
|
66
48
|
}));
|
|
67
49
|
const initMSWDevTool = useHandlerStore.getState().initMSWDevTool;
|
|
68
50
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"handlerStore.js","sources":["../../../src/lib/handlerStore.ts"],"sourcesContent":["import { SetupWorker } from \"msw/browser\";\nimport { create } from \"zustand\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport {
|
|
1
|
+
{"version":3,"file":"handlerStore.js","sources":["../../../src/lib/handlerStore.ts"],"sourcesContent":["import { SetupWorker } from \"msw/browser\";\nimport { create } from \"zustand\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport {\n convertHandlers,\n getTotalEnableHandlers,\n initMSWDevToolStore,\n updateEnableHandlers,\n} from \"./util\";\nimport { OnChangeFn, RowSelectionState, Updater } from \"@tanstack/react-table\";\nimport { isFunction } from \"lodash\";\n\nexport interface HandlerStoreState {\n worker: SetupWorker | null;\n /**\n * GraphQL or WebSocketHandler\n *\n * **Currently not supported**\n */\n restHandlers: Handler[];\n flattenHandlers: FlattenHandler[];\n handlerRowSelection: RowSelectionState;\n initMSWDevTool: (worker: SetupWorker) => SetupWorker;\n handleHandlerRowSelectionChange: OnChangeFn<RowSelectionState>;\n getWorker: () => SetupWorker;\n}\nexport const useHandlerStore = create<HandlerStoreState>((set, get) => ({\n flattenHandlers: [],\n worker: null,\n restHandlers: [],\n handlerRowSelection: {},\n initMSWDevTool: (_worker) => {\n const {\n worker,\n flattenHandlers,\n handlerRowSelection,\n unsupportedHandlers,\n } = initMSWDevToolStore(_worker);\n\n set({ worker });\n set({ flattenHandlers });\n set({\n handlerRowSelection,\n });\n set({ restHandlers: unsupportedHandlers });\n\n return worker;\n },\n handleHandlerRowSelectionChange: (updater) => {\n const worker = get().getWorker();\n\n if (isFunction(updater)) {\n set(({ handlerRowSelection }) => {\n const next = updater(handlerRowSelection);\n const current = get().flattenHandlers.map((handler) =>\n next[handler.id]\n ? { ...handler, enabled: true }\n : { ...handler, enabled: false }\n );\n return { handlerRowSelection: next, flattenHandlers: current };\n });\n } else {\n const current = get().flattenHandlers.map((handler) =>\n updater[handler.id]\n ? { ...handler, enabled: true }\n : { ...handler, enabled: false }\n );\n set({ handlerRowSelection: updater, flattenHandlers: current });\n }\n\n const flattenHandlers = get().flattenHandlers;\n const restHandlers = get().restHandlers;\n const totalEnableHandlers = getTotalEnableHandlers(\n flattenHandlers,\n restHandlers\n );\n updateEnableHandlers(worker, totalEnableHandlers);\n },\n getWorker: () => {\n const worker = get().worker;\n if (!worker) throw new Error(\"Worker is not initialized\");\n return worker;\n },\n}));\n\nexport const initMSWDevTool = useHandlerStore.getState().initMSWDevTool;\n"],"names":["isFunction"],"mappings":";;;;AA0BO,MAAM,eAAe,GAAG,MAAM,CAAoB,CAAC,GAAG,EAAE,GAAG,MAAM;AACtE,IAAA,eAAe,EAAE,EAAE;AACnB,IAAA,MAAM,EAAE,IAAI;AACZ,IAAA,YAAY,EAAE,EAAE;AAChB,IAAA,mBAAmB,EAAE,EAAE;AACvB,IAAA,cAAc,EAAE,CAAC,OAAO,KAAI;AAC1B,QAAA,MAAM,EACJ,MAAM,EACN,eAAe,EACf,mBAAmB,EACnB,mBAAmB,GACpB,GAAG,mBAAmB,CAAC,OAAO,CAAC,CAAC;AAEjC,QAAA,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;AAChB,QAAA,GAAG,CAAC,EAAE,eAAe,EAAE,CAAC,CAAC;AACzB,QAAA,GAAG,CAAC;YACF,mBAAmB;AACpB,SAAA,CAAC,CAAC;AACH,QAAA,GAAG,CAAC,EAAE,YAAY,EAAE,mBAAmB,EAAE,CAAC,CAAC;AAE3C,QAAA,OAAO,MAAM,CAAC;KACf;AACD,IAAA,+BAA+B,EAAE,CAAC,OAAO,KAAI;AAC3C,QAAA,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC;AAEjC,QAAA,IAAIA,wBAAU,CAAC,OAAO,CAAC,EAAE;AACvB,YAAA,GAAG,CAAC,CAAC,EAAE,mBAAmB,EAAE,KAAI;AAC9B,gBAAA,MAAM,IAAI,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAC1C,gBAAA,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,OAAO,KAChD,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;sBACZ,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;sBAC7B,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CACnC,CAAC;gBACF,OAAO,EAAE,mBAAmB,EAAE,IAAI,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC;AACjE,aAAC,CAAC,CAAC;SACJ;aAAM;AACL,YAAA,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,OAAO,KAChD,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;kBACf,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;kBAC7B,EAAE,GAAG,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CACnC,CAAC;YACF,GAAG,CAAC,EAAE,mBAAmB,EAAE,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,CAAC;SACjE;AAED,QAAA,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC;AAC9C,QAAA,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC;QACxC,MAAM,mBAAmB,GAAG,sBAAsB,CAChD,eAAe,EACf,YAAY,CACb,CAAC;AACF,QAAA,oBAAoB,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;KACnD;IACD,SAAS,EAAE,MAAK;AACd,QAAA,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,MAAM,CAAC;AAC5B,QAAA,IAAI,CAAC,MAAM;AAAE,YAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;AAC1D,QAAA,OAAO,MAAM,CAAC;KACf;AACF,CAAA,CAAC,EAAE;AAES,MAAA,cAAc,GAAG,eAAe,CAAC,QAAQ,EAAE,CAAC;;;;"}
|
package/dist/esm/lib/util.js
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { dummyHandler } from '../const/handler.js';
|
|
2
|
+
|
|
1
3
|
const getRowId = ({ path, method }) => JSON.stringify({
|
|
2
4
|
path,
|
|
3
5
|
method,
|
|
@@ -24,6 +26,33 @@ const convertHandlers = (handlers) => {
|
|
|
24
26
|
}, []);
|
|
25
27
|
return { flattenHandlers, unsupportedHandlers };
|
|
26
28
|
};
|
|
29
|
+
const getTotalEnableHandlers = (flattenHandlers, restHandlers) => {
|
|
30
|
+
const checkedHttpHandlers = flattenHandlers
|
|
31
|
+
.filter((h) => h.enabled)
|
|
32
|
+
.map((h) => h.handler);
|
|
33
|
+
return [...checkedHttpHandlers, ...restHandlers];
|
|
34
|
+
};
|
|
35
|
+
/**
|
|
36
|
+
* This has to do with `msw` internal workings.
|
|
37
|
+
* If I spread an empty array in `resetHandlers`, it will be replaced by `initialHandler`.
|
|
38
|
+
* Therefore, I proposed the `clear` method, but unfortunately it was not accepted!
|
|
39
|
+
*/
|
|
40
|
+
const updateEnableHandlers = (worker, totalEnableHandlers) => {
|
|
41
|
+
if (totalEnableHandlers.length === 0) {
|
|
42
|
+
worker.resetHandlers(dummyHandler);
|
|
43
|
+
return;
|
|
44
|
+
}
|
|
45
|
+
worker.resetHandlers(...totalEnableHandlers);
|
|
46
|
+
};
|
|
47
|
+
const initMSWDevToolStore = (worker) => {
|
|
48
|
+
const handlers = worker.listHandlers();
|
|
49
|
+
const { flattenHandlers, unsupportedHandlers } = convertHandlers(handlers);
|
|
50
|
+
const handlerRowSelection = flattenHandlers.reduce((acc, handler) => {
|
|
51
|
+
acc[handler.id] = handler.enabled;
|
|
52
|
+
return acc;
|
|
53
|
+
}, {});
|
|
54
|
+
return { worker, flattenHandlers, unsupportedHandlers, handlerRowSelection };
|
|
55
|
+
};
|
|
27
56
|
|
|
28
|
-
export { convertHandlers, getRowId };
|
|
57
|
+
export { convertHandlers, getRowId, getTotalEnableHandlers, initMSWDevToolStore, updateEnableHandlers };
|
|
29
58
|
//# sourceMappingURL=util.js.map
|
package/dist/esm/lib/util.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../src/lib/util.ts"],"sourcesContent":["import { HttpHandler } from \"msw\";\nimport { FlattenHandler, Handler } from \"./type\";\n\nexport const getRowId = ({ path, method }: { path: string; method: string }) =>\n JSON.stringify({\n path,\n method,\n });\n\nexport const getObjFromRowId = (rowId: string) =>\n JSON.parse(rowId) as { path: string; method: string };\n\nexport const convertHandlers = (handlers: Handler[]) => {\n const unsupportedHandlers: Handler[] = [];\n const flattenHandlers: FlattenHandler[] = handlers.reduce((acc, _handler) => {\n // Current, GraphQL & WebSocketHandler is not supported.\n const handler = _handler as HttpHandler;\n if (!(\"info\" in handler && handler.info.method && handler.info.path)) {\n unsupportedHandlers.push(handler);\n return acc;\n }\n const { method: _method, path: _path } = handler.info;\n const [method, path] = [_method.toString(), _path.toString()];\n acc.push({\n id: getRowId({ path, method }),\n path,\n method,\n enabled: true,\n handler,\n });\n return acc;\n }, [] as FlattenHandler[]);\n return { flattenHandlers, unsupportedHandlers };\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../src/lib/util.ts"],"sourcesContent":["import { HttpHandler } from \"msw\";\nimport { FlattenHandler, Handler } from \"./type\";\nimport { dummyHandler } from \"../const/handler\";\nimport { SetupWorker } from \"msw/lib/browser\";\nimport { initial } from \"lodash\";\nimport { RowSelectionState } from \"@tanstack/react-table\";\n\nexport const getRowId = ({ path, method }: { path: string; method: string }) =>\n JSON.stringify({\n path,\n method,\n });\n\nexport const getObjFromRowId = (rowId: string) =>\n JSON.parse(rowId) as { path: string; method: string };\n\nexport const convertHandlers = (handlers: Handler[]) => {\n const unsupportedHandlers: Handler[] = [];\n const flattenHandlers: FlattenHandler[] = handlers.reduce((acc, _handler) => {\n // Current, GraphQL & WebSocketHandler is not supported.\n const handler = _handler as HttpHandler;\n if (!(\"info\" in handler && handler.info.method && handler.info.path)) {\n unsupportedHandlers.push(handler);\n return acc;\n }\n\n const { method: _method, path: _path } = handler.info;\n const [method, path] = [_method.toString(), _path.toString()];\n acc.push({\n id: getRowId({ path, method }),\n path,\n method,\n enabled: true,\n handler,\n });\n\n return acc;\n }, [] as FlattenHandler[]);\n return { flattenHandlers, unsupportedHandlers };\n};\n\nexport const getTotalEnableHandlers = (\n flattenHandlers: FlattenHandler[],\n restHandlers: Handler[]\n) => {\n const checkedHttpHandlers = flattenHandlers\n .filter((h) => h.enabled)\n .map((h) => h.handler);\n return [...checkedHttpHandlers, ...restHandlers];\n};\n\n/**\n * This has to do with `msw` internal workings.\n * If I spread an empty array in `resetHandlers`, it will be replaced by `initialHandler`.\n * Therefore, I proposed the `clear` method, but unfortunately it was not accepted!\n */\nexport const updateEnableHandlers = (\n worker: SetupWorker,\n totalEnableHandlers: Handler[]\n) => {\n if (totalEnableHandlers.length === 0) {\n worker.resetHandlers(dummyHandler);\n return;\n }\n\n worker.resetHandlers(...totalEnableHandlers);\n};\n\nexport const initMSWDevToolStore = (worker: SetupWorker) => {\n const handlers = worker.listHandlers() as Handler[];\n const { flattenHandlers, unsupportedHandlers } = convertHandlers(handlers);\n const handlerRowSelection = flattenHandlers.reduce((acc, handler) => {\n acc[handler.id] = handler.enabled;\n return acc;\n }, {} as RowSelectionState);\n\n return { worker, flattenHandlers, unsupportedHandlers, handlerRowSelection };\n};\n"],"names":[],"mappings":";;AAOa,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAoC,KACzE,IAAI,CAAC,SAAS,CAAC;IACb,IAAI;IACJ,MAAM;AACP,CAAA,EAAE;AAKQ,MAAA,eAAe,GAAG,CAAC,QAAmB,KAAI;IACrD,MAAM,mBAAmB,GAAc,EAAE,CAAC;IAC1C,MAAM,eAAe,GAAqB,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,QAAQ,KAAI;;QAE1E,MAAM,OAAO,GAAG,QAAuB,CAAC;AACxC,QAAA,IAAI,EAAE,MAAM,IAAI,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpE,YAAA,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AAClC,YAAA,OAAO,GAAG,CAAC;SACZ;AAED,QAAA,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC;AACtD,QAAA,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC9D,GAAG,CAAC,IAAI,CAAC;YACP,EAAE,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;YAC9B,IAAI;YACJ,MAAM;AACN,YAAA,OAAO,EAAE,IAAI;YACb,OAAO;AACR,SAAA,CAAC,CAAC;AAEH,QAAA,OAAO,GAAG,CAAC;KACZ,EAAE,EAAsB,CAAC,CAAC;AAC3B,IAAA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,CAAC;AAClD,EAAE;MAEW,sBAAsB,GAAG,CACpC,eAAiC,EACjC,YAAuB,KACrB;IACF,MAAM,mBAAmB,GAAG,eAAe;SACxC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC;SACxB,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC;AACzB,IAAA,OAAO,CAAC,GAAG,mBAAmB,EAAE,GAAG,YAAY,CAAC,CAAC;AACnD,EAAE;AAEF;;;;AAIG;MACU,oBAAoB,GAAG,CAClC,MAAmB,EACnB,mBAA8B,KAC5B;AACF,IAAA,IAAI,mBAAmB,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,QAAA,MAAM,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QACnC,OAAO;KACR;AAED,IAAA,MAAM,CAAC,aAAa,CAAC,GAAG,mBAAmB,CAAC,CAAC;AAC/C,EAAE;AAEW,MAAA,mBAAmB,GAAG,CAAC,MAAmB,KAAI;AACzD,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,EAAe,CAAC;IACpD,MAAM,EAAE,eAAe,EAAE,mBAAmB,EAAE,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC3E,MAAM,mBAAmB,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,OAAO,KAAI;QAClE,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,OAAO,CAAC;AAClC,QAAA,OAAO,GAAG,CAAC;KACZ,EAAE,EAAuB,CAAC,CAAC;IAE5B,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAC;AAC/E;;;;"}
|
|
@@ -1,37 +1,9 @@
|
|
|
1
|
-
import React__default
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import { createColumnHelper, getCoreRowModel } from '../../node_modules/@tanstack/table-core/build/lib/index.js';
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { flexRender } from '../../node_modules/@tanstack/react-table/build/lib/index.js';
|
|
3
|
+
import { useFlattenHandlersTable } from '../../hook/useFlattenHandlersTable.js';
|
|
5
4
|
|
|
6
5
|
const HttpControl = () => {
|
|
7
|
-
const
|
|
8
|
-
const columnHelper = createColumnHelper();
|
|
9
|
-
const columns = useMemo(() => {
|
|
10
|
-
return [
|
|
11
|
-
columnHelper.accessor("enabled", {
|
|
12
|
-
header: ({ table }) => (React__default.createElement("input", { type: "checkbox", checked: table.getIsAllRowsSelected(), onChange: (e) => table.toggleAllRowsSelected(e.target.checked) })),
|
|
13
|
-
cell: ({ row }) => (React__default.createElement("input", { type: "checkbox", checked: row.getIsSelected(), onChange: (e) => row.toggleSelected(e.target.checked) })),
|
|
14
|
-
}),
|
|
15
|
-
columnHelper.accessor("path", {
|
|
16
|
-
header: "End point",
|
|
17
|
-
}),
|
|
18
|
-
columnHelper.accessor("method", {
|
|
19
|
-
header: "Method",
|
|
20
|
-
cell: ({ row }) => (React__default.createElement("div", { className: "msw-dev-tool-center" }, row.original.enabled)),
|
|
21
|
-
}),
|
|
22
|
-
];
|
|
23
|
-
}, []);
|
|
24
|
-
const table = useReactTable({
|
|
25
|
-
columns,
|
|
26
|
-
data: flattenHandlers,
|
|
27
|
-
getCoreRowModel: getCoreRowModel(),
|
|
28
|
-
state: {
|
|
29
|
-
rowSelection: handlerRowSelection,
|
|
30
|
-
},
|
|
31
|
-
onRowSelectionChange: handleHandlerRowSelectionChange,
|
|
32
|
-
getRowId: (row) => row.id,
|
|
33
|
-
enableRowSelection: true,
|
|
34
|
-
});
|
|
6
|
+
const table = useFlattenHandlersTable();
|
|
35
7
|
return (React__default.createElement("div", null,
|
|
36
8
|
React__default.createElement("table", null,
|
|
37
9
|
React__default.createElement("thead", null, table.getHeaderGroups().map((headerGroup) => (React__default.createElement("tr", { key: headerGroup.id }, headerGroup.headers.map((header) => (React__default.createElement("th", { key: header.id }, header.isPlaceholder
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HttpControl.js","sources":["../../../../src/ui/DevToolContent/HttpControl.tsx"],"sourcesContent":["import React
|
|
1
|
+
{"version":3,"file":"HttpControl.js","sources":["../../../../src/ui/DevToolContent/HttpControl.tsx"],"sourcesContent":["import React from \"react\";\nimport { flexRender } from \"@tanstack/react-table\";\nimport { useFlattenHandlersTable } from \"../../hook/useFlattenHandlersTable\";\n\nexport const HttpControl = () => {\n const table = useFlattenHandlersTable();\n\n return (\n <div>\n <table>\n <thead>\n {table.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map((header) => (\n <th key={header.id}>\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </th>\n ))}\n </tr>\n ))}\n </thead>\n <tbody>\n {table.getRowModel().rows.map((row) => (\n <tr key={row.id}>\n {row.getVisibleCells().map((cell) => (\n <td key={cell.id}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;AAIO,MAAM,WAAW,GAAG,MAAK;AAC9B,IAAA,MAAM,KAAK,GAAG,uBAAuB,EAAE,CAAC;AAExC,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;AACE,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA;AACE,YAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EACG,KAAK,CAAC,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC,WAAW,MACvCA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,GAAG,EAAE,WAAW,CAAC,EAAE,EAAA,EACpB,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAC9BA,cAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,MAAM,CAAC,EAAE,EACf,EAAA,MAAM,CAAC,aAAa;AACnB,kBAAE,IAAI;kBACJ,UAAU,CACR,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAC9B,MAAM,CAAC,UAAU,EAAE,CACpB,CACF,CACN,CAAC,CACC,CACN,CAAC,CACI;AACR,YAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EACG,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MAChCA,cAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,GAAG,CAAC,EAAE,IACZ,GAAG,CAAC,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,MAC9BA,cAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,IAAI,CAAC,EAAE,EAAA,EACb,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CACvD,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACJ,EACN;AACJ;;;;"}
|