From 4639ab3d9c315378b164583a84550482d1116105 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Wed, 15 Mar 2023 18:50:37 +0530
Subject: [PATCH] fix: workspace dropdown (#447)

* fix: workspace dropdown links

* fix: module progress round off
---
 apps/app/components/modules/single-module-card.tsx | 13 +++++++++----
 apps/app/components/workspace/sidebar-dropdown.tsx |  2 +-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/apps/app/components/modules/single-module-card.tsx b/apps/app/components/modules/single-module-card.tsx
index a839eafe2..cbc9ff2e2 100644
--- a/apps/app/components/modules/single-module-card.tsx
+++ b/apps/app/components/modules/single-module-card.tsx
@@ -57,6 +57,7 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
   const completedIssues = (moduleIssues ?? []).filter(
     (i) => i.state_detail.group === "completed" || i.state_detail.group === "cancelled"
   ).length;
+  const completionPercentage = (completedIssues / (moduleIssues ?? []).length) * 100;
 
   const handleDeleteModule = () => {
     if (!module) return;
@@ -156,7 +157,7 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
         <div className="rounded-[10px] border bg-white text-xs">
           <div className="p-4">
             <div className="flex w-full flex-col gap-5">
-              <div className="flex items-center justify-between gap-2">
+              <div className="flex items-start justify-between gap-2">
                 <Tooltip tooltipContent={module.name} position="top-left">
                   <Link href={`/${workspaceSlug}/projects/${module.project}/modules/${module.id}`}>
                     <a className="w-full">
@@ -260,9 +261,13 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
               </div>
             </div>
           </div>
-          <div className="flex items-center gap-2 bg-gray-100 p-4">
-            Progress{" "}
-            <div className="bar relative h-1 w-full rounded bg-gray-300">
+          <div className="flex gap-2 bg-gray-100 p-4">
+            <span>
+              Progress
+              <br />
+              {isNaN(completionPercentage) ? 0 : completionPercentage.toFixed(2)}%
+            </span>
+            <div className="bar relative mt-1 h-1 w-full rounded bg-gray-300">
               <div
                 className="absolute top-0 left-0 h-1 rounded bg-green-500 duration-300"
                 style={{ width: `${(completedIssues / (moduleIssues ?? []).length) * 100}%` }}
diff --git a/apps/app/components/workspace/sidebar-dropdown.tsx b/apps/app/components/workspace/sidebar-dropdown.tsx
index 343cb1fd6..956483042 100644
--- a/apps/app/components/workspace/sidebar-dropdown.tsx
+++ b/apps/app/components/workspace/sidebar-dropdown.tsx
@@ -209,7 +209,7 @@ export const WorkspaceSidebarDropdown = () => {
                   className="flex w-full items-center justify-start rounded px-2 py-1 text-sm text-gray-600 hover:bg-gray-100"
                 >
                   <Link href={link.href}>
-                    <a>{link.name}</a>
+                    <a className="w-full">{link.name}</a>
                   </Link>
                 </Menu.Item>
               ))}