diff --git a/apps/app/components/account/email-code-form.tsx b/apps/app/components/account/email-code-form.tsx index 03f9ea822..93298b4e0 100644 --- a/apps/app/components/account/email-code-form.tsx +++ b/apps/app/components/account/email-code-form.tsx @@ -35,7 +35,6 @@ export const EmailCodeForm = ({ onSuccess }: any) => { }); const onSubmit = ({ email }: EmailCodeFormValues) => { - console.log(email); authenticationService .emailCode({ email }) .then((res) => { diff --git a/apps/app/components/command-palette/index.tsx b/apps/app/components/command-palette/index.tsx index 26dc252b2..9b72b918d 100644 --- a/apps/app/components/command-palette/index.tsx +++ b/apps/app/components/command-palette/index.tsx @@ -1,37 +1,38 @@ // TODO: Refactor this component: into a different file, use this file to export the components import React, { useState, useCallback, useEffect } from "react"; -// next + import { useRouter } from "next/router"; -// swr + import useSWR from "swr"; -// hooks + +// headless ui import { Combobox, Dialog, Transition } from "@headlessui/react"; +// services +import userService from "services/user.service"; +// hooks +import useTheme from "hooks/use-theme"; +import useToast from "hooks/use-toast"; +import useUser from "hooks/use-user"; +// components +import ShortcutsModal from "components/command-palette/shortcuts"; +import { BulkDeleteIssuesModal } from "components/core"; +import { CreateProjectModal } from "components/project"; +import { CreateUpdateIssueModal } from "components/issues"; +import { CreateUpdateModuleModal } from "components/modules"; +import CreateUpdateCycleModal from "components/project/cycles/create-update-cycle-modal"; +// ui +import { Button } from "components/ui"; +// icons import { FolderIcon, RectangleStackIcon, ClipboardDocumentListIcon, MagnifyingGlassIcon, } from "@heroicons/react/24/outline"; -import useTheme from "hooks/use-theme"; -import useToast from "hooks/use-toast"; -import useUser from "hooks/use-user"; -// services -import userService from "services/user.service"; -// components -import ShortcutsModal from "components/command-palette/shortcuts"; -import { CreateProjectModal } from "components/project"; -import { CreateUpdateIssueModal } from "components/issues"; -import { CreateUpdateModuleModal } from "components/modules"; -import CreateUpdateCycleModal from "components/project/cycles/create-update-cycle-modal"; -import BulkDeleteIssuesModal from "components/common/bulk-delete-issues-modal"; -// headless ui // helpers import { copyTextToClipboard } from "helpers/string.helper"; // types import { IIssue } from "types"; -// ui -import { Button } from "components/ui"; -// icons // fetch-keys import { USER_ISSUE } from "constants/fetch-keys"; @@ -111,7 +112,6 @@ const CommandPalette: React.FC = () => { if (!router.query.issueId) return; const url = new URL(window.location.href); - console.log(url); copyTextToClipboard(url.href) .then(() => { setToastAlert({ diff --git a/apps/app/components/common/board-view/single-board.tsx b/apps/app/components/common/board-view/single-board.tsx deleted file mode 100644 index aedc969b5..000000000 --- a/apps/app/components/common/board-view/single-board.tsx +++ /dev/null @@ -1,3 +0,0 @@ -const SingleBoard = () => <>; - -export default SingleBoard; diff --git a/apps/app/components/common/board-view/board-header.tsx b/apps/app/components/core/board-view/board-header.tsx similarity index 99% rename from apps/app/components/common/board-view/board-header.tsx rename to apps/app/components/core/board-view/board-header.tsx index c04bc95d5..3c76b7ee9 100644 --- a/apps/app/components/common/board-view/board-header.tsx +++ b/apps/app/components/core/board-view/board-header.tsx @@ -22,7 +22,7 @@ type Props = { selectedGroup: NestedKeyOf | null; groupTitle: string; createdBy: string | null; - bgColor: string; + bgColor?: string; addIssueToState: () => void; provided?: DraggableProvided; }; diff --git a/apps/app/components/project/cycles/board-view/single-board.tsx b/apps/app/components/core/board-view/single-board.tsx similarity index 53% rename from apps/app/components/project/cycles/board-view/single-board.tsx rename to apps/app/components/core/board-view/single-board.tsx index ab028c2cf..b7ca87291 100644 --- a/apps/app/components/project/cycles/board-view/single-board.tsx +++ b/apps/app/components/core/board-view/single-board.tsx @@ -1,70 +1,68 @@ -import React, { useState } from "react"; +import { Dispatch, SetStateAction, useState } from "react"; import { useRouter } from "next/router"; import useSWR from "swr"; // react-beautiful-dnd -import { Draggable } from "react-beautiful-dnd"; +import StrictModeDroppable from "components/dnd/StrictModeDroppable"; +import { Draggable, DraggableProvided, DraggableStateSnapshot } from "react-beautiful-dnd"; // services import workspaceService from "services/workspace.service"; +// hooks +import useIssuesProperties from "hooks/use-issue-properties"; // components -import SingleIssue from "components/common/board-view/single-issue"; -import StrictModeDroppable from "components/dnd/StrictModeDroppable"; -import BoardHeader from "components/common/board-view/board-header"; -// ui -import { CustomMenu } from "components/ui"; +import BoardHeader from "components/core/board-view/board-header"; +import SingleIssue from "components/core/board-view/single-issue"; // icons import { PlusIcon } from "@heroicons/react/24/outline"; // types -import { IIssue, IWorkspaceMember, NestedKeyOf, Properties, UserAuth } from "types"; +import { IIssue, IWorkspaceMember, NestedKeyOf, UserAuth } from "types"; // fetch-keys import { WORKSPACE_MEMBERS } from "constants/fetch-keys"; type Props = { - properties: Properties; + provided?: DraggableProvided; + snapshot?: DraggableStateSnapshot; + bgColor?: string; + groupTitle: string; groupedByIssues: { [key: string]: IIssue[]; }; selectedGroup: NestedKeyOf | null; - groupTitle: string; - createdBy: string | null; - bgColor?: string; - openCreateIssueModal: (issue?: IIssue, actionType?: "create" | "edit" | "delete") => void; - openIssuesListModal: () => void; - handleDeleteIssue: React.Dispatch>; - setPreloadedData: React.Dispatch< - React.SetStateAction< - | (Partial & { - actionType: "createIssue" | "edit" | "delete"; - }) - | null - > - >; - stateId: string | null; + addIssueToState: () => void; + handleDeleteIssue?: Dispatch> | undefined; userAuth: UserAuth; }; -const SingleModuleBoard: React.FC = ({ - properties, +export const CommonSingleBoard: React.FC = ({ + provided, + snapshot, + bgColor, + groupTitle, groupedByIssues, selectedGroup, - groupTitle, - createdBy, - bgColor, - openCreateIssueModal, - openIssuesListModal, + addIssueToState, handleDeleteIssue, - setPreloadedData, - stateId, userAuth, }) => { // collapse/expand const [isCollapsed, setIsCollapsed] = useState(true); const router = useRouter(); + const { workspaceSlug, projectId } = router.query; - const { workspaceSlug, cycleId } = router.query; + const [properties] = useIssuesProperties(workspaceSlug as string, projectId as string); + + const { data: members } = useSWR( + workspaceSlug ? WORKSPACE_MEMBERS : null, + workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null + ); + + const createdBy = + selectedGroup === "created_by" + ? members?.find((m) => m.member.id === groupTitle)?.member.first_name ?? "loading..." + : null; if (selectedGroup === "priority") groupTitle === "high" @@ -75,32 +73,25 @@ const SingleModuleBoard: React.FC = ({ ? (bgColor = "#22c55e") : (bgColor = "#ff0000"); - const { data: people } = useSWR( - workspaceSlug ? WORKSPACE_MEMBERS : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null - ); - return ( -
+
{ - openCreateIssueModal(); - if (selectedGroup !== null) { - setPreloadedData({ - state: stateId !== null ? stateId : undefined, - [selectedGroup]: groupTitle, - actionType: "createIssue", - }); - } - }} - bgColor={bgColor ?? ""} + addIssueToState={addIssueToState} + bgColor={bgColor} createdBy={createdBy} groupTitle={groupTitle} groupedByIssues={groupedByIssues} isCollapsed={isCollapsed} setIsCollapsed={setIsCollapsed} selectedGroup={selectedGroup} + provided={provided} /> {(provided, snapshot) => ( @@ -116,7 +107,7 @@ const SingleModuleBoard: React.FC = ({ ...(childIssue?.assignees_list ?? []), ...(childIssue?.assignees ?? []), ]?.map((assignee) => { - const tempPerson = people?.find((p) => p.member.id === assignee)?.member; + const tempPerson = members?.find((p) => p.member.id === assignee)?.member; return tempPerson; }); @@ -130,13 +121,11 @@ const SingleModuleBoard: React.FC = ({ {...provided.dragHandleProps} > @@ -146,35 +135,14 @@ const SingleModuleBoard: React.FC = ({ ); })} {provided.placeholder} - - - Add issue - - } - className="mt-1" - optionsPosition="left" - noBorder + {/* */}
)} @@ -182,5 +150,3 @@ const SingleModuleBoard: React.FC = ({
); }; - -export default SingleModuleBoard; diff --git a/apps/app/components/common/board-view/single-issue.tsx b/apps/app/components/core/board-view/single-issue.tsx similarity index 100% rename from apps/app/components/common/board-view/single-issue.tsx rename to apps/app/components/core/board-view/single-issue.tsx diff --git a/apps/app/components/common/bulk-delete-issues-modal.tsx b/apps/app/components/core/bulk-delete-issues-modal.tsx similarity index 97% rename from apps/app/components/common/bulk-delete-issues-modal.tsx rename to apps/app/components/core/bulk-delete-issues-modal.tsx index 64a65c22a..143c5bfe8 100644 --- a/apps/app/components/common/bulk-delete-issues-modal.tsx +++ b/apps/app/components/core/bulk-delete-issues-modal.tsx @@ -8,7 +8,7 @@ import useSWR, { mutate } from "swr"; import { SubmitHandler, useForm } from "react-hook-form"; // services import { Combobox, Dialog, Transition } from "@headlessui/react"; -import { FolderIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; +import { MagnifyingGlassIcon } from "@heroicons/react/24/outline"; import issuesServices from "services/issues.service"; import projectService from "services/project.service"; // hooks @@ -32,7 +32,7 @@ type Props = { setIsOpen: React.Dispatch>; }; -const BulkDeleteIssuesModal: React.FC = ({ isOpen, setIsOpen }) => { +export const BulkDeleteIssuesModal: React.FC = ({ isOpen, setIsOpen }) => { const [query, setQuery] = useState(""); const router = useRouter(); @@ -256,5 +256,3 @@ const BulkDeleteIssuesModal: React.FC = ({ isOpen, setIsOpen }) => { ); }; - -export default BulkDeleteIssuesModal; diff --git a/apps/app/components/common/existing-issues-list-modal.tsx b/apps/app/components/core/existing-issues-list-modal.tsx similarity index 98% rename from apps/app/components/common/existing-issues-list-modal.tsx rename to apps/app/components/core/existing-issues-list-modal.tsx index 5179facd4..e03d3fdbd 100644 --- a/apps/app/components/common/existing-issues-list-modal.tsx +++ b/apps/app/components/core/existing-issues-list-modal.tsx @@ -32,7 +32,7 @@ type Props = { handleOnSubmit: any; }; -const ExistingIssuesListModal: React.FC = ({ +export const ExistingIssuesListModal: React.FC = ({ isOpen, handleClose: onClose, issues, @@ -233,5 +233,3 @@ const ExistingIssuesListModal: React.FC = ({ ); }; - -export default ExistingIssuesListModal; diff --git a/apps/app/components/common/image-upload-modal.tsx b/apps/app/components/core/image-upload-modal.tsx similarity index 100% rename from apps/app/components/common/image-upload-modal.tsx rename to apps/app/components/core/image-upload-modal.tsx diff --git a/apps/app/components/core/index.ts b/apps/app/components/core/index.ts index 8266a5111..dc7fced29 100644 --- a/apps/app/components/core/index.ts +++ b/apps/app/components/core/index.ts @@ -1 +1,5 @@ export * from "./not-authorized-view"; +export * from "./bulk-delete-issues-modal"; +export * from "./existing-issues-list-modal"; +export * from "./image-upload-modal"; +export * from "./view"; diff --git a/apps/app/components/common/list-view/single-issue.tsx b/apps/app/components/core/list-view/single-issue.tsx similarity index 100% rename from apps/app/components/common/list-view/single-issue.tsx rename to apps/app/components/core/list-view/single-issue.tsx diff --git a/apps/app/components/core/view.tsx b/apps/app/components/core/view.tsx index 1fe147f22..69d5f191e 100644 --- a/apps/app/components/core/view.tsx +++ b/apps/app/components/core/view.tsx @@ -23,7 +23,7 @@ type Props = { issues?: IIssue[]; }; -const View: React.FC = ({ issues }) => { +export const IssuesFilterView: React.FC = ({ issues }) => { const router = useRouter(); const { workspaceSlug, projectId } = router.query; @@ -203,5 +203,3 @@ const View: React.FC = ({ issues }) => { ); }; - -export default View; diff --git a/apps/app/components/issues/board-view/index.tsx b/apps/app/components/issues/board-view.tsx similarity index 74% rename from apps/app/components/issues/board-view/index.tsx rename to apps/app/components/issues/board-view.tsx index 4487ec1c8..04d4156a4 100644 --- a/apps/app/components/issues/board-view/index.tsx +++ b/apps/app/components/issues/board-view.tsx @@ -5,16 +5,14 @@ import { useRouter } from "next/router"; import useSWR, { mutate } from "swr"; // react-beautiful-dnd -import { DragDropContext, DropResult } from "react-beautiful-dnd"; +import { DragDropContext, Draggable, DropResult } from "react-beautiful-dnd"; // hook -import useIssuesProperties from "hooks/use-issue-properties"; import useIssueView from "hooks/use-issue-view"; // services import stateServices from "services/state.service"; import issuesServices from "services/issues.service"; -import projectService from "services/project.service"; // components -import SingleBoard from "components/issues/board-view/single-board"; +import { CommonSingleBoard } from "components/core/board-view/single-board"; import StrictModeDroppable from "components/dnd/StrictModeDroppable"; import { CreateUpdateIssueModal, DeleteIssueModal } from "components/issues"; // ui @@ -22,7 +20,7 @@ import { Spinner } from "components/ui"; // types import type { IState, IIssue, IssueResponse, UserAuth } from "types"; // fetch-keys -import { STATE_LIST, PROJECT_ISSUES_LIST, PROJECT_MEMBERS } from "constants/fetch-keys"; +import { STATE_LIST, PROJECT_ISSUES_LIST } from "constants/fetch-keys"; type Props = { issues: IIssue[]; @@ -30,7 +28,7 @@ type Props = { userAuth: UserAuth; }; -const BoardView: React.FC = ({ issues, handleDeleteIssue, userAuth }) => { +export const IssuesBoardView: React.FC = ({ issues, handleDeleteIssue, userAuth }) => { const [createIssueModal, setCreateIssueModal] = useState(false); const [isIssueDeletionOpen, setIsIssueDeletionOpen] = useState(false); const [issueDeletionData, setIssueDeletionData] = useState(); @@ -50,21 +48,6 @@ const BoardView: React.FC = ({ issues, handleDeleteIssue, userAuth }) => : null ); - const { data: members } = useSWR( - workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, - workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) - : null, - { - onErrorRetry(err, _, __, revalidate, revalidateOpts) { - if (err?.status === 403) return; - setTimeout(() => revalidate(revalidateOpts), 5000); - }, - } - ); - - const [properties] = useIssuesProperties(workspaceSlug as string, projectId as string); - const handleOnDragEnd = useCallback( (result: DropResult) => { if (!result.destination || !workspaceSlug || !projectId) return; @@ -208,36 +191,42 @@ const BoardView: React.FC = ({ issues, handleDeleteIssue, userAuth }) => ref={provided.innerRef} >
- {Object.keys(groupedByIssues).map((singleGroup, index) => ( - m.member.id === singleGroup)?.member - .first_name ?? "loading..." - : null - } - groupedByIssues={groupedByIssues} - index={index} - setIsIssueOpen={setCreateIssueModal} - properties={properties} - setPreloadedData={setPreloadedData} - stateId={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.id ?? null - : null - } - bgColor={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.color - : "#000000" - } - handleDeleteIssue={handleDeleteIssue} - userAuth={userAuth} - /> - ))} + {Object.keys(groupedByIssues).map((singleGroup, index) => { + const stateId = + selectedGroup === "state_detail.name" + ? states?.find((s) => s.name === singleGroup)?.id ?? null + : null; + + return ( + + {(provided, snapshot) => ( + s.name === singleGroup)?.color + : "#000000" + } + groupTitle={singleGroup} + groupedByIssues={groupedByIssues} + selectedGroup={selectedGroup} + addIssueToState={() => { + setCreateIssueModal(true); + if (selectedGroup) + setPreloadedData({ + state: stateId !== null ? stateId : undefined, + [selectedGroup]: singleGroup, + actionType: "createIssue", + }); + }} + handleDeleteIssue={handleDeleteIssue} + userAuth={userAuth} + /> + )} + + ); + })}
{provided.placeholder}
@@ -254,5 +243,3 @@ const BoardView: React.FC = ({ issues, handleDeleteIssue, userAuth }) => ); }; - -export default BoardView; diff --git a/apps/app/components/issues/board-view/single-board.tsx b/apps/app/components/issues/board-view/single-board.tsx deleted file mode 100644 index 8630f223c..000000000 --- a/apps/app/components/issues/board-view/single-board.tsx +++ /dev/null @@ -1,174 +0,0 @@ -import React, { useState } from "react"; - -import { useRouter } from "next/router"; - -import useSWR from "swr"; - -// react-beautiful-dnd -import { Draggable } from "react-beautiful-dnd"; -// components -import StrictModeDroppable from "components/dnd/StrictModeDroppable"; -import SingleIssue from "components/common/board-view/single-issue"; -import BoardHeader from "components/common/board-view/board-header"; -// icons -import { PlusIcon } from "@heroicons/react/24/outline"; -// services -import workspaceService from "services/workspace.service"; -// types -import { IIssue, Properties, NestedKeyOf, IWorkspaceMember, UserAuth } from "types"; -// fetch-keys -import { WORKSPACE_MEMBERS } from "constants/fetch-keys"; - -type Props = { - selectedGroup: NestedKeyOf | null; - groupTitle: string; - groupedByIssues: { - [key: string]: IIssue[]; - }; - index: number; - setIsIssueOpen: React.Dispatch>; - properties: Properties; - setPreloadedData: React.Dispatch< - React.SetStateAction< - | (Partial & { - actionType: "createIssue" | "edit" | "delete"; - }) - | undefined - > - >; - bgColor?: string; - stateId: string | null; - createdBy: string | null; - handleDeleteIssue: React.Dispatch>; - userAuth: UserAuth; -}; - -const SingleBoard: React.FC = ({ - selectedGroup, - groupTitle, - groupedByIssues, - index, - setIsIssueOpen, - properties, - setPreloadedData, - bgColor = "#0f2b16", - stateId, - createdBy, - handleDeleteIssue, - userAuth, -}) => { - // Collapse/Expand - const [isCollapsed, setIsCollapsed] = useState(true); - - const router = useRouter(); - const { workspaceSlug } = router.query; - - if (selectedGroup === "priority") - groupTitle === "high" - ? (bgColor = "#dc2626") - : groupTitle === "medium" - ? (bgColor = "#f97316") - : groupTitle === "low" - ? (bgColor = "#22c55e") - : (bgColor = "#ff0000"); - - const { data: people } = useSWR( - workspaceSlug ? WORKSPACE_MEMBERS : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null - ); - - const addIssueToState = () => { - setIsIssueOpen(true); - if (selectedGroup) - setPreloadedData({ - state: stateId !== null ? stateId : undefined, - [selectedGroup]: groupTitle, - actionType: "createIssue", - }); - }; - - return ( - - {(provided, snapshot) => ( -
-
- - - {(provided, snapshot) => ( -
- {groupedByIssues[groupTitle].map((childIssue, index: number) => { - const assignees = [ - ...(childIssue?.assignees_list ?? []), - ...(childIssue?.assignees ?? []), - ]?.map((assignee) => { - const tempPerson = people?.find((p) => p.member.id === assignee)?.member; - - return tempPerson; - }); - - return ( - - {(provided, snapshot) => ( -
- -
- )} - - ); - })} - {provided.placeholder} - -
- )} - -
-
- )} - - ); -}; - -export default SingleBoard; diff --git a/apps/app/components/issues/index.ts b/apps/app/components/issues/index.ts index de602c2e1..58d2b2fa0 100644 --- a/apps/app/components/issues/index.ts +++ b/apps/app/components/issues/index.ts @@ -1,7 +1,7 @@ -export * from "./board-view"; export * from "./comment"; export * from "./sidebar-select"; export * from "./activity"; +export * from "./board-view"; export * from "./delete-issue-modal"; export * from "./description-form"; export * from "./form"; diff --git a/apps/app/components/issues/list-view.tsx b/apps/app/components/issues/list-view.tsx index eb5c00527..2ba5d0b24 100644 --- a/apps/app/components/issues/list-view.tsx +++ b/apps/app/components/issues/list-view.tsx @@ -16,7 +16,7 @@ import workspaceService from "services/workspace.service"; import { Spinner } from "components/ui"; // components import { CreateUpdateIssueModal } from "components/issues/modal"; -import SingleListIssue from "components/common/list-view/single-issue"; +import SingleListIssue from "components/core/list-view/single-issue"; // helpers import { addSpaceIfCamelCase } from "helpers/string.helper"; // types diff --git a/apps/app/components/issues/modal.tsx b/apps/app/components/issues/modal.tsx index 426b8a554..57c5bd62f 100644 --- a/apps/app/components/issues/modal.tsx +++ b/apps/app/components/issues/modal.tsx @@ -209,6 +209,8 @@ export const CreateUpdateIssueModal: React.FC = ({ const payload: Partial = { ...formData, + description: formData.description ? formData.description : "", + description_html: formData.description_html ? formData.description_html : "

", }; if (!data) await createIssue(payload); diff --git a/apps/app/components/issues/sidebar-select/blocked.tsx b/apps/app/components/issues/sidebar-select/blocked.tsx index a6024a1a4..70de8d7e9 100644 --- a/apps/app/components/issues/sidebar-select/blocked.tsx +++ b/apps/app/components/issues/sidebar-select/blocked.tsx @@ -177,7 +177,6 @@ export const SidebarBlockedSelect: React.FC = ({
{ - console.log("Triggered"); const selectedIssues = watchBlocked("blocked_issue_ids"); if (selectedIssues.includes(val)) setValue( diff --git a/apps/app/components/issues/sub-issues-list-modal.tsx b/apps/app/components/issues/sub-issues-list-modal.tsx index ddf98e195..f3ffe50ad 100644 --- a/apps/app/components/issues/sub-issues-list-modal.tsx +++ b/apps/app/components/issues/sub-issues-list-modal.tsx @@ -151,7 +151,7 @@ export const SubIssuesListModal: React.FC = ({ isOpen, handleClose, paren }} > = ({ void; openIssuesListModal: () => void; handleDeleteIssue: React.Dispatch>; @@ -38,9 +36,8 @@ type Props = { userAuth: UserAuth; }; -const ModulesBoardView: React.FC = ({ +export const ModulesBoardView: React.FC = ({ issues, - members, openCreateIssueModal, openIssuesListModal, handleDeleteIssue, @@ -50,7 +47,6 @@ const ModulesBoardView: React.FC = ({ const router = useRouter(); const { workspaceSlug, projectId, moduleId } = router.query; - const [properties] = useIssuesProperties(workspaceSlug as string, projectId as string); const { issueView, groupedByIssues, groupByProperty: selectedGroup } = useIssueView(issues); const { data: states } = useSWR( @@ -134,36 +130,39 @@ const ModulesBoardView: React.FC = ({
- {Object.keys(groupedByIssues).map((singleGroup) => ( - m.member.id === singleGroup)?.member.first_name ?? - "loading..." - : null - } - groupedByIssues={groupedByIssues} - bgColor={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.color - : "#000000" - } - properties={properties} - openIssuesListModal={openIssuesListModal} - openCreateIssueModal={openCreateIssueModal} - handleDeleteIssue={handleDeleteIssue} - setPreloadedData={setPreloadedData} - stateId={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.id ?? null - : null - } - userAuth={userAuth} - /> - ))} + {Object.keys(groupedByIssues).map((singleGroup) => { + const stateId = + selectedGroup === "state_detail.name" + ? states?.find((s) => s.name === singleGroup)?.id ?? null + : null; + + return ( + s.name === singleGroup)?.color + : "#000000" + } + groupTitle={singleGroup} + groupedByIssues={groupedByIssues} + selectedGroup={selectedGroup} + addIssueToState={() => { + openCreateIssueModal(); + if (selectedGroup !== null) { + setPreloadedData({ + state: stateId !== null ? stateId : undefined, + [selectedGroup]: singleGroup, + actionType: "createIssue", + }); + } + }} + // openIssuesListModal={openIssuesListModal} + handleDeleteIssue={handleDeleteIssue} + userAuth={userAuth} + /> + ); + })}
@@ -177,5 +176,3 @@ const ModulesBoardView: React.FC = ({ ); }; - -export default ModulesBoardView; diff --git a/apps/app/components/modules/board-view/single-board.tsx b/apps/app/components/modules/board-view/single-board.tsx deleted file mode 100644 index f6f1cebb8..000000000 --- a/apps/app/components/modules/board-view/single-board.tsx +++ /dev/null @@ -1,185 +0,0 @@ -import React, { useState } from "react"; - -import { useRouter } from "next/router"; - -import useSWR from "swr"; - -// react-beautiful-dnd -import { Draggable } from "react-beautiful-dnd"; -// services -import workspaceService from "services/workspace.service"; -// components -import SingleIssue from "components/common/board-view/single-issue"; -import StrictModeDroppable from "components/dnd/StrictModeDroppable"; -import BoardHeader from "components/common/board-view/board-header"; -// ui -import { CustomMenu } from "components/ui"; -// icons -import { PlusIcon } from "@heroicons/react/24/outline"; -// types -import { IIssue, IWorkspaceMember, NestedKeyOf, Properties, UserAuth } from "types"; -// fetch-keys -import { WORKSPACE_MEMBERS } from "constants/fetch-keys"; - -type Props = { - properties: Properties; - groupedByIssues: { - [key: string]: IIssue[]; - }; - selectedGroup: NestedKeyOf | null; - groupTitle: string; - createdBy: string | null; - bgColor?: string; - openCreateIssueModal: (issue?: IIssue, actionType?: "create" | "edit" | "delete") => void; - openIssuesListModal: () => void; - handleDeleteIssue: React.Dispatch>; - setPreloadedData: React.Dispatch< - React.SetStateAction< - | (Partial & { - actionType: "createIssue" | "edit" | "delete"; - }) - | null - > - >; - stateId: string | null; - userAuth: UserAuth; -}; - -const SingleModuleBoard: React.FC = ({ - properties, - groupedByIssues, - selectedGroup, - groupTitle, - createdBy, - bgColor, - openCreateIssueModal, - openIssuesListModal, - handleDeleteIssue, - setPreloadedData, - stateId, - userAuth, -}) => { - // Collapse/Expand - const [isCollapsed, setIsCollapsed] = useState(true); - - const router = useRouter(); - const { workspaceSlug, moduleId } = router.query; - - if (selectedGroup === "priority") - groupTitle === "high" - ? (bgColor = "#dc2626") - : groupTitle === "medium" - ? (bgColor = "#f97316") - : groupTitle === "low" - ? (bgColor = "#22c55e") - : (bgColor = "#ff0000"); - - const { data: people } = useSWR( - workspaceSlug ? WORKSPACE_MEMBERS : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null - ); - - return ( -
-
- { - openCreateIssueModal(); - if (selectedGroup !== null) { - setPreloadedData({ - state: stateId !== null ? stateId : undefined, - [selectedGroup]: groupTitle, - actionType: "createIssue", - }); - } - }} - bgColor={bgColor ?? ""} - createdBy={createdBy} - groupTitle={groupTitle} - groupedByIssues={groupedByIssues} - isCollapsed={isCollapsed} - setIsCollapsed={setIsCollapsed} - selectedGroup={selectedGroup} - /> - - {(provided, snapshot) => ( -
- {groupedByIssues[groupTitle].map((issue, index: number) => { - const assignees = [ - ...(issue?.assignees_list ?? []), - ...(issue?.assignees ?? []), - ]?.map((assignee) => { - const tempPerson = people?.find((p) => p.member.id === assignee)?.member; - - return tempPerson; - }); - - return ( - - {(provided, snapshot) => ( -
- -
- )} - - ); - })} - {provided.placeholder} - - - Add issue - - } - className="mt-1" - optionsPosition="left" - noBorder - > - { - openCreateIssueModal(); - if (selectedGroup !== null) { - setPreloadedData({ - state: stateId !== null ? stateId : undefined, - [selectedGroup]: groupTitle, - actionType: "createIssue", - }); - } - }} - > - Create new - - openIssuesListModal()}> - Add an existing issue - - -
- )} - -
-
- ); -}; - -export default SingleModuleBoard; diff --git a/apps/app/components/modules/index.ts b/apps/app/components/modules/index.ts index bd120d8b6..558a93035 100644 --- a/apps/app/components/modules/index.ts +++ b/apps/app/components/modules/index.ts @@ -1,6 +1,6 @@ -export * from "./board-view"; export * from "./select"; export * from "./sidebar-select"; +export * from "./board-view"; export * from "./delete-module-modal"; export * from "./form"; export * from "./list-view"; diff --git a/apps/app/components/modules/list-view.tsx b/apps/app/components/modules/list-view.tsx index 195323ec1..884e00be6 100644 --- a/apps/app/components/modules/list-view.tsx +++ b/apps/app/components/modules/list-view.tsx @@ -12,7 +12,7 @@ import stateService from "services/state.service"; import useIssuesProperties from "hooks/use-issue-properties"; import useIssueView from "hooks/use-issue-view"; // components -import SingleListIssue from "components/common/list-view/single-issue"; +import SingleListIssue from "components/core/list-view/single-issue"; // ui import { CustomMenu, Spinner } from "components/ui"; // helpers diff --git a/apps/app/components/project/cycles/board-view/index.tsx b/apps/app/components/project/cycles/board-view.tsx similarity index 73% rename from apps/app/components/project/cycles/board-view/index.tsx rename to apps/app/components/project/cycles/board-view.tsx index ee37b9c75..7dae28ebb 100644 --- a/apps/app/components/project/cycles/board-view/index.tsx +++ b/apps/app/components/project/cycles/board-view.tsx @@ -6,21 +6,19 @@ import { useRouter } from "next/router"; import { DragDropContext, DropResult } from "react-beautiful-dnd"; import stateService from "services/state.service"; // hooks -import useIssuesProperties from "hooks/use-issue-properties"; import useIssueView from "hooks/use-issue-view"; // components -import SingleBoard from "components/project/cycles/board-view/single-board"; +import { CommonSingleBoard } from "components/core/board-view/single-board"; // ui import { Spinner } from "components/ui"; // types -import { CycleIssueResponse, IIssue, IProjectMember, UserAuth } from "types"; +import { CycleIssueResponse, IIssue, UserAuth } from "types"; import issuesService from "services/issues.service"; // constants import { STATE_LIST, CYCLE_ISSUES } from "constants/fetch-keys"; type Props = { issues: IIssue[]; - members: IProjectMember[] | undefined; openCreateIssueModal: (issue?: IIssue, actionType?: "create" | "edit" | "delete") => void; openIssuesListModal: () => void; handleDeleteIssue: React.Dispatch>; @@ -37,7 +35,6 @@ type Props = { const CyclesBoardView: React.FC = ({ issues, - members, openCreateIssueModal, openIssuesListModal, handleDeleteIssue, @@ -47,7 +44,6 @@ const CyclesBoardView: React.FC = ({ const router = useRouter(); const { workspaceSlug, projectId, cycleId } = router.query; - const [properties] = useIssuesProperties(workspaceSlug as string, projectId as string); const { issueView, groupedByIssues, groupByProperty: selectedGroup } = useIssueView(issues); const { data: states } = useSWR( @@ -131,36 +127,39 @@ const CyclesBoardView: React.FC = ({
- {Object.keys(groupedByIssues).map((singleGroup) => ( - m.member.id === singleGroup)?.member.first_name ?? - "loading..." - : null - } - groupedByIssues={groupedByIssues} - bgColor={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.color - : "#000000" - } - properties={properties} - openIssuesListModal={openIssuesListModal} - openCreateIssueModal={openCreateIssueModal} - handleDeleteIssue={handleDeleteIssue} - setPreloadedData={setPreloadedData} - stateId={ - selectedGroup === "state_detail.name" - ? states?.find((s) => s.name === singleGroup)?.id ?? null - : null - } - userAuth={userAuth} - /> - ))} + {Object.keys(groupedByIssues).map((singleGroup) => { + const stateId = + selectedGroup === "state_detail.name" + ? states?.find((s) => s.name === singleGroup)?.id ?? null + : null; + + return ( + s.name === singleGroup)?.color + : "#000000" + } + groupTitle={singleGroup} + groupedByIssues={groupedByIssues} + selectedGroup={selectedGroup} + addIssueToState={() => { + openCreateIssueModal(); + if (selectedGroup !== null) { + setPreloadedData({ + state: stateId !== null ? stateId : undefined, + [selectedGroup]: singleGroup, + actionType: "createIssue", + }); + } + }} + // openIssuesListModal={openIssuesListModal} + handleDeleteIssue={handleDeleteIssue} + userAuth={userAuth} + /> + ); + })}
diff --git a/apps/app/components/project/cycles/list-view/index.tsx b/apps/app/components/project/cycles/list-view/index.tsx index e86ec8de4..f3a435001 100644 --- a/apps/app/components/project/cycles/list-view/index.tsx +++ b/apps/app/components/project/cycles/list-view/index.tsx @@ -15,7 +15,7 @@ import stateService from "services/state.service"; import useIssuesProperties from "hooks/use-issue-properties"; import useIssueView from "hooks/use-issue-view"; // components -import SingleListIssue from "components/common/list-view/single-issue"; +import SingleListIssue from "components/core/list-view/single-issue"; // ui import { CustomMenu, Spinner } from "components/ui"; // helpers diff --git a/apps/app/pages/[workspaceSlug]/me/profile.tsx b/apps/app/pages/[workspaceSlug]/me/profile.tsx index 43ec74018..a9517d46d 100644 --- a/apps/app/pages/[workspaceSlug]/me/profile.tsx +++ b/apps/app/pages/[workspaceSlug]/me/profile.tsx @@ -3,8 +3,29 @@ import React, { useEffect, useState } from "react"; import Link from "next/link"; import Image from "next/image"; import { useRouter } from "next/router"; + import useSWR from "swr"; + +// react-hook-form import { useForm } from "react-hook-form"; +// lib +import { requiredAuth } from "lib/auth"; +// services +import projectService from "services/project.service"; +// hooks +import useUser from "hooks/use-user"; +import useToast from "hooks/use-toast"; +// layouts +import AppLayout from "layouts/app-layout"; +// services +import userService from "services/user.service"; +import workspaceService from "services/workspace.service"; +// components +import { ImageUploadModal } from "components/core"; +// ui +import { Button, Input, Spinner } from "components/ui"; +import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs"; +// icons import { ChevronRightIcon, ClipboardDocumentListIcon, @@ -14,30 +35,11 @@ import { UserPlusIcon, XMarkIcon, } from "@heroicons/react/24/outline"; -import type { NextPage, NextPageContext } from "next"; - -// hooks -import type { IIssue, IUser } from "types"; -import useUser from "hooks/use-user"; -import useToast from "hooks/use-toast"; -// lib -import { requiredAuth } from "lib/auth"; -// services -import projectService from "services/project.service"; -// layouts -import AppLayout from "layouts/app-layout"; -// constants -import { USER_ISSUE, USER_WORKSPACE_INVITATIONS, PROJECTS_LIST } from "constants/fetch-keys"; -// services -import userService from "services/user.service"; -import workspaceService from "services/workspace.service"; -// components -import { ImageUploadModal } from "components/common/image-upload-modal"; -// ui -import { Button, Input, Spinner } from "components/ui"; -import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs"; -// icons // types +import type { NextPage, NextPageContext } from "next"; +import type { IIssue, IUser } from "types"; +// fetch-keys +import { USER_ISSUE, USER_WORKSPACE_INVITATIONS, PROJECTS_LIST } from "constants/fetch-keys"; const defaultValues: Partial = { avatar: "", diff --git a/apps/app/pages/[workspaceSlug]/projects/[projectId]/cycles/[cycleId].tsx b/apps/app/pages/[workspaceSlug]/projects/[projectId]/cycles/[cycleId].tsx index ce2ba8939..ef359ca6f 100644 --- a/apps/app/pages/[workspaceSlug]/projects/[projectId]/cycles/[cycleId].tsx +++ b/apps/app/pages/[workspaceSlug]/projects/[projectId]/cycles/[cycleId].tsx @@ -14,9 +14,8 @@ import { IssueViewContextProvider } from "contexts/issue-view.context"; import CyclesListView from "components/project/cycles/list-view"; import CyclesBoardView from "components/project/cycles/board-view"; import { CreateUpdateIssueModal, DeleteIssueModal } from "components/issues"; -import ExistingIssuesListModal from "components/common/existing-issues-list-modal"; +import { ExistingIssuesListModal, IssuesFilterView } from "components/core"; import CycleDetailSidebar from "components/project/cycles/cycle-detail-sidebar"; -import View from "components/core/view"; // services import issuesServices from "services/issues.service"; import cycleServices from "services/cycles.service"; @@ -35,7 +34,6 @@ import { CYCLE_ISSUES, CYCLE_LIST, PROJECT_ISSUES_LIST, - PROJECT_MEMBERS, PROJECT_DETAILS, CYCLE_DETAILS, } from "constants/fetch-keys"; @@ -107,19 +105,6 @@ const SingleCycle: React.FC = (props) => { cycle: cycleId as string, })); - const { data: members } = useSWR( - workspaceSlug && projectId ? PROJECT_MEMBERS(workspaceSlug as string) : null, - workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) - : null, - { - onErrorRetry(err, _, __, revalidate, revalidateOpts) { - if (err?.status === 403) return; - setTimeout(() => revalidate(revalidateOpts), 5000); - }, - } - ); - const openCreateIssueModal = ( issue?: IIssue, actionType: "create" | "edit" | "delete" = "create" @@ -233,7 +218,7 @@ const SingleCycle: React.FC = (props) => {
- +