github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: render the estimate select if estimate is enabled for the project (#2663)

Browse Source
This commit is contained in:
Aaryan Khandelwal 2023-11-06 20:43:10 +05:30 committed by GitHub
parent 6eb0bf4785
commit a6dea3af23
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 60 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/components/issues/issue-layouts/list/block.tsx
View File

@ -4,20 +4,20 @@ import { IssuePeekOverview } from "components/issues/issue-peek-overview";
// ui
import { Tooltip } from "@plane/ui";
// types
import { IIssue } from "types";
import { IIssue, IIssueDisplayProperties } from "types";
interface IssueBlockProps {
columnId: string;
issue: IIssue;
handleIssues: (group_by: string | null, issue: IIssue, action: "update" | "delete") => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
display_properties: any;
displayProperties: IIssueDisplayProperties;
isReadonly?: boolean;
showEmptyGroup?: boolean;
}
export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
const { columnId, issue, handleIssues, quickActions, display_properties, showEmptyGroup, isReadonly } = props;
const { columnId, issue, handleIssues, quickActions, displayProperties, showEmptyGroup, isReadonly } = props;
const updateIssue = (group_by: string | null, issueToUpdate: IIssue) => {
handleIssues(group_by, issueToUpdate, "update");
@ -26,7 +26,7 @@ export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
return (
<>
<div className="text-sm p-3 relative bg-custom-background-100 flex items-center gap-3">
{display_properties && display_properties?.key && (
{displayProperties && displayProperties?.key && (
<div className="flex-shrink-0 text-xs text-custom-text-300 font-medium">
{issue?.project_detail?.identifier}-{issue.sequence_id}
</div>
@ -54,7 +54,7 @@ export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
issue={issue}
isReadonly={isReadonly}
handleIssues={updateIssue}
display_properties={display_properties}
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
/>
{quickActions(!columnId && columnId === "null" ? null : columnId, issue)}

8
web/components/issues/issue-layouts/list/blocks-list.tsx
View File

@ -2,7 +2,7 @@ import { FC } from "react";
// components
import { IssueBlock } from "components/issues";
// types
import { IIssue } from "types";
import { IIssue, IIssueDisplayProperties } from "types";
interface Props {
columnId: string;
@ -10,12 +10,12 @@ interface Props {
isReadonly?: boolean;
handleIssues: (group_by: string | null, issue: IIssue, action: "update" | "delete") => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
display_properties: any;
displayProperties: IIssueDisplayProperties;
showEmptyGroup?: boolean;
}
export const IssueBlocksList: FC<Props> = (props) => {
const { columnId, issues, handleIssues, quickActions, display_properties, showEmptyGroup, isReadonly } = props;
const { columnId, issues, handleIssues, quickActions, displayProperties, showEmptyGroup, isReadonly } = props;
return (
<div className="w-full h-full relative divide-y-[0.5px] divide-custom-border-200">
@ -28,7 +28,7 @@ export const IssueBlocksList: FC<Props> = (props) => {
handleIssues={handleIssues}
quickActions={quickActions}
isReadonly={isReadonly}
display_properties={display_properties}
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
/>
))

28
web/components/issues/issue-layouts/list/default.tsx
View File

@ -4,7 +4,7 @@ import { observer } from "mobx-react-lite";
import { ListGroupByHeaderRoot } from "./headers/group-by-root";
import { IssueBlocksList, ListInlineCreateIssueForm } from "components/issues";
// types
import { IEstimatePoint, IIssue, IIssueLabels, IProject, IState, IUserLite } from "types";
import { IEstimatePoint, IIssue, IIssueDisplayProperties, IIssueLabels, IProject, IState, IUserLite } from "types";
// constants
import { getValueFromObject } from "constants/issue";
@ -16,7 +16,7 @@ export interface IGroupByList {
listKey: string;
handleIssues: (group_by: string | null, issue: IIssue, action: "update" | "delete") => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
display_properties: any;
displayProperties: IIssueDisplayProperties;
is_list?: boolean;
enableQuickIssueCreate?: boolean;
showEmptyGroup?: boolean;
@ -31,7 +31,7 @@ const GroupByList: React.FC<IGroupByList> = observer((props) => {
listKey,
handleIssues,
quickActions,
display_properties,
displayProperties,
is_list = false,
enableQuickIssueCreate,
showEmptyGroup,
@ -59,7 +59,7 @@ const GroupByList: React.FC<IGroupByList> = observer((props) => {
issues={is_list ? issues : issues[getValueFromObject(_list, listKey) as string]}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
/>
@ -86,7 +86,7 @@ export interface IList {
handleDragDrop?: (result: any) => void | undefined;
handleIssues: (group_by: string | null, issue: IIssue, action: "update" | "delete") => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
display_properties: any;
displayProperties: IIssueDisplayProperties;
states: IState[] | null;
labels: IIssueLabels[] | null;
members: IUserLite[] | null;
@ -105,7 +105,7 @@ export const List: React.FC<IList> = observer((props) => {
isReadonly,
handleIssues,
quickActions,
display_properties,
displayProperties,
states,
labels,
members,
@ -126,7 +126,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
is_list
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
@ -142,7 +142,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -157,7 +157,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -172,7 +172,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`key`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -187,7 +187,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`key`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -202,7 +202,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -217,7 +217,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}
@ -232,7 +232,7 @@ export const List: React.FC<IList> = observer((props) => {
listKey={`id`}
handleIssues={handleIssues}
quickActions={quickActions}
display_properties={display_properties}
displayProperties={displayProperties}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadonly={isReadonly}
showEmptyGroup={showEmptyGroup}

26
web/components/issues/issue-layouts/list/properties.tsx
View File

@ -11,19 +11,19 @@ import { IssuePropertyDate } from "../properties/date";
// ui
import { Tooltip } from "@plane/ui";
// types
import { IIssue, IState, TIssuePriorities } from "types";
import { IIssue, IIssueDisplayProperties, IState, TIssuePriorities } from "types";
export interface IKanBanProperties {
columnId: string;
issue: IIssue;
handleIssues: (group_by: string | null, issue: IIssue) => void;
display_properties: any;
displayProperties: IIssueDisplayProperties;
isReadonly?: boolean;
showEmptyGroup?: boolean;
}
export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
const { columnId: group_id, issue, handleIssues, display_properties, isReadonly, showEmptyGroup } = props;
const { columnId: group_id, issue, handleIssues, displayProperties, isReadonly, showEmptyGroup } = props;
const handleState = (state: IState) => {
handleIssues(!group_id && group_id === "null" ? null : group_id, { ...issue, state: state.id });
@ -57,7 +57,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
<div className="relative flex gap-2 overflow-x-auto whitespace-nowrap">
{/* basic properties */}
{/* state */}
{display_properties && display_properties?.state && (
{displayProperties && displayProperties?.state && (
<IssuePropertyState
projectId={issue?.project_detail?.id || null}
value={issue?.state_detail || null}
@ -68,7 +68,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* priority */}
{display_properties && display_properties?.priority && (
{displayProperties && displayProperties?.priority && (
<IssuePropertyPriority
value={issue?.priority || null}
onChange={handlePriority}
@ -78,7 +78,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* label */}
{display_properties && display_properties?.labels && (showEmptyGroup || issue?.labels.length > 0) && (
{displayProperties && displayProperties?.labels && (showEmptyGroup || issue?.labels.length > 0) && (
<IssuePropertyLabels
projectId={issue?.project_detail?.id || null}
value={issue?.labels || null}
@ -89,7 +89,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* assignee */}
{display_properties && display_properties?.assignee && (showEmptyGroup || issue?.assignees?.length > 0) && (
{displayProperties && displayProperties?.assignee && (showEmptyGroup || issue?.assignees?.length > 0) && (
<IssuePropertyAssignee
projectId={issue?.project_detail?.id || null}
value={issue?.assignees || null}
@ -101,7 +101,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* start date */}
{display_properties && display_properties?.start_date && (showEmptyGroup || issue?.start_date) && (
{displayProperties && displayProperties?.start_date && (showEmptyGroup || issue?.start_date) && (
<IssuePropertyDate
value={issue?.start_date || null}
onChange={(date: string) => handleStartDate(date)}
@ -111,7 +111,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* target/due date */}
{display_properties && display_properties?.due_date && (showEmptyGroup || issue?.target_date) && (
{displayProperties && displayProperties?.due_date && (showEmptyGroup || issue?.target_date) && (
<IssuePropertyDate
value={issue?.target_date || null}
onChange={(date: string) => handleTargetDate(date)}
@ -121,7 +121,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* estimates */}
{display_properties && display_properties?.estimate && (
{displayProperties && displayProperties?.estimate && (
<IssuePropertyEstimates
projectId={issue?.project_detail?.id || null}
value={issue?.estimate_point || null}
@ -133,7 +133,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
{/* extra render properties */}
{/* sub-issues */}
{display_properties && display_properties?.sub_issue_count && (
{displayProperties && displayProperties?.sub_issue_count && (
<Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex-shrink-0 border-[0.5px] border-custom-border-300 overflow-hidden rounded flex justify-center items-center gap-2 px-2.5 py-1 h-5">
<Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
@ -143,7 +143,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* attachments */}
{display_properties && display_properties?.attachment_count && (
{displayProperties && displayProperties?.attachment_count && (
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex-shrink-0 border-[0.5px] border-custom-border-300 overflow-hidden rounded flex justify-center items-center gap-2 px-2.5 py-1 h-5">
<Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
@ -153,7 +153,7 @@ export const KanBanProperties: FC<IKanBanProperties> = observer((props) => {
)}
{/* link */}
{display_properties && display_properties?.link && (
{displayProperties && displayProperties?.link && (
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex-shrink-0 border-[0.5px] border-custom-border-300 overflow-hidden rounded flex justify-center items-center gap-2 px-2.5 py-1 h-5">
<Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />

4
web/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
View File

@ -25,7 +25,7 @@ export const ArchivedIssueListLayout: FC = observer(() => {
// derived values
const issues = archivedIssueStore.getIssues;
const display_properties = archivedIssueFiltersStore?.userDisplayProperties || null;
const displayProperties = archivedIssueFiltersStore?.userDisplayProperties || null;
const group_by: string | null = archivedIssueFiltersStore?.userDisplayFilters?.group_by || null;
const handleIssues = (group_by: string | null, issue: IIssue, action: "delete" | "update") => {
@ -59,7 +59,7 @@ export const ArchivedIssueListLayout: FC = observer(() => {
quickActions={(group_by, issue) => (
<ArchivedIssueQuickActions issue={issue} handleDelete={async () => handleIssues(group_by, issue, "delete")} />
)}
display_properties={display_properties}
displayProperties={displayProperties}
states={states}
stateGroups={stateGroups}
priorities={priorities}

4
web/components/issues/issue-layouts/list/roots/cycle-root.tsx
View File

@ -31,7 +31,7 @@ export const CycleListLayout: React.FC = observer(() => {
const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null;
const display_properties = issueFilterStore?.userDisplayProperties || null;
const displayProperties = issueFilterStore?.userDisplayProperties || null;
const handleIssues = useCallback(
(group_by: string | null, issue: IIssue, action: "update" | "delete" | "remove") => {
@ -80,7 +80,7 @@ export const CycleListLayout: React.FC = observer(() => {
handleRemoveFromCycle={async () => handleIssues(group_by, issue, "remove")}
/>
)}
display_properties={display_properties}
displayProperties={displayProperties}
states={states}
stateGroups={stateGroups}
priorities={priorities}

4
web/components/issues/issue-layouts/list/roots/module-root.tsx
View File

@ -31,7 +31,7 @@ export const ModuleListLayout: React.FC = observer(() => {
const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null;
const display_properties = issueFilterStore?.userDisplayProperties || null;
const displayProperties = issueFilterStore?.userDisplayProperties || null;
const handleIssues = useCallback(
(group_by: string | null, issue: IIssue, action: "update" | "delete" | "remove") => {
@ -80,7 +80,7 @@ export const ModuleListLayout: React.FC = observer(() => {
handleRemoveFromModule={async () => handleIssues(group_by, issue, "remove")}
/>
)}
display_properties={display_properties}
displayProperties={displayProperties}
states={states}
stateGroups={stateGroups}
priorities={priorities}

4
web/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
View File

@ -29,7 +29,7 @@ export const ProfileIssuesListLayout: FC = observer(() => {
const group_by: string | null = profileIssueFiltersStore?.userDisplayFilters?.group_by || null;
const display_properties = profileIssueFiltersStore?.userDisplayProperties || null;
const displayProperties = profileIssueFiltersStore?.userDisplayProperties || null;
const handleIssues = useCallback(
(group_by: string | null, issue: IIssue, action: "update" | "delete") => {
@ -64,7 +64,7 @@ export const ProfileIssuesListLayout: FC = observer(() => {
handleUpdate={async (data) => handleIssues(group_by, data, "update")}
/>
)}
display_properties={display_properties}
displayProperties={displayProperties}
states={states}
stateGroups={stateGroups}
priorities={priorities}

4
web/components/issues/issue-layouts/list/roots/project-root.tsx
View File

@ -29,7 +29,7 @@ export const ListLayout: FC = observer(() => {
const userDisplayFilters = issueFilterStore?.userDisplayFilters || null;
const group_by: string | null = userDisplayFilters?.group_by || null;
const display_properties = issueFilterStore?.userDisplayProperties || null;
const displayProperties = issueFilterStore?.userDisplayProperties || null;
const handleIssues = useCallback(
(group_by: string | null, issue: IIssue, action: "update" | "delete") => {
@ -68,7 +68,7 @@ export const ListLayout: FC = observer(() => {
handleUpdate={async (data) => handleIssues(group_by, data, "update")}
/>
)}
display_properties={display_properties}
displayProperties={displayProperties}
states={states}
stateGroups={stateGroups}
priorities={priorities}

24
web/components/issues/issue-layouts/properties/estimates.tsx
View File

@ -1,16 +1,13 @@
import { Fragment, useState } from "react";
import { observer } from "mobx-react-lite";
// hooks
import { usePopper } from "react-popper";
import useEstimateOption from "hooks/use-estimate-option";
// ui
import { Check, ChevronDown, Search, Triangle } from "lucide-react";
import { observer } from "mobx-react-lite";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search, Triangle } from "lucide-react";
// ui
import { Tooltip } from "@plane/ui";
// types
import { Placement } from "@popperjs/core";
import { useMobxStore } from "lib/mobx/store-provider";
export interface IIssuePropertyEstimates {
view?: "profile" | "workspace" | "project";
@ -27,7 +24,6 @@ export interface IIssuePropertyEstimates {
export const IssuePropertyEstimates: React.FC<IIssuePropertyEstimates> = observer((props) => {
const {
view,
projectId,
value,
onChange,
@ -44,8 +40,6 @@ export const IssuePropertyEstimates: React.FC<IIssuePropertyEstimates> = observe
const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);
const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);
const { isEstimateActive, estimatePoints } = useEstimateOption();
const { styles, attributes } = usePopper(referenceElement, popperElement, {
placement: placement ?? "bottom-start",
modifiers: [
@ -58,6 +52,14 @@ export const IssuePropertyEstimates: React.FC<IIssuePropertyEstimates> = observe
],
});
const { project: projectStore } = useMobxStore();
const projectDetails = projectId ? projectStore.project_details[projectId] : null;
const isEstimateEnabled = projectDetails?.estimate !== null;
const estimates = projectId ? projectStore.estimates?.[projectId] : null;
const estimatePoints =
projectDetails && isEstimateEnabled ? estimates?.find((e) => e.id === projectDetails.estimate)?.points : null;
const options: { value: number | null; query: string; content: any }[] | undefined = (estimatePoints ?? []).map(
(estimate) => ({
value: estimate.key,
@ -94,6 +96,8 @@ export const IssuePropertyEstimates: React.FC<IIssuePropertyEstimates> = observe
</Tooltip>
);
if (!isEstimateEnabled) return null;
return (
<Combobox
as="div"