forked from github/plane
refractor: changed to due date from target date
This commit is contained in:
parent
a4b738508f
commit
08deff5d21
@ -228,7 +228,7 @@ const SingleIssue: React.FC<Props> = ({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{properties.target_date && (
|
{properties.due_date && (
|
||||||
<div
|
<div
|
||||||
className={`group flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
className={`group flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
||||||
issue.target_date === null
|
issue.target_date === null
|
||||||
@ -246,10 +246,10 @@ const SingleIssue: React.FC<Props> = ({
|
|||||||
<div>
|
<div>
|
||||||
{issue.target_date &&
|
{issue.target_date &&
|
||||||
(issue.target_date < new Date().toISOString()
|
(issue.target_date < new Date().toISOString()
|
||||||
? `Target date has passed by ${findHowManyDaysLeft(issue.target_date)} days`
|
? `Due date has passed by ${findHowManyDaysLeft(issue.target_date)} days`
|
||||||
: findHowManyDaysLeft(issue.target_date) <= 3
|
: findHowManyDaysLeft(issue.target_date) <= 3
|
||||||
? `Target date is in ${findHowManyDaysLeft(issue.target_date)} days`
|
? `Due date is in ${findHowManyDaysLeft(issue.target_date)} days`
|
||||||
: "Target date")}
|
: "Due date")}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -218,7 +218,7 @@ const CyclesListView: React.FC<Props> = ({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{properties.target_date && (
|
{properties.due_date && (
|
||||||
<div
|
<div
|
||||||
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
||||||
issue.target_date === null
|
issue.target_date === null
|
||||||
@ -234,23 +234,21 @@ const CyclesListView: React.FC<Props> = ({
|
|||||||
? renderShortNumericDateFormat(issue.target_date)
|
? renderShortNumericDateFormat(issue.target_date)
|
||||||
: "N/A"}
|
: "N/A"}
|
||||||
<div className="absolute bottom-full right-0 mb-2 z-10 hidden group-hover:block p-2 bg-white shadow-md rounded-md whitespace-nowrap">
|
<div className="absolute bottom-full right-0 mb-2 z-10 hidden group-hover:block p-2 bg-white shadow-md rounded-md whitespace-nowrap">
|
||||||
<h5 className="font-medium mb-1 text-gray-900">
|
<h5 className="font-medium mb-1 text-gray-900">Due date</h5>
|
||||||
Target date
|
|
||||||
</h5>
|
|
||||||
<div>
|
<div>
|
||||||
{renderShortNumericDateFormat(issue.target_date ?? "")}
|
{renderShortNumericDateFormat(issue.target_date ?? "")}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{issue.target_date &&
|
{issue.target_date &&
|
||||||
(issue.target_date < new Date().toISOString()
|
(issue.target_date < new Date().toISOString()
|
||||||
? `Target date has passed by ${findHowManyDaysLeft(
|
? `Due date has passed by ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: findHowManyDaysLeft(issue.target_date) <= 3
|
: findHowManyDaysLeft(issue.target_date) <= 3
|
||||||
? `Target date is in ${findHowManyDaysLeft(
|
? `Due date is in ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: "Target date")}
|
: "Due date")}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -310,7 +310,7 @@ const ListView: React.FC<Props> = ({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{properties.target_date && (
|
{properties.due_date && (
|
||||||
<div
|
<div
|
||||||
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
||||||
issue.target_date === null
|
issue.target_date === null
|
||||||
@ -335,14 +335,14 @@ const ListView: React.FC<Props> = ({
|
|||||||
<div>
|
<div>
|
||||||
{issue.target_date &&
|
{issue.target_date &&
|
||||||
(issue.target_date < new Date().toISOString()
|
(issue.target_date < new Date().toISOString()
|
||||||
? `Target date has passed by ${findHowManyDaysLeft(
|
? `Due date has passed by ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: findHowManyDaysLeft(issue.target_date) <= 3
|
: findHowManyDaysLeft(issue.target_date) <= 3
|
||||||
? `Target date is in ${findHowManyDaysLeft(
|
? `Due date is in ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: "Target date")}
|
: "Due date")}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -16,7 +16,7 @@ const initialValues: Properties = {
|
|||||||
assignee: true,
|
assignee: true,
|
||||||
priority: false,
|
priority: false,
|
||||||
start_date: false,
|
start_date: false,
|
||||||
target_date: false,
|
due_date: false,
|
||||||
cycle: false,
|
cycle: false,
|
||||||
children_count: false,
|
children_count: false,
|
||||||
};
|
};
|
||||||
@ -26,7 +26,7 @@ const useIssuesProperties = (workspaceSlug?: string, projectId?: string) => {
|
|||||||
|
|
||||||
const { user } = useUser();
|
const { user } = useUser();
|
||||||
|
|
||||||
const { data: issueProperties } = useSWR<IssuePriorities>(
|
const { data: issueProperties, mutate: mutateIssueProperties } = useSWR<IssuePriorities>(
|
||||||
workspaceSlug && projectId ? ISSUE_PROPERTIES_ENDPOINT(workspaceSlug, projectId) : null,
|
workspaceSlug && projectId ? ISSUE_PROPERTIES_ENDPOINT(workspaceSlug, projectId) : null,
|
||||||
workspaceSlug && projectId
|
workspaceSlug && projectId
|
||||||
? () => issueServices.getIssueProperties(workspaceSlug, projectId)
|
? () => issueServices.getIssueProperties(workspaceSlug, projectId)
|
||||||
@ -56,6 +56,14 @@ const useIssuesProperties = (workspaceSlug?: string, projectId?: string) => {
|
|||||||
(key: keyof Properties) => {
|
(key: keyof Properties) => {
|
||||||
if (!workspaceSlug || !projectId || !issueProperties || !user) return;
|
if (!workspaceSlug || !projectId || !issueProperties || !user) return;
|
||||||
setProperties((prev) => ({ ...prev, [key]: !prev[key] }));
|
setProperties((prev) => ({ ...prev, [key]: !prev[key] }));
|
||||||
|
mutateIssueProperties(
|
||||||
|
(prev) =>
|
||||||
|
({
|
||||||
|
...prev,
|
||||||
|
properties: { ...prev?.properties, [key]: !prev?.properties?.[key] },
|
||||||
|
} as IssuePriorities),
|
||||||
|
false
|
||||||
|
);
|
||||||
if (Object.keys(issueProperties).length > 0) {
|
if (Object.keys(issueProperties).length > 0) {
|
||||||
issueServices.patchIssueProperties(workspaceSlug, projectId, issueProperties.id, {
|
issueServices.patchIssueProperties(workspaceSlug, projectId, issueProperties.id, {
|
||||||
properties: {
|
properties: {
|
||||||
@ -71,23 +79,19 @@ const useIssuesProperties = (workspaceSlug?: string, projectId?: string) => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[workspaceSlug, projectId, issueProperties, user]
|
[workspaceSlug, projectId, issueProperties, user, mutateIssueProperties]
|
||||||
);
|
);
|
||||||
|
|
||||||
const newProperties = Object.keys(properties).reduce((obj: any, key) => {
|
const newProperties: Properties = {
|
||||||
if (
|
key: properties.key,
|
||||||
key !== "children" &&
|
state: properties.state,
|
||||||
key !== "name" &&
|
assignee: properties.assignee,
|
||||||
key !== "parent" &&
|
priority: properties.priority,
|
||||||
key !== "project" &&
|
start_date: properties.start_date,
|
||||||
key !== "description" &&
|
due_date: properties.due_date,
|
||||||
key !== "attachments" &&
|
cycle: properties.cycle,
|
||||||
key !== "sequence_id"
|
children_count: properties.children_count,
|
||||||
) {
|
};
|
||||||
obj[key] = properties[key as keyof Properties];
|
|
||||||
}
|
|
||||||
return obj;
|
|
||||||
}, {});
|
|
||||||
|
|
||||||
return [newProperties, updateIssueProperties] as const;
|
return [newProperties, updateIssueProperties] as const;
|
||||||
};
|
};
|
||||||
|
@ -16,7 +16,7 @@ const initialValues: Properties = {
|
|||||||
assignee: true,
|
assignee: true,
|
||||||
priority: false,
|
priority: false,
|
||||||
start_date: false,
|
start_date: false,
|
||||||
target_date: false,
|
due_date: false,
|
||||||
cycle: false,
|
cycle: false,
|
||||||
children_count: false,
|
children_count: false,
|
||||||
};
|
};
|
||||||
|
@ -398,7 +398,7 @@ const MyIssues: NextPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{properties.target_date && (
|
{properties.due_date && (
|
||||||
<div
|
<div
|
||||||
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
className={`group relative flex-shrink-0 group flex items-center gap-1 hover:bg-gray-100 border rounded shadow-sm px-2 py-1 cursor-pointer focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 text-xs duration-300 ${
|
||||||
issue.target_date === null
|
issue.target_date === null
|
||||||
@ -415,7 +415,7 @@ const MyIssues: NextPage = () => {
|
|||||||
: "N/A"}
|
: "N/A"}
|
||||||
<div className="absolute bottom-full right-0 mb-2 z-10 hidden group-hover:block p-2 bg-white shadow-md rounded-md whitespace-nowrap">
|
<div className="absolute bottom-full right-0 mb-2 z-10 hidden group-hover:block p-2 bg-white shadow-md rounded-md whitespace-nowrap">
|
||||||
<h5 className="font-medium mb-1 text-gray-900">
|
<h5 className="font-medium mb-1 text-gray-900">
|
||||||
Target date
|
Due date
|
||||||
</h5>
|
</h5>
|
||||||
<div>
|
<div>
|
||||||
{renderShortNumericDateFormat(issue.target_date ?? "")}
|
{renderShortNumericDateFormat(issue.target_date ?? "")}
|
||||||
@ -423,14 +423,14 @@ const MyIssues: NextPage = () => {
|
|||||||
<div>
|
<div>
|
||||||
{issue.target_date &&
|
{issue.target_date &&
|
||||||
(issue.target_date < new Date().toISOString()
|
(issue.target_date < new Date().toISOString()
|
||||||
? `Target date has passed by ${findHowManyDaysLeft(
|
? `Due date has passed by ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: findHowManyDaysLeft(issue.target_date) <= 3
|
: findHowManyDaysLeft(issue.target_date) <= 3
|
||||||
? `Target date is in ${findHowManyDaysLeft(
|
? `Due date is in ${findHowManyDaysLeft(
|
||||||
issue.target_date
|
issue.target_date
|
||||||
)} days`
|
)} days`
|
||||||
: "Target date")}
|
: "Due date")}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
2
apps/app/types/issues.d.ts
vendored
2
apps/app/types/issues.d.ts
vendored
@ -130,7 +130,7 @@ export type Properties = {
|
|||||||
assignee: boolean;
|
assignee: boolean;
|
||||||
priority: boolean;
|
priority: boolean;
|
||||||
start_date: boolean;
|
start_date: boolean;
|
||||||
target_date: boolean;
|
due_date: boolean;
|
||||||
cycle: boolean;
|
cycle: boolean;
|
||||||
children_count: boolean;
|
children_count: boolean;
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user