fix: charts design and mutation (#1426)

* fix: pie chart overlap issue

* fix: burndown chart mutation

* fix: burndown chart mutation
This commit is contained in:
Aaryan Khandelwal 2023-06-28 19:08:33 +05:30 committed by GitHub
parent 01f465fdfa
commit c743d43ce2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 3 deletions

View File

@ -173,6 +173,9 @@ export const SingleBoardIssue: React.FC<Props> = ({
.patchIssue(workspaceSlug as string, projectId as string, issue.id, formData, user)
.then(() => {
mutate(fetchKey);
if (cycleId) mutate(CYCLE_DETAILS(cycleId as string));
if (moduleId) mutate(MODULE_DETAILS(moduleId as string));
});
},
[

View File

@ -147,6 +147,9 @@ export const SingleListIssue: React.FC<Props> = ({
.patchIssue(workspaceSlug as string, projectId as string, issue.id, formData, user)
.then(() => {
mutate(fetchKey);
if (cycleId) mutate(CYCLE_DETAILS(cycleId as string));
if (moduleId) mutate(MODULE_DETAILS(moduleId as string));
});
},
[

View File

@ -30,7 +30,9 @@ import useToast from "hooks/use-toast";
import issuesService from "services/issues.service";
// constant
import {
CYCLE_DETAILS,
CYCLE_ISSUES_WITH_PARAMS,
MODULE_DETAILS,
MODULE_ISSUES_WITH_PARAMS,
PROJECT_ISSUES_LIST_WITH_PARAMS,
SUB_ISSUES,
@ -142,6 +144,9 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
mutate(SUB_ISSUES(issue.parent as string));
} else {
mutate(fetchKey);
if (cycleId) mutate(CYCLE_DETAILS(cycleId as string));
if (moduleId) mutate(MODULE_DETAILS(moduleId as string));
}
})
.catch((error) => {

View File

@ -25,8 +25,12 @@ export const IssuesPieChart: React.FC<Props> = ({ groupedIssues }) => (
})) ?? []
}
height="320px"
innerRadius={0.5}
arcLinkLabel={(cell) => `${capitalizeFirstLetter(cell.label.toString())} (${cell.value})`}
innerRadius={0.6}
cornerRadius={5}
padAngle={2}
enableArcLabels
arcLabelsTextColor="#000000"
enableArcLinkLabels={false}
legends={[
{
anchor: "right",
@ -53,8 +57,14 @@ export const IssuesPieChart: React.FC<Props> = ({ groupedIssues }) => (
]}
activeInnerRadiusOffset={5}
colors={(datum) => datum.data.color}
tooltip={(datum) => (
<div className="flex items-center gap-2 rounded-md border border-brand-base bg-brand-surface-2 p-2 text-xs">
<span className="text-brand-secondary capitalize">{datum.datum.label} issues:</span>{" "}
{datum.datum.value}
</div>
)}
theme={{
background: "rgb(var(--color-bg-base))",
background: "transparent",
}}
/>
</div>