plane/web/components/issues/sidebar-select/estimate.tsx
sriram veeraghanta 5b0066140f chore: format all files in monorepo (#3054)
* chore: format all files in the project

* fix: removing @types/react from dependencies

* fix: adding prettier and eslint config

* chore: format files

* fix: upgrading turbo version

* chore: ignoring warnings and adding todos

* fix: updated the type of bubble menu item in the document editor

* chore: format files

---------

Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
2023-12-10 15:50:45 +05:30

60 lines
1.6 KiB
TypeScript

import React from "react";
// hooks
import useEstimateOption from "hooks/use-estimate-option";
// ui
import { CustomSelect } from "@plane/ui";
// icons
import { Triangle } from "lucide-react";
type Props = {
value: number | null;
onChange: (val: number | null) => void;
disabled?: boolean;
};
export const SidebarEstimateSelect: React.FC<Props> = ({ value, onChange, disabled = false }) => {
const { estimatePoints } = useEstimateOption();
const currentEstimate = estimatePoints?.find((e) => e.key === value)?.value;
return (
<CustomSelect
value={value}
customButton={
<div className="flex items-center gap-1.5 rounded bg-custom-background-80 px-2.5 py-0.5 text-xs">
{currentEstimate ? (
<>
<Triangle className={`h-3 w-3 ${value !== null ? "text-custom-text-100" : "text-custom-text-200"}`} />
{currentEstimate}
</>
) : (
"No Estimate"
)}
</div>
}
onChange={onChange}
disabled={disabled}
>
<CustomSelect.Option value={null}>
<>
<span>
<Triangle className="h-3.5 w-3" />
</span>
None
</>
</CustomSelect.Option>
{estimatePoints &&
estimatePoints.map((point) => (
<CustomSelect.Option key={point.key} value={point.key}>
<>
<span>
<Triangle className="h-3.5 w-3.5" />
</span>
{point.value}
</>
</CustomSelect.Option>
))}
</CustomSelect>
);
};