fastapi-rtk 2.2.1 → 2.3.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/.bundled/jsonforms/cjs/_virtual/index10.cjs +2 -2
- package/dist/.bundled/jsonforms/cjs/_virtual/index6.cjs +2 -2
- package/dist/.bundled/jsonforms/cjs/_virtual/index7.cjs +2 -2
- package/dist/.bundled/jsonforms/cjs/_virtual/index8.cjs +2 -2
- package/dist/.bundled/jsonforms/cjs/_virtual/index9.cjs +2 -2
- package/dist/.bundled/jsonforms/esm/_virtual/index10.mjs +2 -2
- package/dist/.bundled/jsonforms/esm/_virtual/index6.mjs +2 -2
- package/dist/.bundled/jsonforms/esm/_virtual/index7.mjs +2 -2
- package/dist/.bundled/jsonforms/esm/_virtual/index8.mjs +2 -2
- package/dist/.bundled/jsonforms/esm/_virtual/index9.mjs +2 -2
- package/dist/.external/cjs/ajv@8.17.1/ajv/dist/compile/index.cjs +1 -1
- package/dist/.external/cjs/ajv@8.17.1/ajv/dist/vocabularies/applicator/index.cjs +1 -1
- package/dist/.external/cjs/ajv@8.17.1/ajv/dist/vocabularies/core/index.cjs +1 -1
- package/dist/.external/cjs/ajv@8.17.1/ajv/dist/vocabularies/format/index.cjs +1 -1
- package/dist/.external/cjs/ajv@8.17.1/ajv/dist/vocabularies/validation/index.cjs +1 -1
- package/dist/.external/esm/ajv@8.17.1/ajv/dist/compile/index.mjs +1 -1
- package/dist/.external/esm/ajv@8.17.1/ajv/dist/vocabularies/applicator/index.mjs +1 -1
- package/dist/.external/esm/ajv@8.17.1/ajv/dist/vocabularies/core/index.mjs +1 -1
- package/dist/.external/esm/ajv@8.17.1/ajv/dist/vocabularies/format/index.mjs +1 -1
- package/dist/.external/esm/ajv@8.17.1/ajv/dist/vocabularies/validation/index.mjs +1 -1
- package/dist/api-types/lib/index.d.ts +1 -0
- package/dist/contexts/lib/ApiContext/types.d.ts +2 -2
- package/dist/core/cjs/Tables/NextGenDataGrid/NextGenDataGrid.cjs +18 -2
- package/dist/core/cjs/Tables/NextGenDataGrid/hooks/useActions.cjs +4 -2
- package/dist/core/cjs/Tables/NextGenDataGrid/hooks/useInfiniteScroll.cjs +57 -0
- package/dist/core/cjs/Tables/NextGenDataGrid/hooks/usePatchProps.cjs +31 -0
- package/dist/core/cjs/Tables/NextGenDataGrid/hooks/useToolbar/basicToolbars.cjs +24 -0
- package/dist/core/cjs/Tables/NextGenDataGrid/hooks/useToolbar/useToolbar.cjs +1 -6
- package/dist/core/cjs/Wrappers/ApiProvider/hooks/utils/useStreamingData.cjs +17 -9
- package/dist/core/cjs/Wrappers/InfiniteScroll/InfiniteScroll.cjs +3 -3
- package/dist/core/cjs/index.cjs +3 -0
- package/dist/core/cjs/translations/de.cjs +2 -0
- package/dist/core/esm/Tables/NextGenDataGrid/NextGenDataGrid.mjs +19 -3
- package/dist/core/esm/Tables/NextGenDataGrid/hooks/useActions.mjs +4 -2
- package/dist/core/esm/Tables/NextGenDataGrid/hooks/useInfiniteScroll.mjs +57 -0
- package/dist/core/esm/Tables/NextGenDataGrid/hooks/usePatchProps.mjs +31 -0
- package/dist/core/esm/Tables/NextGenDataGrid/hooks/useToolbar/basicToolbars.mjs +24 -0
- package/dist/core/esm/Tables/NextGenDataGrid/hooks/useToolbar/useToolbar.mjs +2 -7
- package/dist/core/esm/Wrappers/ApiProvider/hooks/utils/useStreamingData.mjs +17 -9
- package/dist/core/esm/Wrappers/InfiniteScroll/InfiniteScroll.mjs +3 -3
- package/dist/core/esm/index.mjs +3 -0
- package/dist/core/esm/translations/de.mjs +2 -0
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/useInfiniteScroll.d.ts +7 -0
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/useInfiniteScroll.test.d.ts +1 -0
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/usePatchProps.d.ts +15 -0
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/usePatchProps.test.d.ts +1 -0
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/useToolbar/basicToolbars.d.ts +15 -1
- package/dist/core/lib/Tables/NextGenDataGrid/hooks/useToolbar/basicToolbars.test.d.ts +1 -0
- package/dist/core/lib/Wrappers/ApiProvider/hooks/utils/useStreamingData.d.ts +1 -6
- package/dist/core/lib/Wrappers/Provider/hooks/useProvideLang.d.ts +10 -0
- package/dist/core/lib/index.d.ts +1 -0
- package/dist/core/lib/translations/de.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const index = require("../../../../../../.bundled/jsonforms/cjs/_virtual/
|
|
3
|
+
const index = require("../../../../../../.bundled/jsonforms/cjs/_virtual/index10.cjs");
|
|
4
4
|
const index$1 = require("./codegen/index.cjs");
|
|
5
5
|
const validation_error = require("../runtime/validation_error.cjs");
|
|
6
6
|
const names = require("./names.cjs");
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/
|
|
3
|
+
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/index8.cjs");
|
|
4
4
|
const additionalItems = require("./additionalItems.cjs");
|
|
5
5
|
const prefixItems = require("./prefixItems.cjs");
|
|
6
6
|
const items = require("./items.cjs");
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/
|
|
3
|
+
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/index6.cjs");
|
|
4
4
|
const id = require("./id.cjs");
|
|
5
5
|
const ref = require("./ref.cjs");
|
|
6
6
|
var hasRequiredCore;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/
|
|
3
|
+
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/index9.cjs");
|
|
4
4
|
const format = require("./format.cjs");
|
|
5
5
|
var hasRequiredFormat;
|
|
6
6
|
function requireFormat() {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/
|
|
3
|
+
const index = require("../../../../../../../.bundled/jsonforms/cjs/_virtual/index7.cjs");
|
|
4
4
|
const limitNumber = require("./limitNumber.cjs");
|
|
5
5
|
const multipleOf = require("./multipleOf.cjs");
|
|
6
6
|
const limitLength = require("./limitLength.cjs");
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as compile } from "../../../../../../.bundled/jsonforms/esm/_virtual/
|
|
1
|
+
import { __exports as compile } from "../../../../../../.bundled/jsonforms/esm/_virtual/index10.mjs";
|
|
2
2
|
import { __require as requireCodegen } from "./codegen/index.mjs";
|
|
3
3
|
import { __require as requireValidation_error } from "../runtime/validation_error.mjs";
|
|
4
4
|
import { __require as requireNames } from "./names.mjs";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as applicator } from "../../../../../../../.bundled/jsonforms/esm/_virtual/
|
|
1
|
+
import { __exports as applicator } from "../../../../../../../.bundled/jsonforms/esm/_virtual/index8.mjs";
|
|
2
2
|
import { __require as requireAdditionalItems } from "./additionalItems.mjs";
|
|
3
3
|
import { __require as requirePrefixItems } from "./prefixItems.mjs";
|
|
4
4
|
import { __require as requireItems } from "./items.mjs";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as core } from "../../../../../../../.bundled/jsonforms/esm/_virtual/
|
|
1
|
+
import { __exports as core } from "../../../../../../../.bundled/jsonforms/esm/_virtual/index6.mjs";
|
|
2
2
|
import { __require as requireId } from "./id.mjs";
|
|
3
3
|
import { __require as requireRef } from "./ref.mjs";
|
|
4
4
|
var hasRequiredCore;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as format } from "../../../../../../../.bundled/jsonforms/esm/_virtual/
|
|
1
|
+
import { __exports as format } from "../../../../../../../.bundled/jsonforms/esm/_virtual/index9.mjs";
|
|
2
2
|
import { __require as requireFormat$1 } from "./format.mjs";
|
|
3
3
|
var hasRequiredFormat;
|
|
4
4
|
function requireFormat() {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __exports as validation } from "../../../../../../../.bundled/jsonforms/esm/_virtual/
|
|
1
|
+
import { __exports as validation } from "../../../../../../../.bundled/jsonforms/esm/_virtual/index7.mjs";
|
|
2
2
|
import { __require as requireLimitNumber } from "./limitNumber.mjs";
|
|
3
3
|
import { __require as requireMultipleOf } from "./multipleOf.mjs";
|
|
4
4
|
import { __require as requireLimitLength } from "./limitLength.mjs";
|
|
@@ -128,8 +128,8 @@ export interface ApiContextValue {
|
|
|
128
128
|
dataQuery: UseQueryResult<APIData | null>;
|
|
129
129
|
/** The raw React Query infinite query object for streaming requests. */
|
|
130
130
|
streamingQuery: UseInfiniteQueryResult<InfiniteData<APIData | null>>;
|
|
131
|
-
/**
|
|
132
|
-
streaming
|
|
131
|
+
/** Streaming (infinite-scroll) controller. Present only when the `ApiProvider` is configured for streaming; its presence is the streaming-mode signal. When set, `data.result` carries every row fetched so far (all pages) and `streaming.data` is the page-number-keyed breakdown. */
|
|
132
|
+
streaming?: APIStreaming;
|
|
133
133
|
/** An object containing special keys for the API query, such as 'all' and 'actions'. */
|
|
134
134
|
specialKey: APISpecialKey;
|
|
135
135
|
/** A function to update the query parameters. */
|
|
@@ -24,6 +24,8 @@ const useEvent = require("./hooks/useEvent.cjs");
|
|
|
24
24
|
const useFilters = require("./hooks/useFilters.cjs");
|
|
25
25
|
const useGlobalFilter = require("./hooks/useGlobalFilter.cjs");
|
|
26
26
|
const useI18n = require("./hooks/useI18n.cjs");
|
|
27
|
+
const useInfiniteScroll = require("./hooks/useInfiniteScroll.cjs");
|
|
28
|
+
const usePatchProps = require("./hooks/usePatchProps.cjs");
|
|
27
29
|
const useOptimizations = require("./hooks/useOptimizations.cjs");
|
|
28
30
|
const usePagination = require("./hooks/usePagination.cjs");
|
|
29
31
|
const useSelection = require("./hooks/useSelection/useSelection.cjs");
|
|
@@ -38,6 +40,13 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
38
40
|
var _a, _b, _c, _d;
|
|
39
41
|
const { info, specialKey } = contexts.useApi();
|
|
40
42
|
const propsFromMantineTheme = core.useProps("NextGenDataGrid", {}, {});
|
|
43
|
+
const [patchedProps, setPatchedProps] = React.useState({});
|
|
44
|
+
const patchProps = React.useCallback((partial) => {
|
|
45
|
+
setPatchedProps((prev) => {
|
|
46
|
+
const next = utils.deepMerge(prev, partial);
|
|
47
|
+
return JSON.stringify(next) === JSON.stringify(prev) ? prev : next;
|
|
48
|
+
});
|
|
49
|
+
}, []);
|
|
41
50
|
const {
|
|
42
51
|
children,
|
|
43
52
|
// DataGrid props
|
|
@@ -76,7 +85,11 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
76
85
|
hideDownload,
|
|
77
86
|
hideFilter,
|
|
78
87
|
...rest
|
|
79
|
-
} = React.useMemo(
|
|
88
|
+
} = React.useMemo(
|
|
89
|
+
// deep-merge precedence: default -> patched -> theme -> user (user props always win)
|
|
90
|
+
() => utils.deepMerge(defaultProps, patchedProps, propsFromMantineTheme, props),
|
|
91
|
+
[props, propsFromMantineTheme, patchedProps]
|
|
92
|
+
);
|
|
80
93
|
if (bodySeparator && body) {
|
|
81
94
|
Object.keys(body).forEach((col) => {
|
|
82
95
|
const entry = body[col] = body[col] || {};
|
|
@@ -152,6 +165,7 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
152
165
|
const paginationProps = usePagination.usePagination(hidePagination);
|
|
153
166
|
const columnsProps = useColumns.useColumns(columnProps, header, body, textFilterSeparator, enableAdvancedFilters, memo);
|
|
154
167
|
const sizeProps = useSize.useSize(withBorder);
|
|
168
|
+
const infiniteScrollProps = useInfiniteScroll.useInfiniteScroll();
|
|
155
169
|
const actionsConfig = React.useMemo(() => utils.mergeProps(body ?? {}, specialKey.actions), [body, specialKey]);
|
|
156
170
|
const actionsProps = useActions.useActions(
|
|
157
171
|
hideActions,
|
|
@@ -176,6 +190,7 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
176
190
|
sortingProps,
|
|
177
191
|
paginationProps,
|
|
178
192
|
sizeProps,
|
|
193
|
+
infiniteScrollProps,
|
|
179
194
|
actionsProps,
|
|
180
195
|
globalFilterProps,
|
|
181
196
|
toolbarProps,
|
|
@@ -195,6 +210,7 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
195
210
|
sortingProps,
|
|
196
211
|
paginationProps,
|
|
197
212
|
sizeProps,
|
|
213
|
+
infiniteScrollProps,
|
|
198
214
|
actionsProps,
|
|
199
215
|
globalFilterProps,
|
|
200
216
|
toolbarProps,
|
|
@@ -256,7 +272,7 @@ const NextGenDataGrid = React.forwardRef((props, ref) => {
|
|
|
256
272
|
useQueryOnlyVisibleColumnsProps
|
|
257
273
|
}
|
|
258
274
|
),
|
|
259
|
-
/* @__PURE__ */ jsxRuntime.jsx(MantineReactTable.MantineReactTable, { table: mrtTable, ...rest }),
|
|
275
|
+
/* @__PURE__ */ jsxRuntime.jsx(usePatchProps.PropPatchProvider, { value: patchProps, children: /* @__PURE__ */ jsxRuntime.jsx(MantineReactTable.MantineReactTable, { table: mrtTable, ...rest }) }),
|
|
260
276
|
children == null ? void 0 : children({ table: mrtTable }),
|
|
261
277
|
!hideError ? /* @__PURE__ */ jsxRuntime.jsx(ErrorDialog.ErrorDialog, {}) : null
|
|
262
278
|
] });
|
|
@@ -7,11 +7,13 @@ const Actions = require("../../../ActionIcons/Actions.cjs");
|
|
|
7
7
|
const contexts = require("fastapi-rtk/contexts");
|
|
8
8
|
const useAuth = require("../../../hooks/auth/useAuth.cjs");
|
|
9
9
|
const FallbackWrapper = require("../FallbackWrapper.cjs");
|
|
10
|
+
const usePatchProps = require("./usePatchProps.cjs");
|
|
11
|
+
const ROW_ACTIONS_COLUMN_ID = "mrt-row-actions";
|
|
10
12
|
function useActions(hideActions, component, viewProps, editProps, deleteProps) {
|
|
11
13
|
const api = contexts.useApi();
|
|
12
14
|
const auth = useAuth.useAuth();
|
|
13
15
|
const renderRowActions = React.useCallback(
|
|
14
|
-
({ row, ...rest }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
16
|
+
({ row, ...rest }) => /* @__PURE__ */ jsxRuntime.jsx(usePatchProps.AutoSizeColumn, { columnId: ROW_ACTIONS_COLUMN_ID, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
15
17
|
FallbackWrapper.FallbackWrapper,
|
|
16
18
|
{
|
|
17
19
|
fallback: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -31,7 +33,7 @@ function useActions(hideActions, component, viewProps, editProps, deleteProps) {
|
|
|
31
33
|
},
|
|
32
34
|
children: component
|
|
33
35
|
}
|
|
34
|
-
),
|
|
36
|
+
) }),
|
|
35
37
|
[api, auth, component, viewProps, editProps, deleteProps]
|
|
36
38
|
);
|
|
37
39
|
return { enableEditing: !hideActions, editDisplayMode: "modal", renderRowActions };
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
4
|
+
const core = require("@mantine/core");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const contexts = require("fastapi-rtk/contexts");
|
|
7
|
+
function useInfiniteScroll() {
|
|
8
|
+
var _a;
|
|
9
|
+
const { loading, streaming, data, queryParams } = contexts.useApi();
|
|
10
|
+
const { t } = contexts.useTranslation();
|
|
11
|
+
const rowVirtualizerInstanceRef = React.useRef(null);
|
|
12
|
+
const fetchMoreOnBottomReached = React.useCallback(
|
|
13
|
+
(containerRefElement) => {
|
|
14
|
+
if (!containerRefElement || loading || (streaming == null ? void 0 : streaming.isEnd)) {
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
17
|
+
const { scrollHeight, scrollTop, clientHeight } = containerRefElement;
|
|
18
|
+
if (scrollHeight - scrollTop - clientHeight < clientHeight) {
|
|
19
|
+
streaming == null ? void 0 : streaming.fetch();
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
[loading, streaming]
|
|
23
|
+
);
|
|
24
|
+
const querySignature = React.useMemo(
|
|
25
|
+
() => JSON.stringify({
|
|
26
|
+
filters: queryParams == null ? void 0 : queryParams.filters,
|
|
27
|
+
order_column: queryParams == null ? void 0 : queryParams.order_column,
|
|
28
|
+
order_direction: queryParams == null ? void 0 : queryParams.order_direction,
|
|
29
|
+
global_filter: queryParams == null ? void 0 : queryParams.global_filter
|
|
30
|
+
}),
|
|
31
|
+
[queryParams == null ? void 0 : queryParams.filters, queryParams == null ? void 0 : queryParams.order_column, queryParams == null ? void 0 : queryParams.order_direction, queryParams == null ? void 0 : queryParams.global_filter]
|
|
32
|
+
);
|
|
33
|
+
React.useEffect(() => {
|
|
34
|
+
var _a2;
|
|
35
|
+
try {
|
|
36
|
+
(_a2 = rowVirtualizerInstanceRef.current) == null ? void 0 : _a2.scrollToIndex(0);
|
|
37
|
+
} catch {
|
|
38
|
+
}
|
|
39
|
+
}, [querySignature]);
|
|
40
|
+
const fetched = ((_a = data == null ? void 0 : data.result) == null ? void 0 : _a.length) ?? 0;
|
|
41
|
+
const total = (data == null ? void 0 : data.count) ?? 0;
|
|
42
|
+
return React.useMemo(() => {
|
|
43
|
+
if (!streaming) {
|
|
44
|
+
return {};
|
|
45
|
+
}
|
|
46
|
+
return {
|
|
47
|
+
enablePagination: false,
|
|
48
|
+
enableRowVirtualization: true,
|
|
49
|
+
rowVirtualizerInstanceRef,
|
|
50
|
+
mantineTableContainerProps: {
|
|
51
|
+
onScroll: (event) => fetchMoreOnBottomReached(event.currentTarget)
|
|
52
|
+
},
|
|
53
|
+
renderBottomToolbarCustomActions: () => /* @__PURE__ */ jsxRuntime.jsx(core.Text, { size: "sm", c: "dimmed", children: t("Fetched {{fetched}} of {{total}} rows", { fetched, total }) })
|
|
54
|
+
};
|
|
55
|
+
}, [streaming, fetchMoreOnBottomReached, fetched, total, t]);
|
|
56
|
+
}
|
|
57
|
+
exports.useInfiniteScroll = useInfiniteScroll;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
4
|
+
const core = require("@mantine/core");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const contexts = require("fastapi-rtk/contexts");
|
|
7
|
+
const PropPatchContext = React.createContext(void 0);
|
|
8
|
+
const PropPatchProvider = PropPatchContext.Provider;
|
|
9
|
+
function usePatchProps() {
|
|
10
|
+
return React.useContext(PropPatchContext);
|
|
11
|
+
}
|
|
12
|
+
function AutoSizeColumn(props) {
|
|
13
|
+
const { columnId, children } = props;
|
|
14
|
+
const { streaming } = contexts.useApi();
|
|
15
|
+
const patch = usePatchProps();
|
|
16
|
+
const ref = React.useRef(null);
|
|
17
|
+
React.useLayoutEffect(() => {
|
|
18
|
+
if (!streaming || !patch || !ref.current) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
const size = Math.ceil(ref.current.getBoundingClientRect().width) + Number(core.px("1rem"));
|
|
22
|
+
patch({ table: { displayColumnDefOptions: { [columnId]: { size } } } });
|
|
23
|
+
});
|
|
24
|
+
if (!streaming || !patch) {
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
|
|
26
|
+
}
|
|
27
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, style: { width: "max-content" }, children });
|
|
28
|
+
}
|
|
29
|
+
exports.AutoSizeColumn = AutoSizeColumn;
|
|
30
|
+
exports.PropPatchProvider = PropPatchProvider;
|
|
31
|
+
exports.usePatchProps = usePatchProps;
|
|
@@ -28,4 +28,28 @@ function getBasicToolbars(table, rules) {
|
|
|
28
28
|
});
|
|
29
29
|
return toolbars;
|
|
30
30
|
}
|
|
31
|
+
function getBasicToolbarRules(options, enableAdvancedFilters, permissions) {
|
|
32
|
+
const {
|
|
33
|
+
columnFilterDisplayMode,
|
|
34
|
+
enableColumnFilters,
|
|
35
|
+
enableColumnOrdering,
|
|
36
|
+
enableColumnPinning,
|
|
37
|
+
enableDensityToggle,
|
|
38
|
+
enableFilters,
|
|
39
|
+
enableFullScreenToggle,
|
|
40
|
+
enableGlobalFilter,
|
|
41
|
+
enableHiding,
|
|
42
|
+
initialState
|
|
43
|
+
} = options;
|
|
44
|
+
return {
|
|
45
|
+
toggleGlobalFilter: enableFilters !== false && enableGlobalFilter !== false && !(initialState == null ? void 0 : initialState.showGlobalFilter),
|
|
46
|
+
filter: !enableAdvancedFilters && enableFilters !== false && enableColumnFilters !== false && columnFilterDisplayMode !== "popover",
|
|
47
|
+
add: permissions == null ? void 0 : permissions.includes("can_post"),
|
|
48
|
+
download: permissions == null ? void 0 : permissions.includes("can_download"),
|
|
49
|
+
showHideColumns: enableHiding !== false || !!enableColumnOrdering || !!enableColumnPinning,
|
|
50
|
+
toggleDensePadding: enableDensityToggle !== false,
|
|
51
|
+
toggleFullScreen: enableFullScreenToggle !== false
|
|
52
|
+
};
|
|
53
|
+
}
|
|
54
|
+
exports.getBasicToolbarRules = getBasicToolbarRules;
|
|
31
55
|
exports.getBasicToolbars = getBasicToolbars;
|
|
@@ -71,12 +71,7 @@ function useToolbar(toolbar = {}, quickFilters, quickFiltersComponent, hideToolb
|
|
|
71
71
|
auth,
|
|
72
72
|
mrtProps: { table }
|
|
73
73
|
};
|
|
74
|
-
const rules =
|
|
75
|
-
filter: !enableAdvancedFilters,
|
|
76
|
-
add: info == null ? void 0 : info.permissions.includes("can_post"),
|
|
77
|
-
download: info == null ? void 0 : info.permissions.includes("can_download"),
|
|
78
|
-
upload: info == null ? void 0 : info.permissions.includes("can_upload")
|
|
79
|
-
};
|
|
74
|
+
const rules = basicToolbars.getBasicToolbarRules(table.options, enableAdvancedFilters, info == null ? void 0 : info.permissions);
|
|
80
75
|
const basicToolbarsObj = basicToolbars.getBasicToolbars(table, rules);
|
|
81
76
|
return renderCustomizedToolbars(customizer, basicToolbarsObj, functionProps, custom);
|
|
82
77
|
},
|
|
@@ -10,16 +10,29 @@ const useStreamingData = (params) => {
|
|
|
10
10
|
var _a2;
|
|
11
11
|
return ((_a2 = streamingQuery.data) == null ? void 0 : _a2.pages) || [];
|
|
12
12
|
}, [(_a = streamingQuery.data) == null ? void 0 : _a.pages]);
|
|
13
|
+
const accumulatedData = React.useMemo(() => {
|
|
14
|
+
if (!streamingMode) {
|
|
15
|
+
return null;
|
|
16
|
+
}
|
|
17
|
+
const lastPage = streamingPages.at(-1);
|
|
18
|
+
if (!lastPage) {
|
|
19
|
+
return null;
|
|
20
|
+
}
|
|
21
|
+
return {
|
|
22
|
+
...lastPage,
|
|
23
|
+
result: streamingPages.flatMap((page) => (page == null ? void 0 : page.result) ?? []),
|
|
24
|
+
ids: streamingPages.flatMap((page) => (page == null ? void 0 : page.ids) ?? [])
|
|
25
|
+
};
|
|
26
|
+
}, [streamingMode, streamingPages]);
|
|
13
27
|
const activeDataQuery = React.useMemo(() => {
|
|
14
28
|
if (!streamingMode) {
|
|
15
29
|
return dataQuery;
|
|
16
30
|
}
|
|
17
|
-
const currentPageData = streamingPages.at(-1) || null;
|
|
18
31
|
return {
|
|
19
32
|
...streamingQuery,
|
|
20
|
-
data:
|
|
33
|
+
data: accumulatedData
|
|
21
34
|
};
|
|
22
|
-
}, [dataQuery, streamingMode,
|
|
35
|
+
}, [dataQuery, streamingMode, accumulatedData, streamingQuery]);
|
|
23
36
|
const fetchStreamingPage = React.useCallback(() => {
|
|
24
37
|
if (!streamingMode || streamingQuery.isFetchingNextPage) {
|
|
25
38
|
return null;
|
|
@@ -57,12 +70,7 @@ const useStreamingData = (params) => {
|
|
|
57
70
|
);
|
|
58
71
|
const streaming = React.useMemo(() => {
|
|
59
72
|
if (!streamingMode) {
|
|
60
|
-
return
|
|
61
|
-
data: {},
|
|
62
|
-
isEnd: false,
|
|
63
|
-
fetch: async () => null,
|
|
64
|
-
reset: async () => null
|
|
65
|
-
};
|
|
73
|
+
return void 0;
|
|
66
74
|
}
|
|
67
75
|
const data = streamingPages.reduce((acc, page) => {
|
|
68
76
|
var _a2;
|
|
@@ -20,15 +20,15 @@ const InfiniteScroll = (props) => {
|
|
|
20
20
|
} = props;
|
|
21
21
|
const { streaming, loading } = contexts.useApi();
|
|
22
22
|
const { ref, inViewport } = hooks.useInViewport();
|
|
23
|
-
const items = React.useMemo(() => Object.values(streaming.data).flat(), [streaming.data]);
|
|
23
|
+
const items = React.useMemo(() => Object.values((streaming == null ? void 0 : streaming.data) ?? {}).flat(), [streaming == null ? void 0 : streaming.data]);
|
|
24
24
|
React.useEffect(() => {
|
|
25
25
|
if (inViewport && fetch) {
|
|
26
|
-
streaming.fetch();
|
|
26
|
+
streaming == null ? void 0 : streaming.fetch();
|
|
27
27
|
}
|
|
28
28
|
}, [fetch, inViewport]);
|
|
29
29
|
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
30
30
|
utils.parseFromValuesOrFunc(children, { items, loading }),
|
|
31
|
-
streaming.isEnd && End,
|
|
31
|
+
(streaming == null ? void 0 : streaming.isEnd) && End,
|
|
32
32
|
loading ? Loading : /* @__PURE__ */ jsxRuntime.jsx(FetchWrapper, { ref, id: "IS-load-trigger", mih: "1%", ...fetchWrapperProps })
|
|
33
33
|
] });
|
|
34
34
|
};
|
package/dist/core/cjs/index.cjs
CHANGED
|
@@ -26,6 +26,7 @@ const normalProps = require("./Modals/normalProps.cjs");
|
|
|
26
26
|
const overlayProps = require("./Modals/overlayProps.cjs");
|
|
27
27
|
const DataGrid = require("./Tables/DataGrid/DataGrid.cjs");
|
|
28
28
|
const NextGenDataGrid = require("./Tables/NextGenDataGrid/NextGenDataGrid.cjs");
|
|
29
|
+
const usePatchProps = require("./Tables/NextGenDataGrid/hooks/usePatchProps.cjs");
|
|
29
30
|
const ApiProvider = require("./Wrappers/ApiProvider/ApiProvider.cjs");
|
|
30
31
|
const InfiniteScroll = require("./Wrappers/InfiniteScroll/InfiniteScroll.cjs");
|
|
31
32
|
const LazyLoadWrapper = require("./Wrappers/LazyLoadWrapper/LazyLoadWrapper.cjs");
|
|
@@ -87,6 +88,8 @@ exports.NextGenDataGrid = NextGenDataGrid.NextGenDataGrid;
|
|
|
87
88
|
exports.NextGenDatagrid = NextGenDataGrid.NextGenDataGrid;
|
|
88
89
|
exports.NextGendatagrid = NextGenDataGrid.NextGenDataGrid;
|
|
89
90
|
exports.Nextgendatagrid = NextGenDataGrid.NextGenDataGrid;
|
|
91
|
+
exports.AutoSizeColumn = usePatchProps.AutoSizeColumn;
|
|
92
|
+
exports.usePatchProps = usePatchProps.usePatchProps;
|
|
90
93
|
exports.ApiProvider = ApiProvider.ApiProvider;
|
|
91
94
|
exports.withApiProvider = ApiProvider.withApiProvider;
|
|
92
95
|
exports.InfiniteScroll = InfiniteScroll.InfiniteScroll;
|
|
@@ -18,6 +18,8 @@ const de = {
|
|
|
18
18
|
"Are you sure you want to delete this item?": "Sind Sie Sicher, dass Sie das Item löschen wollen?",
|
|
19
19
|
"No filters": "Keine Filter",
|
|
20
20
|
"Advanced Filters": "Erweiterte Filter",
|
|
21
|
+
// Table
|
|
22
|
+
"Fetched {{fetched}} of {{total}} rows": "{{fetched}} von {{total}} Zeilen geladen",
|
|
21
23
|
"End of data": "Ende der Daten",
|
|
22
24
|
// Error titles
|
|
23
25
|
Error: "Fehler",
|
|
@@ -5,7 +5,7 @@ import { DEBOUNCE_DELAY } from "fastapi-rtk/constants";
|
|
|
5
5
|
import { deepMerge, mergeProps, getItemId, parseFromValuesOrFunc } from "fastapi-rtk/utils";
|
|
6
6
|
import { useProps, Box } from "@mantine/core";
|
|
7
7
|
import { useMRT_TableOptions, useMantineReactTable } from "../../../../.external/esm/mantine-react-table@2.0.0-beta.9_patch_hash_b9fcaf5fc0698f1949127d6bfb1f154a5bd28d0d1fe_7b4bd73d03bc0c4b3e9706b344be0f5a/mantine-react-table/dist/index.esm.mjs";
|
|
8
|
-
import { forwardRef, useMemo, useEffect, useRef } from "react";
|
|
8
|
+
import { forwardRef, useState, useCallback, useMemo, useEffect, useRef } from "react";
|
|
9
9
|
import { AddDialog } from "../../Dialogs/AddDialog.mjs";
|
|
10
10
|
import { DeleteDialog } from "../../Dialogs/DeleteDialog.mjs";
|
|
11
11
|
import { EditDialog } from "../../Dialogs/EditDialog.mjs";
|
|
@@ -22,6 +22,8 @@ import { useEvent } from "./hooks/useEvent.mjs";
|
|
|
22
22
|
import { useFilters } from "./hooks/useFilters.mjs";
|
|
23
23
|
import { useGlobalFilter } from "./hooks/useGlobalFilter.mjs";
|
|
24
24
|
import { useI18n } from "./hooks/useI18n.mjs";
|
|
25
|
+
import { useInfiniteScroll } from "./hooks/useInfiniteScroll.mjs";
|
|
26
|
+
import { PropPatchProvider } from "./hooks/usePatchProps.mjs";
|
|
25
27
|
import { useOptimizations } from "./hooks/useOptimizations.mjs";
|
|
26
28
|
import { usePagination } from "./hooks/usePagination.mjs";
|
|
27
29
|
import { useSelection } from "./hooks/useSelection/useSelection.mjs";
|
|
@@ -36,6 +38,13 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
36
38
|
var _a, _b, _c, _d;
|
|
37
39
|
const { info, specialKey } = useApi();
|
|
38
40
|
const propsFromMantineTheme = useProps("NextGenDataGrid", {}, {});
|
|
41
|
+
const [patchedProps, setPatchedProps] = useState({});
|
|
42
|
+
const patchProps = useCallback((partial) => {
|
|
43
|
+
setPatchedProps((prev) => {
|
|
44
|
+
const next = deepMerge(prev, partial);
|
|
45
|
+
return JSON.stringify(next) === JSON.stringify(prev) ? prev : next;
|
|
46
|
+
});
|
|
47
|
+
}, []);
|
|
39
48
|
const {
|
|
40
49
|
children,
|
|
41
50
|
// DataGrid props
|
|
@@ -74,7 +83,11 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
74
83
|
hideDownload,
|
|
75
84
|
hideFilter,
|
|
76
85
|
...rest
|
|
77
|
-
} = useMemo(
|
|
86
|
+
} = useMemo(
|
|
87
|
+
// deep-merge precedence: default -> patched -> theme -> user (user props always win)
|
|
88
|
+
() => deepMerge(defaultProps, patchedProps, propsFromMantineTheme, props),
|
|
89
|
+
[props, propsFromMantineTheme, patchedProps]
|
|
90
|
+
);
|
|
78
91
|
if (bodySeparator && body) {
|
|
79
92
|
Object.keys(body).forEach((col) => {
|
|
80
93
|
const entry = body[col] = body[col] || {};
|
|
@@ -150,6 +163,7 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
150
163
|
const paginationProps = usePagination(hidePagination);
|
|
151
164
|
const columnsProps = useColumns(columnProps, header, body, textFilterSeparator, enableAdvancedFilters, memo);
|
|
152
165
|
const sizeProps = useSize(withBorder);
|
|
166
|
+
const infiniteScrollProps = useInfiniteScroll();
|
|
153
167
|
const actionsConfig = useMemo(() => mergeProps(body ?? {}, specialKey.actions), [body, specialKey]);
|
|
154
168
|
const actionsProps = useActions(
|
|
155
169
|
hideActions,
|
|
@@ -174,6 +188,7 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
174
188
|
sortingProps,
|
|
175
189
|
paginationProps,
|
|
176
190
|
sizeProps,
|
|
191
|
+
infiniteScrollProps,
|
|
177
192
|
actionsProps,
|
|
178
193
|
globalFilterProps,
|
|
179
194
|
toolbarProps,
|
|
@@ -193,6 +208,7 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
193
208
|
sortingProps,
|
|
194
209
|
paginationProps,
|
|
195
210
|
sizeProps,
|
|
211
|
+
infiniteScrollProps,
|
|
196
212
|
actionsProps,
|
|
197
213
|
globalFilterProps,
|
|
198
214
|
toolbarProps,
|
|
@@ -254,7 +270,7 @@ const NextGenDataGrid = forwardRef((props, ref) => {
|
|
|
254
270
|
useQueryOnlyVisibleColumnsProps
|
|
255
271
|
}
|
|
256
272
|
),
|
|
257
|
-
/* @__PURE__ */ jsx(MantineReactTable, { table: mrtTable, ...rest }),
|
|
273
|
+
/* @__PURE__ */ jsx(PropPatchProvider, { value: patchProps, children: /* @__PURE__ */ jsx(MantineReactTable, { table: mrtTable, ...rest }) }),
|
|
258
274
|
children == null ? void 0 : children({ table: mrtTable }),
|
|
259
275
|
!hideError ? /* @__PURE__ */ jsx(ErrorDialog, {}) : null
|
|
260
276
|
] });
|
|
@@ -5,11 +5,13 @@ import { Actions } from "../../../ActionIcons/Actions.mjs";
|
|
|
5
5
|
import { useApi } from "fastapi-rtk/contexts";
|
|
6
6
|
import { useAuth } from "../../../hooks/auth/useAuth.mjs";
|
|
7
7
|
import { FallbackWrapper } from "../FallbackWrapper.mjs";
|
|
8
|
+
import { AutoSizeColumn } from "./usePatchProps.mjs";
|
|
9
|
+
const ROW_ACTIONS_COLUMN_ID = "mrt-row-actions";
|
|
8
10
|
function useActions(hideActions, component, viewProps, editProps, deleteProps) {
|
|
9
11
|
const api = useApi();
|
|
10
12
|
const auth = useAuth();
|
|
11
13
|
const renderRowActions = useCallback(
|
|
12
|
-
({ row, ...rest }) => /* @__PURE__ */ jsx(
|
|
14
|
+
({ row, ...rest }) => /* @__PURE__ */ jsx(AutoSizeColumn, { columnId: ROW_ACTIONS_COLUMN_ID, children: /* @__PURE__ */ jsx(
|
|
13
15
|
FallbackWrapper,
|
|
14
16
|
{
|
|
15
17
|
fallback: /* @__PURE__ */ jsx(
|
|
@@ -29,7 +31,7 @@ function useActions(hideActions, component, viewProps, editProps, deleteProps) {
|
|
|
29
31
|
},
|
|
30
32
|
children: component
|
|
31
33
|
}
|
|
32
|
-
),
|
|
34
|
+
) }),
|
|
33
35
|
[api, auth, component, viewProps, editProps, deleteProps]
|
|
34
36
|
);
|
|
35
37
|
return { enableEditing: !hideActions, editDisplayMode: "modal", renderRowActions };
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Text } from "@mantine/core";
|
|
3
|
+
import { useRef, useCallback, useMemo, useEffect } from "react";
|
|
4
|
+
import { useApi, useTranslation } from "fastapi-rtk/contexts";
|
|
5
|
+
function useInfiniteScroll() {
|
|
6
|
+
var _a;
|
|
7
|
+
const { loading, streaming, data, queryParams } = useApi();
|
|
8
|
+
const { t } = useTranslation();
|
|
9
|
+
const rowVirtualizerInstanceRef = useRef(null);
|
|
10
|
+
const fetchMoreOnBottomReached = useCallback(
|
|
11
|
+
(containerRefElement) => {
|
|
12
|
+
if (!containerRefElement || loading || (streaming == null ? void 0 : streaming.isEnd)) {
|
|
13
|
+
return;
|
|
14
|
+
}
|
|
15
|
+
const { scrollHeight, scrollTop, clientHeight } = containerRefElement;
|
|
16
|
+
if (scrollHeight - scrollTop - clientHeight < clientHeight) {
|
|
17
|
+
streaming == null ? void 0 : streaming.fetch();
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
[loading, streaming]
|
|
21
|
+
);
|
|
22
|
+
const querySignature = useMemo(
|
|
23
|
+
() => JSON.stringify({
|
|
24
|
+
filters: queryParams == null ? void 0 : queryParams.filters,
|
|
25
|
+
order_column: queryParams == null ? void 0 : queryParams.order_column,
|
|
26
|
+
order_direction: queryParams == null ? void 0 : queryParams.order_direction,
|
|
27
|
+
global_filter: queryParams == null ? void 0 : queryParams.global_filter
|
|
28
|
+
}),
|
|
29
|
+
[queryParams == null ? void 0 : queryParams.filters, queryParams == null ? void 0 : queryParams.order_column, queryParams == null ? void 0 : queryParams.order_direction, queryParams == null ? void 0 : queryParams.global_filter]
|
|
30
|
+
);
|
|
31
|
+
useEffect(() => {
|
|
32
|
+
var _a2;
|
|
33
|
+
try {
|
|
34
|
+
(_a2 = rowVirtualizerInstanceRef.current) == null ? void 0 : _a2.scrollToIndex(0);
|
|
35
|
+
} catch {
|
|
36
|
+
}
|
|
37
|
+
}, [querySignature]);
|
|
38
|
+
const fetched = ((_a = data == null ? void 0 : data.result) == null ? void 0 : _a.length) ?? 0;
|
|
39
|
+
const total = (data == null ? void 0 : data.count) ?? 0;
|
|
40
|
+
return useMemo(() => {
|
|
41
|
+
if (!streaming) {
|
|
42
|
+
return {};
|
|
43
|
+
}
|
|
44
|
+
return {
|
|
45
|
+
enablePagination: false,
|
|
46
|
+
enableRowVirtualization: true,
|
|
47
|
+
rowVirtualizerInstanceRef,
|
|
48
|
+
mantineTableContainerProps: {
|
|
49
|
+
onScroll: (event) => fetchMoreOnBottomReached(event.currentTarget)
|
|
50
|
+
},
|
|
51
|
+
renderBottomToolbarCustomActions: () => /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: t("Fetched {{fetched}} of {{total}} rows", { fetched, total }) })
|
|
52
|
+
};
|
|
53
|
+
}, [streaming, fetchMoreOnBottomReached, fetched, total, t]);
|
|
54
|
+
}
|
|
55
|
+
export {
|
|
56
|
+
useInfiniteScroll
|
|
57
|
+
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { jsx, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { px } from "@mantine/core";
|
|
3
|
+
import { createContext, useRef, useLayoutEffect, useContext } from "react";
|
|
4
|
+
import { useApi } from "fastapi-rtk/contexts";
|
|
5
|
+
const PropPatchContext = createContext(void 0);
|
|
6
|
+
const PropPatchProvider = PropPatchContext.Provider;
|
|
7
|
+
function usePatchProps() {
|
|
8
|
+
return useContext(PropPatchContext);
|
|
9
|
+
}
|
|
10
|
+
function AutoSizeColumn(props) {
|
|
11
|
+
const { columnId, children } = props;
|
|
12
|
+
const { streaming } = useApi();
|
|
13
|
+
const patch = usePatchProps();
|
|
14
|
+
const ref = useRef(null);
|
|
15
|
+
useLayoutEffect(() => {
|
|
16
|
+
if (!streaming || !patch || !ref.current) {
|
|
17
|
+
return;
|
|
18
|
+
}
|
|
19
|
+
const size = Math.ceil(ref.current.getBoundingClientRect().width) + Number(px("1rem"));
|
|
20
|
+
patch({ table: { displayColumnDefOptions: { [columnId]: { size } } } });
|
|
21
|
+
});
|
|
22
|
+
if (!streaming || !patch) {
|
|
23
|
+
return /* @__PURE__ */ jsx(Fragment, { children });
|
|
24
|
+
}
|
|
25
|
+
return /* @__PURE__ */ jsx("div", { ref, style: { width: "max-content" }, children });
|
|
26
|
+
}
|
|
27
|
+
export {
|
|
28
|
+
AutoSizeColumn,
|
|
29
|
+
PropPatchProvider,
|
|
30
|
+
usePatchProps
|
|
31
|
+
};
|
|
@@ -26,6 +26,30 @@ function getBasicToolbars(table, rules) {
|
|
|
26
26
|
});
|
|
27
27
|
return toolbars;
|
|
28
28
|
}
|
|
29
|
+
function getBasicToolbarRules(options, enableAdvancedFilters, permissions) {
|
|
30
|
+
const {
|
|
31
|
+
columnFilterDisplayMode,
|
|
32
|
+
enableColumnFilters,
|
|
33
|
+
enableColumnOrdering,
|
|
34
|
+
enableColumnPinning,
|
|
35
|
+
enableDensityToggle,
|
|
36
|
+
enableFilters,
|
|
37
|
+
enableFullScreenToggle,
|
|
38
|
+
enableGlobalFilter,
|
|
39
|
+
enableHiding,
|
|
40
|
+
initialState
|
|
41
|
+
} = options;
|
|
42
|
+
return {
|
|
43
|
+
toggleGlobalFilter: enableFilters !== false && enableGlobalFilter !== false && !(initialState == null ? void 0 : initialState.showGlobalFilter),
|
|
44
|
+
filter: !enableAdvancedFilters && enableFilters !== false && enableColumnFilters !== false && columnFilterDisplayMode !== "popover",
|
|
45
|
+
add: permissions == null ? void 0 : permissions.includes("can_post"),
|
|
46
|
+
download: permissions == null ? void 0 : permissions.includes("can_download"),
|
|
47
|
+
showHideColumns: enableHiding !== false || !!enableColumnOrdering || !!enableColumnPinning,
|
|
48
|
+
toggleDensePadding: enableDensityToggle !== false,
|
|
49
|
+
toggleFullScreen: enableFullScreenToggle !== false
|
|
50
|
+
};
|
|
51
|
+
}
|
|
29
52
|
export {
|
|
53
|
+
getBasicToolbarRules,
|
|
30
54
|
getBasicToolbars
|
|
31
55
|
};
|
|
@@ -5,7 +5,7 @@ import { useMemo, useCallback, isValidElement } from "react";
|
|
|
5
5
|
import { useApi } from "fastapi-rtk/contexts";
|
|
6
6
|
import { useAuth } from "../../../../hooks/auth/useAuth.mjs";
|
|
7
7
|
import { FallbackWrapper } from "../../FallbackWrapper.mjs";
|
|
8
|
-
import { getBasicToolbars } from "./basicToolbars.mjs";
|
|
8
|
+
import { getBasicToolbarRules, getBasicToolbars } from "./basicToolbars.mjs";
|
|
9
9
|
const isCustomizerObject = (value) => typeof value === "object" && value !== null && !Array.isArray(value) && !isValidElement(value);
|
|
10
10
|
function renderCustomizedToolbars(customizer, basicToolbarsObj, functionProps, custom) {
|
|
11
11
|
Object.entries(customizer || {}).forEach(([key, value]) => {
|
|
@@ -69,12 +69,7 @@ function useToolbar(toolbar = {}, quickFilters, quickFiltersComponent, hideToolb
|
|
|
69
69
|
auth,
|
|
70
70
|
mrtProps: { table }
|
|
71
71
|
};
|
|
72
|
-
const rules =
|
|
73
|
-
filter: !enableAdvancedFilters,
|
|
74
|
-
add: info == null ? void 0 : info.permissions.includes("can_post"),
|
|
75
|
-
download: info == null ? void 0 : info.permissions.includes("can_download"),
|
|
76
|
-
upload: info == null ? void 0 : info.permissions.includes("can_upload")
|
|
77
|
-
};
|
|
72
|
+
const rules = getBasicToolbarRules(table.options, enableAdvancedFilters, info == null ? void 0 : info.permissions);
|
|
78
73
|
const basicToolbarsObj = getBasicToolbars(table, rules);
|
|
79
74
|
return renderCustomizedToolbars(customizer, basicToolbarsObj, functionProps, custom);
|
|
80
75
|
},
|
|
@@ -8,16 +8,29 @@ const useStreamingData = (params) => {
|
|
|
8
8
|
var _a2;
|
|
9
9
|
return ((_a2 = streamingQuery.data) == null ? void 0 : _a2.pages) || [];
|
|
10
10
|
}, [(_a = streamingQuery.data) == null ? void 0 : _a.pages]);
|
|
11
|
+
const accumulatedData = useMemo(() => {
|
|
12
|
+
if (!streamingMode) {
|
|
13
|
+
return null;
|
|
14
|
+
}
|
|
15
|
+
const lastPage = streamingPages.at(-1);
|
|
16
|
+
if (!lastPage) {
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
19
|
+
return {
|
|
20
|
+
...lastPage,
|
|
21
|
+
result: streamingPages.flatMap((page) => (page == null ? void 0 : page.result) ?? []),
|
|
22
|
+
ids: streamingPages.flatMap((page) => (page == null ? void 0 : page.ids) ?? [])
|
|
23
|
+
};
|
|
24
|
+
}, [streamingMode, streamingPages]);
|
|
11
25
|
const activeDataQuery = useMemo(() => {
|
|
12
26
|
if (!streamingMode) {
|
|
13
27
|
return dataQuery;
|
|
14
28
|
}
|
|
15
|
-
const currentPageData = streamingPages.at(-1) || null;
|
|
16
29
|
return {
|
|
17
30
|
...streamingQuery,
|
|
18
|
-
data:
|
|
31
|
+
data: accumulatedData
|
|
19
32
|
};
|
|
20
|
-
}, [dataQuery, streamingMode,
|
|
33
|
+
}, [dataQuery, streamingMode, accumulatedData, streamingQuery]);
|
|
21
34
|
const fetchStreamingPage = useCallback(() => {
|
|
22
35
|
if (!streamingMode || streamingQuery.isFetchingNextPage) {
|
|
23
36
|
return null;
|
|
@@ -55,12 +68,7 @@ const useStreamingData = (params) => {
|
|
|
55
68
|
);
|
|
56
69
|
const streaming = useMemo(() => {
|
|
57
70
|
if (!streamingMode) {
|
|
58
|
-
return
|
|
59
|
-
data: {},
|
|
60
|
-
isEnd: false,
|
|
61
|
-
fetch: async () => null,
|
|
62
|
-
reset: async () => null
|
|
63
|
-
};
|
|
71
|
+
return void 0;
|
|
64
72
|
}
|
|
65
73
|
const data = streamingPages.reduce((acc, page) => {
|
|
66
74
|
var _a2;
|
|
@@ -18,15 +18,15 @@ const InfiniteScroll = (props) => {
|
|
|
18
18
|
} = props;
|
|
19
19
|
const { streaming, loading } = useApi();
|
|
20
20
|
const { ref, inViewport } = useInViewport();
|
|
21
|
-
const items = useMemo(() => Object.values(streaming.data).flat(), [streaming.data]);
|
|
21
|
+
const items = useMemo(() => Object.values((streaming == null ? void 0 : streaming.data) ?? {}).flat(), [streaming == null ? void 0 : streaming.data]);
|
|
22
22
|
useEffect(() => {
|
|
23
23
|
if (inViewport && fetch) {
|
|
24
|
-
streaming.fetch();
|
|
24
|
+
streaming == null ? void 0 : streaming.fetch();
|
|
25
25
|
}
|
|
26
26
|
}, [fetch, inViewport]);
|
|
27
27
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
28
28
|
parseFromValuesOrFunc(children, { items, loading }),
|
|
29
|
-
streaming.isEnd && End,
|
|
29
|
+
(streaming == null ? void 0 : streaming.isEnd) && End,
|
|
30
30
|
loading ? Loading : /* @__PURE__ */ jsx(FetchWrapper, { ref, id: "IS-load-trigger", mih: "1%", ...fetchWrapperProps })
|
|
31
31
|
] });
|
|
32
32
|
};
|
package/dist/core/esm/index.mjs
CHANGED
|
@@ -24,6 +24,7 @@ import { normalProps } from "./Modals/normalProps.mjs";
|
|
|
24
24
|
import { overlayProps } from "./Modals/overlayProps.mjs";
|
|
25
25
|
import { DataGrid, DataGrid as DataGrid2 } from "./Tables/DataGrid/DataGrid.mjs";
|
|
26
26
|
import { NextGenDataGrid, NextGenDataGrid as NextGenDataGrid2, NextGenDataGrid as NextGenDataGrid3, NextGenDataGrid as NextGenDataGrid4 } from "./Tables/NextGenDataGrid/NextGenDataGrid.mjs";
|
|
27
|
+
import { AutoSizeColumn, usePatchProps } from "./Tables/NextGenDataGrid/hooks/usePatchProps.mjs";
|
|
27
28
|
import { ApiProvider, withApiProvider } from "./Wrappers/ApiProvider/ApiProvider.mjs";
|
|
28
29
|
import { InfiniteScroll } from "./Wrappers/InfiniteScroll/InfiniteScroll.mjs";
|
|
29
30
|
import { LazyLoadWrapper } from "./Wrappers/LazyLoadWrapper/LazyLoadWrapper.mjs";
|
|
@@ -41,6 +42,7 @@ export {
|
|
|
41
42
|
Add,
|
|
42
43
|
AddDialog,
|
|
43
44
|
ApiProvider,
|
|
45
|
+
AutoSizeColumn,
|
|
44
46
|
CommonModal,
|
|
45
47
|
DataGrid,
|
|
46
48
|
DataGrid2 as Datagrid,
|
|
@@ -78,6 +80,7 @@ export {
|
|
|
78
80
|
useForms,
|
|
79
81
|
useInfo,
|
|
80
82
|
useLang,
|
|
83
|
+
usePatchProps,
|
|
81
84
|
useTranslation,
|
|
82
85
|
withApiProvider,
|
|
83
86
|
withProvider
|
|
@@ -17,6 +17,8 @@ const de = {
|
|
|
17
17
|
"Are you sure you want to delete this item?": "Sind Sie Sicher, dass Sie das Item löschen wollen?",
|
|
18
18
|
"No filters": "Keine Filter",
|
|
19
19
|
"Advanced Filters": "Erweiterte Filter",
|
|
20
|
+
// Table
|
|
21
|
+
"Fetched {{fetched}} of {{total}} rows": "{{fetched}} von {{total}} Zeilen geladen",
|
|
20
22
|
"End of data": "Ende der Daten",
|
|
21
23
|
// Error titles
|
|
22
24
|
Error: "Fehler",
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MRT_RowData, MRT_TableOptions } from '../../../../../.external/lib/mantine-react-table';
|
|
2
|
+
/**
|
|
3
|
+
* Turns the grid into an infinite-scroll list when the `ApiProvider` is in streaming mode (i.e. when
|
|
4
|
+
* `useApi().streaming` is present): disables pagination, enables row virtualization, and fetches the
|
|
5
|
+
* next page as the container nears the bottom. Returns an empty object (no overrides) when streaming is off.
|
|
6
|
+
*/
|
|
7
|
+
export declare function useInfiniteScroll(): Partial<MRT_TableOptions<MRT_RowData>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { NextGenDataGridProps } from '../types';
|
|
3
|
+
export declare const PropPatchProvider: import('react').Provider<((props: Partial<NextGenDataGridProps>) => void) | undefined>;
|
|
4
|
+
/** Patch partial `NextGenDataGrid` props from inside a cell. Returns `undefined` outside a grid. */
|
|
5
|
+
export declare function usePatchProps(): ((props: Partial<NextGenDataGridProps>) => void) | undefined;
|
|
6
|
+
/**
|
|
7
|
+
* Wraps cell content, measures its natural width (via a `max-content` wrapper, immune to the clipping
|
|
8
|
+
* grid cell), and patches it as `columnId`'s default column `size` (via `displayColumnDefOptions`), which
|
|
9
|
+
* a live resize can still override. Outside streaming mode it renders the children untouched so
|
|
10
|
+
* non-virtualized grids keep MRT's content-fitting semantic layout.
|
|
11
|
+
*/
|
|
12
|
+
export declare function AutoSizeColumn(props: {
|
|
13
|
+
columnId: string;
|
|
14
|
+
children: ReactNode;
|
|
15
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,9 +1,23 @@
|
|
|
1
1
|
import { MRT_RowData, MRT_TableInstance } from '../../../../../../.external/lib/mantine-react-table';
|
|
2
2
|
import { BasicToolbarKey, BasicToolbars } from './types';
|
|
3
|
+
type ToolbarRules = Partial<Record<BasicToolbarKey, boolean | undefined>>;
|
|
3
4
|
/**
|
|
4
5
|
* Builds the basic toolbar components for a data grid.
|
|
5
6
|
*
|
|
6
7
|
* @param table - The table instance the toolbar components attach to.
|
|
7
8
|
* @param rules - Rules controlling which toolbar components render.
|
|
8
9
|
*/
|
|
9
|
-
export declare function getBasicToolbars(table: MRT_TableInstance<MRT_RowData>, rules:
|
|
10
|
+
export declare function getBasicToolbars(table: MRT_TableInstance<MRT_RowData>, rules: ToolbarRules): BasicToolbars;
|
|
11
|
+
/**
|
|
12
|
+
* Computes which built-in toolbar buttons should render. Mirrors MRT's `MRT_ToolbarInternalButtons`
|
|
13
|
+
* gating (turning a feature off hides its button) and layers fastapi-rtk's own rules on top
|
|
14
|
+
* (advanced-filters mode replaces the column-filter toggle; add / download / upload are permission-gated).
|
|
15
|
+
* A falsy value drops that button in `getBasicToolbars`.
|
|
16
|
+
*
|
|
17
|
+
* @param options - The resolved table options carrying the MRT enable flags.
|
|
18
|
+
* @param enableAdvancedFilters - Whether the grid uses the advanced-filters UI instead of column filters.
|
|
19
|
+
* @param permissions - The current user's permission list, gating add / download / upload.
|
|
20
|
+
* @returns The per-button visibility map keyed by `BasicToolbarKey`.
|
|
21
|
+
*/
|
|
22
|
+
export declare function getBasicToolbarRules(options: MRT_TableInstance<MRT_RowData>['options'], enableAdvancedFilters: boolean | undefined, permissions: string[] | undefined): ToolbarRules;
|
|
23
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -183,16 +183,11 @@ export declare const useStreamingData: (params: UseStreamingDataParams) => {
|
|
|
183
183
|
refetch?: boolean;
|
|
184
184
|
}) => Promise<import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverRefetchErrorResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverSuccessResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverLoadingErrorResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverPendingResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverPlaceholderResult<InfiniteData<StreamingPage | null, unknown>, Error> | null>;
|
|
185
185
|
streaming: {
|
|
186
|
-
data: {};
|
|
187
|
-
isEnd: boolean;
|
|
188
|
-
fetch: () => Promise<null>;
|
|
189
|
-
reset: () => Promise<null>;
|
|
190
|
-
} | {
|
|
191
186
|
data: Record<number, import('fastapi-rtk/api-types').ResultRow[]>;
|
|
192
187
|
isEnd: boolean;
|
|
193
188
|
fetch: () => Promise<import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverResult<InfiniteData<StreamingPage | null, unknown>, Error>> | null;
|
|
194
189
|
reset: ({ refetch }?: {
|
|
195
190
|
refetch?: boolean;
|
|
196
191
|
}) => Promise<import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverRefetchErrorResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverSuccessResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverLoadingErrorResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverPendingResult<InfiniteData<StreamingPage | null, unknown>, Error> | import('../../../../../../.external/lib/@tanstack/react-query').QueryObserverPlaceholderResult<InfiniteData<StreamingPage | null, unknown>, Error> | null>;
|
|
197
|
-
};
|
|
192
|
+
} | undefined;
|
|
198
193
|
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { LangContextValue } from 'fastapi-rtk/contexts';
|
|
2
|
+
import { UseSetStateCallback } from '@mantine/hooks';
|
|
3
|
+
import { MRTLocalizationMap } from '../Contexts/types';
|
|
4
|
+
type ProvideLangValue = LangContextValue & {
|
|
5
|
+
currentMRTLocalization: MRTLocalizationMap[string] | undefined;
|
|
6
|
+
MRTLocalization: MRTLocalizationMap;
|
|
7
|
+
setMRTLocalization: UseSetStateCallback<MRTLocalizationMap>;
|
|
8
|
+
};
|
|
9
|
+
export declare const useProvideLang: (baseMRTLocalization?: MRTLocalizationMap) => ProvideLangValue;
|
|
10
|
+
export {};
|
package/dist/core/lib/index.d.ts
CHANGED
|
@@ -20,6 +20,7 @@ export { LanguageSelector } from './Selectors/LanguageSelector';
|
|
|
20
20
|
export * from './Modals';
|
|
21
21
|
export { DataGrid, DataGrid as Datagrid, } from './Tables/DataGrid/DataGrid';
|
|
22
22
|
export { NextGenDataGrid, NextGenDataGrid as NextGenDatagrid, NextGenDataGrid as NextGendatagrid, NextGenDataGrid as Nextgendatagrid, } from './Tables/NextGenDataGrid/NextGenDataGrid';
|
|
23
|
+
export { AutoSizeColumn, usePatchProps } from './Tables/NextGenDataGrid/hooks/usePatchProps';
|
|
23
24
|
export { ApiProvider } from './Wrappers/ApiProvider/ApiProvider';
|
|
24
25
|
export { InfiniteScroll } from './Wrappers/InfiniteScroll/InfiniteScroll';
|
|
25
26
|
export { LazyLoadWrapper } from './Wrappers/LazyLoadWrapper/LazyLoadWrapper';
|
|
@@ -15,6 +15,7 @@ declare const de: {
|
|
|
15
15
|
readonly 'Are you sure you want to delete this item?': "Sind Sie Sicher, dass Sie das Item löschen wollen?";
|
|
16
16
|
readonly 'No filters': "Keine Filter";
|
|
17
17
|
readonly 'Advanced Filters': "Erweiterte Filter";
|
|
18
|
+
readonly 'Fetched {{fetched}} of {{total}} rows': "{{fetched}} von {{total}} Zeilen geladen";
|
|
18
19
|
readonly 'End of data': "Ende der Daten";
|
|
19
20
|
readonly Error: "Fehler";
|
|
20
21
|
readonly 'Could not fetch info': "Informationen konnten nicht abgerufen werden";
|
package/package.json
CHANGED