-
Notifications
You must be signed in to change notification settings - Fork 134
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[OPIK-347]: FE prompts list #546
Conversation
…o sasha/OPIK-347/prompts-list
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Overall looks great, nice work! left some minor comments
}: UsePromptCreateMutationParams) => { | ||
const { data } = await api.post(PROMPTS_REST_ENDPOINT, { | ||
...prompt, | ||
workspace_name: workspaceName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think this is needed, we're sending the comet-workspace
request header on each request so the BE already knows the workspace without any extra parameter
It's okay to have it in the query key of react-query
for invalidations since it's needed but no need to send it in the POST (probably copy/paste from old code where before the parameter was needed)
return useMutation({ | ||
mutationFn: async () => { | ||
const { data } = await api.post(`${PROMPTS_REST_ENDPOINT}/versions`, { | ||
...prompt, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just send the prompt
?
|
||
const PromptPage: React.FunctionComponent = () => { | ||
const [tab, setTab] = useQueryParam("tab", StringParam, { | ||
updateType: "replaceIn", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not sure if replaceIn
is the one here, probably the default pushIn
(basically removing this third parameter) is okay (so back button in the browser will work), maybe in setting the default to prompt
is okay to do setTab("prompt", "replaceIn")
@andriidudar what do you think?
const { id: promptId, ...restPrompt } = prompt; | ||
|
||
const { data } = await api.put(`${PROMPTS_REST_ENDPOINT}${promptId}`, { | ||
...restPrompt, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just send restPrompt
const { data } = await api.get(PROMPTS_REST_ENDPOINT, { | ||
signal, | ||
params: { | ||
workspace_name: workspaceName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No need of workspace_name
here, it's okay for the dependency but no need in the endpoint
const { data } = usePromptVersionsById( | ||
{ | ||
promptId: prompt?.id || "", | ||
page: 1, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
So we won't have any sort of pagination in this component to load more in this page, right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@ferc we have the same data in Commits tab
- there is a full flow of it with pagination
here we will show first 25 commits
// eslint-disable-next-line react-hooks/exhaustive-deps | ||
}, [name, description, template, promptCreateMutation.mutate]); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe we should start destructuring the mutation like const { mutate: createPrompt } = usePromptCreateMutation();
so we can use it as dependency here
<Button variant="outline" onClick={() => setOpenUseThisPrompt(true)}> | ||
<Info className="mr-2 size-4" /> | ||
Use this prompt | ||
</Button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's hide it until we have the snippets so we can merge without depending on the SDK
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sorry for the misunderstanding about the workspace name in the project, since it's not sent the header inside the query it could be confusing that we still need the dependency in the query, therefore sent in the useQuery
query key but not in the request body/parameters (automatically added in the header in a global state)
The rest looks great, nice work!
@@ -216,7 +216,6 @@ const SideBar: React.FunctionComponent<SideBarProps> = ({ | |||
|
|||
const { data: promptsData } = usePromptsList( | |||
{ | |||
workspaceName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sorry for the misunderstanding here but you need the workspaceName
as parameter, what you don't need is to send it in the request (it's automatically sent in the request header)
You have to pass it to the query because it should be part of the query key (otherwise on changing workspace name it'll display the cache from previous workspace)
@@ -72,7 +72,6 @@ const PromptsPage: React.FunctionComponent = () => { | |||
const [size, setSize] = useState(10); | |||
const { data, isPending } = usePromptsList( | |||
{ | |||
workspaceName, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same here
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also minor behavior improvement, when you have a prompt test 1
edit it to test 2
, save it and then you edit it again, you still see the test 1
in the textarea (in other parts in the UI is updated to test 2
but not there
Details
Issues
Resolves #
Testing
Documentation