From 790a703e303570a3133b6f54148e22cb11dfabea Mon Sep 17 00:00:00 2001
From: Vamsi Krishna <46787868+vamsikrishnamathala@users.noreply.github.com>
Date: Wed, 26 Mar 2025 21:07:33 +0530
Subject: [PATCH] [WEB-3681]feat: added user timezone dates for cycle (#2807)

* feat: added user timezone dates for cycle

* *chore: added translations
*chore: refactored user timezone functions

---------

Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
---
 .../cycles/active-cycle/progress-donut.tsx    |  2 +-
 .../cycles/active-cycle/progress-header.tsx   | 20 ++-----------------
 2 files changed, 3 insertions(+), 19 deletions(-)

diff --git a/web/ee/components/cycles/active-cycle/progress-donut.tsx b/web/ee/components/cycles/active-cycle/progress-donut.tsx
index c0f0edbae1..bd275dd4fc 100644
--- a/web/ee/components/cycles/active-cycle/progress-donut.tsx
+++ b/web/ee/components/cycles/active-cycle/progress-donut.tsx
@@ -18,7 +18,7 @@ const ProgressDonut = (props: Props) => {
       onMouseEnter={() => setIsHovering(true)}
       onMouseLeave={() => setIsHovering(false)}
     >
-      <CircularProgressIndicator size={82} percentage={percentage} strokeWidth={3}>
+      <CircularProgressIndicator size={65} percentage={percentage} strokeWidth={3}>
         <span className="text-[20px] text-custom-primary-200 font-bold block text-center">
           {progress ? (isHovering ? days_left : `${percentage ? percentage.toFixed(0) : 0}%`) : "0%"}
         </span>
diff --git a/web/ee/components/cycles/active-cycle/progress-header.tsx b/web/ee/components/cycles/active-cycle/progress-header.tsx
index 5ee8e02125..bc0397b750 100644
--- a/web/ee/components/cycles/active-cycle/progress-header.tsx
+++ b/web/ee/components/cycles/active-cycle/progress-header.tsx
@@ -1,17 +1,14 @@
 "use client";
 
 import React, { FC, useRef } from "react";
-import { format, parseISO, startOfToday } from "date-fns";
+import { format, startOfToday } from "date-fns";
 // types
-import { ArrowRight, CalendarDays } from "lucide-react";
 // icons
 import { ICycle, TCycleProgress } from "@plane/types";
 import { ControlLink, Loader, Tooltip } from "@plane/ui";
 import { CycleListItemAction } from "@/components/cycles";
 // helpers
-import { ButtonAvatars } from "@/components/dropdowns/member/avatar";
 import { findHowManyDaysLeft } from "@/helpers/date-time.helper";
-import { useMember } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 import ProgressDonut from "./progress-donut";
 
@@ -26,12 +23,10 @@ type Props = {
 
 export const CycleProgressHeader: FC<Props> = (props: Props) => {
   const { workspaceSlug, projectId, cycleId, progress, cycleDetails } = props;
-  const { getUserDetails } = useMember();
 
   // router
   const router = useAppRouter();
   const parentRef = useRef(null);
-  const createdByDetails = cycleDetails.created_by ? getUserDetails(cycleDetails.created_by) : undefined;
   const progressToday = progress && progress.find((d) => d.date === format(startOfToday(), "yyyy-MM-dd"));
   // handlers
   const handleControlLinkClick = () => {
@@ -50,7 +45,7 @@ export const CycleProgressHeader: FC<Props> = (props: Props) => {
     >
       <div className="px-page-x flex items-center justify-between py-4 bg-custom-sidebar-background-100 w-full">
         <div className="flex gap-6 h-full truncate">
-          {progress === null && <Loader.Item width="82px" height="82px" className="flex-shrink-0 rounded-full" />}
+          {progress === null && <Loader.Item width="65px" height="65px" className="flex-shrink-0 rounded-full" />}
           {progress && (
             <ProgressDonut progress={progressToday} days_left={findHowManyDaysLeft(cycleDetails.end_date) ?? 0} />
           )}
@@ -61,17 +56,6 @@ export const CycleProgressHeader: FC<Props> = (props: Props) => {
                 {cycleDetails.name}
               </div>
             </Tooltip>
-            <div className="flex gap-2">
-              {/* Duration */}
-              <div className="flex gap-1 text-xs text-custom-text-300 font-medium items-center">
-                <CalendarDays className="h-3 w-3 flex-shrink-0 my-auto" />
-                {cycleDetails.start_date && <span>{format(parseISO(cycleDetails.start_date), "MMM dd, yyyy")}</span>}
-                <ArrowRight className="h-3 w-3 flex-shrink-0 my-auto" />
-                {cycleDetails.end_date && <span>{format(parseISO(cycleDetails.end_date), "MMM dd, yyyy")}</span>}
-              </div>
-              {/* created by */}
-              {createdByDetails && <ButtonAvatars showTooltip={false} userIds={createdByDetails?.id} />}
-            </div>
           </div>
         </div>
         <div className="flex shrink-0 gap-4 items-center" onClick={handleEventPropagation}>