forked from github/plane
chore: added missing columns to the spreadsheet layout (#2640)
This commit is contained in:
parent
992cf79031
commit
41e9d5d7e3
@ -0,0 +1,34 @@
|
||||
import React from "react";
|
||||
// hooks
|
||||
import useSubIssue from "hooks/use-sub-issue";
|
||||
// types
|
||||
import { IIssue } from "types";
|
||||
|
||||
type Props = {
|
||||
issue: IIssue;
|
||||
expandedIssues: string[];
|
||||
};
|
||||
|
||||
export const SpreadsheetAttachmentColumn: React.FC<Props> = (props) => {
|
||||
const { issue, expandedIssues } = props;
|
||||
|
||||
const isExpanded = expandedIssues.indexOf(issue.id) > -1;
|
||||
|
||||
const { subIssues, isLoading } = useSubIssue(issue.project_detail.id, issue.id, isExpanded);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex items-center justify-center text-xs h-full w-full">
|
||||
{issue.attachment_count} {issue.attachment_count === 1 ? "attachment" : "attachments"}
|
||||
</div>
|
||||
|
||||
{isExpanded &&
|
||||
!isLoading &&
|
||||
subIssues &&
|
||||
subIssues.length > 0 &&
|
||||
subIssues.map((subIssue: IIssue) => (
|
||||
<SpreadsheetAttachmentColumn key={subIssue.id} issue={subIssue} expandedIssues={expandedIssues} />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
@ -142,6 +142,39 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
|
||||
property="updated_on"
|
||||
/>
|
||||
)}
|
||||
{displayProperties.link && (
|
||||
<SpreadsheetColumn
|
||||
displayFilters={displayFilters}
|
||||
disableUserActions={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
|
||||
handleUpdateIssue={handleUpdateIssue}
|
||||
issues={issues}
|
||||
property="link"
|
||||
/>
|
||||
)}
|
||||
{displayProperties.attachment_count && (
|
||||
<SpreadsheetColumn
|
||||
displayFilters={displayFilters}
|
||||
disableUserActions={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
|
||||
handleUpdateIssue={handleUpdateIssue}
|
||||
issues={issues}
|
||||
property="attachment_count"
|
||||
/>
|
||||
)}
|
||||
{displayProperties.sub_issue_count && (
|
||||
<SpreadsheetColumn
|
||||
displayFilters={displayFilters}
|
||||
disableUserActions={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
|
||||
handleUpdateIssue={handleUpdateIssue}
|
||||
issues={issues}
|
||||
property="sub_issue_count"
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
@ -1,11 +1,14 @@
|
||||
export * from "./issue";
|
||||
export * from "./assignee-column";
|
||||
export * from "./attachment-column";
|
||||
export * from "./columns-list";
|
||||
export * from "./created-on-column";
|
||||
export * from "./due-date-column";
|
||||
export * from "./estimate-column";
|
||||
export * from "./label-column";
|
||||
export * from "./link-column";
|
||||
export * from "./priority-column";
|
||||
export * from "./start-date-column";
|
||||
export * from "./state-column";
|
||||
export * from "./sub-issue-column";
|
||||
export * from "./updated-on-column";
|
||||
|
@ -0,0 +1,34 @@
|
||||
import React from "react";
|
||||
// hooks
|
||||
import useSubIssue from "hooks/use-sub-issue";
|
||||
// types
|
||||
import { IIssue } from "types";
|
||||
|
||||
type Props = {
|
||||
issue: IIssue;
|
||||
expandedIssues: string[];
|
||||
};
|
||||
|
||||
export const SpreadsheetLinkColumn: React.FC<Props> = (props) => {
|
||||
const { issue, expandedIssues } = props;
|
||||
|
||||
const isExpanded = expandedIssues.indexOf(issue.id) > -1;
|
||||
|
||||
const { subIssues, isLoading } = useSubIssue(issue.project_detail.id, issue.id, isExpanded);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex items-center justify-center text-xs h-full w-full">
|
||||
{issue.link_count} {issue.link_count === 1 ? "link" : "links"}
|
||||
</div>
|
||||
|
||||
{isExpanded &&
|
||||
!isLoading &&
|
||||
subIssues &&
|
||||
subIssues.length > 0 &&
|
||||
subIssues.map((subIssue: IIssue) => (
|
||||
<SpreadsheetLinkColumn key={subIssue.id} issue={subIssue} expandedIssues={expandedIssues} />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
@ -0,0 +1,34 @@
|
||||
import React from "react";
|
||||
// hooks
|
||||
import useSubIssue from "hooks/use-sub-issue";
|
||||
// types
|
||||
import { IIssue } from "types";
|
||||
|
||||
type Props = {
|
||||
issue: IIssue;
|
||||
expandedIssues: string[];
|
||||
};
|
||||
|
||||
export const SpreadsheetSubIssueColumn: React.FC<Props> = (props) => {
|
||||
const { issue, expandedIssues } = props;
|
||||
|
||||
const isExpanded = expandedIssues.indexOf(issue.id) > -1;
|
||||
|
||||
const { subIssues, isLoading } = useSubIssue(issue.project_detail.id, issue.id, isExpanded);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex items-center justify-center text-xs h-full w-full">
|
||||
{issue.sub_issues_count} {issue.sub_issues_count === 1 ? "sub-issue" : "sub-issues"}
|
||||
</div>
|
||||
|
||||
{isExpanded &&
|
||||
!isLoading &&
|
||||
subIssues &&
|
||||
subIssues.length > 0 &&
|
||||
subIssues.map((subIssue: IIssue) => (
|
||||
<SpreadsheetSubIssueColumn key={subIssue.id} issue={subIssue} expandedIssues={expandedIssues} />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
@ -12,13 +12,16 @@ import useLocalStorage from "hooks/use-local-storage";
|
||||
// components
|
||||
import {
|
||||
SpreadsheetAssigneeColumn,
|
||||
SpreadsheetAttachmentColumn,
|
||||
SpreadsheetCreatedOnColumn,
|
||||
SpreadsheetDueDateColumn,
|
||||
SpreadsheetEstimateColumn,
|
||||
SpreadsheetLabelColumn,
|
||||
SpreadsheetLinkColumn,
|
||||
SpreadsheetPriorityColumn,
|
||||
SpreadsheetStartDateColumn,
|
||||
SpreadsheetStateColumn,
|
||||
SpreadsheetSubIssueColumn,
|
||||
SpreadsheetUpdatedOnColumn,
|
||||
} from "components/issues";
|
||||
// ui
|
||||
@ -178,7 +181,6 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "priority" ? (
|
||||
<SpreadsheetPriorityColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
@ -186,7 +188,6 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "estimate" ? (
|
||||
<SpreadsheetEstimateColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
@ -194,7 +195,6 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "assignee" ? (
|
||||
<SpreadsheetAssigneeColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
@ -203,7 +203,6 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "labels" ? (
|
||||
<SpreadsheetLabelColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
@ -212,7 +211,6 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "start_date" ? (
|
||||
<SpreadsheetStartDateColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
@ -220,24 +218,21 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
|
||||
/>
|
||||
) : property === "due_date" ? (
|
||||
<SpreadsheetDueDateColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
disabled={disableUserActions}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
|
||||
/>
|
||||
) : property === "created_on" ? (
|
||||
<SpreadsheetCreatedOnColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
/>
|
||||
<SpreadsheetCreatedOnColumn expandedIssues={expandedIssues} issue={issue} />
|
||||
) : property === "updated_on" ? (
|
||||
<SpreadsheetUpdatedOnColumn
|
||||
key={`${property}-${issue.id}`}
|
||||
expandedIssues={expandedIssues}
|
||||
issue={issue}
|
||||
/>
|
||||
<SpreadsheetUpdatedOnColumn expandedIssues={expandedIssues} issue={issue} />
|
||||
) : property === "link" ? (
|
||||
<SpreadsheetLinkColumn expandedIssues={expandedIssues} issue={issue} />
|
||||
) : property === "attachment_count" ? (
|
||||
<SpreadsheetAttachmentColumn expandedIssues={expandedIssues} issue={issue} />
|
||||
) : property === "sub_issue_count" ? (
|
||||
<SpreadsheetSubIssueColumn expandedIssues={expandedIssues} issue={issue} />
|
||||
) : null}
|
||||
</div>
|
||||
))}
|
||||
|
@ -72,4 +72,25 @@ export const SPREADSHEET_PROPERTY_DETAILS: {
|
||||
descendingOrderKey: "updated_at",
|
||||
descendingOrderTitle: "Old",
|
||||
},
|
||||
link: {
|
||||
title: "Link",
|
||||
ascendingOrderKey: "-link_count",
|
||||
ascendingOrderTitle: "Most",
|
||||
descendingOrderKey: "link_count",
|
||||
descendingOrderTitle: "Least",
|
||||
},
|
||||
attachment_count: {
|
||||
title: "Attachment",
|
||||
ascendingOrderKey: "-attachment_count",
|
||||
ascendingOrderTitle: "Most",
|
||||
descendingOrderKey: "attachment_count",
|
||||
descendingOrderTitle: "Least",
|
||||
},
|
||||
sub_issue_count: {
|
||||
title: "Sub-issue",
|
||||
ascendingOrderKey: "-sub_issues_count",
|
||||
ascendingOrderTitle: "Most",
|
||||
descendingOrderKey: "sub_issues_count",
|
||||
descendingOrderTitle: "Least",
|
||||
},
|
||||
};
|
||||
|
8
web/types/view-props.d.ts
vendored
8
web/types/view-props.d.ts
vendored
@ -30,7 +30,13 @@ export type TIssueOrderByOptions =
|
||||
| "estimate_point"
|
||||
| "-estimate_point"
|
||||
| "start_date"
|
||||
| "-start_date";
|
||||
| "-start_date"
|
||||
| "link_count"
|
||||
| "-link_count"
|
||||
| "attachment_count"
|
||||
| "-attachment_count"
|
||||
| "sub_issues_count"
|
||||
| "-sub_issues_count";
|
||||
|
||||
export type TIssueTypeFilters = "active" | "backlog" | null;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user