From 71394d33165a9117a7ef3d03fdafcba4f1bf54f4 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Date: Mon, 4 Sep 2023 18:42:31 +0530 Subject: [PATCH 01/29] chore: add issue option removed from subscribed issue page (#2088) * chore: condition for subscribed page add issue option * chore: condition for subscribed page add issue option --- web/components/core/views/all-views.tsx | 4 ++++ web/components/core/views/board-view/all-boards.tsx | 3 +++ web/components/core/views/board-view/single-board.tsx | 8 ++++---- web/components/core/views/list-view/all-lists.tsx | 3 +++ web/components/core/views/list-view/single-list.tsx | 5 +++-- web/components/issues/my-issues/my-issues-view.tsx | 10 ++++++++++ web/components/profile/profile-issues-view.tsx | 10 ++++++++++ 7 files changed, 37 insertions(+), 6 deletions(-) diff --git a/web/components/core/views/all-views.tsx b/web/components/core/views/all-views.tsx index 79d5d6b11..eb54ccb2a 100644 --- a/web/components/core/views/all-views.tsx +++ b/web/components/core/views/all-views.tsx @@ -53,6 +53,7 @@ type Props = { handleOnDragEnd: (result: DropResult) => Promise; openIssuesListModal: (() => void) | null; removeIssue: ((bridgeId: string, issueId: string) => void) | null; + disableAddIssueOption?: boolean; trashBox: boolean; setTrashBox: React.Dispatch>; viewProps: IIssueViewProps; @@ -68,6 +69,7 @@ export const AllViews: React.FC = ({ handleOnDragEnd, openIssuesListModal, removeIssue, + disableAddIssueOption = false, trashBox, setTrashBox, viewProps, @@ -127,6 +129,7 @@ export const AllViews: React.FC = ({ openIssuesListModal={cycleId || moduleId ? openIssuesListModal : null} removeIssue={removeIssue} disableUserActions={disableUserActions} + disableAddIssueOption={disableAddIssueOption} user={user} userAuth={memberRole} viewProps={viewProps} @@ -135,6 +138,7 @@ export const AllViews: React.FC = ({ void; disableUserActions: boolean; + disableAddIssueOption?: boolean; dragDisabled: boolean; handleIssueAction: (issue: IIssue, action: "copy" | "delete" | "edit") => void; handleTrashBox: (isDragging: boolean) => void; @@ -24,6 +25,7 @@ type Props = { export const AllBoards: React.FC = ({ addIssueToGroup, disableUserActions, + disableAddIssueOption = false, dragDisabled, handleIssueAction, handleTrashBox, @@ -52,6 +54,7 @@ export const AllBoards: React.FC = ({ addIssueToGroup={() => addIssueToGroup(singleGroup)} currentState={currentState} disableUserActions={disableUserActions} + disableAddIssueOption={disableAddIssueOption} dragDisabled={dragDisabled} groupTitle={singleGroup} handleIssueAction={handleIssueAction} diff --git a/web/components/core/views/board-view/single-board.tsx b/web/components/core/views/board-view/single-board.tsx index 52e8c27c7..7ba70c97b 100644 --- a/web/components/core/views/board-view/single-board.tsx +++ b/web/components/core/views/board-view/single-board.tsx @@ -20,6 +20,7 @@ type Props = { addIssueToGroup: () => void; currentState?: IState | null; disableUserActions: boolean; + disableAddIssueOption?: boolean; dragDisabled: boolean; groupTitle: string; handleIssueAction: (issue: IIssue, action: "copy" | "delete" | "edit") => void; @@ -36,6 +37,7 @@ export const SingleBoard: React.FC = ({ currentState, groupTitle, disableUserActions, + disableAddIssueOption = false, dragDisabled, handleIssueAction, handleTrashBox, @@ -53,8 +55,6 @@ export const SingleBoard: React.FC = ({ const router = useRouter(); const { cycleId, moduleId } = router.query; - const isSubscribedIssues = router.pathname.includes("subscribed"); - const type = cycleId ? "cycle" : moduleId ? "module" : "issue"; // Check if it has at least 4 tickets since it is enough to accommodate the Calendar height @@ -72,7 +72,7 @@ export const SingleBoard: React.FC = ({ isCollapsed={isCollapsed} setIsCollapsed={setIsCollapsed} disableUserActions={disableUserActions} - disableAddIssue={isSubscribedIssues} + disableAddIssue={disableAddIssueOption} viewProps={viewProps} /> {isCollapsed && ( @@ -154,7 +154,7 @@ export const SingleBoard: React.FC = ({ {selectedGroup !== "created_by" && (
{type === "issue" - ? !isSubscribedIssues && ( + ? !disableAddIssueOption && ( +
+ + ); +}; diff --git a/web/components/web-view/issue-web-view-form.tsx b/web/components/web-view/issue-web-view-form.tsx new file mode 100644 index 000000000..863464764 --- /dev/null +++ b/web/components/web-view/issue-web-view-form.tsx @@ -0,0 +1,164 @@ +// react +import React, { useCallback, useEffect, useState } from "react"; + +// next +import { useRouter } from "next/router"; + +// react hook forms +import { Controller } from "react-hook-form"; + +// hooks + +import { useDebouncedCallback } from "use-debounce"; +import useReloadConfirmations from "hooks/use-reload-confirmation"; + +// ui +import { TextArea } from "components/ui"; + +// components +import { TipTapEditor } from "components/tiptap"; +import { Label } from "components/web-view"; + +// types +import type { IIssue } from "types"; + +type Props = { + isAllowed: boolean; + issueDetails: IIssue; + submitChanges: (data: Partial) => Promise; + register: any; + control: any; + watch: any; + handleSubmit: any; +}; + +export const IssueWebViewForm: React.FC = (props) => { + const { isAllowed, issueDetails, submitChanges, register, control, watch, handleSubmit } = props; + + const router = useRouter(); + const { workspaceSlug } = router.query; + + const [characterLimit, setCharacterLimit] = useState(false); + const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved"); + + const { setShowAlert } = useReloadConfirmations(); + + useEffect(() => { + if (isSubmitting === "submitted") { + setShowAlert(false); + setTimeout(async () => { + setIsSubmitting("saved"); + }, 2000); + } else if (isSubmitting === "submitting") { + setShowAlert(true); + } + }, [isSubmitting, setShowAlert]); + + const debouncedTitleSave = useDebouncedCallback(async () => { + setTimeout(async () => { + handleSubmit(handleDescriptionFormSubmit)().finally(() => setIsSubmitting("submitted")); + }, 500); + }, 1000); + + const handleDescriptionFormSubmit = useCallback( + async (formData: Partial) => { + if (!formData?.name || formData?.name.length === 0 || formData?.name.length > 255) return; + + await submitChanges({ + name: formData.name ?? "", + description_html: formData.description_html ?? "

", + }); + }, + [submitChanges] + ); + + return ( + <> +
+ +
+ {isAllowed ? ( +