umami/components/common/UpdateNotice.js

48 lines
1.4 KiB
JavaScript
Raw Normal View History

import React from 'react';
import { FormattedMessage } from 'react-intl';
import useVersion from 'hooks/useVersion';
import styles from './UpdateNotice.module.css';
import ButtonLayout from '../layout/ButtonLayout';
import Button from './Button';
2020-09-30 06:22:08 +02:00
import useForceUpdate from '../../hooks/useForceUpdate';
export default function UpdateNotice() {
2020-10-02 19:34:22 +02:00
const forceUpdate = useForceUpdate();
const { hasUpdate, checked, latest, updateCheck } = useVersion(true);
2020-09-30 06:22:08 +02:00
function handleViewClick() {
location.href = 'https://github.com/mikecao/umami/releases';
updateCheck();
2020-10-02 19:34:22 +02:00
forceUpdate();
}
2020-09-30 06:22:08 +02:00
function handleDismissClick() {
updateCheck();
2020-10-02 19:34:22 +02:00
forceUpdate();
2020-09-30 06:22:08 +02:00
}
2020-10-02 19:34:22 +02:00
if (!hasUpdate || checked) {
return null;
}
return (
<div className={styles.notice}>
<div className={styles.message}>
<FormattedMessage
id="message.new-version-available"
defaultMessage="A new version of umami {version} is available!"
values={{ version: `v${latest}` }}
/>
</div>
<ButtonLayout>
2020-09-30 06:22:08 +02:00
<Button size="xsmall" variant="action" onClick={handleViewClick}>
2020-10-13 07:53:59 +02:00
<FormattedMessage id="label.view-details" defaultMessage="View details" />
</Button>
2020-09-30 06:22:08 +02:00
<Button size="xsmall" onClick={handleDismissClick}>
2020-10-13 07:53:59 +02:00
<FormattedMessage id="label.dismiss" defaultMessage="Dismiss" />
</Button>
</ButtonLayout>
</div>
);
}