bbgo/apps/frontend/components/SyncButton.tsx

40 lines
861 B
TypeScript

import { styled } from '@mui/styles';
import React, { useEffect, useState } from 'react';
import { querySyncStatus, SyncStatus, triggerSync } from '../api/bbgo';
import useInterval from '../hooks/useInterval';
const ToolbarButton = styled('button')(({ theme }) => ({
padding: theme.spacing(1),
}));
export default function SyncButton() {
const [syncing, setSyncing] = useState(false);
const sync = async () => {
try {
setSyncing(true);
await triggerSync();
} catch {
setSyncing(false);
}
};
useEffect(() => {
sync();
}, []);
useInterval(() => {
querySyncStatus().then((s) => {
if (s !== SyncStatus.Syncing) {
setSyncing(false);
}
});
}, 2000);
return (
<ToolbarButton disabled={syncing} onClick={sync}>
{syncing ? 'Syncing...' : 'Sync'}
</ToolbarButton>
);
}