46 lines
1.3 KiB
JavaScript
46 lines
1.3 KiB
JavaScript
import React, { useState } from "react";
|
|
import { useDispatch } from "react-redux";
|
|
|
|
import { moveProjectTask } from "@redux/projectsTrackerSlice";
|
|
|
|
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
|
|
|
import "./trackerSelectColumn.scss";
|
|
|
|
export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
|
|
const dispatch = useDispatch();
|
|
const [openSelect, setOpenSelect] = useState(false);
|
|
return (
|
|
<div
|
|
className="trackerSelectColumn"
|
|
onClick={() => setOpenSelect(!openSelect)}
|
|
>
|
|
<p>{currentColumn.title}</p>
|
|
<img className={openSelect ? "open" : ""} src={arrowDown} alt="arrow" />
|
|
{openSelect && (
|
|
<div className="trackerSelectColumn__dropDown">
|
|
{columns.map((column) => {
|
|
return (
|
|
<p
|
|
key={column.id}
|
|
onClick={() => {
|
|
dispatch(
|
|
moveProjectTask({
|
|
startWrapperIndex: { index: currentColumn.id, task },
|
|
columnId: column.id,
|
|
})
|
|
);
|
|
}}
|
|
>
|
|
{column.title}
|
|
</p>
|
|
);
|
|
})}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TrackerSelectColumn;
|