UI: Add a stop button to bladeburner (#1312)

src/Bladeburner/ui/GeneralActionElem.tsx

@@ -8,6 +8,7 @@ import { convertTimeMsToTimeElapsedString } from "../../utils/StringHelperFuncti
 import { Player } from "@player";
 import { CopyableText } from "../../ui/React/CopyableText";
 import { StartButton } from "./StartButton";
+import { StopButton } from "./StopButton";
 import { Box, Paper, Typography } from "@mui/material";
 import { useRerender } from "../../ui/React/hooks";
 
@@ -31,7 +32,10 @@ export function GeneralActionElem({ bladeburner, action }: GeneralActionElemProp
     <Paper sx={{ my: 1, p: 1 }}>
       {isActive ? (
         <>
-          <CopyableText value={action.name} />
+          <Box display="flex" flexDirection="row" alignItems="center">
+            <CopyableText value={action.name} />
+            <StopButton bladeburner={bladeburner} rerender={rerender} />
+          </Box>
           <Typography>
             (IN PROGRESS - {formatNumberNoSuffix(computedActionTimeCurrent, 0)} /{" "}
             {formatNumberNoSuffix(bladeburner.actionTimeToComplete, 0)})

src/Bladeburner/ui/StopButton.tsx

@@ -0,0 +1,17 @@
+import type { Bladeburner } from "../Bladeburner";
+
+import React from "react";
+import { Button } from "@mui/material";
+
+interface StopButtonProps {
+  bladeburner: Bladeburner;
+  rerender: () => void;
+}
+export function StopButton({ bladeburner, rerender }: StopButtonProps): React.ReactElement {
+  function onClick(): void {
+    bladeburner.resetAction();
+    rerender();
+  }
+
+  return <Button onClick={onClick}>Stop</Button>;
+}