forked from github/plane
75 lines
1.7 KiB
TypeScript
75 lines
1.7 KiB
TypeScript
// icons
|
|
import { TStateGroups } from "@plane/types";
|
|
import {
|
|
StateGroupBacklogIcon,
|
|
StateGroupCancelledIcon,
|
|
StateGroupCompletedIcon,
|
|
StateGroupStartedIcon,
|
|
StateGroupUnstartedIcon,
|
|
} from "@/components/icons";
|
|
// types
|
|
import { STATE_GROUPS } from "@/constants/state";
|
|
// constants
|
|
|
|
type Props = {
|
|
className?: string;
|
|
color?: string;
|
|
height?: string;
|
|
stateGroup: TStateGroups;
|
|
width?: string;
|
|
};
|
|
|
|
export const StateGroupIcon: React.FC<Props> = ({
|
|
className = "",
|
|
color,
|
|
height = "12px",
|
|
width = "12px",
|
|
stateGroup,
|
|
}) => {
|
|
if (stateGroup === "backlog")
|
|
return (
|
|
<StateGroupBacklogIcon
|
|
width={width}
|
|
height={height}
|
|
color={color ?? STATE_GROUPS["backlog"].color}
|
|
className={`flex-shrink-0 ${className}`}
|
|
/>
|
|
);
|
|
else if (stateGroup === "cancelled")
|
|
return (
|
|
<StateGroupCancelledIcon
|
|
width={width}
|
|
height={height}
|
|
color={color ?? STATE_GROUPS["cancelled"].color}
|
|
className={`flex-shrink-0 ${className}`}
|
|
/>
|
|
);
|
|
else if (stateGroup === "completed")
|
|
return (
|
|
<StateGroupCompletedIcon
|
|
width={width}
|
|
height={height}
|
|
color={color ?? STATE_GROUPS["completed"].color}
|
|
className={`flex-shrink-0 ${className}`}
|
|
/>
|
|
);
|
|
else if (stateGroup === "started")
|
|
return (
|
|
<StateGroupStartedIcon
|
|
width={width}
|
|
height={height}
|
|
color={color ?? STATE_GROUPS["started"].color}
|
|
className={`flex-shrink-0 ${className}`}
|
|
/>
|
|
);
|
|
else
|
|
return (
|
|
<StateGroupUnstartedIcon
|
|
width={width}
|
|
height={height}
|
|
color={color ?? STATE_GROUPS["unstarted"].color}
|
|
className={`flex-shrink-0 ${className}`}
|
|
/>
|
|
);
|
|
};
|