| | |
| | | import ConfigContext from '@/context/debug-configuration' |
| | | import { useModalContext } from '@/context/modal-context' |
| | | import { useToastContext } from '@/app/components/base/toast' |
| | | import s from '@/app/components/app/configuration/config-prompt/style.module.css' |
| | | import { noop } from 'lodash-es' |
| | | |
| | | import s from '@/app/components/app/configuration/config-prompt/style.module.css' |
| | | type Props = { |
| | | className?: string |
| | | type: 'first-prompt' | 'next-iteration' |
| | |
| | | return ( |
| | | <div className={cn(className, s.gradientBorder, 'relative')}> |
| | | <div className='rounded-xl bg-white'> |
| | | <div className={cn(s.boxHeader, 'flex h-11 items-center justify-between rounded-tl-xl rounded-tr-xl bg-white pb-1 pl-4 pr-3 pt-2 hover:shadow-xs')}> |
| | | <div className={cn(s.boxHeader, 'flex justify-between items-center h-11 pt-2 pr-3 pb-1 pl-4 rounded-tl-xl rounded-tr-xl bg-white hover:shadow-xs')}> |
| | | <div className='text-sm font-semibold uppercase text-indigo-800'>{t(`appDebug.agent.${isFirstPrompt ? 'firstPrompt' : 'nextIteration'}`)}</div> |
| | | <div className={cn(s.optionWrap, 'items-center space-x-1')}> |
| | | {!isCopied |
| | | ? ( |
| | | <Clipboard className='h-6 w-6 cursor-pointer p-1 text-gray-500' onClick={() => { |
| | | <Clipboard className='h-6 w-6 p-1 text-gray-500 cursor-pointer' onClick={() => { |
| | | copy(value) |
| | | setIsCopied(true) |
| | | }} /> |
| | |
| | | )} |
| | | </div> |
| | | </div> |
| | | <div className={cn(editorHeight, ' min-h-[102px] overflow-y-auto px-4 text-sm text-gray-700')}> |
| | | <div className={cn(editorHeight, ' px-4 min-h-[102px] overflow-y-auto text-sm text-gray-700')}> |
| | | <PromptEditor |
| | | className={editorHeight} |
| | | value={value} |
| | |
| | | user: '', |
| | | assistant: '', |
| | | }, |
| | | onEditRole: noop, |
| | | onEditRole: () => { }, |
| | | }} |
| | | queryBlock={{ |
| | | show: false, |
| | | selectable: false, |
| | | }} |
| | | onChange={onChange} |
| | | onBlur={noop} |
| | | onBlur={() => { }} |
| | | /> |
| | | </div> |
| | | <div className='flex pb-2 pl-4'> |
| | | <div className="h-[18px] rounded-md bg-gray-100 px-1 text-xs leading-[18px] text-gray-500">{value.length}</div> |
| | | <div className='pl-4 pb-2 flex'> |
| | | <div className="h-[18px] leading-[18px] px-1 rounded-md bg-gray-100 text-xs text-gray-500">{value.length}</div> |
| | | </div> |
| | | </div> |
| | | </div> |