fix: ui fix (#331)

* fix: project card id removed

* feat: my issue page copy issue option

apps/app/components/issues/my-issues-list-item.tsx

@@ -20,6 +20,8 @@ import { CustomMenu, Tooltip } from "components/ui";
 import { IIssue, Properties } from "types";
 // fetch-keys
 import { USER_ISSUE } from "constants/fetch-keys";
+import { copyTextToClipboard } from "helpers/string.helper";
+import useToast from "hooks/use-toast";
 
 type Props = {
   issue: IIssue;
@@ -36,6 +38,7 @@ export const MyIssuesListItem: React.FC<Props> = ({
 }) => {
   const router = useRouter();
   const { workspaceSlug } = router.query;
+  const { setToastAlert } = useToast();
 
   const partialUpdateIssue = useCallback(
     (formData: Partial<IIssue>) => {
@@ -64,6 +67,20 @@ export const MyIssuesListItem: React.FC<Props> = ({
     [workspaceSlug, projectId, issue]
   );
 
+  const handleCopyText = () => {
+    const originURL =
+      typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
+    copyTextToClipboard(
+      `${originURL}/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`
+    ).then(() => {
+      setToastAlert({
+        type: "success",
+        title: "Link Copied!",
+        message: "Issue link copied to clipboard.",
+      });
+    });
+  };
+
   const isNotAllowed = false;
 
   return (
@@ -160,7 +177,8 @@ export const MyIssuesListItem: React.FC<Props> = ({
           </Tooltip>
         )}
         <CustomMenu width="auto" ellipsis>
-          <CustomMenu.MenuItem onClick={handleDeleteIssue}>Delete permanently</CustomMenu.MenuItem>
+          <CustomMenu.MenuItem onClick={handleDeleteIssue}>Delete issue</CustomMenu.MenuItem>
+          <CustomMenu.MenuItem onClick={handleCopyText}>Copy issue link</CustomMenu.MenuItem>
         </CustomMenu>
       </div>
     </div>

apps/app/components/project/card.tsx

@@ -53,10 +53,9 @@ export const ProjectCard: React.FC<ProjectCardProps> = (props) => {
                 {project.icon && (
                   <span className="text-base">{String.fromCodePoint(parseInt(project.icon))}</span>
                 )}
-                <span className=" max-w-[225px] w-[125px] xl:max-w-[225px] text-ellipsis overflow-hidden">
+                <span className=" w-auto max-w-[220px] text-ellipsis whitespace-nowrap overflow-hidden">
                   {project.name}
                 </span>
-                <span className="text-xs text-gray-500 ">{project.identifier}</span>
               </a>
             </Link>
           </div>