[WEB-1964]chore: cycles actions restructuring (#6298)

* chore: cycles quick actions restructuring

* chore: added additional actions to cycle list actions

* chore: cycle quick action structure

* chore: added additional actions to cycle list actions

* chore: added end cycle hook

* fix: updated end cycle export

---------

Co-authored-by: gurusinath <[email protected]>

Author: vamsikrishnamathala

web/ce/components/cycles/additional-actions.tsx

@@ -0,0 +1,7 @@
+import { FC } from "react";
+import { observer } from "mobx-react";
+type Props = {
+  cycleId: string;
+  projectId: string;
+};
+export const CycleAdditionalActions: FC<Props> = observer(() => <></>);

web/ce/components/cycles/end-cycle/index.ts

@@ -0,0 +1,2 @@
+export * from "./modal";
+export * from "./use-end-cycle";

web/ce/components/cycles/end-cycle/modal.tsx

@@ -0,0 +1,12 @@
+import React from "react";
+
+interface Props {
+  isOpen: boolean;
+  handleClose: () => void;
+  cycleId: string;
+  projectId: string;
+  workspaceSlug: string;
+  transferrableIssuesCount: number;
+}
+
+export const EndCycleModal: React.FC<Props> = () => <></>;

web/ce/components/cycles/end-cycle/use-end-cycle.tsx

@@ -0,0 +1,7 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export const useEndCycle = (isCurrentCycle: boolean) => ({
+  isEndCycleModalOpen: false,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  setEndCycleModalOpen: (value: boolean) => {},
+  endCycleContextMenu: undefined,
+});

web/ce/components/cycles/index.ts

@@ -1,2 +1,4 @@
 export * from "./active-cycle";
 export * from "./analytics-sidebar";
+export * from "./additional-actions";
+export * from "./end-cycle";

web/core/components/cycles/list/cycle-list-item-action.tsx

@@ -33,7 +33,8 @@ import { generateQueryParams } from "@/helpers/router.helper";
 import { useCycle, useEventTracker, useMember, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { usePlatformOS } from "@/hooks/use-platform-os";
-// plane web
+// plane web components
+import { CycleAdditionalActions } from "@/plane-web/components/cycles";
 // plane web constants
 import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 // services
@@ -156,7 +157,7 @@ export const CycleListItemAction: FC<Props> = observer((props) => {
     try {
       const res = await cycleService.cycleDateCheck(workspaceSlug as string, projectId as string, payload);
       return res.status;
-    } catch (err) {
+    } catch {
       return false;
     }
   };
@@ -244,6 +245,7 @@ export const CycleListItemAction: FC<Props> = observer((props) => {
         </div>
       )}
 
+      <CycleAdditionalActions cycleId={cycleId} projectId={projectId} />
       {showTransferIssues && (
         <div
           className="px-2 h-6  text-custom-primary-200 flex items-center gap-1 cursor-pointer"

web/core/components/cycles/list/cycles-list-item.tsx

@@ -11,14 +11,14 @@ import type { TCycleGroups } from "@plane/types";
 import { CircularProgressIndicator } from "@plane/ui";
 // components
 import { ListItem } from "@/components/core/list";
+import { CycleQuickActions } from "@/components/cycles/";
 import { CycleListItemAction } from "@/components/cycles/list";
 // helpers
 import { generateQueryParams } from "@/helpers/router.helper";
 // hooks
 import { useCycle } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { usePlatformOS } from "@/hooks/use-platform-os";
-import { CycleQuickActions } from "../quick-actions";
 
 type TCyclesListItem = {
   cycleId: string;

web/core/components/cycles/quick-actions.tsx

@@ -15,6 +15,7 @@ import { copyUrlToClipboard } from "@/helpers/string.helper";
 // hooks
 import { useCycle, useEventTracker, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
+import { useEndCycle, EndCycleModal } from "@/plane-web/components/cycles";
 import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 
 type Props = {
@@ -40,6 +41,8 @@ export const CycleQuickActions: React.FC<Props> = observer((props) => {
   const cycleDetails = getCycleById(cycleId);
   const isArchived = !!cycleDetails?.archived_at;
   const isCompleted = cycleDetails?.status?.toLowerCase() === "completed";
+  const isCurrentCycle = cycleDetails?.status?.toLowerCase() === "current";
+  const transferableIssuesCount = cycleDetails ? cycleDetails.total_issues - cycleDetails.completed_issues : 0;
   // auth
   const isEditingAllowed = allowPermissions(
     [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
@@ -48,6 +51,8 @@ export const CycleQuickActions: React.FC<Props> = observer((props) => {
     projectId
   );
 
+  const { isEndCycleModalOpen, setEndCycleModalOpen, endCycleContextMenu } = useEndCycle(isCurrentCycle);
+
   const cycleLink = `${workspaceSlug}/projects/${projectId}/cycles/${cycleId}`;
   const handleCopyText = () =>
     copyUrlToClipboard(cycleLink).then(() => {
@@ -138,6 +143,8 @@ export const CycleQuickActions: React.FC<Props> = observer((props) => {
     },
   ];
 
+  if (endCycleContextMenu) MENU_ITEMS.splice(3, 0, endCycleContextMenu);
+
   return (
     <>
       {cycleDetails && (
@@ -163,6 +170,14 @@ export const CycleQuickActions: React.FC<Props> = observer((props) => {
             workspaceSlug={workspaceSlug}
             projectId={projectId}
           />
+          <EndCycleModal
+            isOpen={isEndCycleModalOpen}
+            handleClose={() => setEndCycleModalOpen(false)}
+            cycleId={cycleId}
+            projectId={projectId}
+            workspaceSlug={workspaceSlug}
+            transferrableIssuesCount={transferableIssuesCount}
+          />
         </div>
       )}
       <ContextMenu parentRef={parentRef} items={MENU_ITEMS} />

web/ee/components/cycles/end-cycle/index.ts

@@ -0,0 +1 @@
+export * from "ce/components/cycles/end-cycle";

web/ee/components/cycles/index.ts

@@ -1,2 +1,4 @@
 export * from "./active-cycle";
 export * from "./analytics-sidebar";
+export * from "./end-cycle";
+export * from "ce/components/cycles/additional-actions";