From f2e8add29d7651057d731309bfad352499f5451f Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com>
Date: Wed, 12 Apr 2023 15:33:30 +0530
Subject: [PATCH] feat: attachment and link display properties (#796)

* feat: attachment and link count added

* fix: build fix
---
 .../core/board-view/single-issue.tsx          | 23 ++++++++++++++++++-
 .../core/list-view/single-issue.tsx           | 21 +++++++++++++++++
 apps/app/hooks/use-issue-properties.tsx       |  4 ++++
 apps/app/hooks/use-my-issues-filter.tsx       |  2 ++
 apps/app/types/issues.d.ts                    |  4 ++++
 5 files changed, 53 insertions(+), 1 deletion(-)

diff --git a/apps/app/components/core/board-view/single-issue.tsx b/apps/app/components/core/board-view/single-issue.tsx
index 9158d6d1f..5ce33ca04 100644
--- a/apps/app/components/core/board-view/single-issue.tsx
+++ b/apps/app/components/core/board-view/single-issue.tsx
@@ -26,7 +26,7 @@ import {
   ViewStateSelect,
 } from "components/issues";
 // ui
-import { ContextMenu, CustomMenu } from "components/ui";
+import { ContextMenu, CustomMenu, Tooltip } from "components/ui";
 // icons
 import {
   ClipboardDocumentCheckIcon,
@@ -35,6 +35,7 @@ import {
   TrashIcon,
   XMarkIcon,
   ArrowTopRightOnSquareIcon,
+  PaperClipIcon,
 } from "@heroicons/react/24/outline";
 // helpers
 import { handleIssuesMutation } from "constants/issue";
@@ -354,6 +355,26 @@ export const SingleBoardIssue: React.FC<Props> = ({
                 selfPositioned
               />
             )}
+            {properties.link && (
+              <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+                <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
+                  <div className="flex items-center gap-1 text-gray-500">
+                    <LinkIcon className="h-3.5 w-3.5 text-gray-500" />
+                    {issue.link_count}
+                  </div>
+                </Tooltip>
+              </div>
+            )}
+            {properties.attachment_count && (
+              <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+                <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
+                  <div className="flex items-center gap-1 text-gray-500">
+                    <PaperClipIcon className="h-3.5 w-3.5 text-gray-500 -rotate-45" />
+                    {issue.attachment_count}
+                  </div>
+                </Tooltip>
+              </div>
+            )}
           </div>
         </div>
       </div>
diff --git a/apps/app/components/core/list-view/single-issue.tsx b/apps/app/components/core/list-view/single-issue.tsx
index 2d1a7932a..287b4c905 100644
--- a/apps/app/components/core/list-view/single-issue.tsx
+++ b/apps/app/components/core/list-view/single-issue.tsx
@@ -29,6 +29,7 @@ import {
   TrashIcon,
   XMarkIcon,
   ArrowTopRightOnSquareIcon,
+  PaperClipIcon
 } from "@heroicons/react/24/outline";
 // helpers
 import { copyTextToClipboard, truncateText } from "helpers/string.helper";
@@ -282,6 +283,26 @@ export const SingleListIssue: React.FC<Props> = ({
                 isNotAllowed={isNotAllowed}
               />
             )}
+            {properties.link && (
+              <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+                <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
+                  <div className="flex items-center gap-1 text-gray-500">
+                    <LinkIcon className="h-3.5 w-3.5 text-gray-500" />
+                    {issue.link_count}
+                  </div>
+                </Tooltip>
+              </div>
+            )}
+            {properties.attachment_count && (
+              <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+                <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
+                  <div className="flex items-center gap-1 text-gray-500">
+                    <PaperClipIcon className="h-3.5 w-3.5 text-gray-500 -rotate-45" />
+                    {issue.attachment_count}
+                  </div>
+                </Tooltip>
+              </div>
+            )}
             {type && !isNotAllowed && (
               <CustomMenu width="auto" ellipsis>
                 <CustomMenu.MenuItem onClick={editIssue}>
diff --git a/apps/app/hooks/use-issue-properties.tsx b/apps/app/hooks/use-issue-properties.tsx
index 5c8a9402d..163dcdcd2 100644
--- a/apps/app/hooks/use-issue-properties.tsx
+++ b/apps/app/hooks/use-issue-properties.tsx
@@ -15,6 +15,8 @@ const initialValues: Properties = {
   priority: false,
   state: true,
   sub_issue_count: false,
+  attachment_count: false,
+  link: false,
   estimate: false,
 };
 
@@ -91,6 +93,8 @@ const useIssuesProperties = (workspaceSlug?: string, projectId?: string) => {
     priority: properties.priority,
     state: properties.state,
     sub_issue_count: properties.sub_issue_count,
+    attachment_count: properties.attachment_count,
+    link: properties.link,
     estimate: properties.estimate,
   };
 
diff --git a/apps/app/hooks/use-my-issues-filter.tsx b/apps/app/hooks/use-my-issues-filter.tsx
index b1991f30b..9d26a7a60 100644
--- a/apps/app/hooks/use-my-issues-filter.tsx
+++ b/apps/app/hooks/use-my-issues-filter.tsx
@@ -24,6 +24,8 @@ const initialValues: Properties = {
   priority: false,
   state: true,
   sub_issue_count: false,
+  attachment_count: false,
+  link: false,
   estimate: false,
 };
 
diff --git a/apps/app/types/issues.d.ts b/apps/app/types/issues.d.ts
index 10f084325..7094b5ce8 100644
--- a/apps/app/types/issues.d.ts
+++ b/apps/app/types/issues.d.ts
@@ -67,6 +67,7 @@ export interface IIssue {
   assignees: string[];
   assignee_details: IUser[];
   assignees_list: string[];
+  attachment_count: number;
   attachments: any[];
   blocked_by_issue_details: any[];
   blocked_issue_details: any[];
@@ -101,6 +102,7 @@ export interface IIssue {
   issue_module: IIssueModule | null;
   label_details: any[];
   links_list: IIssueLink[];
+  link_count: number;
   module: string | null;
   module_id: string | null;
   name: string;
@@ -186,6 +188,8 @@ export type Properties = {
   priority: boolean;
   state: boolean;
   sub_issue_count: boolean;
+  link: boolean;
+  attachment_count: boolean;
   estimate: boolean;
 };