= ({
void;
data: IIssue | null;
+ onSubmit?: () => Promise
;
user: ICurrentUserResponse | undefined;
};
-export const DeleteIssueModal: React.FC = ({ isOpen, handleClose, data, user }) => {
+export const DeleteIssueModal: React.FC = ({
+ isOpen,
+ handleClose,
+ data,
+ onSubmit,
+ user,
+}) => {
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const router = useRouter();
@@ -116,6 +123,8 @@ export const DeleteIssueModal: React.FC = ({ isOpen, handleClose, data, u
else mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(data.project, params));
}
+ if (onSubmit) onSubmit();
+
handleClose();
setToastAlert({
title: "Success",
diff --git a/apps/app/components/issues/peek-overview/issue-properties.tsx b/apps/app/components/issues/peek-overview/issue-properties.tsx
index 2c8b4d572..1f2d618ac 100644
--- a/apps/app/components/issues/peek-overview/issue-properties.tsx
+++ b/apps/app/components/issues/peek-overview/issue-properties.tsx
@@ -103,7 +103,7 @@ export const PeekOverviewIssueProperties: React.FC = ({
handleUpdateIssue({ assignees_list: val })}
disabled={readOnly}
/>
@@ -128,23 +128,18 @@ export const PeekOverviewIssueProperties: React.FC = ({
Start date
- {issue.start_date ? (
-
- handleUpdateIssue({
- start_date: val,
- })
- }
- className="bg-custom-background-100"
- wrapperClassName="w-full"
- maxDate={maxDate ?? undefined}
- disabled={readOnly}
- />
- ) : (
- Empty
- )}
+
+ handleUpdateIssue({
+ start_date: val,
+ })
+ }
+ className="bg-custom-background-80 border-none"
+ maxDate={maxDate ?? undefined}
+ disabled={readOnly}
+ />
@@ -153,23 +148,18 @@ export const PeekOverviewIssueProperties: React.FC
= ({
Due date
- {issue.target_date ? (
-
- handleUpdateIssue({
- target_date: val,
- })
- }
- className="bg-custom-background-100"
- wrapperClassName="w-full"
- minDate={minDate ?? undefined}
- disabled={readOnly}
- />
- ) : (
- Empty
- )}
+
+ handleUpdateIssue({
+ target_date: val,
+ })
+ }
+ className="bg-custom-background-80 border-none"
+ minDate={minDate ?? undefined}
+ disabled={readOnly}
+ />
{/*
diff --git a/apps/app/components/issues/peek-overview/layout.tsx b/apps/app/components/issues/peek-overview/layout.tsx
index ce026e6a2..40737b6e8 100644
--- a/apps/app/components/issues/peek-overview/layout.tsx
+++ b/apps/app/components/issues/peek-overview/layout.tsx
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from "react";
import { useRouter } from "next/router";
+import { mutate } from "swr";
// mobx
import { observer } from "mobx-react-lite";
import { useMobxStore } from "lib/mobx/store-provider";
@@ -10,9 +11,11 @@ import { Dialog, Transition } from "@headlessui/react";
// hooks
import useUser from "hooks/use-user";
// components
-import { FullScreenPeekView, SidePeekView } from "components/issues";
+import { DeleteIssueModal, FullScreenPeekView, SidePeekView } from "components/issues";
// types
import { IIssue } from "types";
+// fetch-keys
+import { PROJECT_ISSUES_ACTIVITY } from "constants/fetch-keys";
type Props = {
handleMutation: () => void;
@@ -28,6 +31,7 @@ export const IssuePeekOverview: React.FC
= observer(
const [isSidePeekOpen, setIsSidePeekOpen] = useState(false);
const [isModalPeekOpen, setIsModalPeekOpen] = useState(false);
const [peekOverviewMode, setPeekOverviewMode] = useState("side");
+ const [deleteIssueModal, setDeleteIssueModal] = useState(false);
const router = useRouter();
const { peekIssue } = router.query;
@@ -53,6 +57,7 @@ export const IssuePeekOverview: React.FC = observer(
if (!issue || !user) return;
await updateIssue(workspaceSlug, projectId, issue.id, formData, user);
+ mutate(PROJECT_ISSUES_ACTIVITY(issue.id));
handleMutation();
};
@@ -88,33 +93,38 @@ export const IssuePeekOverview: React.FC = observer(
return (
<>
+ setDeleteIssueModal(false)}
+ data={issue ? { ...issue } : null}
+ onSubmit={handleDeleteIssue}
+ user={user}
+ />
Select co-worker’s email
+ Select co-worker
)}
diff --git a/apps/app/components/ui/dropdowns/custom-select.tsx b/apps/app/components/ui/dropdowns/custom-select.tsx
index 4e495a210..ae814dccb 100644
--- a/apps/app/components/ui/dropdowns/custom-select.tsx
+++ b/apps/app/components/ui/dropdowns/custom-select.tsx
@@ -41,7 +41,7 @@ const CustomSelect = ({
>
<>
{customButton ? (
- {customButton}
+ {customButton}
) : (
{
+ const [user, setUser] = useState();
+ const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved");
+ const [isLoading, setIsLoading] = useState("false");
+ const { setShowAlert } = useReloadConfirmations();
+ const [cookies, setCookies] = useState({});
+ const [issueDetail, setIssueDetail] = useState(null);
+ const router = useRouter();
+ const { editable } = router.query;
+ const {
+ handleSubmit,
+ watch,
+ setValue,
+ control,
+ formState: { errors },
+ } = useForm({
+ defaultValues: {
+ name: "",
+ description: "",
+ description_html: "",
+ },
+ });
+
+ const getCookies = () => {
+ const cookies = document.cookie.split(";");
+ const cookieObj: any = {};
+ cookies.forEach((cookie) => {
+ const cookieArr = cookie.split("=");
+ cookieObj[cookieArr[0].trim()] = cookieArr[1];
+ });
+
+ setCookies(cookieObj);
+ return cookieObj;
+ };
+
+ const getIssueDetail = async (cookiesData: any) => {
+ try {
+ setIsLoading("true");
+ const userData = await userService.currentUser();
+ setUser(userData);
+ const issueDetail = await issuesService.retrieve(
+ cookiesData.MOBILE_slug,
+ cookiesData.MOBILE_project_id,
+ cookiesData.MOBILE_issue_id
+ );
+ setIssueDetail(issueDetail);
+ setIsLoading("false");
+ setValue("description_html", issueDetail.description_html);
+ setValue("description", issueDetail.description);
+ } catch (e) {
+ setIsLoading("error");
+ console.log(e);
+ }
+ };
+ useEffect(() => {
+ const cookiesData = getCookies();
+
+ getIssueDetail(cookiesData);
+ }, []);
+
+ useEffect(() => {
+ if (isSubmitting === "submitted") {
+ setShowAlert(false);
+ setTimeout(async () => {
+ setIsSubmitting("saved");
+ }, 2000);
+ } else if (isSubmitting === "submitting") {
+ setShowAlert(true);
+ }
+ }, [isSubmitting, setShowAlert]);
+
+ const submitChanges = async (
+ formData: Partial,
+ workspaceSlug: string,
+ projectId: string,
+ issueId: string
+ ) => {
+ if (!workspaceSlug || !projectId || !issueId) return;
+
+ const payload: Partial = {
+ ...formData,
+ };
+
+ delete payload.blocker_issues;
+ delete payload.blocked_issues;
+ await issuesService
+ .patchIssue(workspaceSlug as string, projectId as string, issueId as string, payload, user)
+ .catch((e) => {
+ console.log(e);
+ });
+ };
+
+ const handleDescriptionFormSubmit = useCallback(
+ async (formData: Partial) => {
+ if (!formData) return;
+
+ await submitChanges(
+ {
+ name: issueDetail?.name ?? "",
+ description: formData.description ?? "",
+ description_html: formData.description_html ?? "",
+ },
+ cookies.MOBILE_slug,
+ cookies.MOBILE_project_id,
+ cookies.MOBILE_issue_id
+ );
+ },
+ [submitChanges]
+ );
+
+ return isLoading === "error" ? (
+
+ ) : isLoading === "true" ? (
+
+
+
+ ) : (
+
+
(
+ {
+ setShowAlert(true);
+ setIsSubmitting("submitting");
+ onChange(description_html);
+ setValue("description", description);
+ handleSubmit(handleDescriptionFormSubmit)().finally(() => {
+ setIsSubmitting("submitted");
+ });
+ }}
+ />
+ )}
+ />
+
+ {isSubmitting === "submitting" ? "Saving..." : "Saved"}
+
+
+
+
+
+
+
+
Oops! Something went wrong.
+
+
+