import { useState } from "react"; import { useRouter } from "next/router"; // react-beautiful-dnd import StrictModeDroppable from "components/dnd/StrictModeDroppable"; import { Draggable } from "react-beautiful-dnd"; // components import { BoardHeader, SingleBoardIssue } from "components/core"; // ui import { CustomMenu } from "components/ui"; // icons import { PlusIcon } from "@heroicons/react/24/outline"; // helpers import { replaceUnderscoreIfSnakeCase } from "helpers/string.helper"; // types import { ICurrentUserResponse, IIssue, IIssueViewProps, IState, UserAuth } from "types"; type Props = { addIssueToGroup: () => void; currentState?: IState | null; disableUserActions: boolean; dragDisabled: boolean; groupTitle: string; handleIssueAction: (issue: IIssue, action: "copy" | "delete" | "edit") => void; handleTrashBox: (isDragging: boolean) => void; openIssuesListModal?: (() => void) | null; removeIssue: ((bridgeId: string, issueId: string) => void) | null; user: ICurrentUserResponse | undefined; userAuth: UserAuth; viewProps: IIssueViewProps; }; export const SingleBoard: React.FC = ({ addIssueToGroup, currentState, groupTitle, disableUserActions, dragDisabled, handleIssueAction, handleTrashBox, openIssuesListModal, removeIssue, user, userAuth, viewProps, }) => { // collapse/expand const [isCollapsed, setIsCollapsed] = useState(true); const { groupedIssues, groupByProperty: selectedGroup, orderBy, properties } = viewProps; const router = useRouter(); const { cycleId, moduleId } = router.query; const isSubscribedIssues = router.pathname.includes("subscribed"); const type = cycleId ? "cycle" : moduleId ? "module" : "issue"; // Check if it has at least 4 tickets since it is enough to accommodate the Calendar height const issuesLength = groupedIssues?.[groupTitle].length; const hasMinimumNumberOfCards = issuesLength ? issuesLength >= 4 : false; const isNotAllowed = userAuth.isGuest || userAuth.isViewer || disableUserActions; return (
{isCollapsed && ( {(provided, snapshot) => (
{orderBy !== "sort_order" && ( <>
This board is ordered by{" "} {replaceUnderscoreIfSnakeCase( orderBy ? (orderBy[0] === "-" ? orderBy.slice(1) : orderBy) : "created_at" )}
)}
{groupedIssues?.[groupTitle].map((issue, index) => ( {(provided, snapshot) => ( handleIssueAction(issue, "edit")} makeIssueCopy={() => handleIssueAction(issue, "copy")} handleDeleteIssue={() => handleIssueAction(issue, "delete")} handleTrashBox={handleTrashBox} removeIssue={() => { if (removeIssue && issue.bridge_id) removeIssue(issue.bridge_id, issue.id); }} disableUserActions={disableUserActions} user={user} userAuth={userAuth} viewProps={viewProps} /> )} ))} {provided.placeholder}
{selectedGroup !== "created_by" && (
{type === "issue" ? !isSubscribedIssues && ( ) : !disableUserActions && ( Add Issue } position="left" noBorder > Create new {openIssuesListModal && ( Add an existing issue )} )}
)}
)} )}
); };