add-variable-popup.tsx 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. import { memo } from 'react'
  2. import { useTranslation } from 'react-i18next'
  3. import VarReferenceVars from '@/app/components/workflow/nodes/_base/components/variable/var-reference-vars'
  4. import type {
  5. NodeOutPutVar,
  6. ValueSelector,
  7. Var,
  8. } from '@/app/components/workflow/types'
  9. export type AddVariablePopupProps = {
  10. availableVars: NodeOutPutVar[]
  11. onSelect: (value: ValueSelector, item: Var) => void
  12. }
  13. export const AddVariablePopup = ({
  14. availableVars,
  15. onSelect,
  16. }: AddVariablePopupProps) => {
  17. const { t } = useTranslation()
  18. return (
  19. <div className='w-[240px] bg-white border-[0.5px] border-gray-200 rounded-lg shadow-lg'>
  20. <div className='flex items-center px-4 h-[34px] text-[13px] font-semibold text-gray-700 border-b-[0.5px] border-b-gray-200'>
  21. {t('workflow.nodes.variableAssigner.setAssignVariable')}
  22. </div>
  23. <div className='p-1'>
  24. <VarReferenceVars
  25. hideSearch
  26. vars={availableVars}
  27. onChange={onSelect}
  28. />
  29. </div>
  30. </div>
  31. )
  32. }
  33. export default memo(AddVariablePopup)