Frontend: Auto reload page when chunk is not found (#33445)

This commit is contained in:
Torkel Ödegaard 2021-04-28 09:31:52 +02:00 committed by GitHub
parent 20ee0e9601
commit 3a93313f75
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,6 +1,7 @@
import React, { FunctionComponent } from 'react';
import { Button, stylesFactory } from '@grafana/ui';
import { css } from '@emotion/css';
import { useUrlParams } from 'app/core/navigation/hooks';
const getStyles = stylesFactory(() => {
return css`
@ -13,23 +14,32 @@ interface Props {
error: Error | null;
}
export const ErrorLoadingChunk: FunctionComponent<Props> = ({ error }) => (
<div className={getStyles()}>
<h2>Unable to find application file</h2>
<br />
<h2 className="page-heading">Grafana has likely been updated. Please try reloading the page.</h2>
<br />
<div className="gf-form-group">
<Button size="md" variant="secondary" icon="repeat" onClick={() => window.location.reload()}>
Reload
</Button>
</div>
<details style={{ whiteSpace: 'pre-wrap' }}>
{error && error.message ? error.message : 'Unexpected error occurred'}
export const ErrorLoadingChunk: FunctionComponent<Props> = ({ error }) => {
const [params, updateUrlParams] = useUrlParams();
if (!params.get('chunkNotFound')) {
updateUrlParams({ chunkNotFound: true }, true);
window.location.reload();
}
return (
<div className={getStyles()}>
<h2>Unable to find application file</h2>
<br />
{error && error.stack ? error.stack : null}
</details>
</div>
);
<h2 className="page-heading">Grafana has likely been updated. Please try reloading the page.</h2>
<br />
<div className="gf-form-group">
<Button size="md" variant="secondary" icon="repeat" onClick={() => window.location.reload()}>
Reload
</Button>
</div>
<details style={{ whiteSpace: 'pre-wrap' }}>
{error && error.message ? error.message : 'Unexpected error occurred'}
<br />
{error && error.stack ? error.stack : null}
</details>
</div>
);
};
ErrorLoadingChunk.displayName = 'ErrorLoadingChunk';