From 0ac8de6081a6db2281383a9962ff8bdfe810f69f Mon Sep 17 00:00:00 2001 From: gurusainath Date: Fri, 22 Sep 2023 15:14:59 +0530 Subject: [PATCH 1/3] chore: issue store for kanban and calendar --- web/components/core/views/all-views.tsx | 244 ++++++++++-------- .../issues/issue-layouts/calandar/index.ts | 1 + .../issues/issue-layouts/calandar/root.tsx | 17 ++ web/components/issues/issue-layouts/index.ts | 2 + .../issues/issue-layouts/kanban/default.tsx | 18 ++ .../issue-layouts/kanban/headers/card.tsx | 16 ++ .../kanban/headers/state copy.tsx | 8 + .../kanban/headers/state-group.tsx | 8 + .../issue-layouts/kanban/headers/state.tsx | 8 + .../issues/issue-layouts/kanban/index.ts | 4 + .../issues/issue-layouts/kanban/root.tsx | 29 +++ .../issues/issue-layouts/kanban/swinlanes.tsx | 18 ++ .../projects/[projectId]/issues/index.tsx | 12 +- web/store/issue.ts | 176 +++++++++---- web/store/workspace.ts | 13 +- 15 files changed, 389 insertions(+), 185 deletions(-) create mode 100644 web/components/issues/issue-layouts/calandar/index.ts create mode 100644 web/components/issues/issue-layouts/calandar/root.tsx create mode 100644 web/components/issues/issue-layouts/index.ts create mode 100644 web/components/issues/issue-layouts/kanban/default.tsx create mode 100644 web/components/issues/issue-layouts/kanban/headers/card.tsx create mode 100644 web/components/issues/issue-layouts/kanban/headers/state copy.tsx create mode 100644 web/components/issues/issue-layouts/kanban/headers/state-group.tsx create mode 100644 web/components/issues/issue-layouts/kanban/headers/state.tsx create mode 100644 web/components/issues/issue-layouts/kanban/index.ts create mode 100644 web/components/issues/issue-layouts/kanban/root.tsx create mode 100644 web/components/issues/issue-layouts/kanban/swinlanes.tsx diff --git a/web/components/core/views/all-views.tsx b/web/components/core/views/all-views.tsx index 4d5b886da41..2ae219c8d51 100644 --- a/web/components/core/views/all-views.tsx +++ b/web/components/core/views/all-views.tsx @@ -14,6 +14,7 @@ import useUser from "hooks/use-user"; import { useProjectMyMembership } from "contexts/project-member.context"; // components import { AllLists, AllBoards, CalendarView, SpreadsheetView, GanttChartView } from "components/core"; +import { KanBanLayout } from "components/issues/issue-layouts"; // ui import { EmptyState, Spinner } from "components/ui"; // icons @@ -27,6 +28,9 @@ import { getStatesList } from "helpers/state.helper"; import { IIssue, IIssueViewProps } from "types"; // fetch-keys import { STATES_LIST } from "constants/fetch-keys"; +// store +import { useMobxStore } from "lib/mobx/store-provider"; +import { RootStore } from "store/root"; type Props = { addIssueToDate: (date: string) => void; @@ -71,7 +75,12 @@ export const AllViews: React.FC = ({ viewProps, }) => { const router = useRouter(); - const { workspaceSlug, projectId, cycleId, moduleId } = router.query; + const { workspaceSlug, projectId, cycleId, moduleId } = router.query as { + workspaceSlug: string; + projectId: string; + cycleId: string; + moduleId: string; + }; const [myIssueProjectId, setMyIssueProjectId] = useState(null); @@ -97,118 +106,127 @@ export const AllViews: React.FC = ({ [trashBox, setTrashBox] ); + const { issue: issueStore }: RootStore = useMobxStore(); + + useSWR(workspaceSlug && projectId ? `PROJECT_ISSUES` : null, () => { + if (workspaceSlug && projectId) issueStore.fetchIssues(workspaceSlug, projectId); + }); + return ( - - - {(provided, snapshot) => ( -
- - Drop here to delete the issue. -
- )} -
- {groupedIssues ? ( - !isEmpty || - displayFilters?.layout === "kanban" || - displayFilters?.layout === "calendar" || - displayFilters?.layout === "gantt_chart" ? ( - <> - {displayFilters?.layout === "list" ? ( - - ) : displayFilters?.layout === "kanban" ? ( - - ) : displayFilters?.layout === "calendar" ? ( - - ) : displayFilters?.layout === "spreadsheet" ? ( - - ) : ( - displayFilters?.layout === "gantt_chart" && - )} - - ) : router.pathname.includes("archived-issues") ? ( - { - router.push(`/${workspaceSlug}/projects/${projectId}/settings/automations`); - }, - }} - /> - ) : ( - - ) - ) : ( -
- -
- )} -
+ // + // + // {(provided, snapshot) => ( + //
+ // + // Drop here to delete the issue. + //
+ // )} + //
+ // {groupedIssues ? ( + // !isEmpty || + // displayFilters?.layout === "kanban" || + // displayFilters?.layout === "calendar" || + // displayFilters?.layout === "gantt_chart" ? ( + // <> + // {displayFilters?.layout === "list" ? ( + // + // ) : displayFilters?.layout === "kanban" ? ( + // + // ) : displayFilters?.layout === "calendar" ? ( + // + // ) : displayFilters?.layout === "spreadsheet" ? ( + // + // ) : ( + // displayFilters?.layout === "gantt_chart" && + // )} + // + // ) : router.pathname.includes("archived-issues") ? ( + // { + // router.push(`/${workspaceSlug}/projects/${projectId}/settings/automations`); + // }, + // }} + // /> + // ) : ( + // + // ) + // ) : ( + //
+ // + //
+ // )} + //
+
+ +
); }; diff --git a/web/components/issues/issue-layouts/calandar/index.ts b/web/components/issues/issue-layouts/calandar/index.ts new file mode 100644 index 00000000000..1efe34c51ec --- /dev/null +++ b/web/components/issues/issue-layouts/calandar/index.ts @@ -0,0 +1 @@ +export * from "./root"; diff --git a/web/components/issues/issue-layouts/calandar/root.tsx b/web/components/issues/issue-layouts/calandar/root.tsx new file mode 100644 index 00000000000..c0ea15d9d33 --- /dev/null +++ b/web/components/issues/issue-layouts/calandar/root.tsx @@ -0,0 +1,17 @@ +import React from "react"; + +export interface ICalendarLayout { + issues: any; + handleDragDrop: () => void; +} + +export const CalendarLayout: React.FC = ({}) => { + console.log("kanaban layout"); + return ( +
+
header
+
content
+
footer
+
+ ); +}; diff --git a/web/components/issues/issue-layouts/index.ts b/web/components/issues/issue-layouts/index.ts new file mode 100644 index 00000000000..f8337cc7718 --- /dev/null +++ b/web/components/issues/issue-layouts/index.ts @@ -0,0 +1,2 @@ +export * from "./kanban"; +export * from "./calandar"; diff --git a/web/components/issues/issue-layouts/kanban/default.tsx b/web/components/issues/issue-layouts/kanban/default.tsx new file mode 100644 index 00000000000..b9e67a46b96 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/default.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +export interface IKanBan { + issues?: any; + handleIssues?: () => void; + handleDragDrop?: () => void; +} + +export const KanBan: React.FC = ({}) => { + console.log("kanaban layout"); + return ( +
+
header
+
content
+
footer
+
+ ); +}; diff --git a/web/components/issues/issue-layouts/kanban/headers/card.tsx b/web/components/issues/issue-layouts/kanban/headers/card.tsx new file mode 100644 index 00000000000..0c9ad1ba82f --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/headers/card.tsx @@ -0,0 +1,16 @@ +import React from "react"; + +interface IHeaderCard {} + +export const HeaderCard = ({}: IHeaderCard) => { + console.log("KanBanHeader"); + + return ( +
+
icon
+
title
+
Minimise
+ {/*
*/} +
+ ); +}; diff --git a/web/components/issues/issue-layouts/kanban/headers/state copy.tsx b/web/components/issues/issue-layouts/kanban/headers/state copy.tsx new file mode 100644 index 00000000000..57559979ed4 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/headers/state copy.tsx @@ -0,0 +1,8 @@ +export const PriorityHeader = () => { + console.log("state header"); + return ( +
+
State Header
+
+ ); +}; diff --git a/web/components/issues/issue-layouts/kanban/headers/state-group.tsx b/web/components/issues/issue-layouts/kanban/headers/state-group.tsx new file mode 100644 index 00000000000..6e24bba1a99 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/headers/state-group.tsx @@ -0,0 +1,8 @@ +export const StateGroupHeader = () => { + console.log("state header"); + return ( +
+
State Header
+
+ ); +}; diff --git a/web/components/issues/issue-layouts/kanban/headers/state.tsx b/web/components/issues/issue-layouts/kanban/headers/state.tsx new file mode 100644 index 00000000000..b4e7ac502ec --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/headers/state.tsx @@ -0,0 +1,8 @@ +export const StateHeader = () => { + console.log("state header"); + return ( +
+
State Header
+
+ ); +}; diff --git a/web/components/issues/issue-layouts/kanban/index.ts b/web/components/issues/issue-layouts/kanban/index.ts new file mode 100644 index 00000000000..5d3d7853939 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/index.ts @@ -0,0 +1,4 @@ +export * from "./root"; + +// header +export * from "./headers/card"; diff --git a/web/components/issues/issue-layouts/kanban/root.tsx b/web/components/issues/issue-layouts/kanban/root.tsx new file mode 100644 index 00000000000..890c9bfacc2 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/root.tsx @@ -0,0 +1,29 @@ +import React from "react"; + +// mobx +import { observer } from "mobx-react-lite"; +// store +import { useMobxStore } from "lib/mobx/store-provider"; +import { RootStore } from "store/root"; +import { KanBanSwimLanes } from "./swinlanes"; +import { KanBan } from "./default"; + +export interface IKanBanLayout { + issues?: any; + handleIssues?: () => void; + handleDragDrop?: () => void; +} + +export const KanBanLayout: React.FC = observer(({}) => { + const { issue: issueStore }: RootStore = useMobxStore(); + + console.log("---"); + console.log("issues", issueStore?.getIssues); + console.log("---"); + + return ( +
+ {"swinlanes" === "swinlanes" ? : } +
+ ); +}); diff --git a/web/components/issues/issue-layouts/kanban/swinlanes.tsx b/web/components/issues/issue-layouts/kanban/swinlanes.tsx new file mode 100644 index 00000000000..78190f56689 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/swinlanes.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +export interface IKanBanSwimLanes { + issues?: any; + handleIssues?: () => void; + handleDragDrop?: () => void; +} + +export const KanBanSwimLanes: React.FC = ({}) => { + console.log("kanaban layout"); + return ( +
+
header
+
content
+
footer
+
+ ); +}; diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/issues/index.tsx b/web/pages/[workspaceSlug]/projects/[projectId]/issues/index.tsx index cb7b1fd337b..7ed7654f50c 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/issues/index.tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/issues/index.tsx @@ -35,16 +35,12 @@ const ProjectIssues: NextPage = () => { const { data: projectDetails } = useSWR( workspaceSlug && projectId ? PROJECT_DETAILS(projectId as string) : null, - workspaceSlug && projectId - ? () => projectService.getProject(workspaceSlug as string, projectId as string) - : null + workspaceSlug && projectId ? () => projectService.getProject(workspaceSlug as string, projectId as string) : null ); const { data: inboxList } = useSWR( workspaceSlug && projectId ? INBOX_LIST(projectId as string) : null, - workspaceSlug && projectId - ? () => inboxService.getInboxes(workspaceSlug as string, projectId as string) - : null + workspaceSlug && projectId ? () => inboxService.getInboxes(workspaceSlug as string, projectId as string) : null ); return ( @@ -53,9 +49,7 @@ const ProjectIssues: NextPage = () => { breadcrumbs={ - + } right={ diff --git a/web/store/issue.ts b/web/store/issue.ts index f91f8af05a8..3ff1f2f8643 100644 --- a/web/store/issue.ts +++ b/web/store/issue.ts @@ -1,28 +1,37 @@ import { observable, action, computed, makeObservable, runInAction } from "mobx"; -import { IIssue } from "types"; +// store import { RootStore } from "./root"; +// types +import { IIssue } from "types"; +// services +import { IssueService } from "services/issue.service"; + +export type IIssueType = "grouped" | "groupWithSubGroups" | "ungrouped"; +export type IIssueGroupedStructure = { [group_id: string]: IIssue[] }; +export type IIssueGroupWithSubGroupsStructure = { + [group_id: string]: { + [sub_group_id: string]: IIssue[]; + }; +}; +export type IIssueUnGroupedStructure = IIssue[]; export interface IIssueStore { loader: boolean; error: any | null; - + // issues issues: { [project_id: string]: { - grouped: { - [group_id: string]: IIssue[]; - }; - groupWithSubGroups: { - [group_id: string]: { - [sub_group_id: string]: IIssue[]; - }; - }; - ungrouped: IIssue[]; + grouped: IIssueGroupedStructure; + groupWithSubGroups: IIssueGroupWithSubGroupsStructure; + ungrouped: IIssueUnGroupedStructure; }; }; - - addIssueToIssuesStore: (projectId: string, issue: IIssue) => void; - updateIssueInIssuesStore: (projectId: string, issue: IIssue) => void; - deleteIssueFromIssuesStore: (projectId: string, issueId: string) => void; + // computed + getIssueType: IIssueType | null; + getIssues: IIssueGroupedStructure | IIssueGroupWithSubGroupsStructure | IIssueUnGroupedStructure | null; + // action + fetchIssues: (workspaceSlug: string, projectId: string) => void; + updateIssueStructure: (group_id: string | null, sub_group_id: string | null, issue: IIssue) => void; } class IssueStore implements IIssueStore { @@ -31,7 +40,7 @@ class IssueStore implements IIssueStore { issues: { [project_id: string]: { grouped: { - [issueId: string]: IIssue[]; + [group_id: string]: IIssue[]; }; groupWithSubGroups: { [group_id: string]: { @@ -41,7 +50,8 @@ class IssueStore implements IIssueStore { ungrouped: IIssue[]; }; } = {}; - + // service + issueService; rootStore; constructor(_rootStore: RootStore) { @@ -50,55 +60,113 @@ class IssueStore implements IIssueStore { loader: observable.ref, error: observable.ref, issues: observable.ref, - - addIssueToIssuesStore: action, - updateIssueInIssuesStore: action, - deleteIssueFromIssuesStore: action, + // computed + getIssueType: computed, + getIssues: computed, + // actions + fetchIssues: action, + updateIssueStructure: action, }); this.rootStore = _rootStore; + this.issueService = new IssueService(); } - addIssueToIssuesStore = (projectId: string, issue: IIssue) => { - runInAction(() => { - this.rootStore.issue.issues = { - ...this.rootStore.issue.issues, - [projectId]: { - ...this.rootStore.issue.issues[projectId], - ungrouped: [...this.rootStore.issue.issues[projectId].ungrouped, issue], - }, - }; - }); - }; + get getIssueType() { + const groupedLayouts = ["kanban", "list"]; + const ungroupedLayouts = ["calendar", "spreadsheet", "gantt_chart"]; - updateIssueInIssuesStore = (projectId: string, issue: IIssue) => { - const newUngroupedIssues = this.rootStore.issue.issues[projectId].ungrouped.map((i) => ({ - ...i, - ...(i.id === issue.id ? issue : {}), - })); + const issueLayout = "kanban"; + const issueSubGroup = null; - runInAction(() => { - this.rootStore.issue.issues = { - ...this.rootStore.issue.issues, - [projectId]: { - ...this.rootStore.issue.issues[projectId], - ungrouped: newUngroupedIssues, + const _issueState = groupedLayouts.includes(issueLayout) + ? issueSubGroup + ? "groupWithSubGroups" + : "grouped" + : ungroupedLayouts.includes(issueLayout) + ? "ungrouped" + : null; + + return _issueState || null; + } + + get getIssues() { + const projectId: string | null = this.rootStore?.project?.projectId; + const issueType = this.getIssueType; + + if (!projectId || !issueType) return null; + return this.issues?.[projectId]?.[issueType] || null; + } + + updateIssueStructure = async (group_id: string | null, sub_group_id: string | null, issue: IIssue) => { + const projectId: string | null = issue?.project; + const issueType: IIssueType | null = this.getIssueType; + if (!projectId || !issueType) return null; + + let issues: IIssueGroupedStructure | IIssueGroupWithSubGroupsStructure | IIssueUnGroupedStructure | null = + this.getIssues; + if (!issues) return null; + + if (issueType === "grouped" && group_id) { + issues = issues as IIssueGroupedStructure; + issues = { + ...issues, + [group_id]: issues[group_id].map((i: IIssue) => (i?.id === issue?.id ? issue : i)), + }; + } + if (issueType === "groupWithSubGroups" && group_id && sub_group_id) { + issues = issues as IIssueGroupWithSubGroupsStructure; + issues = { + ...issues, + [sub_group_id]: { + ...issues[sub_group_id], + [group_id]: issues[sub_group_id][group_id].map((i: IIssue) => (i?.id === issue?.id ? issue : i)), }, }; + } + if (issueType === "ungrouped") { + issues = issues as IIssueUnGroupedStructure; + issues = issues.map((i: IIssue) => (i?.id === issue?.id ? issue : i)); + } + + runInAction(() => { + this.issues = { ...this.issues, [projectId]: { ...this.issues[projectId], [issueType]: issues } }; }); }; - deleteIssueFromIssuesStore = (projectId: string, issueId: string) => { - const newUngroupedIssues = this.rootStore.issue.issues[projectId].ungrouped.filter((i) => i.id !== issueId); + fetchIssues = async (workspaceSlug: string, projectId: string) => { + try { + this.loader = true; + this.error = null; - runInAction(() => { - this.rootStore.issue.issues = { - ...this.rootStore.issue.issues, - [projectId]: { - ...this.rootStore.issue.issues[projectId], - ungrouped: newUngroupedIssues, - }, - }; - }); + this.rootStore.workspace.setWorkspaceSlug(workspaceSlug); + this.rootStore.project.setProjectId(projectId); + + const params = { group_by: "state" }; + const issueResponse = await this.issueService.getIssuesWithParams(workspaceSlug, projectId, params); + + const issueType = this.getIssueType; + if (issueType != null) { + const _issues = { + ...this.issues, + [projectId]: { + ...this.issues[projectId], + [issueType]: issueResponse, + }, + }; + runInAction(() => { + this.issues = _issues; + this.loader = false; + this.error = null; + }); + } + + return issueResponse; + } catch (error) { + console.error("Error: Fetching error in issues", error); + this.loader = false; + this.error = error; + return error; + } }; } diff --git a/web/store/workspace.ts b/web/store/workspace.ts index 5f27ab2f7f5..45361578f35 100644 --- a/web/store/workspace.ts +++ b/web/store/workspace.ts @@ -96,27 +96,22 @@ class WorkspaceStore implements IWorkspaceStore { * fetch workspace info from the array of workspaces in the store. * @param workspaceSlug */ - getWorkspaceBySlug = (workspaceSlug: string) => { - return this.workspaces.find((w) => w.slug == workspaceSlug) || null; - }; + getWorkspaceBySlug = (workspaceSlug: string) => this.workspaces.find((w) => w.slug == workspaceSlug) || null; /** * get Workspace projects using workspace slug * @param workspaceSlug * @returns */ - getWorkspaceProjects = (workspaceSlug: string) => { - return this.projects[workspaceSlug]; - }; + getWorkspaceProjects = (workspaceSlug: string) => this.projects[workspaceSlug]; /** * get workspace label information from the workspace labels * @param labelId * @returns */ - getWorkspaceLabelById = (workspaceSlug: string, labelId: string) => { - return this.labels?.[workspaceSlug].find((label) => label.id === labelId) || null; - }; + getWorkspaceLabelById = (workspaceSlug: string, labelId: string) => + this.labels?.[workspaceSlug].find((label) => label.id === labelId) || null; /** * fetch user workspaces from API From f0701485128bfe17a6ff9898526b5c8c96cf3fb8 Mon Sep 17 00:00:00 2001 From: gurusainath Date: Tue, 26 Sep 2023 00:54:35 +0530 Subject: [PATCH 2/3] chore: updated ui for kanba and swimlanes --- web/components/core/views/all-views.tsx | 4 +- .../issues/issue-layouts/kanban/block.tsx | 50 ++++++++ .../issues/issue-layouts/kanban/default.tsx | 118 +++++++++++------- .../headers/{root.tsx => group-by-root.tsx} | 6 +- .../kanban/headers/state-group.tsx | 1 + .../kanban/headers/sub-group-by-root.tsx | 32 +++++ .../issues/issue-layouts/kanban/root.tsx | 29 ++++- .../issues/issue-layouts/kanban/swimlanes.tsx | 98 +++++++++++++-- web/package.json | 1 + web/store/issue.ts | 2 +- web/store/kanban_view.ts | 77 +++++------- 11 files changed, 312 insertions(+), 106 deletions(-) create mode 100644 web/components/issues/issue-layouts/kanban/block.tsx rename web/components/issues/issue-layouts/kanban/headers/{root.tsx => group-by-root.tsx} (81%) create mode 100644 web/components/issues/issue-layouts/kanban/headers/sub-group-by-root.tsx diff --git a/web/components/core/views/all-views.tsx b/web/components/core/views/all-views.tsx index c0fa298443b..a75ac67d4c4 100644 --- a/web/components/core/views/all-views.tsx +++ b/web/components/core/views/all-views.tsx @@ -110,7 +110,7 @@ export const AllViews: React.FC = ({ useSWR(workspaceSlug && projectId ? `PROJECT_ISSUES` : null, async () => { if (workspaceSlug && projectId) { - await issueFilterStore.fetchUserFilters(workspaceSlug, projectId); + await issueFilterStore.fetchUserProjectFilters(workspaceSlug, projectId); await projectStore.fetchProjectStates(workspaceSlug, projectId); await projectStore.fetchProjectLabels(workspaceSlug, projectId); @@ -233,7 +233,7 @@ export const AllViews: React.FC = ({ // // )} // -
+
); diff --git a/web/components/issues/issue-layouts/kanban/block.tsx b/web/components/issues/issue-layouts/kanban/block.tsx new file mode 100644 index 00000000000..6900e9782ed --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/block.tsx @@ -0,0 +1,50 @@ +// react beautiful dnd +import { Draggable } from "@hello-pangea/dnd"; + +interface IssueBlockProps { + sub_group_id: string; + columnId: string; + issues: any; +} + +export const IssueBlock = ({ sub_group_id, columnId, issues }: IssueBlockProps) => { + console.log(); + + return ( + <> + {issues && issues.length > 0 ? ( + <> + {issues.map((issue: any, index: any) => ( + + {(provided: any, snapshot: any) => ( +
+
+
ONE-{issue.sequence_id}
+
{issue.name}
+
Footer
+
+
+ )} +
+ ))} + + ) : ( +
No issues are available.
+ )} + + ); +}; diff --git a/web/components/issues/issue-layouts/kanban/default.tsx b/web/components/issues/issue-layouts/kanban/default.tsx index 3ed6a265abe..321105635ee 100644 --- a/web/components/issues/issue-layouts/kanban/default.tsx +++ b/web/components/issues/issue-layouts/kanban/default.tsx @@ -1,6 +1,9 @@ import React from "react"; +// react beautiful dnd +import { Droppable } from "@hello-pangea/dnd"; // components -import { KanBanHeaderRoot } from "./headers/root"; +import { KanBanGroupByHeaderRoot } from "./headers/group-by-root"; +import { IssueBlock } from "./block"; // constants import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES } from "constants/issue"; // mobx @@ -12,48 +15,65 @@ import { RootStore } from "store/root"; export interface IKanBan { issues?: any; handleIssues?: () => void; - handleDragDrop?: () => void; + handleDragDrop?: (result: any) => void | undefined; + sub_group_id?: string; } -export const KanBan: React.FC = observer(({}) => { - const { issue: issueStore, project: projectStore, issueFilter: issueFilterStore }: RootStore = useMobxStore(); +export const KanBan: React.FC = observer(({ issues, sub_group_id = "null" }) => { + const { project: projectStore, issueFilter: issueFilterStore }: RootStore = useMobxStore(); const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; - - // console.log("issueStore", issueStore?.getIssues); - // console.log("issueStore", projectStore?.projectStates); - // console.log("issueStore", projectStore?.projectLabels); - // console.log("issueStore", projectStore?.projectMembers); - // console.log("issueFilterStore", issueFilterStore); - // issueStore?.getIssues && Object.keys(issueStore?.getIssues) && Object.keys(issueStore?.getIssues).length > 0 + const sub_group_by: string | null = issueFilterStore?.userDisplayFilters?.sub_group_by || null; return ( -
+
{group_by && group_by === "state" && (
{projectStore?.projectStates && projectStore?.projectStates.length > 0 && projectStore?.projectStates.map((state) => ( -
-
- +
+ {sub_group_by === null && ( +
+ +
+ )} + +
+ + {(provided: any, snapshot: any) => ( +
+ {issues && ( + + )} + {provided.placeholder} +
+ )} +
-
content
-
footer
))}
)} - {group_by && group_by === "state.group" && ( + {group_by && group_by === "state_detail.group" && (
{ISSUE_STATE_GROUPS && ISSUE_STATE_GROUPS.length > 0 && - ISSUE_STATE_GROUPS.map((state) => ( -
- -
content
-
footer
+ ISSUE_STATE_GROUPS.map((stateGroup) => ( +
+ {sub_group_by === null && ( +
+ +
+ )} +
content
))}
@@ -63,11 +83,14 @@ export const KanBan: React.FC = observer(({}) => {
{ISSUE_PRIORITIES && ISSUE_PRIORITIES.length > 0 && - ISSUE_PRIORITIES.map((state) => ( -
- -
content
-
footer
+ ISSUE_PRIORITIES.map((priority) => ( +
+ {sub_group_by === null && ( +
+ +
+ )} +
content
))}
@@ -77,11 +100,14 @@ export const KanBan: React.FC = observer(({}) => {
{projectStore?.projectLabels && projectStore?.projectLabels.length > 0 && - projectStore?.projectLabels.map((state) => ( -
- -
content
-
footer
+ projectStore?.projectLabels.map((label) => ( +
+ {sub_group_by === null && ( +
+ +
+ )} +
content
))}
@@ -91,11 +117,14 @@ export const KanBan: React.FC = observer(({}) => {
{projectStore?.projectMembers && projectStore?.projectMembers.length > 0 && - projectStore?.projectMembers.map((state) => ( -
- -
content
-
footer
+ projectStore?.projectMembers.map((member) => ( +
+ {sub_group_by === null && ( +
+ +
+ )} +
content
))}
@@ -105,11 +134,14 @@ export const KanBan: React.FC = observer(({}) => {
{projectStore?.projectMembers && projectStore?.projectMembers.length > 0 && - projectStore?.projectMembers.map((state) => ( -
- -
content
-
footer
+ projectStore?.projectMembers.map((member) => ( +
+ {sub_group_by === null && ( +
+ +
+ )} +
content
))}
diff --git a/web/components/issues/issue-layouts/kanban/headers/root.tsx b/web/components/issues/issue-layouts/kanban/headers/group-by-root.tsx similarity index 81% rename from web/components/issues/issue-layouts/kanban/headers/root.tsx rename to web/components/issues/issue-layouts/kanban/headers/group-by-root.tsx index 2c41ee07937..9412d04f306 100644 --- a/web/components/issues/issue-layouts/kanban/headers/root.tsx +++ b/web/components/issues/issue-layouts/kanban/headers/group-by-root.tsx @@ -11,18 +11,18 @@ import { observer } from "mobx-react-lite"; import { useMobxStore } from "lib/mobx/store-provider"; import { RootStore } from "store/root"; -export interface IKanBanHeaderRoot { +export interface IKanBanGroupByHeaderRoot { column_id: string; } -export const KanBanHeaderRoot: React.FC = observer(({ column_id }) => { +export const KanBanGroupByHeaderRoot: React.FC = observer(({ column_id }) => { const { issueFilter: issueFilterStore }: RootStore = useMobxStore(); const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; return ( <> {group_by && group_by === "state" && } - {group_by && group_by === "state.group" && } + {group_by && group_by === "state_detail.group" && } {group_by && group_by === "priority" && } {group_by && group_by === "labels" && } {group_by && group_by === "assignees" && } diff --git a/web/components/issues/issue-layouts/kanban/headers/state-group.tsx b/web/components/issues/issue-layouts/kanban/headers/state-group.tsx index 87570d6e85c..2a406ac946c 100644 --- a/web/components/issues/issue-layouts/kanban/headers/state-group.tsx +++ b/web/components/issues/issue-layouts/kanban/headers/state-group.tsx @@ -11,6 +11,7 @@ import { RootStore } from "store/root"; export interface IStateGroupHeader { column_id: string; + swimlanes?: boolean; } export const StateGroupHeader: React.FC = observer(({ column_id }) => { diff --git a/web/components/issues/issue-layouts/kanban/headers/sub-group-by-root.tsx b/web/components/issues/issue-layouts/kanban/headers/sub-group-by-root.tsx new file mode 100644 index 00000000000..f78970fd702 --- /dev/null +++ b/web/components/issues/issue-layouts/kanban/headers/sub-group-by-root.tsx @@ -0,0 +1,32 @@ +// components +import { StateHeader } from "./state"; +import { StateGroupHeader } from "./state-group"; +import { AssigneesHeader } from "./assignee"; +import { PriorityHeader } from "./priority"; +import { LabelHeader } from "./label"; +import { CreatedByHeader } from "./created_by"; +// mobx +import { observer } from "mobx-react-lite"; +// mobx +import { useMobxStore } from "lib/mobx/store-provider"; +import { RootStore } from "store/root"; + +export interface IKanBanSubGroupByHeaderRoot { + column_id: string; +} + +export const KanBanSubGroupByHeaderRoot: React.FC = observer(({ column_id }) => { + const { issueFilter: issueFilterStore }: RootStore = useMobxStore(); + const sub_group_by: string | null = issueFilterStore?.userDisplayFilters?.sub_group_by || null; + + return ( + <> + {sub_group_by && sub_group_by === "state" && } + {sub_group_by && sub_group_by === "state_detail.group" && } + {sub_group_by && sub_group_by === "priority" && } + {sub_group_by && sub_group_by === "labels" && } + {sub_group_by && sub_group_by === "assignees" && } + {sub_group_by && sub_group_by === "created_by" && } + + ); +}); diff --git a/web/components/issues/issue-layouts/kanban/root.tsx b/web/components/issues/issue-layouts/kanban/root.tsx index 09580b3ef70..4b3bb5de98c 100644 --- a/web/components/issues/issue-layouts/kanban/root.tsx +++ b/web/components/issues/issue-layouts/kanban/root.tsx @@ -1,4 +1,6 @@ import React from "react"; +// react beautiful dnd +import { DragDropContext } from "@hello-pangea/dnd"; // mobx import { observer } from "mobx-react-lite"; // store @@ -10,18 +12,37 @@ import { KanBan } from "./default"; export interface IKanBanLayout { issues?: any; handleIssues?: () => void; - handleDragDrop?: () => void; + handleDragDrop?: (result: any) => void; } export const KanBanLayout: React.FC = observer(({}) => { - const { issueFilter: issueFilterStore }: RootStore = useMobxStore(); + const { issue: issueStore, issueFilter: issueFilterStore }: RootStore = useMobxStore(); const currentKanBanView: "swimlanes" | "default" = issueFilterStore?.userDisplayFilters?.sub_group_by ? "swimlanes" : "default"; + const issues = issueStore?.getIssues; + + const onDragEnd = (result: any) => { + if (!result) return; + + if ( + result.destination && + result.source && + result.destination.droppableId === result.source.droppableId && + result.destination.index === result.source.index + ) + return; + + console.log("result", result); + // issueKanBanViewStore?.handleDragDrop(result.source, result.destination); + }; + return ( -
- {currentKanBanView === "default" ? : } +
+ + {currentKanBanView === "default" ? : } +
); }); diff --git a/web/components/issues/issue-layouts/kanban/swimlanes.tsx b/web/components/issues/issue-layouts/kanban/swimlanes.tsx index d4305b931ad..7ac4a47439f 100644 --- a/web/components/issues/issue-layouts/kanban/swimlanes.tsx +++ b/web/components/issues/issue-layouts/kanban/swimlanes.tsx @@ -1,4 +1,15 @@ import React from "react"; +// components +import { KanBanGroupByHeaderRoot } from "./headers/group-by-root"; +import { KanBanSubGroupByHeaderRoot } from "./headers/sub-group-by-root"; +import { KanBan } from "./default"; +// constants +import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES } from "constants/issue"; +// mobx +import { observer } from "mobx-react-lite"; +// mobx +import { useMobxStore } from "lib/mobx/store-provider"; +import { RootStore } from "store/root"; export interface IKanBanSwimLanes { issues?: any; @@ -6,14 +17,87 @@ export interface IKanBanSwimLanes { handleDragDrop?: () => void; } -export const KanBanSwimLanes: React.FC = ({}) => { - console.log(""); +const SubGroupSwimlaneHeader = ({ list, _key }: any) => ( +
+ {list && + list.length > 0 && + list.map((_list: any) => ( +
+ +
+ ))} +
+); + +const SubGroupSwimlane = ({ issues, list, _key }: any) => ( +
+ {list && + list.length > 0 && + list.map((_list: any) => ( +
+
+
+ +
+
+
+ +
+ +
+
+ ))} +
+); + +export const KanBanSwimLanes: React.FC = observer(({ issues }) => { + const { project: projectStore, issueFilter: issueFilterStore }: RootStore = useMobxStore(); + + const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; + const sub_group_by: string | null = issueFilterStore?.userDisplayFilters?.sub_group_by || null; + + console.log("sub_group_by", sub_group_by); return ( -
-
header
-
content
-
footer
+
+
+ {group_by && group_by === "state" && } + {group_by && group_by === "state_detail.group" && ( + + )} + {group_by && group_by === "priority" && } + {group_by && group_by === "labels" && } + {group_by && group_by === "assignees" && ( + + )} + {group_by && group_by === "created_by" && ( + + )} +
+ + {sub_group_by && sub_group_by === "state" && ( + + )} + + {sub_group_by && sub_group_by === "state_detail.group" && ( + + )} + + {sub_group_by && sub_group_by === "priority" && ( + + )} + + {sub_group_by && sub_group_by === "labels" && ( + + )} + + {sub_group_by && sub_group_by === "assignees" && ( + + )} + + {sub_group_by && sub_group_by === "created_by" && ( + + )}
); -}; +}); diff --git a/web/package.json b/web/package.json index a3b3ba92b75..6a261159ed0 100644 --- a/web/package.json +++ b/web/package.json @@ -14,6 +14,7 @@ "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", "@headlessui/react": "^1.7.3", + "@hello-pangea/dnd": "^16.3.0", "@heroicons/react": "^2.0.12", "@jitsu/nextjs": "^3.1.5", "@mui/icons-material": "^5.14.1", diff --git a/web/store/issue.ts b/web/store/issue.ts index fbdf1c6c4f8..00c3fa46abb 100644 --- a/web/store/issue.ts +++ b/web/store/issue.ts @@ -77,7 +77,7 @@ class IssueStore implements IIssueStore { const issueLayout = this.rootStore?.issueFilter?.userDisplayFilters?.layout || null; const issueSubGroup = this.rootStore?.issueFilter?.userDisplayFilters?.sub_group_by || null; - if (!issueLayout || !issueSubGroup) return null; + if (!issueLayout) return null; const _issueState = groupedLayouts.includes(issueLayout) ? issueSubGroup diff --git a/web/store/kanban_view.ts b/web/store/kanban_view.ts index 0289e9d62ae..c0d15227aa5 100644 --- a/web/store/kanban_view.ts +++ b/web/store/kanban_view.ts @@ -1,6 +1,7 @@ import { action, computed, makeObservable } from "mobx"; // types import { RootStore } from "./root"; +import { IIssueType } from "./issue"; export interface IIssueKanBanViewStore { handleDragDrop: (source: any, destination: any) => void; @@ -26,12 +27,10 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { get canUserDragDrop() { if ( - this.rootStore?.issueFilters?.issueView && - this.rootStore?.issueFilters?.userFilters?.display_filters?.group_by && - this.rootStore?.issueFilters?.userFilters?.display_filters?.order_by && - !["my_issues"].includes(this.rootStore?.issueFilters?.issueView) && - ["state", "priority"].includes(this.rootStore?.issueFilters?.userFilters?.display_filters?.group_by) && - this.rootStore?.issueFilters?.userFilters?.display_filters?.order_by === "sort_order" + this.rootStore?.issueFilter?.userDisplayFilters?.group_by && + this.rootStore?.issueFilter?.userDisplayFilters?.order_by && + ["state", "priority"].includes(this.rootStore?.issueFilter?.userDisplayFilters?.group_by) && + this.rootStore?.issueFilter?.userDisplayFilters?.order_by === "sort_order" ) { return true; } @@ -45,26 +44,18 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { } handleDragDrop = async (source: any, destination: any) => { - const workspaceId = this.rootStore?.issueFilters?.workspaceId; - const projectId = this.rootStore?.issueFilters?.projectId; - const issueView = this.rootStore?.issueFilters?.issueView; - const issueLayout = this.rootStore?.issueFilters?.userFilters?.display_filters?.layout; + const workspaceSlug = this.rootStore?.workspace?.workspaceSlug; + const projectId = this.rootStore?.project?.projectId; + const issueType: IIssueType | null = this.rootStore?.issue?.getIssueType; + const issueLayout = this.rootStore?.issueFilter?.userDisplayFilters?.layout || null; const sortOrderDefaultValue = 10000; - if ( - this.rootStore?.issueView?.getIssues && - workspaceId && - projectId && - issueView && - issueLayout && - issueView != "my_issues" - ) { - const projectSortedIssues: any = - this.rootStore?.issueView.issues?.[workspaceId]?.project_issues?.[projectId]?.[issueView]?.[issueLayout]; + if (workspaceSlug && projectId && issueType && issueLayout === "kanban" && this.rootStore.issue.getIssues) { + const currentIssues: any = this.rootStore.issue.getIssues; let updateIssue: any = { - workspaceId: workspaceId, + workspaceSlug: workspaceSlug, projectId: projectId, }; @@ -73,7 +64,7 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { // vertical if (source.droppableId === destination.droppableId) { const _columnId = source.droppableId; - const _issues = projectSortedIssues[_columnId]; + const _issues = currentIssues[_columnId]; // update the sort order if (destination.index === 0) { @@ -92,7 +83,7 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { _issues.splice(destination.index, 0, { ...removed, sort_order: updateIssue.sort_order }); updateIssue = { ...updateIssue, issueId: removed?.id }; - projectSortedIssues[_columnId] = _issues; + currentIssues[_columnId] = _issues; } // horizontal @@ -100,8 +91,8 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { const _sourceColumnId = source.droppableId; const _destinationColumnId = destination.droppableId; - const _sourceIssues = projectSortedIssues[_sourceColumnId]; - const _destinationIssues = projectSortedIssues[_destinationColumnId]; + const _sourceIssues = currentIssues[_sourceColumnId]; + const _destinationIssues = currentIssues[_destinationColumnId]; if (_destinationIssues.length > 0) { if (destination.index === 0) { @@ -142,8 +133,8 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { }); updateIssue = { ...updateIssue, issueId: removed?.id }; - projectSortedIssues[_sourceColumnId] = _sourceIssues; - projectSortedIssues[_destinationColumnId] = _destinationIssues; + currentIssues[_sourceColumnId] = _sourceIssues; + currentIssues[_destinationColumnId] = _destinationIssues; } } @@ -155,29 +146,23 @@ class IssueKanBanViewStore implements IIssueKanBanViewStore { if (this.canUserDragDropHorizontally && source.droppableId != destination.droppableId) { } - this.rootStore.issueView.issues = { - ...this.rootStore?.issueView.issues, - [workspaceId]: { - ...this.rootStore?.issueView.issues?.[workspaceId], - project_issues: { - ...this.rootStore?.issueView.issues?.[workspaceId]?.project_issues, - [projectId]: { - ...this.rootStore?.issueView.issues?.[workspaceId]?.project_issues?.[projectId], - [issueView]: { - ...this.rootStore?.issueView.issues?.[workspaceId]?.project_issues?.[projectId]?.[issueView], - [issueLayout]: projectSortedIssues, - }, - }, + this.rootStore.issue.issues = { + ...this.rootStore?.issue.issues, + [projectId]: { + ...this.rootStore?.issue.issues?.[projectId], + [issueType]: { + ...this.rootStore?.issue.issues?.[projectId]?.[issueType], + [issueType]: currentIssues, }, }, }; - this.rootStore.issueDetail?.updateIssueAsync( - updateIssue.workspaceId, - updateIssue.projectId, - updateIssue.issueId, - updateIssue - ); + // this.rootStore.issueDetail?.updateIssueAsync( + // updateIssue.workspaceSlug, + // updateIssue.projectId, + // updateIssue.issueId, + // updateIssue + // ); } }; } From f4e18a5c444766a1ad4cd0904b89668bff02cb24 Mon Sep 17 00:00:00 2001 From: gurusainath Date: Tue, 26 Sep 2023 00:56:49 +0530 Subject: [PATCH 3/3] chore: yarn.lock updated --- yarn.lock | 60 ++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 55 insertions(+), 5 deletions(-) diff --git a/yarn.lock b/yarn.lock index d357987f0dd..ace724162ad 100644 --- a/yarn.lock +++ b/yarn.lock @@ -926,6 +926,13 @@ dependencies: regenerator-runtime "^0.14.0" +"@babel/runtime@^7.12.1", "@babel/runtime@^7.22.5": + version "7.23.1" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.1.tgz#72741dc4d413338a91dcb044a86f3c0bc402646d" + integrity sha512-hC2v6p8ZSI/W0HUzh3V8C5g+NwSKzKPtJwSpTjwl0o297GP9+ZLQSkdvHz46CM3LqyoXxq+5G9komY+eSqSO0g== + dependencies: + regenerator-runtime "^0.14.0" + "@babel/template@^7.22.15", "@babel/template@^7.22.5": version "7.22.15" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.15.tgz#09576efc3830f0430f4548ef971dde1350ef2f38" @@ -1243,6 +1250,19 @@ dependencies: client-only "^0.0.1" +"@hello-pangea/dnd@^16.3.0": + version "16.3.0" + resolved "https://registry.yarnpkg.com/@hello-pangea/dnd/-/dnd-16.3.0.tgz#3776212f812df4e8e69c42831ec8ab7ff3a087d6" + integrity sha512-RYQ/K8shtJoyNPvFWz0gfXIK7HF3P3mL9UZFGMuHB0ljRSXVgMjVFI/FxcZmakMzw6tO7NflWLriwTNBow/4vw== + dependencies: + "@babel/runtime" "^7.22.5" + css-box-model "^1.2.1" + memoize-one "^6.0.0" + raf-schd "^4.0.3" + react-redux "^8.1.1" + redux "^4.2.1" + use-memo-one "^1.1.3" + "@heroicons/react@^2.0.12": version "2.0.18" resolved "https://registry.yarnpkg.com/@heroicons/react/-/react-2.0.18.tgz#f80301907c243df03c7e9fd76c0286e95361f7c1" @@ -2462,6 +2482,14 @@ "@types/react" "*" hoist-non-react-statics "^3.3.0" +"@types/hoist-non-react-statics@^3.3.1": + version "3.3.2" + resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#dc1e9ded53375d37603c479cc12c693b0878aa2a" + integrity sha512-YIQtIg4PKr7ZyqNPZObpxfHsHEmuB8dXCxd6qVcGuQVDK2bpsF7bYNnBJ4Nn7giuACZg+WewExgrtAJ3XnA4Xw== + dependencies: + "@types/react" "*" + hoist-non-react-statics "^3.3.0" + "@types/js-cookie@^3.0.2", "@types/js-cookie@^3.0.3": version "3.0.3" resolved "https://registry.yarnpkg.com/@types/js-cookie/-/js-cookie-3.0.3.tgz#d6bfbbdd0c187354ca555213d1962f6d0691ff4e" @@ -2693,6 +2721,11 @@ resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.8.tgz#bb197b9639aa1a04cf464a617fe800cccd92ad5c" integrity sha512-d0XxK3YTObnWVp6rZuev3c49+j4Lo8g4L1ZRm9z5L0xpoZycUPshHgczK5gsUMaZOstjVYYi09p5gYvUtfChYw== +"@types/use-sync-external-store@^0.0.3": + version "0.0.3" + resolved "https://registry.yarnpkg.com/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz#b6725d5f4af24ace33b36fafd295136e75509f43" + integrity sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA== + "@types/uuid@^8.3.4": version "8.3.4" resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-8.3.4.tgz#bd86a43617df0594787d38b735f55c805becf1bc" @@ -3486,7 +3519,7 @@ crypto-random-string@^2.0.0: resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-2.0.0.tgz#ef2a7a966ec11083388369baa02ebead229b30d5" integrity sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA== -css-box-model@^1.2.0: +css-box-model@^1.2.0, css-box-model@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/css-box-model/-/css-box-model-1.2.1.tgz#59951d3b81fd6b2074a62d49444415b0d2b4d7c1" integrity sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw== @@ -5705,6 +5738,11 @@ memoize-one@^5.1.1: resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.2.1.tgz#8337aa3c4335581839ec01c3d594090cebe8f00e" integrity sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q== +memoize-one@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-6.0.0.tgz#b2591b871ed82948aee4727dc6abceeeac8c1045" + integrity sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw== + merge-stream@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60" @@ -6731,7 +6769,7 @@ queue-tick@^1.0.1: resolved "https://registry.yarnpkg.com/queue-tick/-/queue-tick-1.0.1.tgz#f6f07ac82c1fd60f82e098b417a80e52f1f4c142" integrity sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag== -raf-schd@^4.0.2: +raf-schd@^4.0.2, raf-schd@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/raf-schd/-/raf-schd-4.0.3.tgz#5d6c34ef46f8b2a0e880a8fcdb743efc5bfdbc1a" integrity sha512-tQkJl2GRWh83ui2DiPTJz9wEiMN20syf+5oKfB03yYP7ioZcJwsIK8FjrtLwH1m7C7e+Tt2yYBlrOpdT+dyeIQ== @@ -6924,6 +6962,18 @@ react-redux@^7.2.0: prop-types "^15.7.2" react-is "^17.0.2" +react-redux@^8.1.1: + version "8.1.2" + resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-8.1.2.tgz#9076bbc6b60f746659ad6d51cb05de9c5e1e9188" + integrity sha512-xJKYI189VwfsFc4CJvHqHlDrzyFTY/3vZACbE+rr/zQ34Xx1wQfB4OTOSeOSNrF6BDVe8OOdxIrAnMGXA3ggfw== + dependencies: + "@babel/runtime" "^7.12.1" + "@types/hoist-non-react-statics" "^3.3.1" + "@types/use-sync-external-store" "^0.0.3" + hoist-non-react-statics "^3.3.2" + react-is "^18.0.0" + use-sync-external-store "^1.0.0" + react-remove-scroll-bar@^2.3.3: version "2.3.4" resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.4.tgz#53e272d7a5cb8242990c7f144c44d8bd8ab5afd9" @@ -7006,7 +7056,7 @@ readdirp@~3.6.0: dependencies: picomatch "^2.2.1" -redux@^4.0.0, redux@^4.0.4: +redux@^4.0.0, redux@^4.0.4, redux@^4.2.1: version "4.2.1" resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197" integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w== @@ -8158,7 +8208,7 @@ use-debounce@^9.0.4: resolved "https://registry.yarnpkg.com/use-debounce/-/use-debounce-9.0.4.tgz#51d25d856fbdfeb537553972ce3943b897f1ac85" integrity sha512-6X8H/mikbrt0XE8e+JXRtZ8yYVvKkdYRfmIhWZYsP8rcNs9hk3APV8Ua2mFkKRLcJKVdnX2/Vwrmg2GWKUQEaQ== -use-memo-one@^1.1.1: +use-memo-one@^1.1.1, use-memo-one@^1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/use-memo-one/-/use-memo-one-1.1.3.tgz#2fd2e43a2169eabc7496960ace8c79efef975e99" integrity sha512-g66/K7ZQGYrI6dy8GLpVcMsBp4s17xNkYJVSMvTEevGy3nDxHOfE6z8BVE22+5G5x7t3+bhzrlTDB7ObrEE0cQ== @@ -8171,7 +8221,7 @@ use-sidecar@^1.1.2: detect-node-es "^1.1.0" tslib "^2.0.0" -use-sync-external-store@1.2.0, use-sync-external-store@^1.2.0: +use-sync-external-store@1.2.0, use-sync-external-store@^1.0.0, use-sync-external-store@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a" integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==