This commit is contained in:
@@ -233,15 +233,3 @@ export type ActionsApiResponse = {
|
|||||||
intention: string | null;
|
intention: string | null;
|
||||||
response: string | null;
|
response: string | null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type ObserverCruise = {
|
|
||||||
observer_cruise_id: string;
|
|
||||||
status: Status;
|
|
||||||
workflow_run_id: string | null;
|
|
||||||
workflow_id: string | null;
|
|
||||||
workflow_permanent_id: string | null;
|
|
||||||
prompt: string | null;
|
|
||||||
url: string | null;
|
|
||||||
created_at: string;
|
|
||||||
modified_at: string;
|
|
||||||
};
|
|
||||||
|
|||||||
@@ -114,30 +114,6 @@ const SelectLabel = React.forwardRef<
|
|||||||
));
|
));
|
||||||
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
||||||
|
|
||||||
const CustomSelectItem = React.forwardRef<
|
|
||||||
React.ElementRef<typeof SelectPrimitive.Item>,
|
|
||||||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
|
|
||||||
>(({ className, children, ...props }, ref) => (
|
|
||||||
<SelectPrimitive.Item
|
|
||||||
ref={ref}
|
|
||||||
className={cn(
|
|
||||||
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
{...props}
|
|
||||||
>
|
|
||||||
<span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
|
|
||||||
<SelectPrimitive.ItemIndicator>
|
|
||||||
<CheckIcon className="h-4 w-4" />
|
|
||||||
</SelectPrimitive.ItemIndicator>
|
|
||||||
</span>
|
|
||||||
{children}
|
|
||||||
</SelectPrimitive.Item>
|
|
||||||
));
|
|
||||||
CustomSelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
||||||
|
|
||||||
const SelectItemText = SelectPrimitive.ItemText;
|
|
||||||
|
|
||||||
const SelectItem = React.forwardRef<
|
const SelectItem = React.forwardRef<
|
||||||
React.ElementRef<typeof SelectPrimitive.Item>,
|
React.ElementRef<typeof SelectPrimitive.Item>,
|
||||||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
|
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
|
||||||
@@ -183,6 +159,4 @@ export {
|
|||||||
SelectSeparator,
|
SelectSeparator,
|
||||||
SelectScrollUpButton,
|
SelectScrollUpButton,
|
||||||
SelectScrollDownButton,
|
SelectScrollDownButton,
|
||||||
CustomSelectItem,
|
|
||||||
SelectItemText,
|
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { getClient } from "@/api/AxiosClient";
|
import { getClient } from "@/api/AxiosClient";
|
||||||
import { ObserverCruise, TaskGenerationApiResponse } from "@/api/types";
|
import { TaskGenerationApiResponse } from "@/api/types";
|
||||||
import img from "@/assets/promptBoxBg.png";
|
import img from "@/assets/promptBoxBg.png";
|
||||||
import { CartIcon } from "@/components/icons/CartIcon";
|
import { CartIcon } from "@/components/icons/CartIcon";
|
||||||
import { GraphIcon } from "@/components/icons/GraphIcon";
|
import { GraphIcon } from "@/components/icons/GraphIcon";
|
||||||
@@ -7,19 +7,9 @@ import { InboxIcon } from "@/components/icons/InboxIcon";
|
|||||||
import { MessageIcon } from "@/components/icons/MessageIcon";
|
import { MessageIcon } from "@/components/icons/MessageIcon";
|
||||||
import { TranslateIcon } from "@/components/icons/TranslateIcon";
|
import { TranslateIcon } from "@/components/icons/TranslateIcon";
|
||||||
import { TrophyIcon } from "@/components/icons/TrophyIcon";
|
import { TrophyIcon } from "@/components/icons/TrophyIcon";
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import {
|
|
||||||
CustomSelectItem,
|
|
||||||
Select,
|
|
||||||
SelectContent,
|
|
||||||
SelectItemText,
|
|
||||||
SelectTrigger,
|
|
||||||
SelectValue,
|
|
||||||
} from "@/components/ui/select";
|
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
import { toast } from "@/components/ui/use-toast";
|
import { toast } from "@/components/ui/use-toast";
|
||||||
import { useCredentialGetter } from "@/hooks/useCredentialGetter";
|
import { useCredentialGetter } from "@/hooks/useCredentialGetter";
|
||||||
import { observerFeatureEnabled } from "@/util/env";
|
|
||||||
import {
|
import {
|
||||||
FileTextIcon,
|
FileTextIcon,
|
||||||
GearIcon,
|
GearIcon,
|
||||||
@@ -28,11 +18,10 @@ import {
|
|||||||
PlusIcon,
|
PlusIcon,
|
||||||
ReloadIcon,
|
ReloadIcon,
|
||||||
} from "@radix-ui/react-icons";
|
} from "@radix-ui/react-icons";
|
||||||
import { ToastAction } from "@radix-ui/react-toast";
|
|
||||||
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { Link, useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { stringify as convertToYAML } from "yaml";
|
import { stringify as convertToYAML } from "yaml";
|
||||||
|
|
||||||
function createTemplateTaskFromTaskGenerationParameters(
|
function createTemplateTaskFromTaskGenerationParameters(
|
||||||
@@ -123,53 +112,9 @@ const exampleCases = [
|
|||||||
function PromptBox() {
|
function PromptBox() {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const [prompt, setPrompt] = useState<string>("");
|
const [prompt, setPrompt] = useState<string>("");
|
||||||
const [selectValue, setSelectValue] = useState(
|
|
||||||
observerFeatureEnabled ? "v2" : "v1",
|
|
||||||
);
|
|
||||||
const credentialGetter = useCredentialGetter();
|
const credentialGetter = useCredentialGetter();
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
const startObserverCruiseMutation = useMutation({
|
|
||||||
mutationFn: async (prompt: string) => {
|
|
||||||
const client = await getClient(credentialGetter);
|
|
||||||
return client.post<{ user_prompt: string }, { data: ObserverCruise }>(
|
|
||||||
"/cruise",
|
|
||||||
{ user_prompt: prompt },
|
|
||||||
);
|
|
||||||
},
|
|
||||||
onSuccess: (response) => {
|
|
||||||
toast({
|
|
||||||
variant: "success",
|
|
||||||
title: "Workflow Run Created",
|
|
||||||
description: `Workflow run created successfully.`,
|
|
||||||
action: (
|
|
||||||
<ToastAction altText="View">
|
|
||||||
<Button asChild>
|
|
||||||
<Link
|
|
||||||
to={`/workflows/${response.data.workflow_permanent_id}/${response.data.workflow_run_id}`}
|
|
||||||
>
|
|
||||||
View
|
|
||||||
</Link>
|
|
||||||
</Button>
|
|
||||||
</ToastAction>
|
|
||||||
),
|
|
||||||
});
|
|
||||||
queryClient.invalidateQueries({
|
|
||||||
queryKey: ["workflowRuns"],
|
|
||||||
});
|
|
||||||
queryClient.invalidateQueries({
|
|
||||||
queryKey: ["workflows"],
|
|
||||||
});
|
|
||||||
},
|
|
||||||
onError: (error: AxiosError) => {
|
|
||||||
toast({
|
|
||||||
variant: "destructive",
|
|
||||||
title: "Error creating workflow run from prompt",
|
|
||||||
description: error.message,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const getTaskFromPromptMutation = useMutation({
|
const getTaskFromPromptMutation = useMutation({
|
||||||
mutationFn: async (prompt: string) => {
|
mutationFn: async (prompt: string) => {
|
||||||
const client = await getClient(credentialGetter);
|
const client = await getClient(credentialGetter);
|
||||||
@@ -235,48 +180,14 @@ function PromptBox() {
|
|||||||
placeholder="Enter your prompt..."
|
placeholder="Enter your prompt..."
|
||||||
rows={1}
|
rows={1}
|
||||||
/>
|
/>
|
||||||
{observerFeatureEnabled && (
|
<div className="h-full">
|
||||||
<Select value={selectValue} onValueChange={setSelectValue}>
|
{getTaskFromPromptMutation.isPending ||
|
||||||
<SelectTrigger className="w-32 focus:ring-0">
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent className="border-slate-500 bg-slate-elevation3">
|
|
||||||
<CustomSelectItem value="v2" className="hover:bg-slate-800">
|
|
||||||
<div className="space-y-2">
|
|
||||||
<div>
|
|
||||||
<SelectItemText>Observer</SelectItemText>
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-slate-400">
|
|
||||||
best for complex tasks
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CustomSelectItem>
|
|
||||||
<CustomSelectItem value="v1">
|
|
||||||
<div className="space-y-2">
|
|
||||||
<div>
|
|
||||||
<SelectItemText>Task</SelectItemText>
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-slate-400">
|
|
||||||
best for simple tasks
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CustomSelectItem>
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
)}
|
|
||||||
<div className="flex items-center">
|
|
||||||
{startObserverCruiseMutation.isPending ||
|
|
||||||
getTaskFromPromptMutation.isPending ||
|
|
||||||
saveTaskMutation.isPending ? (
|
saveTaskMutation.isPending ? (
|
||||||
<ReloadIcon className="h-6 w-6 animate-spin" />
|
<ReloadIcon className="h-6 w-6 animate-spin" />
|
||||||
) : (
|
) : (
|
||||||
<PaperPlaneIcon
|
<PaperPlaneIcon
|
||||||
className="h-6 w-6 cursor-pointer"
|
className="h-6 w-6 cursor-pointer"
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
if (observerFeatureEnabled && selectValue === "v2") {
|
|
||||||
startObserverCruiseMutation.mutate(prompt);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const taskGenerationResponse =
|
const taskGenerationResponse =
|
||||||
await getTaskFromPromptMutation.mutateAsync(prompt);
|
await getTaskFromPromptMutation.mutateAsync(prompt);
|
||||||
await saveTaskMutation.mutateAsync(taskGenerationResponse);
|
await saveTaskMutation.mutateAsync(taskGenerationResponse);
|
||||||
|
|||||||
@@ -19,13 +19,4 @@ if (!artifactApiBaseUrl) {
|
|||||||
console.warn("artifactApiBaseUrl environment variable was not set");
|
console.warn("artifactApiBaseUrl environment variable was not set");
|
||||||
}
|
}
|
||||||
|
|
||||||
const observerEnabled = import.meta.env.VITE_OBSERVER_ENABLED as string;
|
export { apiBaseUrl, environment, envCredential, artifactApiBaseUrl };
|
||||||
const observerFeatureEnabled = observerEnabled === "true";
|
|
||||||
|
|
||||||
export {
|
|
||||||
apiBaseUrl,
|
|
||||||
environment,
|
|
||||||
envCredential,
|
|
||||||
artifactApiBaseUrl,
|
|
||||||
observerFeatureEnabled,
|
|
||||||
};
|
|
||||||
|
|||||||
Reference in New Issue
Block a user