77 lines
2.7 KiB
TypeScript
77 lines
2.7 KiB
TypeScript
import React, { useEffect, useState } from 'react';
|
|
import { Button } from '@/components/elements/button/index';
|
|
import Can from '@/components/elements/Can';
|
|
import { ServerContext } from '@/state/server';
|
|
import { PowerAction } from '@/components/server/console/ServerConsoleContainer';
|
|
import { Dialog } from '@/components/elements/dialog';
|
|
|
|
interface PowerButtonProps {
|
|
className?: string;
|
|
}
|
|
|
|
export default ({ className }: PowerButtonProps) => {
|
|
const [ open, setOpen ] = useState(false);
|
|
const status = ServerContext.useStoreState(state => state.status.value);
|
|
const instance = ServerContext.useStoreState(state => state.socket.instance);
|
|
|
|
const killable = status === 'stopping';
|
|
const onButtonClick = (action: PowerAction | 'kill-confirmed', e: React.MouseEvent<HTMLButtonElement, MouseEvent>): void => {
|
|
e.preventDefault();
|
|
if (action === 'kill') {
|
|
return setOpen(true);
|
|
}
|
|
|
|
if (instance) {
|
|
setOpen(false);
|
|
instance.send('set state', action === 'kill-confirmed' ? 'kill' : action);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (status === 'offline') {
|
|
setOpen(false);
|
|
}
|
|
}, [ status ]);
|
|
|
|
return (
|
|
<div className={className}>
|
|
<Dialog.Confirm
|
|
open={open}
|
|
hideCloseIcon
|
|
onClose={() => setOpen(false)}
|
|
title={'Forcibly Stop Process'}
|
|
confirm={'Continue'}
|
|
onConfirmed={onButtonClick.bind(this, 'kill-confirmed')}
|
|
>
|
|
Forcibly stopping a server can lead to data corruption.
|
|
</Dialog.Confirm>
|
|
<Can action={'control.start'}>
|
|
<Button
|
|
className={'w-full sm:w-24'}
|
|
disabled={status !== 'offline'}
|
|
onClick={onButtonClick.bind(this, 'start')}
|
|
>
|
|
Start
|
|
</Button>
|
|
</Can>
|
|
<Can action={'control.restart'}>
|
|
<Button.Text
|
|
className={'w-full sm:w-24'}
|
|
disabled={!status}
|
|
onClick={onButtonClick.bind(this, 'restart')}
|
|
>
|
|
Restart
|
|
</Button.Text>
|
|
</Can>
|
|
<Can action={'control.stop'}>
|
|
<Button.Danger
|
|
className={'w-full sm:w-24'}
|
|
disabled={status === 'offline'}
|
|
onClick={onButtonClick.bind(this, killable ? 'kill' : 'stop')}
|
|
>
|
|
{killable ? 'Kill' : 'Stop'}
|
|
</Button.Danger>
|
|
</Can>
|
|
</div>
|
|
);
|
|
};
|