diff --git a/agenta-web/src/components/Playground/ViewNavigation.tsx b/agenta-web/src/components/Playground/ViewNavigation.tsx index eea831f19f..5db2ba4e69 100644 --- a/agenta-web/src/components/Playground/ViewNavigation.tsx +++ b/agenta-web/src/components/Playground/ViewNavigation.tsx @@ -17,7 +17,7 @@ import { import {useAppsData} from "@/contexts/app.context" import {isDemo} from "@/lib/helpers/utils" -interface Props { +interface PruseVariantops { variant: Variant handlePersistVariant: (variantName: string) => void environments: Environment[] @@ -60,12 +60,11 @@ const ViewNavigation: React.FC = ({ saveOptParams, isLoading, isChatVariant, - promptRevisions, historyStatus, setPromptOptParams, - setPromptRevisions, setHistoryStatus, } = useVariant(appId, variant) + const [retrying, setRetrying] = useState(false) const [isParamsCollapsed, setIsParamsCollapsed] = useState("1") const [containerURI, setContainerURI] = useState("") @@ -244,7 +243,8 @@ const ViewNavigation: React.FC = ({ tabID={tabID} setHistoryStatus={setHistoryStatus} setIsDrawerOpen={setIsDrawerOpen} - setPromptRevisions={setPromptRevisions} + isDrawerOpen={isDrawerOpen} + historyStatus={historyStatus} /> @@ -259,12 +259,8 @@ const ViewNavigation: React.FC = ({ isChatVariant={!!isChatVariant} compareMode={compareMode} onStateChange={onStateChange} - promptRevisions={promptRevisions} - historyStatus={historyStatus} setPromptOptParams={setPromptOptParams} promptOptParams={promptOptParams} - isDrawerOpen={isDrawerOpen} - setIsDrawerOpen={setIsDrawerOpen} /> diff --git a/agenta-web/src/components/Playground/Views/ParametersView.tsx b/agenta-web/src/components/Playground/Views/ParametersView.tsx index 1aaae7c96d..30602349eb 100644 --- a/agenta-web/src/components/Playground/Views/ParametersView.tsx +++ b/agenta-web/src/components/Playground/Views/ParametersView.tsx @@ -9,6 +9,13 @@ import {promptVersioning, removeVariant} from "@/lib/services/api" import {CloudUploadOutlined, DeleteOutlined, HistoryOutlined, SaveOutlined} from "@ant-design/icons" import {usePostHogAg} from "@/hooks/usePostHogAg" import {isDemo} from "@/lib/helpers/utils" +import {useQueryParam} from "@/hooks/useQuery" +import {dynamicComponent} from "@/lib/helpers/dynamic" + + +const PromptVersioningDrawer: any = dynamicComponent( + `PromptVersioningDrawer/PromptVersioningDrawer`, +) interface Props { variant: Variant @@ -30,8 +37,12 @@ interface Props { onStateChange: (isDirty: boolean) => void compareMode: boolean tabID: React.MutableRefObject + isDrawerOpen: boolean setIsDrawerOpen: React.Dispatch> - setPromptRevisions: React.Dispatch> + historyStatus: { + loading: boolean + error: boolean + } setHistoryStatus: React.Dispatch< React.SetStateAction<{ loading: boolean @@ -76,15 +87,18 @@ const ParametersView: React.FC = ({ onStateChange, compareMode, tabID, - setHistoryStatus, + isDrawerOpen, setIsDrawerOpen, - setPromptRevisions, + historyStatus, + setHistoryStatus, }) => { const classes = useStyles() const posthog = usePostHogAg() const [messageApi, contextHolder] = message.useMessage() const [isPublishModalOpen, setPublishModalOpen] = useState(false) const isVariantExisting = !!variant.variantId + const [revisionNum, setRevisionNum] = useQueryParam("revision") + const [promptRevisions, setPromptRevisions] = useState() useEffect(() => { onStateChange(variant.persistent === false) @@ -153,6 +167,10 @@ const ParametersView: React.FC = ({ } } + let filteredRevisions + if (promptRevisions !== undefined) { + filteredRevisions = promptRevisions.filter((item) => item.revision !== 0) + } const items: CollapseProps["items"] = [ { key: "1", @@ -271,6 +289,14 @@ const ParametersView: React.FC = ({ setIsModalOpen={setPublishModalOpen} environments={environments} /> + ) } diff --git a/agenta-web/src/components/Playground/Views/TestView.tsx b/agenta-web/src/components/Playground/Views/TestView.tsx index daabacb5c6..937034b6d5 100644 --- a/agenta-web/src/components/Playground/Views/TestView.tsx +++ b/agenta-web/src/components/Playground/Views/TestView.tsx @@ -1,7 +1,7 @@ import React, {useContext, useEffect, useRef, useState} from "react" import {Button, Input, Card, Row, Col, Space, Form, Modal} from "antd" import {CaretRightOutlined, CloseCircleOutlined, PlusOutlined} from "@ant-design/icons" -import {callVariant} from "@/lib/services/api" +import {callVariant, promptRevision} from "@/lib/services/api" import { ChatMessage, ChatRole, @@ -31,9 +31,6 @@ import duration from "dayjs/plugin/duration" import {useQueryParam} from "@/hooks/useQuery" import {dynamicComponent} from "@/lib/helpers/dynamic" -const PromptVersioningDrawer: any = dynamicComponent( - `PromptVersioningDrawer/PromptVersioningDrawer`, -) dayjs.extend(relativeTime) dayjs.extend(duration) @@ -143,15 +140,8 @@ interface TestViewProps { isChatVariant?: boolean compareMode: boolean onStateChange: (isDirty: boolean) => void - promptRevisions: IPromptVersioning | undefined - historyStatus: { - loading: boolean - error: boolean - } setPromptOptParams: React.Dispatch> promptOptParams: Parameter[] | null - setIsDrawerOpen: React.Dispatch> - isDrawerOpen: boolean } interface BoxComponentProps { @@ -330,10 +320,6 @@ const App: React.FC = ({ compareMode, onStateChange, setPromptOptParams, - promptRevisions, - historyStatus, - isDrawerOpen, - setIsDrawerOpen, }) => { const router = useRouter() const appId = router.query.app_id as unknown as string @@ -348,7 +334,6 @@ const App: React.FC = ({ const [resultsList, setResultsList] = useState(testList.map(() => "")) const [params, setParams] = useState | null>(null) const classes = useStylesApp({themeMode: appTheme} as StyleProps) - const filteredRevisions = promptRevisions?.revisions.filter((item) => item.revision !== 0) const rootRef = React.useRef(null) const [isLLMProviderMissingModalOpen, setIsLLMProviderMissingModalOpen] = useState(false) @@ -364,41 +349,45 @@ const App: React.FC = ({ useEffect(() => { if (!revisionNum) return - - const revision = filteredRevisions?.find((rev) => rev.revision === parseInt(revisionNum)) - - if (!revision) return - - setPromptOptParams((prevState: Parameter[] | null) => { - if (!prevState) { - return prevState - } - - const parameterNames = [ - "temperature", - "model", - "max_tokens", - "prompt_system", - "prompt_user", - "top_p", - "frequence_penalty", - "presence_penalty", - "inputs", - ] - - return prevState.map((param: Parameter) => { - if (parameterNames.includes(param.name)) { - const newValue = (revision?.config.parameters as Record)[ - param.name - ] - if (newValue !== undefined) { - param.default = newValue - } + + const fetchData = async () => { + const revision = await promptRevision(variant.variantId, parseInt(revisionNum)) + if (!revision) return + + setPromptOptParams((prevState: Parameter[] | null) => { + if (!prevState) { + return prevState } - return param + + const parameterNames = [ + "temperature", + "model", + "max_tokens", + "prompt_system", + "prompt_user", + "top_p", + "frequence_penalty", + "presence_penalty", + "inputs", + ] + + return prevState.map((param: Parameter) => { + if (parameterNames.includes(param.name)) { + const newValue = (revision?.config.parameters as Record)[ + param.name + ] + if (newValue !== undefined) { + param.default = newValue + } + } + return param + }) }) - }) + } + + fetchData() }, [revisionNum]) + const abortControllersRef = useRef([]) const [isRunningAll, setIsRunningAll] = useState(false) @@ -684,14 +673,6 @@ const App: React.FC = ({ have a valid API key for the model you are using.

- ) } diff --git a/agenta-web/src/lib/hooks/useVariant.ts b/agenta-web/src/lib/hooks/useVariant.ts index 1262c656ba..62dd5d0c7b 100644 --- a/agenta-web/src/lib/hooks/useVariant.ts +++ b/agenta-web/src/lib/hooks/useVariant.ts @@ -1,6 +1,6 @@ import {useState, useEffect} from "react" import {promptVersioning, saveNewVariant, updateVariantParams} from "@/lib/services/api" -import {Variant, Parameter, IPromptVersioning} from "@/lib/Types" +import {Variant, Parameter, IPromptRevisions} from "@/lib/Types" import {getAllVariantParameters, updateInputParams} from "@/lib/helpers/variantHelper" import {isDemo} from "../helpers/utils" import {PERMISSION_ERR_MSG} from "../helpers/axiosConfig" @@ -13,7 +13,6 @@ import {PERMISSION_ERR_MSG} from "../helpers/axiosConfig" * @returns */ export function useVariant(appId: string, variant: Variant) { - const [promptRevisions, setPromptRevisions] = useState() const [historyStatus, setHistoryStatus] = useState({loading: false, error: false}) const [promptOptParams, setPromptOptParams] = useState(null) const [inputParams, setInputParams] = useState(null) @@ -34,10 +33,6 @@ export function useVariant(appId: string, variant: Variant) { variant, ) setPromptOptParams(parameters) - if (variant.variantId && isDemo()) { - const revisions = await promptVersioning(variant.variantId) - setPromptRevisions(revisions) - } setInputParams(inputs) setURIPath(URIPath) setIsChatVariant(isChatVariant) @@ -115,10 +110,8 @@ export function useVariant(appId: string, variant: Variant) { saveOptParams, refetch: fetchParameters, isChatVariant, - promptRevisions, historyStatus, setPromptOptParams, - setPromptRevisions, setHistoryStatus, } }