lychiyu/bbgo_origin
1
0
Fork 0
mirror of https://github.com/c9s/bbgo.git synced 2024-11-25 08:15:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

frontend: show syncing status

Browse Source
This commit is contained in:
ycdesu 2022-06-15 11:37:05 +08:00
parent 93f7616f14
commit 52ae59eb99
3 changed files with 45 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/components/SyncButton.tsx Normal file
View File

@ -0,0 +1,43 @@
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>
);
}

17
frontend/layouts/DashboardLayout.js
View File

@ -1,17 +1,16 @@
import React from 'react'; import React from 'react';
import { makeStyles, styled } from '@mui/styles'; import { makeStyles } from '@mui/styles';
import AppBar from '@mui/material/AppBar'; import AppBar from '@mui/material/AppBar';
import Toolbar from '@mui/material/Toolbar'; import Toolbar from '@mui/material/Toolbar';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import Container from '@mui/material/Container'; import Container from '@mui/material/Container';
import SideBar from '../components/SideBar'; import SideBar from '../components/SideBar';
import SyncButton from '../components/SyncButton';
import ConnectWallet from '../components/ConnectWallet'; import ConnectWallet from '../components/ConnectWallet';
import { Box } from '@mui/material'; import { Box } from '@mui/material';
import { throttle } from '../src/utils';
import { triggerSync } from '../api/bbgo';
const useStyles = makeStyles((theme) => ({ const useStyles = makeStyles((theme) => ({
root: { root: {
@ -33,18 +32,6 @@ const useStyles = makeStyles((theme) => ({
}, },
})); }));
const ToolbarButton = styled('button')(({ theme }) => ({
padding: theme.spacing(1),
}));
function SyncButton() {
const handleClick = throttle(async () => {
await triggerSync();
}, 2000);
return <ToolbarButton onClick={handleClick}>Sync</ToolbarButton>;
}
export default function DashboardLayout({ children }) { export default function DashboardLayout({ children }) {
const classes = useStyles(); const classes = useStyles();

5
frontend/pages/_app.tsx
View File

@ -7,7 +7,6 @@ import { ThemeProvider } from '@mui/material/styles';
import CssBaseline from '@mui/material/CssBaseline'; import CssBaseline from '@mui/material/CssBaseline';
import theme from '../src/theme'; import theme from '../src/theme';
import '../styles/globals.css'; import '../styles/globals.css';
import { triggerSync } from '../api/bbgo';
export default function MyApp(props) { export default function MyApp(props) {
const { Component, pageProps } = props; const { Component, pageProps } = props;
@ -20,10 +19,6 @@ export default function MyApp(props) {
} }
}, []); }, []);
useEffect(() => {
triggerSync();
}, []);
return ( return (
<React.Fragment> <React.Fragment>
<Head> <Head>