This repository has been archived by the owner on Mar 14, 2024. It is now read-only.
-
-
Notifications
You must be signed in to change notification settings - Fork 5
/
AppRootPage.tsx
97 lines (85 loc) · 2.85 KB
/
AppRootPage.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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
// Libraries
import { AppEvents, AppPlugin, AppPluginMeta, KeyValue, NavModel, PluginType, UrlQueryMap, urlUtil } from '@savantly/sprout-api';
import React, { FC, useMemo, useState } from 'react';
import { connect } from 'react-redux';
import { useLocation, useParams } from 'react-router-dom';
import { appEvents } from '../../core/app_events';
import Page from '../../core/components/Page/Page';
import PageLoader from '../../core/components/PageLoader/PageLoader';
import { getExceptionNav, getNotFoundNav, getWarningNav } from '../../core/nav_model_srv';
// Types
import { StoreState } from '../../types';
import { getPluginSettings } from './PluginSettingsCache';
import { importAppPlugin } from './plugin_loader';
interface Props {
slug?: string;
}
export function getAppPluginPageError(meta: AppPluginMeta) {
if (!meta) {
return 'Unknown Plugin';
}
if (meta.type !== PluginType.app) {
return 'Plugin must be an app';
}
if (!meta.enabled) {
return 'Application Not Enabled';
}
return null;
}
const AppRootPage: FC<Props> = ({
}) => {
const params = useParams();
const location = useLocation();
const [plugin, setPlugin] = useState<AppPlugin<KeyValue<any>> | null>();
const [nav, setNav] = useState<NavModel | null>();
const [loading, setLoading] = useState<boolean>(true);
useMemo(() => {
try {
getPluginSettings(params.pluginId).then((info) => {
const error = getAppPluginPageError(info);
if (error) {
appEvents.emit(AppEvents.alertError, [error]);
setNav(getWarningNav(error));
return null;
}
importAppPlugin(info).then(app => {
setPlugin(app);
setLoading(false);
});
});
} catch (err) {
setPlugin(null);
setLoading(false);
setNav(process.env.NODE_ENV === 'development' ? getExceptionNav(err) : getNotFoundNav());
}
}, [params.pluginId]);
const onNavChanged = (nav: NavModel) => {
setNav(nav);
};
if (plugin && !plugin.root) {
// TODO? redirect to plugin page?
return <div>No Root App</div>;
}
// When no navigation is set, give full control to the app plugin
if (!nav) {
if (plugin && plugin.root) {
return <plugin.root meta={plugin.meta} query={urlUtil.getUrlSearchParams()} path={location.pathname} onNavChanged={onNavChanged} />;
}
return <PageLoader />;
}
return (
<Page navModel={nav}>
<Page.Contents isLoading={loading}>
{plugin && plugin.root && (
<plugin.root meta={plugin.meta} query={urlUtil.getUrlSearchParams()} path={location.pathname} onNavChanged={onNavChanged} />
)}
</Page.Contents>
</Page>
);
}
const mapStateToProps = (state: StoreState) => ({
slug: state.location.routeParams.slug as string,
query: state.location.query,
path: state.location.path
});
export default connect(mapStateToProps)(AppRootPage);