[WEB-999] chore: inbox issue bug fixes and improvement (#4188)

* chore: duplicate inbox issue header improvement

* chore: snooze inbox issue header action improvement

* fix: project inbox exception error

* chore: inbox issue modal improvement

* chore: code refactor

* chore: Updated the inbox issue mutation

---------

Co-authored-by: guru_sainath <gurusainath007@gmail.com>
This commit is contained in:
Anmol Singh Bhatia 2024-04-15 19:45:47 +05:30 committed by GitHub
parent 8454e4f1e0
commit 7a4ee509da
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 34 additions and 32 deletions

View File

@ -429,9 +429,13 @@ class InboxIssueViewSet(BaseViewSet):
if state is not None:
issue.state = state
issue.save()
inbox_issue = (
InboxIssue.objects.select_related("issue")
InboxIssue.objects.filter(
inbox_id=inbox_id.id,
issue_id=serializer.data["id"],
project_id=project_id,
)
.select_related("issue")
.prefetch_related(
"issue__labels",
"issue__assignees",
@ -459,12 +463,7 @@ class InboxIssueViewSet(BaseViewSet):
output_field=ArrayField(UUIDField()),
),
),
)
.get(
inbox_id=inbox_id.id,
issue_id=serializer.data["id"],
project_id=project_id,
)
).first()
)
serializer = InboxIssueDetailSerializer(inbox_issue).data
return Response(serializer, status=status.HTTP_200_OK)

View File

@ -60,11 +60,11 @@ export const InboxIssueActionsHeader: FC<TInboxIssueActionsHeader> = observer((p
const issue = inboxIssue?.issue;
// derived values
const isAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER;
const canMarkAsDuplicate = isAllowed && inboxIssue?.status === -2;
const canMarkAsDuplicate = isAllowed && (inboxIssue?.status === 0 || inboxIssue?.status === -2);
const canMarkAsAccepted = isAllowed && (inboxIssue?.status === 0 || inboxIssue?.status === -2);
const canMarkAsDeclined = isAllowed && inboxIssue?.status === -2;
const canMarkAsDeclined = isAllowed && (inboxIssue?.status === 0 || inboxIssue?.status === -2);
const canDelete = isAllowed || inboxIssue?.created_by === currentUser?.id;
const isAcceptedOrDeclined = inboxIssue?.status ? [-1, 1].includes(inboxIssue.status) : undefined;
const isAcceptedOrDeclined = inboxIssue?.status ? [-1, 1, 2].includes(inboxIssue.status) : undefined;
const currentInboxIssueId = inboxIssue?.issue?.id;

View File

@ -1,4 +1,4 @@
import { FC, useCallback, useRef, useState } from "react";
import { FC, FormEvent, useCallback, useRef, useState } from "react";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { EditorRefApi } from "@plane/rich-text-editor";
@ -59,7 +59,8 @@ export const InboxIssueCreateRoot: FC<TInboxIssueCreateRoot> = observer((props)
[formData]
);
const handleFormSubmit = async () => {
const handleFormSubmit = async (event: FormEvent<HTMLFormElement>) => {
event.preventDefault();
const payload: Partial<TIssue> = {
name: formData.name || "",
description_html: formData.description_html || "<p></p>",
@ -117,7 +118,7 @@ export const InboxIssueCreateRoot: FC<TInboxIssueCreateRoot> = observer((props)
if (!workspaceSlug || !projectId || !workspaceId) return <></>;
return (
<div className="relative space-y-4">
<form className="relative space-y-4" onSubmit={handleFormSubmit}>
<InboxIssueTitle data={formData} handleData={handleFormData} />
<InboxIssueDescription
workspaceSlug={workspaceSlug}
@ -137,11 +138,11 @@ export const InboxIssueCreateRoot: FC<TInboxIssueCreateRoot> = observer((props)
<Button variant="neutral-primary" size="sm" type="button" onClick={handleModalClose}>
Discard
</Button>
<Button variant="primary" size="sm" type="button" loading={formSubmitting} onClick={handleFormSubmit}>
<Button variant="primary" size="sm" type="submit" loading={formSubmitting}>
{formSubmitting ? "Adding Issue..." : "Add Issue"}
</Button>
</div>
</div>
</div>
</form>
);
});

View File

@ -21,6 +21,8 @@ export const InboxIssueTitle: FC<TInboxIssueTitle> = observer((props) => {
onChange={(e) => handleData("name", e.target.value)}
placeholder="Title"
className="w-full resize-none text-xl"
maxLength={255}
required
/>
</div>
);

View File

@ -107,7 +107,7 @@ export const IssueDescriptionInput: FC<IssueDescriptionInputProps> = observer((p
) : (
<RichTextReadOnlyEditor
initialValue={localIssueDescription.description_html ?? ""}
containerClassName="!p-0 !pt-2 text-custom-text-200"
containerClassName="!p-0 !pt-2 text-custom-text-200 min-h-[150px]"
/>
)
}

View File

@ -25,6 +25,11 @@ const ProjectInboxPage: NextPageWithLayout = observer(() => {
const { currentProjectDetails } = useProject();
const { currentTab, handleCurrentTab } = useProjectInbox();
useEffect(() => {
if (navigationTab && currentTab != navigationTab)
handleCurrentTab(navigationTab === "open" ? EInboxIssueCurrentTab.OPEN : EInboxIssueCurrentTab.CLOSED);
}, [currentTab, navigationTab, handleCurrentTab]);
// No access to inbox
if (currentProjectDetails?.inbox_view === false)
return (
@ -39,11 +44,6 @@ const ProjectInboxPage: NextPageWithLayout = observer(() => {
// derived values
const pageTitle = currentProjectDetails?.name ? `${currentProjectDetails?.name} - Inbox` : "Plane - Inbox";
useEffect(() => {
if (navigationTab && currentTab != navigationTab)
handleCurrentTab(navigationTab === "open" ? EInboxIssueCurrentTab.OPEN : EInboxIssueCurrentTab.CLOSED);
}, [currentTab, navigationTab, handleCurrentTab]);
if (!workspaceSlug || !projectId) return <></>;
return (

View File

@ -97,23 +97,24 @@ export class InboxIssueStore implements IInboxIssueStore {
const previousData: Partial<TInboxIssue> = {
status: this.status,
duplicate_to: this.duplicate_to,
duplicate_issue_detail: this.duplicate_issue_detail,
};
try {
if (!this.issue.id) return;
const issueResponse = await this.inboxIssueService.update(this.workspaceSlug, this.projectId, this.issue.id, {
const inboxIssue = await this.inboxIssueService.update(this.workspaceSlug, this.projectId, this.issue.id, {
status: inboxStatus,
duplicate_to: issueId,
});
runInAction(() => {
this.status = issueResponse.status;
this.duplicate_to = issueResponse.duplicate_to;
this.duplicate_issue_detail = issueResponse.duplicate_issue_detail;
set(this, "status", inboxIssue?.status);
set(this, "duplicate_to", inboxIssue?.duplicate_to);
set(this, "duplicate_issue_detail", inboxIssue?.duplicate_issue_detail);
});
} catch {
runInAction(() => {
set(this, "status", previousData.status);
set(this, "duplicate_to", previousData.duplicate_to);
set(this, "duplicate_issue_detail", previousData.duplicate_issue_detail);
});
}
};
@ -124,16 +125,15 @@ export class InboxIssueStore implements IInboxIssueStore {
status: this.status,
snoozed_till: this.snoozed_till,
};
try {
if (!this.issue.id) return;
const issueResponse = await this.inboxIssueService.update(this.workspaceSlug, this.projectId, this.issue.id, {
const inboxIssue = await this.inboxIssueService.update(this.workspaceSlug, this.projectId, this.issue.id, {
status: inboxStatus,
snoozed_till: new Date(date),
});
runInAction(() => {
this.status = issueResponse?.status;
this.snoozed_till = issueResponse?.snoozed_till ? new Date(issueResponse.snoozed_till) : undefined;
set(this, "status", inboxIssue?.status);
set(this, "snoozed_till", inboxIssue?.snoozed_till);
});
} catch {
runInAction(() => {

View File

@ -355,6 +355,7 @@ export class ProjectInboxStore implements IProjectInboxStore {
if (inboxIssue && issueId) {
runInAction(() => {
set(this.inboxIssues, [issueId], new InboxIssueStore(workspaceSlug, projectId, inboxIssue, this.store));
set(this, "loader", undefined);
});
// fetching reactions
await this.store.issue.issueDetail.fetchReactions(workspaceSlug, projectId, issueId);
@ -362,7 +363,6 @@ export class ProjectInboxStore implements IProjectInboxStore {
await this.store.issue.issueDetail.fetchActivities(workspaceSlug, projectId, issueId);
// fetching comments
await this.store.issue.issueDetail.fetchComments(workspaceSlug, projectId, issueId);
this.loader = undefined;
}
return inboxIssue;
} catch (error) {