added a new atom to pass in the generated prompt from the existing an…

…d create new prompt flows

opentrons-ai-client/src/molecules/InputPrompt/index.tsx

@@ -15,7 +15,12 @@ import {
   TYPOGRAPHY,
 } from '@opentrons/components'
 import { SendButton } from '../../atoms/SendButton'
-import { chatDataAtom, chatHistoryAtom, tokenAtom } from '../../resources/atoms'
+import {
+  chatDataAtom,
+  chatHistoryAtom,
+  chatPromptAtom,
+  tokenAtom,
+} from '../../resources/atoms'
 import { useApiCall } from '../../resources/hooks'
 import { calcTextAreaHeight } from '../../resources/utils/utils'
 import {
@@ -29,14 +34,19 @@ import type { ChatData } from '../../resources/types'
 
 export function InputPrompt(): JSX.Element {
   const { t } = useTranslation('protocol_generator')
-  const { register, watch, reset } = useFormContext()
+  const { register, watch, reset, setValue } = useFormContext()
+  const [chatPromptAtomValue] = useAtom(chatPromptAtom)
   const [, setChatData] = useAtom(chatDataAtom)
   const [chatHistory, setChatHistory] = useAtom(chatHistoryAtom)
   const [token] = useAtom(tokenAtom)
   const [submitted, setSubmitted] = useState<boolean>(false)
   const userPrompt = watch('userPrompt') ?? ''
   const { data, isLoading, callApi } = useApiCall()
 
+  useEffect(() => {
+    setValue('userPrompt', chatPromptAtomValue)
+  }, [chatPromptAtomValue, setValue])
+
   const handleClick = async (): Promise<void> => {
     const userInput: ChatData = {
       role: 'user',

opentrons-ai-client/src/organisms/UpdateProtocol/index.tsx

@@ -1,4 +1,4 @@
-import styled, { css } from 'styled-components'
+import styled from 'styled-components'
 import {
   COLORS,
   DIRECTION_COLUMN,
@@ -19,9 +19,8 @@ import type { ChangeEvent } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import { FileUpload } from '../../molecules/FileUpload'
 import { useNavigate } from 'react-router-dom'
-import { chatDataAtom, headerWithMeterAtom } from '../../resources/atoms'
+import { chatPromptAtom, headerWithMeterAtom } from '../../resources/atoms'
 import { CSSTransition } from 'react-transition-group'
-import type { ChatData } from '../../resources/types'
 import { useAtom } from 'jotai'
 
 const updateOptions: DropdownOption[] = [
@@ -92,7 +91,7 @@ export function UpdateProtocol(): JSX.Element {
   const { t }: { t: (key: string) => string } = useTranslation(
     'protocol_generator'
   )
-  const [, setChatData] = useAtom(chatDataAtom)
+  const [, setChatPrompt] = useAtom(chatPromptAtom)
   const [headerState, setHeaderWithMeterAtom] = useAtom(headerWithMeterAtom)
   const [updateType, setUpdateType] = useState<DropdownOption | null>(null)
   const [detailsValue, setDetailsValue] = useState<string>('')
@@ -156,8 +155,7 @@ export function UpdateProtocol(): JSX.Element {
   }
 
   function processDataAndNavigateToChat(): void {
-    const userPrompt = `
-    Modify the following Python code using the Opentrons Python Protocol API v2. \nEnsure that the new labware and pipettes are compatible with the Flex robot. \nEnsure that you perform the correct Type of Update use the Details of Changes.
+    const userPrompt = `Modify the following Python code using the Opentrons Python Protocol API v2. Ensure that the new labware and pipettes are compatible with the Flex robot. Ensure that you perform the correct Type of Update use the Details of Changes.
 
     Original Python Code:
     \`\`\`python
@@ -172,12 +170,7 @@ export function UpdateProtocol(): JSX.Element {
   `
     console.log(userPrompt)
 
-    const userInput: ChatData = {
-      role: 'user',
-      reply: userPrompt,
-    }
-
-    setChatData(chatData => [...chatData, userInput])
+    setChatPrompt(chatData => userPrompt)
     navigate('/chat')
   }
 

opentrons-ai-client/src/resources/atoms.ts

@@ -11,6 +11,9 @@ import type {
 /** ChatDataAtom is for chat data (user prompt and response from OpenAI API) */
 export const chatDataAtom = atom<ChatData[]>([])
 
+/** ChatPromptAtom is for the prefilled userprompt when landing on the chat page */
+export const chatPromptAtom = atom<string>('')
+
 export const chatHistoryAtom = atom<Chat[]>([])
 
 export const tokenAtom = atom<string | null>(null)