misc_pterodactyl-panel/resources/scripts/components/server/console/PowerButtons.tsx

77 lines
2.6 KiB
TypeScript
Raw Normal View History

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={'flex-1'}
disabled={status !== 'offline'}
onClick={onButtonClick.bind(this, 'start')}
>
Start
</Button>
</Can>
<Can action={'control.restart'}>
<Button.Text className={'flex-1'} disabled={!status} onClick={onButtonClick.bind(this, 'restart')}>
Restart
</Button.Text>
</Can>
<Can action={'control.stop'}>
<Button.Danger
className={'flex-1'}
disabled={status === 'offline'}
onClick={onButtonClick.bind(this, killable ? 'kill' : 'stop')}
>
{killable ? 'Kill' : 'Stop'}
</Button.Danger>
</Can>
</div>
);
};