view changes for the project roles

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

@@ -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) => {
+              addIssuesToView={addIssuesToView}
-                console.log("kanban existingIds", issues);
+              canEditProperties={canEditProperties}
-
-                return Promise.resolve({} as IIssue);
-              }}
             />
           )}
         </DragDropContext>

web/components/issues/issue-layouts/kanban/block.tsx

@@ -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>

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

@@ -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}
               />
             );
           })}

web/components/issues/issue-layouts/kanban/default.tsx

@@ -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>

web/components/issues/issue-layouts/kanban/swimlanes.tsx

@@ -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}
         />
       )}

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

@@ -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}

web/components/issues/issue-layouts/list/block.tsx

@@ -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}
               />

web/components/issues/issue-layouts/list/blocks-list.tsx

@@ -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}
               />
             )

web/components/issues/issue-layouts/list/default.tsx

@@ -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}

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

@@ -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>

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

@@ -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}
     />
   );
 });

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

@@ -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}

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

@@ -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>

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

@@ -12,8 +12,8 @@ type Props = {
   expandedIssues: string[];
   setExpandedIssues: React.Dispatch<React.SetStateAction<string[]>>;
   properties: IIssueDisplayProperties;
-  quickActions: (issue: IIssue,customActionButton?: React.ReactElement) => React.ReactNode;
+  quickActions: (issue: IIssue, customActionButton?: React.ReactElement) => React.ReactNode;
-  disableUserActions: boolean;
+  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}
           />
         ))}

web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx

@@ -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) => (
+        {issues?.map((issue) => {
-          <div
+          const disableUserActions = !canEditProperties(issue.project);
-            key={`${property}-${issue.id}`}
+          return (
-            className={`h-11 border-b-[0.5px] border-custom-border-200 ${
+            <div
-              disableUserActions ? "" : "cursor-pointer hover:bg-custom-background-80"
+              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}
+              {property === "state" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetStateColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  expandedIssues={expandedIssues}
-                states={states}
+                  issue={issue}
-              />
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-            ) : property === "priority" ? (
+                  states={states}
-              <SpreadsheetPriorityColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "priority" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetPriorityColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  expandedIssues={expandedIssues}
-              />
+                  issue={issue}
-            ) : property === "estimate" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetEstimateColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "estimate" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetEstimateColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  expandedIssues={expandedIssues}
-              />
+                  issue={issue}
-            ) : property === "assignee" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetAssigneeColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "assignee" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetAssigneeColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                members={members}
+                  expandedIssues={expandedIssues}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  issue={issue}
-              />
+                  members={members}
-            ) : property === "labels" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetLabelColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "labels" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetLabelColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                labels={labels}
+                  expandedIssues={expandedIssues}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  issue={issue}
-              />
+                  labels={labels}
-            ) : property === "start_date" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetStartDateColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "start_date" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetStartDateColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  expandedIssues={expandedIssues}
-              />
+                  issue={issue}
-            ) : property === "due_date" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetDueDateColumn
+                />
-                disabled={disableUserActions}
+              ) : property === "due_date" ? (
-                expandedIssues={expandedIssues}
+                <SpreadsheetDueDateColumn
-                issue={issue}
+                  disabled={disableUserActions}
-                onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
+                  expandedIssues={expandedIssues}
-              />
+                  issue={issue}
-            ) : property === "created_on" ? (
+                  onChange={(data: Partial<IIssue>) => handleUpdateIssue(issue, data)}
-              <SpreadsheetCreatedOnColumn expandedIssues={expandedIssues} issue={issue} />
+                />
-            ) : property === "updated_on" ? (
+              ) : property === "created_on" ? (
-              <SpreadsheetUpdatedOnColumn expandedIssues={expandedIssues} issue={issue} />
+                <SpreadsheetCreatedOnColumn expandedIssues={expandedIssues} issue={issue} />
-            ) : property === "link" ? (
+              ) : property === "updated_on" ? (
-              <SpreadsheetLinkColumn expandedIssues={expandedIssues} issue={issue} />
+                <SpreadsheetUpdatedOnColumn expandedIssues={expandedIssues} issue={issue} />
-            ) : property === "attachment_count" ? (
+              ) : property === "link" ? (
-              <SpreadsheetAttachmentColumn expandedIssues={expandedIssues} issue={issue} />
+                <SpreadsheetLinkColumn expandedIssues={expandedIssues} issue={issue} />
-            ) : property === "sub_issue_count" ? (
+              ) : property === "attachment_count" ? (
-              <SpreadsheetSubIssueColumn expandedIssues={expandedIssues} issue={issue} />
+                <SpreadsheetAttachmentColumn expandedIssues={expandedIssues} issue={issue} />
-            ) : null}
+              ) : property === "sub_issue_count" ? (
-          </div>
+                <SpreadsheetSubIssueColumn expandedIssues={expandedIssues} issue={issue} />
-        ))}
+              ) : null}
+            </div>
+          );
+        })}
       </div>
     </div>
   );

web/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx

@@ -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)}

web/store/issues/profile/issue.store.ts

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