mirror of
https://github.com/grafana/grafana.git
synced 2025-07-29 21:42:11 +08:00
feat(plugin-admin-app): show message prompting user to refresh browser when installing panel plugin (#35271)
This commit is contained in:
@ -1,5 +1,5 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { css } from '@emotion/css';
|
import { css, cx } from '@emotion/css';
|
||||||
import { gt, satisfies } from 'semver';
|
import { gt, satisfies } from 'semver';
|
||||||
|
|
||||||
import { config } from '@grafana/runtime';
|
import { config } from '@grafana/runtime';
|
||||||
@ -25,6 +25,7 @@ export const InstallControls = ({ localPlugin, remotePlugin }: Props) => {
|
|||||||
const [shouldUpdate, setShouldUpdate] = useState(
|
const [shouldUpdate, setShouldUpdate] = useState(
|
||||||
remotePlugin?.version && localPlugin?.info.version && gt(remotePlugin?.version!, localPlugin?.info.version!)
|
remotePlugin?.version && localPlugin?.info.version && gt(remotePlugin?.version!, localPlugin?.info.version!)
|
||||||
);
|
);
|
||||||
|
const [hasInstalledPanel, setHasInstalledPanel] = useState(false);
|
||||||
const isExternallyManaged = config.pluginAdminExternalManageEnabled;
|
const isExternallyManaged = config.pluginAdminExternalManageEnabled;
|
||||||
const externalManageLink = getExternalManageLink(remotePlugin);
|
const externalManageLink = getExternalManageLink(remotePlugin);
|
||||||
|
|
||||||
@ -37,6 +38,7 @@ export const InstallControls = ({ localPlugin, remotePlugin }: Props) => {
|
|||||||
appEvents.emit(AppEvents.alertSuccess, [`Installed ${remotePlugin?.name}`]);
|
appEvents.emit(AppEvents.alertSuccess, [`Installed ${remotePlugin?.name}`]);
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
setIsInstalled(true);
|
setIsInstalled(true);
|
||||||
|
setHasInstalledPanel(remotePlugin.typeCode === 'panel');
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
}
|
}
|
||||||
@ -115,6 +117,11 @@ export const InstallControls = ({ localPlugin, remotePlugin }: Props) => {
|
|||||||
<Button variant="destructive" disabled={loading || !hasPermission} onClick={onUninstall}>
|
<Button variant="destructive" disabled={loading || !hasPermission} onClick={onUninstall}>
|
||||||
{loading && !shouldUpdate ? 'Uninstalling' : 'Uninstall'}
|
{loading && !shouldUpdate ? 'Uninstalling' : 'Uninstall'}
|
||||||
</Button>
|
</Button>
|
||||||
|
{hasInstalledPanel && (
|
||||||
|
<div className={cx(styles.message, styles.messageMargin)}>
|
||||||
|
Please refresh your browser window before using this plugin.
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
{!hasPermission && <div className={styles.message}>You need admin privileges to manage this plugin.</div>}
|
{!hasPermission && <div className={styles.message}>You need admin privileges to manage this plugin.</div>}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
@ -158,6 +165,9 @@ export const getStyles = (theme: GrafanaTheme2) => {
|
|||||||
message: css`
|
message: css`
|
||||||
color: ${theme.colors.text.secondary};
|
color: ${theme.colors.text.secondary};
|
||||||
`,
|
`,
|
||||||
|
messageMargin: css`
|
||||||
|
margin-left: ${theme.spacing()};
|
||||||
|
`,
|
||||||
readme: css`
|
readme: css`
|
||||||
margin: ${theme.spacing(3)} 0;
|
margin: ${theme.spacing(3)} 0;
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user