Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | 3x 11x 11x 11x | import {
Box,
BoxFlexDirection,
BoxFlexWrap,
ButtonBase,
Icon,
IconName,
} from '@metamask/design-system-react';
import { useKernelActions } from '../hooks/useKernelActions.ts';
import { useVats } from '../hooks/useVats.ts';
/**
* @returns A panel for controlling the kernel.
*/
export const KernelControls: React.FC = () => {
const { terminateAllVats, collectGarbage, clearState, reload } =
useKernelActions();
const { hasVats } = useVats();
return (
<Box
flexDirection={BoxFlexDirection.Row}
flexWrap={BoxFlexWrap.Wrap}
className="mb-4"
gap={2}
>
{hasVats && (
<ButtonBase
className="h-auto flex-1 flex-col justify-center rounded-lg bg-muted py-4 hover:bg-muted-hover active:bg-muted-pressed"
onClick={terminateAllVats}
>
<Icon name={IconName.Ban} className="mb-2" />
Terminate All Vats
</ButtonBase>
)}
<ButtonBase
className="h-auto flex-1 flex-col justify-center rounded-lg bg-muted py-4 hover:bg-muted-hover active:bg-muted-pressed"
onClick={collectGarbage}
>
<Icon name={IconName.Trash} className="mb-2" />
Collect Garbage
</ButtonBase>
<ButtonBase
className="h-auto flex-1 flex-col justify-center rounded-lg bg-muted py-4 hover:bg-muted-hover active:bg-muted-pressed"
onClick={clearState}
>
<Icon name={IconName.Data} className="mb-2" />
Clear All State
</ButtonBase>
<ButtonBase
className="h-auto flex-1 flex-col justify-center rounded-lg bg-muted py-4 hover:bg-muted-hover active:bg-muted-pressed"
onClick={reload}
>
<Icon name={IconName.Refresh} className="mb-2" />
Reload Kernel
</ButtonBase>
</Box>
);
};
|