fix: state drop down refactor

This commit is contained in:
sriram veeraghanta 2025-02-25 15:39:29 +05:30
parent 9297448ec8
commit d08bce35a3
3 changed files with 9 additions and 10 deletions

View file

@ -2,20 +2,21 @@ import { observer } from "mobx-react";
import { Check } from "lucide-react"; import { Check } from "lucide-react";
import { Combobox } from "@headlessui/react"; import { Combobox } from "@headlessui/react";
type Props = { export type TStateOptionProps = {
projectId: string | null | undefined; projectId: string | null | undefined;
option: { option: {
value: string | undefined; value: string | undefined;
query: string; query: string;
content: JSX.Element; content: JSX.Element;
}; };
filterAvailableStateIds: boolean;
selectedValue: string | null | undefined; selectedValue: string | null | undefined;
className?: string; className?: string;
filterAvailableStateIds?: boolean;
isForWorkItemCreation?: boolean; isForWorkItemCreation?: boolean;
alwaysAllowStateChange?: boolean;
}; };
export const StateOption = observer((props: Props) => { export const StateOption = observer((props: TStateOptionProps) => {
const { option, className = "" } = props; const { option, className = "" } = props;
return ( return (

View file

@ -36,6 +36,7 @@ type Props = TDropdownProps & {
stateIds?: string[]; stateIds?: string[];
filterAvailableStateIds?: boolean; filterAvailableStateIds?: boolean;
isForWorkItemCreation?: boolean; isForWorkItemCreation?: boolean;
alwaysAllowStateChange?: boolean;
}; };
export const StateDropdown: React.FC<Props> = observer((props) => { export const StateDropdown: React.FC<Props> = observer((props) => {
@ -59,8 +60,6 @@ export const StateDropdown: React.FC<Props> = observer((props) => {
value, value,
renderByDefault = true, renderByDefault = true,
stateIds, stateIds,
filterAvailableStateIds = true,
isForWorkItemCreation = false,
} = props; } = props;
// states // states
const [query, setQuery] = useState(""); const [query, setQuery] = useState("");
@ -237,11 +236,9 @@ export const StateDropdown: React.FC<Props> = observer((props) => {
<StateOption <StateOption
key={option.value} key={option.value}
option={option} option={option}
projectId={projectId}
filterAvailableStateIds={filterAvailableStateIds}
selectedValue={value} selectedValue={value}
className="flex w-full cursor-pointer select-none items-center justify-between gap-2 truncate rounded px-1 py-1.5" className="flex w-full cursor-pointer select-none items-center justify-between gap-2 truncate rounded px-1 py-1.5"
isForWorkItemCreation={isForWorkItemCreation} {...props}
/> />
)) ))
) : ( ) : (

View file

@ -244,6 +244,7 @@ export const ListGroup = observer((props: Props) => {
const isDragAllowed = !!group_by && DRAG_ALLOWED_GROUPS.includes(group_by); const isDragAllowed = !!group_by && DRAG_ALLOWED_GROUPS.includes(group_by);
const canOverlayBeVisible = isWorkflowDropDisabled || orderBy !== "sort_order" || !!group.isDropDisabled; const canOverlayBeVisible = isWorkflowDropDisabled || orderBy !== "sort_order" || !!group.isDropDisabled;
const isDropDisabled = isWorkflowDropDisabled || !!group.isDropDisabled;
const isGroupByCreatedBy = group_by === "created_by"; const isGroupByCreatedBy = group_by === "created_by";
const shouldExpand = (!!groupIssueCount && isExpanded) || !group_by; const shouldExpand = (!!groupIssueCount && isExpanded) || !group_by;
@ -253,7 +254,7 @@ export const ListGroup = observer((props: Props) => {
ref={groupRef} ref={groupRef}
className={cn(`relative flex flex-shrink-0 flex-col border-[1px] border-transparent`, { className={cn(`relative flex flex-shrink-0 flex-col border-[1px] border-transparent`, {
"border-custom-primary-100": isDraggingOverColumn, "border-custom-primary-100": isDraggingOverColumn,
"border-custom-error-200": isDraggingOverColumn && !!group.isDropDisabled, "border-custom-error-200": isDraggingOverColumn && isDropDisabled,
})} })}
> >
<Row <Row
@ -283,7 +284,7 @@ export const ListGroup = observer((props: Props) => {
<GroupDragOverlay <GroupDragOverlay
dragColumnOrientation={dragColumnOrientation} dragColumnOrientation={dragColumnOrientation}
canOverlayBeVisible={canOverlayBeVisible} canOverlayBeVisible={canOverlayBeVisible}
isDropDisabled={isWorkflowDropDisabled || !!group.isDropDisabled} isDropDisabled={isDropDisabled}
workflowDisabledSource={workflowDisabledSource} workflowDisabledSource={workflowDisabledSource}
dropErrorMessage={group.dropErrorMessage} dropErrorMessage={group.dropErrorMessage}
orderBy={orderBy} orderBy={orderBy}