alihan/OpenPipe-llm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

signal when new scenario is in progress

Browse Source
This commit is contained in:
Kyle Corbitt
2023-06-28 06:37:40 -07:00
parent 0a675cd7f7
commit 5d3d51d1a5
1 changed files with 8 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/OutputsTable/NewScenarioButton.tsx
View File

@@ -1,4 +1,4 @@
import { Button, type ButtonProps, Fade, HStack } from "@chakra-ui/react"; import { Button, type ButtonProps, Fade, HStack, Spinner, Icon } from "@chakra-ui/react";
import { useState } from "react"; import { useState } from "react";
import { BsPlus } from "react-icons/bs"; import { BsPlus } from "react-icons/bs";
import { api } from "~/utils/api"; import { api } from "~/utils/api";
@@ -21,7 +21,6 @@ export default function NewScenarioButton() {
const experiment = useExperiment(); const experiment = useExperiment();
const mutation = api.scenarios.create.useMutation(); const mutation = api.scenarios.create.useMutation();
const utils = api.useContext(); const utils = api.useContext();
const [hovering, setHovering] = useState(false);
const [onClick] = useHandledAsyncCallback(async () => { const [onClick] = useHandledAsyncCallback(async () => {
if (!experiment.data) return; if (!experiment.data) return;
@@ -31,7 +30,7 @@ export default function NewScenarioButton() {
await utils.scenarios.list.invalidate(); await utils.scenarios.list.invalidate();
}, [mutation]); }, [mutation]);
const [onAutogenerate] = useHandledAsyncCallback(async () => { const [onAutogenerate, autogenerating] = useHandledAsyncCallback(async () => {
if (!experiment.data) return; if (!experiment.data) return;
await mutation.mutateAsync({ await mutation.mutateAsync({
experimentId: experiment.data.id, experimentId: experiment.data.id,
@@ -41,21 +40,15 @@ export default function NewScenarioButton() {
}, [mutation]); }, [mutation]);
return ( return (
<HStack <HStack spacing={2}>
spacing={2}
onMouseEnter={() => setHovering(true)}
onMouseLeave={() => setHovering(false)}
>
<StyledButton onClick={onClick}> <StyledButton onClick={onClick}>
<BsPlus size={24} /> <Icon as={BsPlus} boxSize={6} />
Add Scenario Add Scenario
</StyledButton> </StyledButton>
<Fade in={hovering}> <StyledButton onClick={onAutogenerate}>
<StyledButton onClick={onAutogenerate}> <Icon as={autogenerating ? Spinner : BsPlus} boxSize={6} />
<BsPlus size={24} /> Autogenerate Scenario
Autogenerate Scenario </StyledButton>
</StyledButton>
</Fade>
</HStack> </HStack>
); );
} }