From abb8782c440501f0615b3544bd1422e50b685707 Mon Sep 17 00:00:00 2001 From: guru_sainath Date: Thu, 17 Aug 2023 14:24:33 +0530 Subject: [PATCH 01/10] fix: handled default view on plane deploy (#1893) * fix: handled default view on plane deploy * fix: handled default view on refresh --- .../[workspace_slug]/[project_slug]/page.tsx | 40 +++++++++++++++---- apps/space/lib/mobx/store-init.tsx | 5 --- 2 files changed, 33 insertions(+), 12 deletions(-) diff --git a/apps/space/app/[workspace_slug]/[project_slug]/page.tsx b/apps/space/app/[workspace_slug]/[project_slug]/page.tsx index 0aa9b164d..f6ccf5081 100644 --- a/apps/space/app/[workspace_slug]/[project_slug]/page.tsx +++ b/apps/space/app/[workspace_slug]/[project_slug]/page.tsx @@ -29,15 +29,41 @@ const WorkspaceProjectPage = observer(() => { // updating default board view when we are in the issues page useEffect(() => { - if (workspace_slug && project_slug) { - if (!board) { - store.issue.setCurrentIssueBoardView("list"); - router.replace(`/${workspace_slug}/${project_slug}?board=${store?.issue?.currentIssueBoardView}`); - } else { - if (board != store?.issue?.currentIssueBoardView) store.issue.setCurrentIssueBoardView(board); + if (workspace_slug && project_slug && store?.project?.workspaceProjectSettings) { + const workspacePRojectSettingViews = store?.project?.workspaceProjectSettings?.views; + const userAccessViews: TIssueBoardKeys[] = []; + + Object.keys(workspacePRojectSettingViews).filter((_key) => { + if (_key === "list" && workspacePRojectSettingViews.list === true) userAccessViews.push(_key); + if (_key === "kanban" && workspacePRojectSettingViews.kanban === true) userAccessViews.push(_key); + if (_key === "calendar" && workspacePRojectSettingViews.calendar === true) userAccessViews.push(_key); + if (_key === "spreadsheet" && workspacePRojectSettingViews.spreadsheet === true) userAccessViews.push(_key); + if (_key === "gantt" && workspacePRojectSettingViews.gantt === true) userAccessViews.push(_key); + }); + + if (userAccessViews && userAccessViews.length > 0) { + if (!board) { + store.issue.setCurrentIssueBoardView(userAccessViews[0]); + router.replace(`/${workspace_slug}/${project_slug}?board=${userAccessViews[0]}`); + } else { + if (userAccessViews.includes(board)) { + if (store.issue.currentIssueBoardView === null) store.issue.setCurrentIssueBoardView(board); + else { + if (board === store.issue.currentIssueBoardView) + router.replace(`/${workspace_slug}/${project_slug}?board=${board}`); + else { + store.issue.setCurrentIssueBoardView(board); + router.replace(`/${workspace_slug}/${project_slug}?board=${board}`); + } + } + } else { + store.issue.setCurrentIssueBoardView(userAccessViews[0]); + router.replace(`/${workspace_slug}/${project_slug}?board=${userAccessViews[0]}`); + } + } } } - }, [workspace_slug, project_slug, board, router, store?.issue]); + }, [workspace_slug, project_slug, board, router, store?.issue, store?.project?.workspaceProjectSettings]); useEffect(() => { if (workspace_slug && project_slug) { diff --git a/apps/space/lib/mobx/store-init.tsx b/apps/space/lib/mobx/store-init.tsx index 2ba2f9024..4f4b6662c 100644 --- a/apps/space/lib/mobx/store-init.tsx +++ b/apps/space/lib/mobx/store-init.tsx @@ -24,11 +24,6 @@ const MobxStoreInit = () => { else localStorage.setItem("app_theme", _theme && _theme != "light" ? "dark" : "light"); }, [store?.theme]); - // updating default board view when we are in the issues page - useEffect(() => { - if (board && board != store?.issue?.currentIssueBoardView) store.issue.setCurrentIssueBoardView(board); - }, [board, store?.issue]); - return <>; }; From e593a8d4bd9469c7ea5535efa93ce0b4997add93 Mon Sep 17 00:00:00 2001 From: Henit Chobisa Date: Fri, 18 Aug 2023 11:47:58 +0530 Subject: [PATCH 02/10] chore: Edited Setup Script to take TipTap Auth Token and Generate .npmrc (#1897) --- setup.sh | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/setup.sh b/setup.sh index 8c1f81a48..a5a8e9b6a 100755 --- a/setup.sh +++ b/setup.sh @@ -1,5 +1,5 @@ #!/bin/bash -cp ./.env.example ./.env +# cp ./.env.example ./.env # Export for tr error in mac export LC_ALL=C @@ -14,3 +14,16 @@ echo -e "SECRET_KEY=\"$(tr -dc 'a-z0-9' < /dev/urandom | head -c50)\"" >> ./.en # WEB_URL for email redirection and image saving echo -e "WEB_URL=$1" >> ./.env + +# Generate Prompt for taking tiptap auth key +echo -e "\n\e[1;38m Instructions for generating TipTap Pro Extensions Auth Token \e[0m \n" + +echo -e "\e[1;38m 1. Head over to TipTap cloud's Pro Extensions Page, https://collab.tiptap.dev/pro-extensions \e[0m" +echo -e "\e[1;38m 2. Copy the token given to you under the first paragraph, after 'Here it is' \e[0m \n" + +read -p $'\e[1;32m Please Enter Your TipTap Pro Extensions Authentication Token: \e[0m \e[1;36m' authToken + + +echo "@tiptap-pro:registry=https://registry.tiptap.dev/ +//registry.tiptap.dev/:_authToken=${authToken}" > .npmrc + From d74ec7bda99ca94acd43e6ab153aaed2dd122d0c Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Date: Fri, 18 Aug 2023 12:01:51 +0530 Subject: [PATCH 03/10] fix: ui improvement and bug fixes (#1883) --- .../core/views/board-view/single-issue.tsx | 17 +++++++++++++---- .../components/issues/comment/add-comment.tsx | 2 +- .../components/issues/comment/comment-card.tsx | 2 +- apps/app/components/issues/description-form.tsx | 2 +- apps/app/components/issues/select/assignee.tsx | 14 ++++++-------- apps/app/components/issues/select/label.tsx | 6 +++--- apps/app/components/issues/sidebar.tsx | 6 ++++-- .../components/issues/view-select/due-date.tsx | 6 ++++++ .../issues/view-select/start-date.tsx | 6 ++++++ apps/app/components/tiptap/index.tsx | 2 +- apps/app/components/ui/datepicker.tsx | 9 +++++++++ 11 files changed, 51 insertions(+), 21 deletions(-) diff --git a/apps/app/components/core/views/board-view/single-issue.tsx b/apps/app/components/core/views/board-view/single-issue.tsx index e87ea434f..4a1f25fe0 100644 --- a/apps/app/components/core/views/board-view/single-issue.tsx +++ b/apps/app/components/core/views/board-view/single-issue.tsx @@ -88,6 +88,7 @@ export const SingleBoardIssue: React.FC = ({ const [contextMenu, setContextMenu] = useState(false); const [contextMenuPosition, setContextMenuPosition] = useState({ x: 0, y: 0 }); const [isMenuActive, setIsMenuActive] = useState(false); + const [isDropdownActive, setIsDropdownActive] = useState(false); const actionSectionRef = useRef(null); @@ -245,7 +246,7 @@ export const SingleBoardIssue: React.FC = ({ setContextMenuPosition({ x: e.pageX, y: e.pageY }); }} > -
+
{!isNotAllowed && (
= ({
)} - + {properties.key && ( -
+
{issue.project_detail.identifier}-{issue.sequence_id}
)}
{issue.name}
 -
+
{properties.priority && ( = ({ setIsDropdownActive(true)} + handleOnClose={() => setIsDropdownActive(false)} user={user} isNotAllowed={isNotAllowed} /> @@ -335,6 +342,8 @@ export const SingleBoardIssue: React.FC = ({ setIsDropdownActive(true)} + handleOnClose={() => setIsDropdownActive(false)} user={user} isNotAllowed={isNotAllowed} /> diff --git a/apps/app/components/issues/comment/add-comment.tsx b/apps/app/components/issues/comment/add-comment.tsx index 1dc75a7a6..15b67b157 100644 --- a/apps/app/components/issues/comment/add-comment.tsx +++ b/apps/app/components/issues/comment/add-comment.tsx @@ -101,7 +101,7 @@ export const AddComment: React.FC = ({ issueId, user, disabled = false }) ? watch("comment_html") : value } - customClassName="p-3 min-h-[50px]" + customClassName="p-3 min-h-[50px] shadow-sm" debouncedUpdatesEnabled={false} onChange={(comment_json: Object, comment_html: string) => { onChange(comment_html); diff --git a/apps/app/components/issues/comment/comment-card.tsx b/apps/app/components/issues/comment/comment-card.tsx index 08ea0f1d5..02dbe9b0b 100644 --- a/apps/app/components/issues/comment/comment-card.tsx +++ b/apps/app/components/issues/comment/comment-card.tsx @@ -106,7 +106,7 @@ export const CommentCard: React.FC = ({ comment, onSubmit, handleCommentD ref={editorRef} value={watch("comment_html")} debouncedUpdatesEnabled={false} - customClassName="min-h-[50px] p-3" + customClassName="min-h-[50px] p-3 shadow-sm" onChange={(comment_json: Object, comment_html: string) => { setValue("comment_json", comment_json); setValue("comment_html", comment_html); diff --git a/apps/app/components/issues/description-form.tsx b/apps/app/components/issues/description-form.tsx index c0c6157a2..553a9fa7a 100644 --- a/apps/app/components/issues/description-form.tsx +++ b/apps/app/components/issues/description-form.tsx @@ -141,7 +141,7 @@ export const IssueDescriptionForm: FC = ({ } debouncedUpdatesEnabled={true} setIsSubmitting={setIsSubmitting} - customClassName="min-h-[150px]" + customClassName="min-h-[150px] shadow-sm" editorContentCustomClassNames="pb-9" onChange={(description: Object, description_html: string) => { setIsSubmitting("submitting"); diff --git a/apps/app/components/issues/select/assignee.tsx b/apps/app/components/issues/select/assignee.tsx index 989d071ec..603483f0f 100644 --- a/apps/app/components/issues/select/assignee.tsx +++ b/apps/app/components/issues/select/assignee.tsx @@ -5,9 +5,7 @@ import useSWR from "swr"; // services import projectServices from "services/project.service"; // ui -import { AssigneesList, Avatar, CustomSearchSelect } from "components/ui"; -// icons -import { UserGroupIcon } from "@heroicons/react/24/outline"; +import { AssigneesList, Avatar, CustomSearchSelect, Icon } from "components/ui"; // fetch-keys import { PROJECT_MEMBERS } from "constants/fetch-keys"; @@ -44,15 +42,15 @@ export const IssueAssigneeSelect: React.FC = ({ projectId, value = [], on value={value} onChange={onChange} options={options} - label={ -
+ customButton={ +
{value && value.length > 0 && Array.isArray(value) ? ( -
+
) : ( -
- +
+ Assignee
)} diff --git a/apps/app/components/issues/select/label.tsx b/apps/app/components/issues/select/label.tsx index 6d7e2f391..b15a6f9c6 100644 --- a/apps/app/components/issues/select/label.tsx +++ b/apps/app/components/issues/select/label.tsx @@ -59,9 +59,9 @@ export const IssueLabelSelect: React.FC = ({ setIsOpen, value, onChange, > {({ open }: any) => ( <> - + {value && value.length > 0 ? ( - + issueLabels?.find((l) => l.id === v)?.color) ?? []} length={3} @@ -69,7 +69,7 @@ export const IssueLabelSelect: React.FC = ({ setIsOpen, value, onChange, /> ) : ( - + Label diff --git a/apps/app/components/issues/sidebar.tsx b/apps/app/components/issues/sidebar.tsx index c396750e5..7925be167 100644 --- a/apps/app/components/issues/sidebar.tsx +++ b/apps/app/components/issues/sidebar.tsx @@ -396,7 +396,8 @@ export const IssueDetailsSidebar: React.FC = ({ start_date: val, }) } - className="bg-custom-background-90 w-full" + className="bg-custom-background-100" + wrapperClassName="w-full" maxDate={maxDate ?? undefined} disabled={isNotAllowed || uneditable} /> @@ -424,7 +425,8 @@ export const IssueDetailsSidebar: React.FC = ({ target_date: val, }) } - className="bg-custom-background-90 w-full" + className="bg-custom-background-100" + wrapperClassName="w-full" minDate={minDate ?? undefined} disabled={isNotAllowed || uneditable} /> diff --git a/apps/app/components/issues/view-select/due-date.tsx b/apps/app/components/issues/view-select/due-date.tsx index 54b287a1e..5f5e5cbd0 100644 --- a/apps/app/components/issues/view-select/due-date.tsx +++ b/apps/app/components/issues/view-select/due-date.tsx @@ -13,6 +13,8 @@ import useIssuesView from "hooks/use-issues-view"; type Props = { issue: IIssue; partialUpdateIssue: (formData: Partial, issue: IIssue) => void; + handleOnOpen?: () => void; + handleOnClose?: () => void; tooltipPosition?: "top" | "bottom"; noBorder?: boolean; user: ICurrentUserResponse | undefined; @@ -22,6 +24,8 @@ type Props = { export const ViewDueDateSelect: React.FC = ({ issue, partialUpdateIssue, + handleOnOpen, + handleOnClose, tooltipPosition = "top", noBorder = false, user, @@ -80,6 +84,8 @@ export const ViewDueDateSelect: React.FC = ({ }`} minDate={minDate ?? undefined} noBorder={noBorder} + handleOnOpen={handleOnOpen} + handleOnClose={handleOnClose} disabled={isNotAllowed} />
diff --git a/apps/app/components/issues/view-select/start-date.tsx b/apps/app/components/issues/view-select/start-date.tsx index 29110eadb..8748567ae 100644 --- a/apps/app/components/issues/view-select/start-date.tsx +++ b/apps/app/components/issues/view-select/start-date.tsx @@ -13,6 +13,8 @@ import useIssuesView from "hooks/use-issues-view"; type Props = { issue: IIssue; partialUpdateIssue: (formData: Partial, issue: IIssue) => void; + handleOnOpen?: () => void; + handleOnClose?: () => void; tooltipPosition?: "top" | "bottom"; noBorder?: boolean; user: ICurrentUserResponse | undefined; @@ -22,6 +24,8 @@ type Props = { export const ViewStartDateSelect: React.FC = ({ issue, partialUpdateIssue, + handleOnOpen, + handleOnClose, tooltipPosition = "top", noBorder = false, user, @@ -72,6 +76,8 @@ export const ViewStartDateSelect: React.FC = ({ }`} maxDate={maxDate ?? undefined} noBorder={noBorder} + handleOnOpen={handleOnOpen} + handleOnClose={handleOnClose} disabled={isNotAllowed} />
diff --git a/apps/app/components/tiptap/index.tsx b/apps/app/components/tiptap/index.tsx index 0ecaf69b0..72a914bc9 100644 --- a/apps/app/components/tiptap/index.tsx +++ b/apps/app/components/tiptap/index.tsx @@ -112,7 +112,7 @@ const Tiptap = (props: ITiptapRichTextEditor) => { }, 500); }, 1000); - const editorClassNames = `relative w-full max-w-screen-lg sm:rounded-lg sm:shadow-lg mt-2 p-3 relative focus:outline-none rounded-md + const editorClassNames = `relative w-full max-w-screen-lg mt-2 p-3 relative focus:outline-none rounded-lg ${noBorder ? "" : "border border-custom-border-200"} ${ borderOnFocus ? "focus:border border-custom-border-300" : "focus:border-0" } ${customClassName}`; diff --git a/apps/app/components/ui/datepicker.tsx b/apps/app/components/ui/datepicker.tsx index 831baec51..3bb0d3a1d 100644 --- a/apps/app/components/ui/datepicker.tsx +++ b/apps/app/components/ui/datepicker.tsx @@ -8,10 +8,13 @@ type Props = { renderAs?: "input" | "button"; value: Date | string | null | undefined; onChange: (val: string | null) => void; + handleOnOpen?: () => void; + handleOnClose?: () => void; placeholder?: string; displayShortForm?: boolean; error?: boolean; noBorder?: boolean; + wrapperClassName?: string; className?: string; isClearable?: boolean; disabled?: boolean; @@ -23,10 +26,13 @@ export const CustomDatePicker: React.FC = ({ renderAs = "button", value, onChange, + handleOnOpen, + handleOnClose, placeholder = "Select date", displayShortForm = false, error = false, noBorder = false, + wrapperClassName = "", className = "", isClearable = true, disabled = false, @@ -40,6 +46,9 @@ export const CustomDatePicker: React.FC = ({ if (!val) onChange(null); else onChange(renderDateFormat(val)); }} + onCalendarOpen={handleOnOpen} + onCalendarClose={handleOnClose} + wrapperClassName={wrapperClassName} className={`${ renderAs === "input" ? "block px-2 py-2 text-sm focus:outline-none" From c3c6ba9e342f7caeb038e9a83489e80004013ea7 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Date: Fri, 18 Aug 2023 12:03:31 +0530 Subject: [PATCH 04/10] chore: link edit functionality (#1895) --- .../app/components/core/modals/link-modal.tsx | 56 +++++++++++++++---- .../components/core/sidebar/links-list.tsx | 28 ++++++---- apps/app/components/issues/sidebar.tsx | 56 ++++++++++++++++++- apps/app/components/modules/sidebar.tsx | 52 +++++++++++++++-- apps/app/services/issues.service.ts | 23 ++++++++ apps/app/services/modules.service.ts | 22 ++++++++ apps/app/types/issues.d.ts | 20 ++++--- apps/app/types/modules.d.ts | 11 +--- 8 files changed, 220 insertions(+), 48 deletions(-) diff --git a/apps/app/components/core/modals/link-modal.tsx b/apps/app/components/core/modals/link-modal.tsx index fc1641767..bed74fca0 100644 --- a/apps/app/components/core/modals/link-modal.tsx +++ b/apps/app/components/core/modals/link-modal.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect } from "react"; // react-hook-form import { useForm } from "react-hook-form"; @@ -7,12 +7,15 @@ import { Dialog, Transition } from "@headlessui/react"; // ui import { Input, PrimaryButton, SecondaryButton } from "components/ui"; // types -import type { IIssueLink, ModuleLink } from "types"; +import type { IIssueLink, linkDetails, ModuleLink } from "types"; type Props = { isOpen: boolean; handleClose: () => void; - onFormSubmit: (formData: IIssueLink | ModuleLink) => Promise; + data?: linkDetails | null; + status: boolean; + createIssueLink: (formData: IIssueLink | ModuleLink) => Promise; + updateIssueLink: (formData: IIssueLink | ModuleLink, linkId: string) => Promise; }; const defaultValues: IIssueLink | ModuleLink = { @@ -20,7 +23,14 @@ const defaultValues: IIssueLink | ModuleLink = { url: "", }; -export const LinkModal: React.FC = ({ isOpen, handleClose, onFormSubmit }) => { +export const LinkModal: React.FC = ({ + isOpen, + handleClose, + createIssueLink, + updateIssueLink, + status, + data, +}) => { const { register, formState: { errors, isSubmitting }, @@ -30,11 +40,6 @@ export const LinkModal: React.FC = ({ isOpen, handleClose, onFormSubmit } defaultValues, }); - const onSubmit = async (formData: IIssueLink | ModuleLink) => { - await onFormSubmit({ title: formData.title, url: formData.url }); - onClose(); - }; - const onClose = () => { handleClose(); const timeout = setTimeout(() => { @@ -43,6 +48,27 @@ export const LinkModal: React.FC = ({ isOpen, handleClose, onFormSubmit } }, 500); }; + const handleFormSubmit = async (formData: IIssueLink | ModuleLink) => { + if (!data) await createIssueLink({ title: formData.title, url: formData.url }); + else await updateIssueLink({ title: formData.title, url: formData.url }, data.id); + onClose(); + }; + + const handleCreateUpdatePage = async (formData: IIssueLink | ModuleLink) => { + await handleFormSubmit(formData); + + reset({ + ...defaultValues, + }); + }; + + useEffect(() => { + reset({ + ...defaultValues, + ...data, + }); + }, [data, reset]); + return ( @@ -70,14 +96,14 @@ export const LinkModal: React.FC = ({ isOpen, handleClose, onFormSubmit } leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" > -
+
- Add Link + {status ? "Update Link" : "Add Link"}
@@ -113,7 +139,13 @@ export const LinkModal: React.FC = ({ isOpen, handleClose, onFormSubmit }
Cancel - {isSubmitting ? "Adding Link..." : "Add Link"} + {status + ? isSubmitting + ? "Updating Link..." + : "Update Link" + : isSubmitting + ? "Adding Link..." + : "Add Link"}
diff --git a/apps/app/components/core/sidebar/links-list.tsx b/apps/app/components/core/sidebar/links-list.tsx index af008fec4..fb8f3243d 100644 --- a/apps/app/components/core/sidebar/links-list.tsx +++ b/apps/app/components/core/sidebar/links-list.tsx @@ -1,25 +1,24 @@ // icons import { ArrowTopRightOnSquareIcon, LinkIcon, TrashIcon } from "@heroicons/react/24/outline"; +import { Icon } from "components/ui"; // helpers import { timeAgo } from "helpers/date-time.helper"; // types -import { IUserLite, UserAuth } from "types"; +import { linkDetails, UserAuth } from "types"; type Props = { - links: { - id: string; - created_at: Date; - created_by: string; - created_by_detail: IUserLite; - metadata: any; - title: string; - url: string; - }[]; + links: linkDetails[]; handleDeleteLink: (linkId: string) => void; + handleEditLink: (link: linkDetails) => void; userAuth: UserAuth; }; -export const LinksList: React.FC = ({ links, handleDeleteLink, userAuth }) => { +export const LinksList: React.FC = ({ + links, + handleDeleteLink, + handleEditLink, + userAuth, +}) => { const isNotAllowed = userAuth.isGuest || userAuth.isViewer; return ( @@ -28,6 +27,13 @@ export const LinksList: React.FC = ({ links, handleDeleteLink, userAuth }
{!isNotAllowed && (
+ = ({ }) => { const [deleteIssueModal, setDeleteIssueModal] = useState(false); const [linkModal, setLinkModal] = useState(false); + const [selectedLinkToUpdate, setSelectedLinkToUpdate] = useState(null); const router = useRouter(); const { workspaceSlug, projectId, issueId } = router.query; @@ -156,6 +157,43 @@ export const IssueDetailsSidebar: React.FC = ({ }); }; + const handleUpdateLink = async (formData: IIssueLink, linkId: string) => { + if (!workspaceSlug || !projectId || !issueDetail) return; + + const payload = { metadata: {}, ...formData }; + + const updatedLinks = issueDetail.issue_link.map((l) => + l.id === linkId + ? { + ...l, + title: formData.title, + url: formData.url, + } + : l + ); + + mutate( + ISSUE_DETAILS(issueDetail.id), + (prevData) => ({ ...(prevData as IIssue), issue_link: updatedLinks }), + false + ); + + await issuesService + .updateIssueLink( + workspaceSlug as string, + projectId as string, + issueDetail.id, + linkId, + payload + ) + .then((res) => { + mutate(ISSUE_DETAILS(issueDetail.id)); + }) + .catch((err) => { + console.log(err); + }); + }; + const handleDeleteLink = async (linkId: string) => { if (!workspaceSlug || !projectId || !issueDetail) return; @@ -220,14 +258,25 @@ export const IssueDetailsSidebar: React.FC = ({ const maxDate = targetDate ? new Date(targetDate) : null; maxDate?.setDate(maxDate.getDate()); + const handleEditLink = (link: linkDetails) => { + setSelectedLinkToUpdate(link); + setLinkModal(true); + }; + const isNotAllowed = memberRole.isGuest || memberRole.isViewer; return ( <> setLinkModal(false)} - onFormSubmit={handleCreateLink} + handleClose={() => { + setLinkModal(false); + setSelectedLinkToUpdate(null); + }} + data={selectedLinkToUpdate} + status={selectedLinkToUpdate ? true : false} + createIssueLink={handleCreateLink} + updateIssueLink={handleUpdateLink} /> setDeleteIssueModal(false)} @@ -490,6 +539,7 @@ export const IssueDetailsSidebar: React.FC = ({ ) : null} diff --git a/apps/app/components/modules/sidebar.tsx b/apps/app/components/modules/sidebar.tsx index 1e63f960a..0407b95aa 100644 --- a/apps/app/components/modules/sidebar.tsx +++ b/apps/app/components/modules/sidebar.tsx @@ -37,7 +37,7 @@ import { LinkIcon } from "@heroicons/react/20/solid"; import { renderDateFormat, renderShortDateWithYearFormat } from "helpers/date-time.helper"; import { capitalizeFirstLetter, copyTextToClipboard } from "helpers/string.helper"; // types -import { ICurrentUserResponse, IIssue, IModule, ModuleLink } from "types"; +import { ICurrentUserResponse, IIssue, linkDetails, IModule, ModuleLink } from "types"; // fetch-keys import { MODULE_DETAILS } from "constants/fetch-keys"; // constant @@ -61,6 +61,7 @@ type Props = { export const ModuleDetailsSidebar: React.FC = ({ module, isOpen, moduleIssues, user }) => { const [moduleDeleteModal, setModuleDeleteModal] = useState(false); const [moduleLinkModal, setModuleLinkModal] = useState(false); + const [selectedLinkToUpdate, setSelectedLinkToUpdate] = useState(null); const router = useRouter(); const { workspaceSlug, projectId, moduleId } = router.query; @@ -115,6 +116,37 @@ export const ModuleDetailsSidebar: React.FC = ({ module, isOpen, moduleIs }); }; + const handleUpdateLink = async (formData: ModuleLink, linkId: string) => { + if (!workspaceSlug || !projectId || !module) return; + + const payload = { metadata: {}, ...formData }; + + const updatedLinks = module.link_module.map((l) => + l.id === linkId + ? { + ...l, + title: formData.title, + url: formData.url, + } + : l + ); + + mutate( + MODULE_DETAILS(module.id), + (prevData) => ({ ...(prevData as IModule), link_module: updatedLinks }), + false + ); + + await modulesService + .updateModuleLink(workspaceSlug as string, projectId as string, module.id, linkId, payload) + .then((res) => { + mutate(MODULE_DETAILS(module.id)); + }) + .catch((err) => { + console.log(err); + }); + }; + const handleDeleteLink = async (linkId: string) => { if (!workspaceSlug || !projectId || !module) return; @@ -170,12 +202,23 @@ export const ModuleDetailsSidebar: React.FC = ({ module, isOpen, moduleIs ? Math.round((module.completed_issues / module.total_issues) * 100) : null; + const handleEditLink = (link: linkDetails) => { + setSelectedLinkToUpdate(link); + setModuleLinkModal(true); + }; + return ( <> setModuleLinkModal(false)} - onFormSubmit={handleCreateLink} + handleClose={() => { + setModuleLinkModal(false); + setSelectedLinkToUpdate(null); + }} + data={selectedLinkToUpdate} + status={selectedLinkToUpdate ? true : false} + createIssueLink={handleCreateLink} + updateIssueLink={handleUpdateLink} /> = ({ module, isOpen, moduleIs
-
+

Links