fix: resolved pending issue graph in analytics, user wishes in dashboard, and typo in projects list (#2247)

web/components/analytics/scope-and-demand/scope.tsx

@@ -15,17 +15,19 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
     <div className="divide-y divide-custom-border-200">
       <div>
         <h6 className="px-3 text-base font-medium">Pending issues</h6>
-        {defaultAnalytics.pending_issue_user.length > 0 ? (
+        {defaultAnalytics.pending_issue_user && defaultAnalytics.pending_issue_user.length > 0 ? (
           <BarGraph
             data={defaultAnalytics.pending_issue_user}
-            indexBy="assignees__display_name"
+            indexBy="assignees__id"
             keys={["count"]}
             height="250px"
             colors={() => `#f97316`}
-            customYAxisTickValues={defaultAnalytics.pending_issue_user.map((d) => d.count)}
+            customYAxisTickValues={defaultAnalytics.pending_issue_user.map((d) =>
+              d.count > 0 ? d.count : 50
+            )}
             tooltip={(datum) => {
               const assignee = defaultAnalytics.pending_issue_user.find(
-                (a) => a.assignees__display_name === `${datum.indexValue}`
+                (a) => a.assignees__id === `${datum.indexValue}`
               );
 
               return (
@@ -39,10 +41,9 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
             }}
             axisBottom={{
               renderTick: (datum) => {
-                const avatar =
+                const assignee = defaultAnalytics.pending_issue_user[datum.tickIndex] ?? "";
-                  defaultAnalytics.pending_issue_user[datum.tickIndex]?.assignees__avatar ?? "";
 
-                if (avatar && avatar !== "")
+                if (assignee && assignee?.assignees__avatar && assignee?.assignees__avatar !== "")
                   return (
                     <g transform={`translate(${datum.x},${datum.y})`}>
                       <image
@@ -50,7 +51,7 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
                         y={10}
                         width={16}
                         height={16}
-                        xlinkHref={avatar}
+                        xlinkHref={assignee?.assignees__avatar}
                         style={{ clipPath: "circle(50%)" }}
                       />
                     </g>
@@ -60,7 +61,7 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
                     <g transform={`translate(${datum.x},${datum.y})`}>
                       <circle cy={18} r={8} fill="#374151" />
                       <text x={0} y={21} textAnchor="middle" fontSize={9} fill="#ffffff">
-                        {datum.value ? `${datum.value}`.toUpperCase()[0] : "?"}
+                        {datum.value ? `${assignee.assignees__display_name}`.toUpperCase()[0] : "?"}
                       </text>
                     </g>
                   );

web/components/project/single-project-card.tsx

@@ -149,7 +149,7 @@ export const SingleProjectCard: React.FC<ProjectCardProps> = ({
                   </button>
                 ) : (
                   <span className="cursor-default rounded bg-green-600 px-2 py-1 text-xs">
-                    Member
+                    Joined
                   </span>
                 )}
                 {project.is_favorite && (

web/pages/[workspaceSlug]/index.tsx

@@ -127,9 +127,21 @@ const WorkspacePage: NextPage = () => {
           />
         </div>
       )}
+      <div className="p-8 space-y-8">
+        <div>
+          <h3 className="text-2xl font-semibold">
+            Good {greeting}, {user?.first_name} {user?.last_name}
+          </h3>
+          <h6 className="text-custom-text-400 font-medium flex items-center gap-2">
+            <div>{greeting === "morning" ? "🌤️" : greeting === "afternoon" ? "🌥️" : "🌙️"}</div>
+            <div>
+              {DAYS[today.getDay()]}, {renderShortDate(today)} {render12HourFormatTime(today)}
+            </div>
+          </h6>
+        </div>
+
         {projects ? (
           projects.length > 0 ? (
-          <div className="p-8">
             <div className="flex flex-col gap-8">
               <IssuesStats data={workspaceDashboardData} />
               <div className="grid grid-cols-1 gap-8 lg:grid-cols-2">
@@ -143,17 +155,8 @@ const WorkspacePage: NextPage = () => {
                 />
               </div>
             </div>
-          </div>
           ) : (
-          <div className="p-8">
+            <div className="bg-custom-primary-100/5 flex justify-between gap-5 md:gap-8">
-            <h3 className="text-2xl font-semibold">
-              Good {greeting}, {user?.first_name} {user?.last_name}
-            </h3>
-            <h6 className="text-custom-text-400 font-medium">
-              {greeting === "morning" ? "🌤️" : greeting === "afternoon" ? "🌥️" : "🌙️"}
-              {DAYS[today.getDay()]}, {renderShortDate(today)} {render12HourFormatTime(today)}
-            </h6>
-            <div className="mt-7 bg-custom-primary-100/5 flex justify-between gap-5 md:gap-8">
               <div className="p-5 md:p-8 pr-0">
                 <h5 className="text-xl font-semibold">Create a project</h5>
                 <p className="mt-2 mb-5">
@@ -174,9 +177,9 @@ const WorkspacePage: NextPage = () => {
                 <Image src={emptyDashboard} alt="Empty Dashboard" />
               </div>
             </div>
-          </div>
           )
         ) : null}
+      </div>
     </WorkspaceAuthorizationLayout>
   );
 };