54 lines
1.3 KiB
JavaScript
54 lines
1.3 KiB
JavaScript
// @flow
|
|
import * as React from 'react';
|
|
import styled from 'styled-components';
|
|
import Badge from 'components/Badge';
|
|
import SidebarLink from './SidebarLink';
|
|
import { version } from '../../../../package.json';
|
|
|
|
export default function Version() {
|
|
// $FlowFixMe
|
|
const [releasesBehind, setReleasesBehind] = React.useState(0);
|
|
|
|
// $FlowFixMe
|
|
React.useEffect(() => {
|
|
async function loadReleases() {
|
|
let out = 0;
|
|
const res = await fetch(
|
|
'https://api.github.com/repos/outline/outline/releases'
|
|
);
|
|
const releases = await res.json();
|
|
for (const release of releases) {
|
|
if (release.tag_name === `v${version}`) {
|
|
return setReleasesBehind(out);
|
|
} else {
|
|
out++;
|
|
}
|
|
}
|
|
}
|
|
loadReleases();
|
|
}, []);
|
|
|
|
return (
|
|
<SidebarLink
|
|
href="https://github.com/outline/outline/releases"
|
|
label={
|
|
<React.Fragment>
|
|
v{version}
|
|
<br />
|
|
<LilBadge>
|
|
{releasesBehind === 0
|
|
? 'Up to date'
|
|
: `${releasesBehind} version${
|
|
releasesBehind === 1 ? '' : 's'
|
|
} behind`}
|
|
</LilBadge>
|
|
</React.Fragment>
|
|
}
|
|
/>
|
|
);
|
|
}
|
|
|
|
const LilBadge = styled(Badge)`
|
|
margin-left: 0;
|
|
`;
|