I am new to react, so I tried to learn my implementing react
when I click open panel I need to search from from text box and after the results display.
I need to drag the results into table and column.
but I am not able to drag the results of the chips
can you let me know whow to fix it.
Providing code and sandbox below
{panelOpen && (
<div className="vertical-panel">
<button onClick={() => setPanelOpen(false)}>close</button>
{columns.column3.items.map((item, index) => (
<Draggable key={item} draggableId={item} index={index}>
{(provided) => (
<div
{...provided.draggableProps}
{...provided.dragHandleProps}
ref={provided.innerRef}
>
<p>{item}</p>
<MuiChipsInput
value={chips}
onChange={handleChange}
/>
<button onClick={handleSearch}>Search</button>
{filteredData.length > 0 ? (
filteredData.map((item) => (
<div key={item.id}>{item.lion}</div>
))
) : (
<div>No results found.</div>
)}
</div>
)}
{/* <div>
<MuiChipsInput
value={chips}
onChange={handleChange}
/>
<button onClick={handleSearch}>Search</button>
{filteredData.length > 0 ? (
filteredData.map((item) => (
<div key={item.id}>
{item.lion}
</div>
))
) : (
<div>No results found.</div>
)}
</div> */}
</Draggable>
))}
</div>
)}