IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Routing: refresh plugin module when pluginId changes (#33579)

Browse Source 
* fix(approotpage): load plugin if pluginId changes so ui updates

* fix(approotpage): prevent dashboard search breaking for plugins without navmodel
This commit is contained in:
Jack Westbrook 2021-05-05 13:55:34 +02:00 committed by GitHub
parent b2d4730ca1
commit 7f63efb941
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/app/core/components/Page/Page.tsx
View File

@ -13,7 +13,7 @@ import { css, cx } from '@emotion/css';
interface Props extends HTMLAttributes<HTMLDivElement> { interface Props extends HTMLAttributes<HTMLDivElement> {
children: React.ReactNode; children: React.ReactNode;
navModel: NavModel; navModel?: NavModel;
} }
export interface PageType extends FC<Props> { export interface PageType extends FC<Props> {
@ -25,15 +25,19 @@ export const Page: PageType = ({ navModel, children, className, ...otherProps })
const styles = useStyles2(getStyles); const styles = useStyles2(getStyles);
useEffect(() => { useEffect(() => {
const title = getTitleFromNavModel(navModel); if (navModel) {
document.title = title ? `${title} - ${Branding.AppTitle}` : Branding.AppTitle; const title = getTitleFromNavModel(navModel);
document.title = title ? `${title} - ${Branding.AppTitle}` : Branding.AppTitle;
} else {
document.title = Branding.AppTitle;
}
}, [navModel]); }, [navModel]);
return ( return (
<div {...otherProps} className={cx(styles.wrapper, className)}> <div {...otherProps} className={cx(styles.wrapper, className)}>
<CustomScrollbar autoHeightMin={'100%'}> <CustomScrollbar autoHeightMin={'100%'}>
<div className="page-scrollbar-content"> <div className="page-scrollbar-content">
<PageHeader model={navModel} /> {navModel && <PageHeader model={navModel} />}
{children} {children}
<Footer /> <Footer />
</div> </div>

24
public/app/features/plugins/AppRootPage.tsx
View File

@ -49,8 +49,7 @@ class AppRootPage extends Component<Props, State> {
shouldComponentUpdate(nextProps: Props) { shouldComponentUpdate(nextProps: Props) {
return nextProps.location.pathname.startsWith('/a/'); return nextProps.location.pathname.startsWith('/a/');
} }
async loadPluginSettings() {
async componentDidMount() {
const { params } = this.props.match; const { params } = this.props.match;
try { try {
const app = await getPluginSettings(params.pluginId).then((info) => { const app = await getPluginSettings(params.pluginId).then((info) => {
@ -62,7 +61,7 @@ class AppRootPage extends Component<Props, State> {
} }
return importAppPlugin(info); return importAppPlugin(info);
}); });
this.setState({ plugin: app, loading: false }); this.setState({ plugin: app, loading: false, nav: undefined });
} catch (err) { } catch (err) {
this.setState({ this.setState({
plugin: null, plugin: null,
@ -72,6 +71,21 @@ class AppRootPage extends Component<Props, State> {
} }
} }
componentDidMount() {
this.loadPluginSettings();
}
componentDidUpdate(prevProps: Props) {
const { params } = this.props.match;
if (prevProps.match.params.pluginId !== params.pluginId) {
this.setState({
loading: true,
});
this.loadPluginSettings();
}
}
onNavChanged = (nav: NavModel) => { onNavChanged = (nav: NavModel) => {
this.setState({ nav }); this.setState({ nav });
}; };
@ -104,10 +118,10 @@ class AppRootPage extends Component<Props, State> {
</Page.Contents> </Page.Contents>
</Page> </Page>
) : ( ) : (
<> <Page>
<OutPortal node={portalNode} /> <OutPortal node={portalNode} />
{loading && <PageLoader />} {loading && <PageLoader />}
</> </Page>
)} )}
</> </>
); );