thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

[WEB-540] fix: hide sub_issue, link, attachment property from list/ kanban view if their count is 0. (#3768)

Browse Source 
* [WEB-540] fix: hide `sub_issue`, `link`, `attachment` property from list/ kanban view if their count is 0.

* chore: use `cn` helper function instead of string interpolation.
This commit is contained in:
Prateek Shourya 2024-02-23 19:03:45 +05:30 committed by GitHub
parent 1f7565ce52
commit 849d3a66c1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 20 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web/components/issues/issue-layouts/properties/all-properties.tsx
View File

@ -21,6 +21,7 @@ import {
} from "components/dropdowns"; } from "components/dropdowns";
// helpers // helpers
import { renderFormattedPayloadDate } from "helpers/date-time.helper"; import { renderFormattedPayloadDate } from "helpers/date-time.helper";
import { cn } from "helpers/common.helper";
// types // types
import { TIssue, IIssueDisplayProperties, TIssuePriorities } from "@plane/types"; import { TIssue, IIssueDisplayProperties, TIssuePriorities } from "@plane/types";
// constants // constants
@ -378,12 +379,17 @@ export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
<WithDisplayPropertiesHOC <WithDisplayPropertiesHOC
displayProperties={displayProperties} displayProperties={displayProperties}
displayPropertyKey="sub_issue_count" displayPropertyKey="sub_issue_count"
shouldRenderProperty={(properties) => !!properties.sub_issue_count} shouldRenderProperty={(properties) => !!properties.sub_issue_count && !!issue.sub_issues_count}
> >
<Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
<div <div
onClick={redirectToIssueDetail} onClick={issue.sub_issues_count ? redirectToIssueDetail : () => {}}
className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 hover:bg-custom-background-80 px-2.5 py-1 cursor-pointer" className={cn(
"flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1",
{
"hover:bg-custom-background-80 cursor-pointer": issue.sub_issues_count,
}
)}
> >
<Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} /> <Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
<div className="text-xs">{issue.sub_issues_count}</div> <div className="text-xs">{issue.sub_issues_count}</div>
@ -395,7 +401,7 @@ export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
<WithDisplayPropertiesHOC <WithDisplayPropertiesHOC
displayProperties={displayProperties} displayProperties={displayProperties}
displayPropertyKey="attachment_count" displayPropertyKey="attachment_count"
shouldRenderProperty={(properties) => !!properties.attachment_count} shouldRenderProperty={(properties) => !!properties.attachment_count && !!issue.attachment_count}
> >
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1"> <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
@ -409,7 +415,7 @@ export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
<WithDisplayPropertiesHOC <WithDisplayPropertiesHOC
displayProperties={displayProperties} displayProperties={displayProperties}
displayPropertyKey="link" displayPropertyKey="link"
shouldRenderProperty={(properties) => !!properties.link} shouldRenderProperty={(properties) => !!properties.link && !!issue.link_count}
> >
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1"> <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">

11
web/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx
View File

@ -5,6 +5,8 @@ import { useRouter } from "next/router";
import { useApplication } from "hooks/store"; import { useApplication } from "hooks/store";
// types // types
import { TIssue } from "@plane/types"; import { TIssue } from "@plane/types";
// helpers
import { cn } from "helpers/common.helper";
type Props = { type Props = {
issue: TIssue; issue: TIssue;
@ -30,8 +32,13 @@ export const SpreadsheetSubIssueColumn: React.FC<Props> = observer((props: Props
return ( return (
<div <div
onClick={redirectToIssueDetail} onClick={issue?.sub_issues_count ? redirectToIssueDetail : () => {}}
className="flex h-11 w-full items-center px-2.5 py-1 text-xs border-b-[0.5px] border-custom-border-200 hover:bg-custom-background-80 cursor-pointer" className={cn(
"flex h-11 w-full items-center px-2.5 py-1 text-xs border-b-[0.5px] border-custom-border-200 hover:bg-custom-background-80",
{
"cursor-pointer": issue?.sub_issues_count,
}
)}
> >
{issue?.sub_issues_count} {issue?.sub_issues_count === 1 ? "sub-issue" : "sub-issues"} {issue?.sub_issues_count} {issue?.sub_issues_count === 1 ? "sub-issue" : "sub-issues"}
</div> </div>