-
Notifications
You must be signed in to change notification settings - Fork 39
/
Component.tsx
62 lines (52 loc) · 1.49 KB
/
Component.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
import * as React from 'react';
import {ReactElement} from "react";
import {uid} from "react-uid";
import {settings} from './config';
import {ComponentOptions} from "./types";
import {useImported} from "./useImported";
function ImportedComponent<P, K>(props: ComponentOptions<P, K>): ReactElement | null {
const {loading, error, loadable, imported: Component, retry} = useImported(props.loadable);
if (loading && props.async) {
throw loadable.resolution;
}
if ('render' in props && props.render) {
return props.render(Component, {loading, error}, props.forwardProps)
}
if (Component) {
// importedUUID for cache busting
return <Component {...props.forwardProps} ref={props.forwardRef} importedUUID={uid(Component)}/>
}
if (loading) {
if (props.async) {
throw loadable.resolution;
}
return props.LoadingComponent
? <props.LoadingComponent {...props.forwardProps} />
: null;
}
if (error) {
// always report about errors
console.error('react-imported-component', error);
// let's rethrow the error after react leaves this function
// this might be very crucial for the "safe" dev mode
if (settings.rethrowErrors) {
setTimeout(() => {
throw error
});
}
if (props.ErrorComponent) {
return (
<props.ErrorComponent
retryImport={retry}
error={error}
{...props.forwardProps}
/>
)
}
throw error;
}
return null;
};
export {
ImportedComponent
}