feat: draft tab and cycle sidebar update
This commit is contained in:
parent
7ab6eb7b48
commit
8a941d0d14
3 changed files with 97 additions and 42 deletions
|
|
@ -34,6 +34,8 @@ import {
|
|||
PROJECT_ISSUES_LIST,
|
||||
PROJECT_DETAILS,
|
||||
CYCLE_DETAILS,
|
||||
CYCLE_COMPLETE_LIST,
|
||||
CYCLE_CURRENT_AND_UPCOMING_LIST,
|
||||
} from "constants/fetch-keys";
|
||||
|
||||
const SingleCycle: React.FC<UserAuth> = (props) => {
|
||||
|
|
@ -78,6 +80,40 @@ const SingleCycle: React.FC<UserAuth> = (props) => {
|
|||
: null
|
||||
);
|
||||
|
||||
const { data: currentAndUpcomingCycles } = useSWR(
|
||||
workspaceSlug && projectId ? CYCLE_CURRENT_AND_UPCOMING_LIST(projectId as string) : null,
|
||||
workspaceSlug && projectId
|
||||
? () =>
|
||||
cycleServices.getCurrentAndUpcomingCycles(workspaceSlug as string, projectId as string)
|
||||
: null
|
||||
);
|
||||
|
||||
const { data: completedCycles } = useSWR(
|
||||
workspaceSlug && projectId ? CYCLE_COMPLETE_LIST(projectId as string) : null,
|
||||
workspaceSlug && projectId
|
||||
? () => cycleServices.getCompletedCycles(workspaceSlug as string, projectId as string)
|
||||
: null
|
||||
);
|
||||
|
||||
const checkForInProgress = currentAndUpcomingCycles?.current_cycle?.filter(
|
||||
(c) => c.id === cycleDetails?.id
|
||||
);
|
||||
const checkForUpcoming = currentAndUpcomingCycles?.upcoming_cycle?.filter(
|
||||
(c) => c.id === cycleDetails?.id
|
||||
);
|
||||
const checkForInCompleted = completedCycles?.completed_cycles?.filter(
|
||||
(c) => c.id === cycleDetails?.id
|
||||
);
|
||||
|
||||
const cycleStatus =
|
||||
checkForInCompleted && checkForInCompleted.length > 0
|
||||
? "completed"
|
||||
: checkForInProgress && checkForInProgress.length > 0
|
||||
? "current"
|
||||
: checkForUpcoming && checkForUpcoming.length > 0
|
||||
? "upcoming"
|
||||
: "draft";
|
||||
|
||||
const { data: cycleIssues } = useSWR<CycleIssueResponse[]>(
|
||||
workspaceSlug && projectId && cycleId ? CYCLE_ISSUES(cycleId as string) : null,
|
||||
workspaceSlug && projectId && cycleId
|
||||
|
|
@ -218,6 +254,7 @@ const SingleCycle: React.FC<UserAuth> = (props) => {
|
|||
</div>
|
||||
)}
|
||||
<CycleDetailsSidebar
|
||||
cycleStatus={cycleStatus}
|
||||
issues={cycleIssuesArray ?? []}
|
||||
cycle={cycleDetails}
|
||||
isOpen={cycleSidebar}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,11 @@ import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
|
|||
import { SelectCycleType } from "types";
|
||||
import type { NextPage, GetServerSidePropsContext } from "next";
|
||||
// fetching keys
|
||||
import { CYCLE_CURRENT_AND_UPCOMING_LIST, PROJECT_DETAILS } from "constants/fetch-keys";
|
||||
import {
|
||||
CYCLE_CURRENT_AND_UPCOMING_LIST,
|
||||
CYCLE_DRAFT_LIST,
|
||||
PROJECT_DETAILS,
|
||||
} from "constants/fetch-keys";
|
||||
|
||||
const CompletedCyclesList = dynamic<CompletedCyclesListProps>(
|
||||
() => import("components/cycles").then((a) => a.CompletedCyclesList),
|
||||
|
|
@ -54,6 +58,13 @@ const ProjectCycles: NextPage = () => {
|
|||
: null
|
||||
);
|
||||
|
||||
const { data: draftCycles } = useSWR(
|
||||
workspaceSlug && projectId ? CYCLE_DRAFT_LIST(projectId as string) : null,
|
||||
workspaceSlug && projectId
|
||||
? () => cycleService.getDraftCycles(workspaceSlug as string, projectId as string)
|
||||
: null
|
||||
);
|
||||
|
||||
const { data: currentAndUpcomingCycles } = useSWR(
|
||||
workspaceSlug && projectId ? CYCLE_CURRENT_AND_UPCOMING_LIST(projectId as string) : null,
|
||||
workspaceSlug && projectId
|
||||
|
|
@ -112,22 +123,29 @@ const ProjectCycles: NextPage = () => {
|
|||
<Tab.Group>
|
||||
<Tab.List
|
||||
as="div"
|
||||
className="grid grid-cols-2 items-center gap-2 rounded-lg bg-gray-100 p-2 text-sm"
|
||||
className="flex justify-between items-center gap-2 rounded-lg bg-gray-100 p-2 text-sm"
|
||||
>
|
||||
<Tab
|
||||
className={({ selected }) =>
|
||||
`rounded-lg px-6 py-2 ${selected ? "bg-gray-300" : "hover:bg-gray-200"}`
|
||||
`w-1/3 rounded-lg px-6 py-2 ${selected ? "bg-gray-300" : "hover:bg-gray-200"}`
|
||||
}
|
||||
>
|
||||
Upcoming
|
||||
</Tab>
|
||||
<Tab
|
||||
className={({ selected }) =>
|
||||
`rounded-lg px-6 py-2 ${selected ? "bg-gray-300" : "hover:bg-gray-200"}`
|
||||
`w-1/3 rounded-lg px-6 py-2 ${selected ? "bg-gray-300" : "hover:bg-gray-200"}`
|
||||
}
|
||||
>
|
||||
Completed
|
||||
</Tab>
|
||||
<Tab
|
||||
className={({ selected }) =>
|
||||
` w-1/3 rounded-lg px-6 py-2 ${selected ? "bg-gray-300" : "hover:bg-gray-200"}`
|
||||
}
|
||||
>
|
||||
Draft
|
||||
</Tab>
|
||||
</Tab.List>
|
||||
<Tab.Panels>
|
||||
<Tab.Panel as="div" className="mt-8 space-y-5">
|
||||
|
|
@ -145,6 +163,14 @@ const ProjectCycles: NextPage = () => {
|
|||
/>
|
||||
</Tab.Panel>
|
||||
</Tab.Panels>
|
||||
<Tab.Panel as="div" className="mt-8 space-y-5">
|
||||
<CyclesList
|
||||
cycles={draftCycles?.draft_cycles ?? []}
|
||||
setCreateUpdateCycleModal={setCreateUpdateCycleModal}
|
||||
setSelectedCycle={setSelectedCycle}
|
||||
type="upcoming"
|
||||
/>
|
||||
</Tab.Panel>
|
||||
</Tab.Group>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue