File size: 1,154 Bytes
4304c6d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import type { FC } from 'react'
import React from 'react'
import RemoveButton from '../_base/components/remove-button'
import type { CodeDependency } from './types'
import DependencyPicker from './dependency-picker'

type Props = {
  available_dependencies: CodeDependency[]
  dependencies: CodeDependency[]
  handleRemove: (index: number) => void
  handleChange: (index: number, dependency: CodeDependency) => void
}

const Dependencies: FC<Props> = ({

  available_dependencies, dependencies, handleRemove, handleChange,

}) => {
  return (
    <div className='space-y-2'>

      {dependencies.map((dependency, index) => (

        <div className='flex items-center space-x-1' key={index}>

          <DependencyPicker

            value={dependency}

            available_dependencies={available_dependencies}

            onChange={dependency => handleChange(index, dependency)}

          />

          <RemoveButton

            className='!p-2 !bg-gray-100 hover:!bg-gray-200'

            onClick={() => handleRemove(index)}

          />

        </div>

      ))}

    </div>
  )
}

export default React.memo(Dependencies)