thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

view changes for the project roles

Browse Source
This commit is contained in:
rahulramesha 2023-12-07 18:50:05 +05:30
parent 0e055666e7
commit 8e80e35d10
17 changed files with 201 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
web/components/issues/issue-layouts/kanban/base-kanban-root.tsx
View File

@ -68,6 +68,7 @@ export interface IBaseKanBanLayout {
issueWithIds: any
) => Promise<IIssue | undefined>;
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
}
type KanbanDragState = {
@ -88,6 +89,7 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
currentStore,
handleDragDrop,
addIssuesToView,
canEditPropertiesBasedOnProject,
} = props;
// router
const router = useRouter();
@ -105,7 +107,6 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
const { setToastAlert } = useToast();
const { currentProjectRole } = userStore;
const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
const issues = issueStore?.getIssues || {};
const issueIds = issueStore?.getIssuesIds || [];
@ -130,6 +131,15 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
const [dragState, setDragState] = useState<KanbanDragState>({});
const [deleteIssueModal, setDeleteIssueModal] = useState(false);
const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
const canEditProperties = (projectId: string | undefined) => {
const isEditingAllowedBasedOnProject =
canEditPropertiesBasedOnProject && projectId ? canEditPropertiesBasedOnProject(projectId) : isEditingAllowed;
return enableInlineEditing && isEditingAllowedBasedOnProject;
};
const onDragStart = (dragStart: DragStart) => {
setDragState({
draggedIssueId: dragStart.draggableId.split("__")[0],
@ -285,7 +295,7 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
quickAddCallback={issueStore?.quickAddIssue}
viewId={viewId}
disableIssueCreation={!enableIssueCreation || !isEditingAllowed}
isReadOnly={!enableInlineEditing || !isEditingAllowed}
canEditProperties={canEditProperties}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
/>
@ -327,14 +337,10 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
isDragStarted={isDragStarted}
disableIssueCreation={true}
enableQuickIssueCreate={enableQuickAdd}
isReadOnly={!enableInlineEditing || !isEditingAllowed}
currentStore={currentStore}
quickAddCallback={issueStore?.quickAddIssue}
addIssuesToView={(issues) => {
console.log("kanban existingIds", issues);
return Promise.resolve({} as IIssue);
}}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
</DragDropContext>

8
web/components/issues/issue-layouts/kanban/block.tsx
View File

@ -20,7 +20,7 @@ interface IssueBlockProps {
handleIssues: (sub_group_by: string | null, group_by: string | null, issue: IIssue, action: EIssueActions) => void;
quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode;
displayProperties: IIssueDisplayProperties | null;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
interface IssueDetailsBlockProps {
@ -110,13 +110,15 @@ export const KanbanIssueBlock: React.FC<IssueBlockProps> = (props) => {
handleIssues,
quickActions,
displayProperties,
isReadOnly,
canEditProperties,
} = props;
let draggableId = issue.id;
if (columnId) draggableId = `${draggableId}__${columnId}`;
if (sub_group_id) draggableId = `${draggableId}__${sub_group_id}`;
const canEditIssueProperties = canEditProperties(issue.project);
return (
<>
<Draggable draggableId={draggableId} index={index}>
@ -143,7 +145,7 @@ export const KanbanIssueBlock: React.FC<IssueBlockProps> = (props) => {
handleIssues={handleIssues}
quickActions={quickActions}
displayProperties={displayProperties}
isReadOnly={isReadOnly}
isReadOnly={!canEditIssueProperties}
/>
</div>
</div>

6
web/components/issues/issue-layouts/kanban/blocks-list.tsx
View File

@ -19,7 +19,7 @@ interface IssueBlocksListProps {
customActionButton?: React.ReactElement
) => React.ReactNode;
displayProperties: IIssueDisplayProperties | null;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = (props) => {
@ -33,7 +33,7 @@ export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = (props) =>
handleIssues,
quickActions,
displayProperties,
isReadOnly,
canEditProperties,
} = props;
return (
@ -57,7 +57,7 @@ export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = (props) =>
columnId={columnId}
sub_group_id={sub_group_id}
isDragDisabled={isDragDisabled}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
/>
);
})}

24
web/components/issues/issue-layouts/kanban/default.tsx
View File

@ -48,7 +48,7 @@ export interface IGroupByKanBan {
disableIssueCreation?: boolean;
currentStore?: EProjectStore;
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
@ -75,9 +75,9 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
quickAddCallback,
viewId,
disableIssueCreation,
isReadOnly,
currentStore,
addIssuesToView,
canEditProperties,
} = props;
const verticalAlignPosition = (_list: any) =>
@ -133,7 +133,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
handleIssues={handleIssues}
quickActions={quickActions}
displayProperties={displayProperties}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
/>
) : (
isDragDisabled && (
@ -216,7 +216,7 @@ export interface IKanBan {
disableIssueCreation?: boolean;
currentStore?: EProjectStore;
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
export const KanBan: React.FC<IKanBan> = observer((props) => {
@ -244,9 +244,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback,
viewId,
disableIssueCreation,
isReadOnly,
currentStore,
addIssuesToView,
canEditProperties,
} = props;
const { issueKanBanView: issueKanBanViewStore } = useMobxStore();
@ -276,9 +276,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -305,9 +305,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -334,9 +334,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -363,9 +363,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -392,9 +392,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -421,9 +421,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
@ -450,9 +450,9 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
isReadOnly={isReadOnly}
currentStore={currentStore}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>
)}
</div>

26
web/components/issues/issue-layouts/kanban/swimlanes.tsx
View File

@ -95,7 +95,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
disableIssueCreation?: boolean;
currentStore?: EProjectStore;
enableQuickIssueCreate: boolean;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
quickAddCallback?: (
workspaceSlug: string,
projectId: string,
@ -127,7 +127,7 @@ const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
isDragStarted,
disableIssueCreation,
enableQuickIssueCreate,
isReadOnly,
canEditProperties,
addIssuesToView,
quickAddCallback,
} = props;
@ -186,7 +186,7 @@ const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
projects={projects}
enableQuickIssueCreate={enableQuickIssueCreate}
isDragStarted={isDragStarted}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
addIssuesToView={addIssuesToView}
quickAddCallback={quickAddCallback}
/>
@ -232,7 +232,7 @@ export interface IKanBanSwimLanes {
data: IIssue,
viewId?: string
) => Promise<IIssue | undefined>;
isReadOnly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
@ -257,7 +257,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted,
disableIssueCreation,
enableQuickIssueCreate,
isReadOnly,
canEditProperties,
currentStore,
addIssuesToView,
quickAddCallback,
@ -402,7 +402,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -431,7 +431,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -460,7 +460,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -489,7 +489,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -518,7 +518,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -547,7 +547,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -576,7 +576,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}
@ -605,7 +605,7 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
isDragStarted={isDragStarted}
disableIssueCreation={disableIssueCreation}
enableQuickIssueCreate={enableQuickIssueCreate}
isReadOnly={isReadOnly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
/>
)}

10
web/components/issues/issue-layouts/list/base-list-root.tsx
View File

@ -58,6 +58,7 @@ interface IBaseListRoot {
viewId?: string;
currentStore: EProjectStore;
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
}
export const BaseListRoot = observer((props: IBaseListRoot) => {
@ -70,6 +71,7 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
viewId,
currentStore,
addIssuesToView,
canEditPropertiesBasedOnProject,
} = props;
// router
const router = useRouter();
@ -90,6 +92,12 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
const issues = issueStore?.getIssues;
const { enableInlineEditing, enableQuickAdd, enableIssueCreation } = issueStore?.viewFlags || {};
const canEditProperties = (projectId: string | undefined) => {
const isEditingAllowedBasedOnProject =
canEditPropertiesBasedOnProject && projectId ? canEditPropertiesBasedOnProject(projectId) : isEditingAllowed;
return enableInlineEditing && isEditingAllowedBasedOnProject;
};
const displayFilters = issueFilterStore?.issueFilters?.displayFilters;
const group_by = displayFilters?.group_by || null;
@ -147,7 +155,7 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
viewId={viewId}
quickAddCallback={issueStore?.quickAddIssue}
enableIssueQuickAdd={!!enableQuickAdd}
isReadonly={!enableInlineEditing || !isEditingAllowed}
canEditProperties={canEditProperties}
disableIssueCreation={!enableIssueCreation || !isEditingAllowed}
currentStore={currentStore}
addIssuesToView={addIssuesToView}

8
web/components/issues/issue-layouts/list/block.tsx
View File

@ -14,11 +14,11 @@ interface IssueBlockProps {
handleIssues: (issue: IIssue, action: EIssueActions) => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
displayProperties: IIssueDisplayProperties | undefined;
isReadonly?: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
}
export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
const { columnId, issue, handleIssues, quickActions, displayProperties, isReadonly } = props;
const { columnId, issue, handleIssues, quickActions, displayProperties, canEditProperties } = props;
// router
const router = useRouter();
const updateIssue = (group_by: string | null, issueToUpdate: IIssue) => {
@ -34,6 +34,8 @@ export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
});
};
const canEditIssueProperties = canEditProperties(issue.project);
return (
<>
<div className="text-sm p-3 relative bg-custom-background-100 flex items-center gap-3">
@ -61,7 +63,7 @@ export const IssueBlock: React.FC<IssueBlockProps> = (props) => {
<ListProperties
columnId={columnId}
issue={issue}
isReadonly={isReadonly}
isReadonly={!canEditIssueProperties}
handleIssues={updateIssue}
displayProperties={displayProperties}
/>

6
web/components/issues/issue-layouts/list/blocks-list.tsx
View File

@ -10,14 +10,14 @@ interface Props {
columnId: string;
issueIds: IGroupedIssues | TUnGroupedIssues | any;
issues: IIssueResponse;
isReadonly?: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
handleIssues: (issue: IIssue, action: EIssueActions) => void;
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
displayProperties: IIssueDisplayProperties | undefined;
}
export const IssueBlocksList: FC<Props> = (props) => {
const { columnId, issueIds, issues, handleIssues, quickActions, displayProperties, isReadonly } = props;
const { columnId, issueIds, issues, handleIssues, quickActions, displayProperties, canEditProperties } = props;
return (
<div className="w-full h-full relative divide-y-[0.5px] divide-custom-border-200">
@ -31,7 +31,7 @@ export const IssueBlocksList: FC<Props> = (props) => {
issue={issues[issueId]}
handleIssues={handleIssues}
quickActions={quickActions}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
displayProperties={displayProperties}
/>
)

26
web/components/issues/issue-layouts/list/default.tsx
View File

@ -23,7 +23,7 @@ export interface IGroupByList {
displayProperties: IIssueDisplayProperties | undefined;
enableIssueQuickAdd: boolean;
showEmptyGroup?: boolean;
isReadonly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
quickAddCallback?: (
workspaceSlug: string,
projectId: string,
@ -50,7 +50,7 @@ const GroupByList: React.FC<IGroupByList> = (props) => {
displayProperties,
enableIssueQuickAdd,
showEmptyGroup,
isReadonly,
canEditProperties,
quickAddCallback,
viewId,
disableIssueCreation,
@ -105,7 +105,7 @@ const GroupByList: React.FC<IGroupByList> = (props) => {
handleIssues={handleIssues}
quickActions={quickActions}
displayProperties={displayProperties}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
/>
)}
@ -134,7 +134,7 @@ export interface IList {
displayProperties: IIssueDisplayProperties | undefined;
showEmptyGroup: boolean;
enableIssueQuickAdd: boolean;
isReadonly: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
states: IState[] | null;
labels: IIssueLabel[] | null;
members: IUserLite[] | null;
@ -165,7 +165,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties,
showEmptyGroup,
enableIssueQuickAdd,
isReadonly,
canEditProperties,
disableIssueCreation,
states,
stateGroups,
@ -193,7 +193,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
enableIssueQuickAdd={enableIssueQuickAdd}
showEmptyGroup={showEmptyGroup}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -215,7 +215,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -237,7 +237,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -259,7 +259,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -281,7 +281,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -303,7 +303,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -325,7 +325,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
@ -347,7 +347,7 @@ export const List: React.FC<IList> = (props) => {
displayProperties={displayProperties}
showEmptyGroup={showEmptyGroup}
enableIssueQuickAdd={enableIssueQuickAdd}
isReadonly={isReadonly}
canEditProperties={canEditProperties}
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}

8
web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
View File

@ -55,7 +55,11 @@ export const AllIssueLayoutRoot: React.FC<Props> = observer((props) => {
}
);
const isEditingAllowed = false;
const canEditProperties = (projectId: string | undefined) => {
const isEditingAllowedBasedOnProject = false;
return isEditingAllowedBasedOnProject;
};
const issuesResponse = getIssues;
const issueIds = (getIssuesIds ?? []) as TUnGroupedIssues;
@ -123,7 +127,7 @@ export const AllIssueLayoutRoot: React.FC<Props> = observer((props) => {
members={workspaceMembers?.map((m) => m.member)}
labels={workspaceLabels || undefined}
handleIssues={handleIssues}
disableUserActions={isEditingAllowed}
canEditProperties={canEditProperties}
viewId={currentIssueView}
/>
</div>

16
web/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx
View File

@ -34,10 +34,11 @@ interface IBaseSpreadsheetRoot {
[EIssueActions.UPDATE]?: (issue: IIssue) => void;
[EIssueActions.REMOVE]?: (issue: IIssue) => void;
};
canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
}
export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => {
const { issueFiltersStore, issueStore, viewId, QuickActions, issueActions } = props;
const { issueFiltersStore, issueStore, viewId, QuickActions, issueActions, canEditPropertiesBasedOnProject } = props;
const router = useRouter();
const { workspaceSlug, projectId } = router.query as { workspaceSlug: string; projectId: string };
@ -49,9 +50,18 @@ export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => {
user: userStore,
} = useMobxStore();
const { enableInlineEditing, enableQuickAdd } = issueStore?.viewFlags || {};
const { currentProjectRole } = userStore;
const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
const canEditProperties = (projectId: string | undefined) => {
const isEditingAllowedBasedOnProject =
canEditPropertiesBasedOnProject && projectId ? canEditPropertiesBasedOnProject(projectId) : isEditingAllowed;
return enableInlineEditing && isEditingAllowedBasedOnProject;
};
const issuesResponse = issueStore.getIssues;
const issueIds = (issueStore.getIssuesIds ?? []) as TUnGroupedIssues;
@ -106,10 +116,10 @@ export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => {
labels={projectLabels || undefined}
states={projectId ? projectStateStore.states?.[projectId.toString()] : undefined}
handleIssues={handleIssues}
disableUserActions={!isEditingAllowed}
canEditProperties={canEditProperties}
quickAddCallback={issueStore.quickAddIssue}
viewId={viewId}
enableQuickCreateIssue
enableQuickCreateIssue={enableQuickAdd}
/>
);
});

28
web/components/issues/issue-layouts/spreadsheet/columns/columns-list.tsx
View File

@ -8,7 +8,7 @@ import { IIssue, IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueLabe
type Props = {
displayFilters: IIssueDisplayFilterOptions;
displayProperties: IIssueDisplayProperties;
disableUserActions: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
expandedIssues: string[];
handleDisplayFilterUpdate: (data: Partial<IIssueDisplayFilterOptions>) => void;
handleUpdateIssue: (issue: IIssue, data: Partial<IIssue>) => void;
@ -20,7 +20,7 @@ type Props = {
export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
const {
disableUserActions,
canEditProperties,
displayFilters,
displayProperties,
expandedIssues,
@ -43,7 +43,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.state && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -55,7 +55,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.priority && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -66,7 +66,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.assignee && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -78,7 +78,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.labels && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -90,7 +90,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.start_date && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -101,7 +101,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.due_date && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -112,7 +112,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.estimate && isEstimateEnabled && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -123,7 +123,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.created_on && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -134,7 +134,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.updated_on && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -145,7 +145,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.link && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -156,7 +156,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.attachment_count && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}
@ -167,7 +167,7 @@ export const SpreadsheetColumnsList: React.FC<Props> = observer((props) => {
{displayProperties.sub_issue_count && (
<SpreadsheetColumn
displayFilters={displayFilters}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={handleUpdateIssue}

6
web/components/issues/issue-layouts/spreadsheet/columns/issue/issue-column.tsx
View File

@ -14,7 +14,7 @@ type Props = {
handleToggleExpand: (issueId: string) => void;
properties: IIssueDisplayProperties;
quickActions: (issue: IIssue, customActionButton?: React.ReactElement) => React.ReactNode;
disableUserActions: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
nestingLevel: number;
};
@ -24,7 +24,7 @@ export const IssueColumn: React.FC<Props> = ({
handleToggleExpand,
properties,
quickActions,
disableUserActions,
canEditProperties,
nestingLevel,
}) => {
// router
@ -76,7 +76,7 @@ export const IssueColumn: React.FC<Props> = ({
{issue.project_detail?.identifier}-{issue.sequence_id}
</span>
{!disableUserActions && (
{canEditProperties(issue.project) && (
<div className={`absolute top-0 left-2.5 hidden group-hover:block ${isMenuActive ? "!block" : ""}`}>
{quickActions(issue, customActionButton)}
</div>

10
web/components/issues/issue-layouts/spreadsheet/columns/issue/spreadsheet-issue-column.tsx
View File

@ -12,8 +12,8 @@ type Props = {
expandedIssues: string[];
setExpandedIssues: React.Dispatch<React.SetStateAction<string[]>>;
properties: IIssueDisplayProperties;
quickActions: (issue: IIssue,customActionButton?: React.ReactElement) => React.ReactNode;
disableUserActions: boolean;
quickActions: (issue: IIssue, customActionButton?: React.ReactElement) => React.ReactNode;
canEditProperties: (projectId: string | undefined) => boolean;
nestingLevel?: number;
};
@ -23,7 +23,7 @@ export const SpreadsheetIssuesColumn: React.FC<Props> = ({
setExpandedIssues,
properties,
quickActions,
disableUserActions,
canEditProperties,
nestingLevel = 0,
}) => {
const handleToggleExpand = (issueId: string) => {
@ -49,7 +49,7 @@ export const SpreadsheetIssuesColumn: React.FC<Props> = ({
expanded={isExpanded}
handleToggleExpand={handleToggleExpand}
properties={properties}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
nestingLevel={nestingLevel}
quickActions={quickActions}
/>
@ -66,7 +66,7 @@ export const SpreadsheetIssuesColumn: React.FC<Props> = ({
setExpandedIssues={setExpandedIssues}
properties={properties}
quickActions={quickActions}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
nestingLevel={nestingLevel + 1}
/>
))}

151
web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx
View File

@ -32,7 +32,7 @@ import { IIssue, IIssueDisplayFilterOptions, IIssueLabel, IState, IUserLite, TIs
import { SPREADSHEET_PROPERTY_DETAILS } from "constants/spreadsheet";
type Props = {
disableUserActions: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
displayFilters: IIssueDisplayFilterOptions;
expandedIssues: string[];
handleDisplayFilterUpdate: (data: Partial<IIssueDisplayFilterOptions>) => void;
@ -46,7 +46,7 @@ type Props = {
export const SpreadsheetColumn: React.FC<Props> = (props) => {
const {
disableUserActions,
canEditProperties,
displayFilters,
expandedIssues,
handleDisplayFilterUpdate,
@ -160,78 +160,81 @@ export const SpreadsheetColumn: React.FC<Props> = (props) => {
</div>
<div className="h-full min-w-[8rem] w-full">
{issues?.map((issue) => (
<div
key={`${property}-${issue.id}`}
className={`h-11 border-b-[0.5px] border-custom-border-200 ${
disableUserActions ? "" : "cursor-pointer hover:bg-custom-background-80"
}`}
>
{property === "state" ? (
<SpreadsheetStateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
states={states}
/>
) : property === "priority" ? (
<SpreadsheetPriorityColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "estimate" ? (
<SpreadsheetEstimateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "assignee" ? (
<SpreadsheetAssigneeColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
members={members}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "labels" ? (
<SpreadsheetLabelColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
labels={labels}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "start_date" ? (
<SpreadsheetStartDateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "due_date" ? (
<SpreadsheetDueDateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "created_on" ? (
<SpreadsheetCreatedOnColumn expandedIssues={expandedIssues} issue={issue} />
) : property === "updated_on" ? (
<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>
))}
{issues?.map((issue) => {
const disableUserActions = !canEditProperties(issue.project);
return (
<div
key={`${property}-${issue.id}`}
className={`h-11 border-b-[0.5px] border-custom-border-200 ${
disableUserActions ? "" : "cursor-pointer hover:bg-custom-background-80"
}`}
>
{property === "state" ? (
<SpreadsheetStateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
states={states}
/>
) : property === "priority" ? (
<SpreadsheetPriorityColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "estimate" ? (
<SpreadsheetEstimateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "assignee" ? (
<SpreadsheetAssigneeColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
members={members}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "labels" ? (
<SpreadsheetLabelColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
labels={labels}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "start_date" ? (
<SpreadsheetStartDateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "due_date" ? (
<SpreadsheetDueDateColumn
disabled={disableUserActions}
expandedIssues={expandedIssues}
issue={issue}
onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
/>
) : property === "created_on" ? (
<SpreadsheetCreatedOnColumn expandedIssues={expandedIssues} issue={issue} />
) : property === "updated_on" ? (
<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>
);
})}
</div>
</div>
);

10
web/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx
View File

@ -21,7 +21,7 @@ type Props = {
members?: IUserLite[] | undefined;
labels?: IIssueLabel[] | undefined;
states?: IState[] | undefined;
quickActions: (issue: IIssue,customActionButton?: React.ReactElement) => React.ReactNode;
quickActions: (issue: IIssue, customActionButton?: React.ReactElement) => React.ReactNode;
handleIssues: (issue: IIssue, action: EIssueActions) => void;
openIssuesListModal?: (() => void) | null;
quickAddCallback?: (
@ -31,7 +31,7 @@ type Props = {
viewId?: string
) => Promise<IIssue | undefined>;
viewId?: string;
disableUserActions: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
enableQuickCreateIssue?: boolean;
};
@ -48,7 +48,7 @@ export const SpreadsheetView: React.FC<Props> = observer((props) => {
handleIssues,
quickAddCallback,
viewId,
disableUserActions,
canEditProperties,
enableQuickCreateIssue,
} = props;
// states
@ -114,7 +114,7 @@ export const SpreadsheetView: React.FC<Props> = observer((props) => {
setExpandedIssues={setExpandedIssues}
properties={displayProperties}
quickActions={quickActions}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
/>
) : null
)}
@ -124,7 +124,7 @@ export const SpreadsheetView: React.FC<Props> = observer((props) => {
<SpreadsheetColumnsList
displayFilters={displayFilters}
displayProperties={displayProperties}
disableUserActions={disableUserActions}
canEditProperties={canEditProperties}
expandedIssues={expandedIssues}
handleDisplayFilterUpdate={handleDisplayFilterUpdate}
handleUpdateIssue={(issue, data) => handleIssues({ ...issue, ...data }, EIssueActions.UPDATE)}

2
web/store/issues/profile/issue.store.ts
View File

@ -136,7 +136,7 @@ export class ProfileIssuesStore extends IssueBaseStore implements IProfileIssues
return {
enableQuickAdd: false,
enableIssueCreation: false,
enableInlineEditing: false,
enableInlineEditing: true,
};
}