import React, { useState } from "react";
import IconText from "../IconText";
import ButtonDivTag from "../ButtonDivTag";
import TitleSubtitle from "../TitleSubtitle";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
const CardDesign2 = ({ buttons }) => {
const [dokmeha, updateDokmeha] = useState(buttons);
function handleOnDragEnd(result) {
if (!result.destination) return;
const items = Array.from(dokmeha);
const [reorderedItem] = items.splice(result.source.index, 1);
items.splice(result.destination.index, 0, reorderedItem);
updateDokmeha(items);
}
return (
{(provided) => (
{dokmeha.map((btn, index) => (
{(provided) => (
)}
))}
{provided.placeholder}
)}
);
};
export default CardDesign2;
CardDesign2.defaultProps = {
buttons: [
{
id: 1,
name: "پنجره",
className: "bg-[#FFF7BF]",
},
{
id: 2,
name: "کمک اولیه",
className: "bg-[#DBFDFF]",
},
{
id: 3,
name: "درب خروجی",
className: "bg-[#828282]",
},
{
id: 4,
name: "سیستم سرمایش",
className: "bg-[#F6FFEB]",
},
{
id: 5,
name: "آب سردکن",
className: "bg-[#F0FFB4]",
},
{
id: 6,
name: "سرویس بهداشتی",
className: "bg-[#FFDD8E]",
},
{
id: 7,
name: "حمام",
className: "bg-[#EEEFFF]",
},
{
id: 8,
name: "تخت",
className: "bg-[#FFF5EE]",
},
],
};