@servicetitan/web-components 23.5.1 → 23.5.2
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/loader.d.ts +3 -1
- package/dist/loader.d.ts.map +1 -1
- package/dist/loader.js +3 -6
- package/dist/loader.js.map +1 -1
- package/dist/utils/web-component.d.ts +1 -3
- package/dist/utils/web-component.d.ts.map +1 -1
- package/dist/utils/web-component.js +14 -2
- package/dist/utils/web-component.js.map +1 -1
- package/package.json +8 -8
- package/src/__tests__/loader.test.tsx +15 -5
- package/src/loader.tsx +17 -9
- package/src/utils/web-component.tsx +2 -4
package/dist/loader.d.ts
CHANGED
|
@@ -16,6 +16,8 @@ export interface LoaderProps<T> {
|
|
|
16
16
|
retries?: number;
|
|
17
17
|
onRequestError?(error: GetJsonError): boolean;
|
|
18
18
|
}
|
|
19
|
-
export declare type LoaderDataProps = Pick<LoaderProps<{}>, 'data' | 'className'
|
|
19
|
+
export declare type LoaderDataProps = Pick<LoaderProps<{}>, 'data' | 'className'> & {
|
|
20
|
+
LoadingFallback: () => JSX.Element;
|
|
21
|
+
};
|
|
20
22
|
export declare const Loader: import("react").ForwardRefExoticComponent<LoaderProps<{}> & import("react").RefAttributes<EventBus>>;
|
|
21
23
|
//# sourceMappingURL=loader.d.ts.map
|
package/dist/loader.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loader.d.ts","sourceRoot":"","sources":["../src/loader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,SAAS,EAOZ,MAAM,OAAO,CAAC;AAKf,OAAO,EAGH,YAAY,EAEf,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAgC,MAAM,aAAa,CAAC;AAIrE,oBAAY,SAAS,GAAG,QAAQ,CAAC;AAEjC,oBAAY,YAAY,GAAG,WAAW,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;AAEzD,MAAM,WAAW,WAAW,CAAC,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uHAAuH;IACvH,IAAI,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,YAAY,CAAC;IAC/B,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAAC;CACjD;AAED,oBAAY,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"loader.d.ts","sourceRoot":"","sources":["../src/loader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,SAAS,EAOZ,MAAM,OAAO,CAAC;AAKf,OAAO,EAGH,YAAY,EAEf,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAgC,MAAM,aAAa,CAAC;AAIrE,oBAAY,SAAS,GAAG,QAAQ,CAAC;AAEjC,oBAAY,YAAY,GAAG,WAAW,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;AAEzD,MAAM,WAAW,WAAW,CAAC,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uHAAuH;IACvH,IAAI,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,YAAY,CAAC;IAC/B,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAAC;CACjD;AAED,oBAAY,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC,GAAG;IACxE,eAAe,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,MAAM,sGAwDjB,CAAC"}
|
package/dist/loader.js
CHANGED
|
@@ -34,7 +34,6 @@ export const Loader = forwardRef((props, ref) => {
|
|
|
34
34
|
onRequestError,
|
|
35
35
|
retries,
|
|
36
36
|
src,
|
|
37
|
-
LoadingFallback,
|
|
38
37
|
}), [
|
|
39
38
|
basename,
|
|
40
39
|
cancelation,
|
|
@@ -45,9 +44,8 @@ export const Loader = forwardRef((props, ref) => {
|
|
|
45
44
|
fallbackSrc,
|
|
46
45
|
retries,
|
|
47
46
|
src,
|
|
48
|
-
LoadingFallback,
|
|
49
47
|
]);
|
|
50
|
-
return (_jsx(ErrorBoundary, Object.assign({ moduleName: src, fallback: ErrorFallback }, { children: _jsx(Suspense, Object.assign({ fallback: _jsx(LoadingFallback, {}) }, { children: _jsx(Loader, { ref: ref, data: (_a = props.data) !== null && _a !== void 0 ? _a : {}, className: props.className }) })) })));
|
|
48
|
+
return (_jsx(ErrorBoundary, Object.assign({ moduleName: src, fallback: ErrorFallback }, { children: _jsx(Suspense, Object.assign({ fallback: _jsx(LoadingFallback, {}) }, { children: _jsx(Loader, { ref: ref, data: (_a = props.data) !== null && _a !== void 0 ? _a : {}, className: props.className, LoadingFallback: LoadingFallback }) })) })));
|
|
51
49
|
});
|
|
52
50
|
function lazyLoader(props) {
|
|
53
51
|
const { cancelation, eventBus } = props;
|
|
@@ -59,11 +57,11 @@ function lazyLoader(props) {
|
|
|
59
57
|
cancelation.abort();
|
|
60
58
|
};
|
|
61
59
|
}, []);
|
|
62
|
-
return _jsx(LazyWebComponent, { data: props.data, className: props.className });
|
|
60
|
+
return (_jsx(LazyWebComponent, { data: props.data, className: props.className, LoadingFallback: props.LoadingFallback }));
|
|
63
61
|
});
|
|
64
62
|
}
|
|
65
63
|
function lazyWebComponent(props) {
|
|
66
|
-
const { basename, cancelation, exposedDependencies, eventBus, fallbackSrc, logService, onRequestError, retries, src,
|
|
64
|
+
const { basename, cancelation, exposedDependencies, eventBus, fallbackSrc, logService, onRequestError, retries, src, } = props;
|
|
67
65
|
return lazy(() => __awaiter(this, void 0, void 0, function* () {
|
|
68
66
|
let bundleInfo;
|
|
69
67
|
try {
|
|
@@ -86,7 +84,6 @@ function lazyWebComponent(props) {
|
|
|
86
84
|
eventBus,
|
|
87
85
|
exposedDependencies,
|
|
88
86
|
logService,
|
|
89
|
-
LoadingFallback,
|
|
90
87
|
}),
|
|
91
88
|
};
|
|
92
89
|
}));
|
package/dist/loader.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loader.js","sourceRoot":"","sources":["../src/loader.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAGH,QAAQ,EACR,UAAU,EACV,IAAI,EACJ,SAAS,EACT,mBAAmB,EACnB,OAAO,GACV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAElE,OAAO,EACH,0BAA0B,EAG1B,cAAc,GACjB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAY,eAAe,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAc,aAAa,EAAE,kBAAkB,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"loader.js","sourceRoot":"","sources":["../src/loader.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { Log } from '@servicetitan/log-service';
|
|
3
2
|
import { ExposedDependencies } from '../common';
|
|
4
3
|
import { EventBus } from '../event-bus';
|
|
@@ -10,8 +9,7 @@ interface WebComponentProps {
|
|
|
10
9
|
eventBus: EventBus;
|
|
11
10
|
exposedDependencies?: ExposedDependencies;
|
|
12
11
|
logService?: Log;
|
|
13
|
-
LoadingFallback: () => JSX.Element;
|
|
14
12
|
}
|
|
15
|
-
export declare function webComponent(props: WebComponentProps): (props: LoaderDataProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare function webComponent(props: WebComponentProps): ({ LoadingFallback, ...props }: LoaderDataProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
14
|
export {};
|
|
17
15
|
//# sourceMappingURL=web-component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"web-component.d.ts","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"web-component.d.ts","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAGhD,OAAO,EAAE,mBAAmB,EAAiB,MAAM,WAAW,CAAC;AAE/D,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAE5C,UAAU,iBAAiB;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,UAAU,CAAC,EAAE,GAAG,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,mCAKV,eAAe,6CAoDzD"}
|
|
@@ -1,12 +1,24 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
13
|
import { Fragment, useMemo, useState } from 'react';
|
|
3
14
|
import { useOptionalDependencies } from '@servicetitan/react-ioc';
|
|
4
15
|
import { HistoryManager } from '../history-manager';
|
|
5
16
|
export function webComponent(props) {
|
|
6
|
-
const { basename, bundleInfo, eventBus, exposedDependencies, logService
|
|
17
|
+
const { basename, bundleInfo, eventBus, exposedDependencies, logService } = props;
|
|
7
18
|
const { WebComponent, disposer, mfeSupportsRerendering } = bundleInfo;
|
|
8
19
|
const elementName = getElementName(bundleInfo);
|
|
9
|
-
return (
|
|
20
|
+
return (_a) => {
|
|
21
|
+
var { LoadingFallback } = _a, props = __rest(_a, ["LoadingFallback"]);
|
|
10
22
|
const [isLoading, setIsLoading] = useState(true);
|
|
11
23
|
const [historyManager] = useOptionalDependencies(HistoryManager);
|
|
12
24
|
const handleRef = (webComponent) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"web-component.js","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"web-component.js","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/web-components",
|
|
3
|
-
"version": "23.5.
|
|
3
|
+
"version": "23.5.2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -15,17 +15,17 @@
|
|
|
15
15
|
"src"
|
|
16
16
|
],
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@servicetitan/error-boundary": "23.5.
|
|
18
|
+
"@servicetitan/error-boundary": "23.5.2",
|
|
19
19
|
"lodash.get": "~4.4.2",
|
|
20
20
|
"mitt": "~3.0.1",
|
|
21
21
|
"semver": "~7.5.4"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
24
|
"@servicetitan/design-system": "~14.0.0",
|
|
25
|
-
"@servicetitan/log-service": "23.5.
|
|
26
|
-
"@servicetitan/react-ioc": "23.5.
|
|
25
|
+
"@servicetitan/log-service": "23.5.2",
|
|
26
|
+
"@servicetitan/react-ioc": "23.5.2",
|
|
27
27
|
"@testing-library/dom": "^9.0.0",
|
|
28
|
-
"@testing-library/jest-dom": "^6.4.
|
|
28
|
+
"@testing-library/jest-dom": "^6.4.4",
|
|
29
29
|
"@testing-library/react": "^15.0.6",
|
|
30
30
|
"@types/history": "~4.7.10",
|
|
31
31
|
"@types/lodash.get": "~4.4.6",
|
|
@@ -39,8 +39,8 @@
|
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"@servicetitan/design-system": ">=12.6.2",
|
|
42
|
-
"@servicetitan/log-service": "23.5.
|
|
43
|
-
"@servicetitan/react-ioc": "23.5.
|
|
42
|
+
"@servicetitan/log-service": "23.5.2",
|
|
43
|
+
"@servicetitan/react-ioc": "23.5.2",
|
|
44
44
|
"history": "~4.10.1",
|
|
45
45
|
"react": ">=17.0.2",
|
|
46
46
|
"react-dom": ">=17.0.2"
|
|
@@ -51,5 +51,5 @@
|
|
|
51
51
|
"cli": {
|
|
52
52
|
"webpack": false
|
|
53
53
|
},
|
|
54
|
-
"gitHead": "
|
|
54
|
+
"gitHead": "db3072704335e30ef5cfc943cd1efa2538949512"
|
|
55
55
|
}
|
|
@@ -118,12 +118,14 @@ describe('[web-components] Loader', () => {
|
|
|
118
118
|
jest.mocked(getVersionMismatches).mockReturnValue({});
|
|
119
119
|
});
|
|
120
120
|
|
|
121
|
+
const Root = () => (
|
|
122
|
+
<Provider singletons={singletons}>
|
|
123
|
+
<Loader {...props} />
|
|
124
|
+
</Provider>
|
|
125
|
+
);
|
|
126
|
+
|
|
121
127
|
function subject() {
|
|
122
|
-
return render(
|
|
123
|
-
<Provider singletons={singletons}>
|
|
124
|
-
<Loader {...props} />
|
|
125
|
-
</Provider>
|
|
126
|
-
);
|
|
128
|
+
return render(<Root />);
|
|
127
129
|
}
|
|
128
130
|
|
|
129
131
|
test('renders default loading fallback', () => {
|
|
@@ -140,6 +142,14 @@ describe('[web-components] Loader', () => {
|
|
|
140
142
|
subject();
|
|
141
143
|
expect(screen.getByText('foo')).toBeInTheDocument();
|
|
142
144
|
});
|
|
145
|
+
|
|
146
|
+
test('preserves component state when loading fallback is updated', () => {
|
|
147
|
+
const renderResult = subject();
|
|
148
|
+
expect(common.getJson).toHaveBeenCalledTimes(1);
|
|
149
|
+
props.loadingFallback = <div>foo</div>;
|
|
150
|
+
renderResult.rerender(<Root />);
|
|
151
|
+
expect(common.getJson).toHaveBeenCalledTimes(1);
|
|
152
|
+
});
|
|
143
153
|
});
|
|
144
154
|
|
|
145
155
|
describe('when the loadingFallback throws an error', () => {
|
package/src/loader.tsx
CHANGED
|
@@ -40,7 +40,9 @@ export interface LoaderProps<T> {
|
|
|
40
40
|
onRequestError?(error: GetJsonError): boolean;
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
export type LoaderDataProps = Pick<LoaderProps<{}>, 'data' | 'className'
|
|
43
|
+
export type LoaderDataProps = Pick<LoaderProps<{}>, 'data' | 'className'> & {
|
|
44
|
+
LoadingFallback: () => JSX.Element;
|
|
45
|
+
};
|
|
44
46
|
|
|
45
47
|
export const Loader = forwardRef<LoaderRef, LoaderProps<{}>>((props, ref) => {
|
|
46
48
|
const { basename, fallbackSrc, onRequestError, retries, src } = props;
|
|
@@ -72,7 +74,6 @@ export const Loader = forwardRef<LoaderRef, LoaderProps<{}>>((props, ref) => {
|
|
|
72
74
|
onRequestError,
|
|
73
75
|
retries,
|
|
74
76
|
src,
|
|
75
|
-
LoadingFallback,
|
|
76
77
|
}),
|
|
77
78
|
[
|
|
78
79
|
basename,
|
|
@@ -84,25 +85,28 @@ export const Loader = forwardRef<LoaderRef, LoaderProps<{}>>((props, ref) => {
|
|
|
84
85
|
fallbackSrc,
|
|
85
86
|
retries,
|
|
86
87
|
src,
|
|
87
|
-
LoadingFallback,
|
|
88
88
|
]
|
|
89
89
|
);
|
|
90
90
|
|
|
91
91
|
return (
|
|
92
92
|
<ErrorBoundary moduleName={src} fallback={ErrorFallback}>
|
|
93
93
|
<Suspense fallback={<LoadingFallback />}>
|
|
94
|
-
<Loader
|
|
94
|
+
<Loader
|
|
95
|
+
ref={ref}
|
|
96
|
+
data={props.data ?? {}}
|
|
97
|
+
className={props.className}
|
|
98
|
+
LoadingFallback={LoadingFallback}
|
|
99
|
+
/>
|
|
95
100
|
</Suspense>
|
|
96
101
|
</ErrorBoundary>
|
|
97
102
|
);
|
|
98
103
|
});
|
|
99
104
|
|
|
100
|
-
type LazyLoaderProps =
|
|
105
|
+
type LazyLoaderProps = LoaderProps<any> & {
|
|
101
106
|
cancelation: AbortController;
|
|
102
107
|
exposedDependencies?: ExposedDependencies;
|
|
103
108
|
eventBus: EventBus;
|
|
104
109
|
logService?: Log;
|
|
105
|
-
LoadingFallback: () => JSX.Element;
|
|
106
110
|
};
|
|
107
111
|
|
|
108
112
|
function lazyLoader(props: LazyLoaderProps) {
|
|
@@ -119,7 +123,13 @@ function lazyLoader(props: LazyLoaderProps) {
|
|
|
119
123
|
};
|
|
120
124
|
}, []);
|
|
121
125
|
|
|
122
|
-
return
|
|
126
|
+
return (
|
|
127
|
+
<LazyWebComponent
|
|
128
|
+
data={props.data}
|
|
129
|
+
className={props.className}
|
|
130
|
+
LoadingFallback={props.LoadingFallback}
|
|
131
|
+
/>
|
|
132
|
+
);
|
|
123
133
|
});
|
|
124
134
|
}
|
|
125
135
|
|
|
@@ -134,7 +144,6 @@ function lazyWebComponent(props: LazyLoaderProps) {
|
|
|
134
144
|
onRequestError,
|
|
135
145
|
retries,
|
|
136
146
|
src,
|
|
137
|
-
LoadingFallback,
|
|
138
147
|
} = props;
|
|
139
148
|
|
|
140
149
|
return lazy<(props: LoaderDataProps) => JSX.Element | null>(async () => {
|
|
@@ -169,7 +178,6 @@ function lazyWebComponent(props: LazyLoaderProps) {
|
|
|
169
178
|
eventBus,
|
|
170
179
|
exposedDependencies,
|
|
171
180
|
logService,
|
|
172
|
-
LoadingFallback,
|
|
173
181
|
}),
|
|
174
182
|
};
|
|
175
183
|
});
|
|
@@ -15,16 +15,14 @@ interface WebComponentProps {
|
|
|
15
15
|
eventBus: EventBus;
|
|
16
16
|
exposedDependencies?: ExposedDependencies;
|
|
17
17
|
logService?: Log;
|
|
18
|
-
LoadingFallback: () => JSX.Element;
|
|
19
18
|
}
|
|
20
19
|
|
|
21
20
|
export function webComponent(props: WebComponentProps) {
|
|
22
|
-
const { basename, bundleInfo, eventBus, exposedDependencies, logService
|
|
23
|
-
props;
|
|
21
|
+
const { basename, bundleInfo, eventBus, exposedDependencies, logService } = props;
|
|
24
22
|
const { WebComponent, disposer, mfeSupportsRerendering } = bundleInfo;
|
|
25
23
|
const elementName = getElementName(bundleInfo);
|
|
26
24
|
|
|
27
|
-
return (props: LoaderDataProps) => {
|
|
25
|
+
return ({ LoadingFallback, ...props }: LoaderDataProps) => {
|
|
28
26
|
const [isLoading, setIsLoading] = useState(true);
|
|
29
27
|
const [historyManager] = useOptionalDependencies(HistoryManager);
|
|
30
28
|
|