From 2898765454c9ae39e7a5f4315fe2ab5c178b73ce Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 27 Dec 2023 13:30:20 +0530
Subject: [PATCH 1/9] chore: remove `Save View` option for guest/ viewer from
 project issues header.

---
 .../applied-filters/roots/project-root.tsx       | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/project-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/project-root.tsx
index 6d7369bb9a2..31317366c25 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/roots/project-root.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/project-root.tsx
@@ -1,29 +1,32 @@
 import { useRouter } from "next/router";
 import { observer } from "mobx-react-lite";
-
 // mobx store
 import { useMobxStore } from "lib/mobx/store-provider";
 // components
 import { AppliedFiltersList, SaveFilterView } from "components/issues";
-
 // types
 import { IIssueFilterOptions } from "types";
 import { EFilterType } from "store/issues/types";
+// constants
+import { EUserWorkspaceRoles } from "constants/workspace";
 
 export const ProjectAppliedFiltersRoot: React.FC = observer(() => {
+  // router
   const router = useRouter();
   const { workspaceSlug, projectId } = router.query as {
     workspaceSlug: string;
     projectId: string;
   };
-
+  // mobx stores
   const {
     projectLabel: { projectLabels },
     projectState: projectStateStore,
     projectMember: { projectMembers },
     projectIssuesFilter: { issueFilters, updateFilters },
+    user: { currentProjectRole },
   } = useMobxStore();
-
+  // derived values
+  const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
   const userFilters = issueFilters?.filters;
 
   // filters whose value not null or empty array
@@ -73,8 +76,9 @@ export const ProjectAppliedFiltersRoot: React.FC = observer(() => {
         members={projectMembers?.map((m) => m.member)}
         states={projectStateStore.states?.[projectId?.toString() ?? ""]}
       />
-
-      <SaveFilterView workspaceSlug={workspaceSlug} projectId={projectId} filterParams={appliedFilters} />
+      {isEditingAllowed && (
+        <SaveFilterView workspaceSlug={workspaceSlug} projectId={projectId} filterParams={appliedFilters} />
+      )}
     </div>
   );
 });

From 3dae871d23424d55abac95e16522696ad3c2a5c4 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 27 Dec 2023 13:31:33 +0530
Subject: [PATCH 2/9] chore: allow guest/ viewer to clear applied filters in
 project issues.

---
 .../filters/applied-filters/filters-list.tsx  | 50 ++++++-------------
 .../filters/applied-filters/label.tsx         | 19 +++----
 .../filters/applied-filters/members.tsx       | 19 +++----
 .../filters/applied-filters/priority.tsx      | 19 +++----
 .../filters/applied-filters/project.tsx       | 19 +++----
 .../filters/applied-filters/state.tsx         | 19 +++----
 6 files changed, 56 insertions(+), 89 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
index 7ff8056b9e1..5d1868a8ae6 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
@@ -1,5 +1,4 @@
 import { observer } from "mobx-react-lite";
-import { useMobxStore } from "lib/mobx/store-provider";
 // components
 import {
   AppliedDateFilters,
@@ -16,8 +15,6 @@ import { X } from "lucide-react";
 import { replaceUnderscoreIfSnakeCase } from "helpers/string.helper";
 // types
 import { IIssueFilterOptions, IIssueLabel, IProject, IState, IUserLite } from "types";
-// constants
-import { EUserWorkspaceRoles } from "constants/workspace";
 
 type Props = {
   appliedFilters: IIssueFilterOptions;
@@ -35,16 +32,10 @@ const dateFilters = ["start_date", "target_date"];
 export const AppliedFiltersList: React.FC<Props> = observer((props) => {
   const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, members, projects, states } = props;
 
-  const {
-    user: { currentProjectRole },
-  } = useMobxStore();
-
   if (!appliedFilters) return null;
 
   if (Object.keys(appliedFilters).length === 0) return null;
 
-  const isEditingAllowed = currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
-
   return (
     <div className="flex flex-wrap items-stretch gap-2 bg-custom-background-100">
       {Object.entries(appliedFilters).map(([key, value]) => {
@@ -61,7 +52,6 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
             <div className="flex flex-wrap items-center gap-1">
               {membersFilters.includes(filterKey) && (
                 <AppliedMembersFilters
-                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter(filterKey, val)}
                   members={members}
                   values={value}
@@ -72,7 +62,6 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "labels" && (
                 <AppliedLabelsFilters
-                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("labels", val)}
                   labels={labels}
                   values={value}
@@ -80,14 +69,12 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "priority" && (
                 <AppliedPriorityFilters
-                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("priority", val)}
                   values={value}
                 />
               )}
               {filterKey === "state" && states && (
                 <AppliedStateFilters
-                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("state", val)}
                   states={states}
                   values={value}
@@ -101,35 +88,30 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "project" && (
                 <AppliedProjectFilters
-                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("project", val)}
                   projects={projects}
                   values={value}
                 />
               )}
-              {isEditingAllowed && (
-                <button
-                  type="button"
-                  className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                  onClick={() => handleRemoveFilter(filterKey, null)}
-                >
-                  <X size={12} strokeWidth={2} />
-                </button>
-              )}
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemoveFilter(filterKey, null)}
+              >
+                <X size={12} strokeWidth={2} />
+              </button>
             </div>
           </div>
         );
       })}
-      {isEditingAllowed && (
-        <button
-          type="button"
-          onClick={handleClearAllFilters}
-          className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
-        >
-          Clear all
-          <X size={12} strokeWidth={2} />
-        </button>
-      )}
-    </div>
+      <button
+        type="button"
+        onClick={handleClearAllFilters}
+        className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
+      >
+        Clear all
+        <X size={12} strokeWidth={2} />
+      </button>
+      </div>
   );
 });
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 08e7aee4458..9cec9b2f724 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -9,11 +9,10 @@ type Props = {
   handleRemove: (val: string) => void;
   labels: IIssueLabel[] | undefined;
   values: string[];
-  editable: boolean | undefined;
 };
 
 export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, labels, values, editable } = props;
+  const { handleRemove, labels, values } = props;
 
   return (
     <>
@@ -31,15 +30,13 @@ export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
               }}
             />
             <span className="normal-case">{labelDetails.name}</span>
-            {editable && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(labelId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(labelId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
index 1dd61d3390b..bfa7e9a29da 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -9,11 +9,10 @@ type Props = {
   handleRemove: (val: string) => void;
   members: IUserLite[] | undefined;
   values: string[];
-  editable: boolean | undefined;
 };
 
 export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, members, values, editable } = props;
+  const { handleRemove, members, values } = props;
 
   return (
     <>
@@ -26,15 +25,13 @@ export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
           <div key={memberId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <Avatar name={memberDetails.display_name} src={memberDetails.avatar} showTooltip={false} />
             <span className="normal-case">{memberDetails.display_name}</span>
-            {editable && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(memberId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(memberId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index 88b39dc0033..e00d0d829e4 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -9,11 +9,10 @@ import { TIssuePriorities } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
-  editable: boolean | undefined;
 };
 
 export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values, editable } = props;
+  const { handleRemove, values } = props;
 
   return (
     <>
@@ -21,15 +20,13 @@ export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
         <div key={priority} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <PriorityIcon priority={priority as TIssuePriorities} className={`h-3 w-3`} />
           {priority}
-          {editable && (
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(priority)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
-          )}
+          <button
+            type="button"
+            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+            onClick={() => handleRemove(priority)}
+          >
+            <X size={10} strokeWidth={2} />
+          </button>
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
index b1e17cfe3dc..01830986162 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -10,11 +10,10 @@ type Props = {
   handleRemove: (val: string) => void;
   projects: IProject[] | undefined;
   values: string[];
-  editable: boolean | undefined;
 };
 
 export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, projects, values, editable } = props;
+  const { handleRemove, projects, values } = props;
 
   return (
     <>
@@ -35,15 +34,13 @@ export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
               </span>
             )}
             <span className="normal-case">{projectDetails.name}</span>
-            {editable && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(projectId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(projectId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 9cff84d9b7a..8e759250557 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -10,11 +10,10 @@ type Props = {
   handleRemove: (val: string) => void;
   states: IState[];
   values: string[];
-  editable: boolean | undefined;
 };
 
 export const AppliedStateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, states, values, editable } = props;
+  const { handleRemove, states, values } = props;
 
   return (
     <>
@@ -27,15 +26,13 @@ export const AppliedStateFilters: React.FC<Props> = observer((props) => {
           <div key={stateId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <StateGroupIcon color={stateDetails.color} stateGroup={stateDetails.group} height="12px" width="12px" />
             {stateDetails.name}
-            {editable && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(stateId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(stateId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}

From 1023a7d9ba95050ec94632d89bd2fd28cecb4bfc Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 27 Dec 2023 17:36:26 +0530
Subject: [PATCH 3/9] chore: disable `date`, `label` property access for
 guests/ viewer in all project issue views.

---
 .../issues/issue-layouts/kanban/properties.tsx | 18 +++++++++++++++---
 .../issues/issue-layouts/list/properties.tsx   | 18 +++++++++++++++---
 .../issues/issue-layouts/properties/date.tsx   |  3 ++-
 .../issues/issue-layouts/properties/labels.tsx |  8 ++++++--
 web/components/issues/sidebar-select/label.tsx |  4 +++-
 web/components/issues/view-select/due-date.tsx |  4 ++--
 .../issues/view-select/start-date.tsx          |  4 ++--
 7 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/web/components/issues/issue-layouts/kanban/properties.tsx b/web/components/issues/issue-layouts/kanban/properties.tsx
index 9590c90682f..e6288d62c75 100644
--- a/web/components/issues/issue-layouts/kanban/properties.tsx
+++ b/web/components/issues/issue-layouts/kanban/properties.tsx
@@ -166,7 +166,11 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* sub-issues */}
       {displayProperties && displayProperties?.sub_issue_count && !!issue?.sub_issues_count && (
         <Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.sub_issues_count}</div>
           </div>
@@ -176,7 +180,11 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* attachments */}
       {displayProperties && displayProperties?.attachment_count && !!issue?.attachment_count && (
         <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.attachment_count}</div>
           </div>
@@ -186,7 +194,11 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* link */}
       {displayProperties && displayProperties?.link && !!issue?.link_count && (
         <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>
diff --git a/web/components/issues/issue-layouts/list/properties.tsx b/web/components/issues/issue-layouts/list/properties.tsx
index eeff3b27393..ba8a8142f94 100644
--- a/web/components/issues/issue-layouts/list/properties.tsx
+++ b/web/components/issues/issue-layouts/list/properties.tsx
@@ -137,7 +137,11 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* sub-issues */}
       {displayProperties && displayProperties?.sub_issue_count && !!issue?.sub_issues_count && (
         <Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.sub_issues_count}</div>
           </div>
@@ -147,7 +151,11 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* attachments */}
       {displayProperties && displayProperties?.attachment_count && !!issue?.attachment_count && (
         <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.attachment_count}</div>
           </div>
@@ -157,7 +165,11 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* link */}
       {displayProperties && displayProperties?.link && !!issue?.link_count && (
         <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
-          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
+          <div
+            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
+              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>
diff --git a/web/components/issues/issue-layouts/properties/date.tsx b/web/components/issues/issue-layouts/properties/date.tsx
index cfe3481e31e..d0bb297114a 100644
--- a/web/components/issues/issue-layouts/properties/date.tsx
+++ b/web/components/issues/issue-layouts/properties/date.tsx
@@ -61,6 +61,7 @@ export const IssuePropertyDate: React.FC<IIssuePropertyDate> = observer((props)
               ref={dropdownBtn}
               className="border-none outline-none"
               onClick={(e) => e.stopPropagation()}
+              disabled={disabled}
             >
               <Tooltip
                 tooltipHeading={dateOptionDetails.placeholder}
@@ -69,7 +70,7 @@ export const IssuePropertyDate: React.FC<IIssuePropertyDate> = observer((props)
                 <div
                   className={`flex h-5 w-full items-center rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 outline-none duration-300 ${
                     disabled
-                      ? "pointer-events-none cursor-not-allowed text-custom-text-200"
+                      ? "cursor-not-allowed text-custom-text-200"
                       : "cursor-pointer hover:bg-custom-background-80"
                   }`}
                 >
diff --git a/web/components/issues/issue-layouts/properties/labels.tsx b/web/components/issues/issue-layouts/properties/labels.tsx
index 282268d7b1c..d0045c3d447 100644
--- a/web/components/issues/issue-layouts/properties/labels.tsx
+++ b/web/components/issues/issue-layouts/properties/labels.tsx
@@ -128,7 +128,11 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
               ))}
           </>
         ) : (
-          <div className="flex h-full flex-shrink-0 cursor-pointer items-center rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 text-xs">
+          <div
+            className={`flex h-full flex-shrink-0 items-center rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 text-xs ${
+              disabled ? "cursor-not-allowed" : "cursor-pointer"
+            }`}
+          >
             <Tooltip
               position="top"
               tooltipHeading="Labels"
@@ -147,7 +151,7 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
       ) : (
         <Tooltip position="top" tooltipHeading="Labels" tooltipContent="None">
           <div
-            className={`h-full flex items-center justify-center gap-2 rounded px-2.5 py-1 text-xs hover:bg-custom-background-80 ${
+            className={`flex h-full items-center justify-center gap-2 rounded px-2.5 py-1 text-xs hover:bg-custom-background-80 ${
               noLabelBorder ? "" : "border-[0.5px] border-custom-border-300"
             }`}
           >
diff --git a/web/components/issues/sidebar-select/label.tsx b/web/components/issues/sidebar-select/label.tsx
index ca7abd8be22..6340383e975 100644
--- a/web/components/issues/sidebar-select/label.tsx
+++ b/web/components/issues/sidebar-select/label.tsx
@@ -92,7 +92,9 @@ export const SidebarLabelSelect: React.FC<Props> = observer((props) => {
             return (
               <button
                 key={label.id}
-                className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-1 py-0.5 text-xs hover:border-red-500/20 hover:bg-red-500/20"
+                className={`group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-1 py-0.5 text-xs ${
+                  isNotAllowed || uneditable ? "!cursor-not-allowed" : "hover:border-red-500/20 hover:bg-red-500/20"
+                }`}
                 onClick={() => {
                   const updatedLabels = labelList?.filter((l) => l !== labelId);
                   submitChanges({
diff --git a/web/components/issues/view-select/due-date.tsx b/web/components/issues/view-select/due-date.tsx
index d7e00148ecd..5b2bfb0ec53 100644
--- a/web/components/issues/view-select/due-date.tsx
+++ b/web/components/issues/view-select/due-date.tsx
@@ -61,9 +61,9 @@ export const ViewDueDateSelect: React.FC<Props> = ({
           className={`bg-transparent ${issue?.target_date ? "w-[6.5rem]" : "w-[5rem] text-center"}`}
           customInput={
             <div
-              className={`flex cursor-pointer items-center justify-center gap-2 rounded border border-custom-border-200 px-2 py-1 text-xs shadow-sm duration-200 hover:bg-custom-background-80 ${
+              className={`flex items-center justify-center gap-2 rounded border border-custom-border-200 px-2 py-1 text-xs shadow-sm duration-200 hover:bg-custom-background-80 ${
                 issue.target_date ? "pr-6 text-custom-text-300" : "text-custom-text-400"
-              }`}
+              } ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`}
             >
               {issue.target_date ? (
                 <>
diff --git a/web/components/issues/view-select/start-date.tsx b/web/components/issues/view-select/start-date.tsx
index c1408f015cd..8cfac4a6434 100644
--- a/web/components/issues/view-select/start-date.tsx
+++ b/web/components/issues/view-select/start-date.tsx
@@ -49,9 +49,9 @@ export const ViewStartDateSelect: React.FC<Props> = ({
           handleOnOpen={handleOnOpen}
           customInput={
             <div
-              className={`flex cursor-pointer items-center justify-center gap-2 rounded border border-custom-border-200 px-2 py-1 text-xs shadow-sm duration-200 hover:bg-custom-background-80 ${
+              className={`flex items-center justify-center gap-2 rounded border border-custom-border-200 px-2 py-1 text-xs shadow-sm duration-200 hover:bg-custom-background-80 ${
                 issue?.start_date ? "pr-6 text-custom-text-300" : "text-custom-text-400"
-              }`}
+              } ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`}
             >
               {issue?.start_date ? (
                 <>

From 03f90be188bc6b2f98a780ae22e0a29d9c59268d Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 27 Dec 2023 17:38:35 +0530
Subject: [PATCH 4/9] chore: update `Workspace Issues` -> `All Issues` header.

---
 web/components/headers/global-issues.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/components/headers/global-issues.tsx b/web/components/headers/global-issues.tsx
index ef4c2b3f570..0b27bdd816d 100644
--- a/web/components/headers/global-issues.tsx
+++ b/web/components/headers/global-issues.tsx
@@ -95,7 +95,7 @@ export const GlobalIssuesHeader: React.FC<Props> = observer((props) => {
                   <PhotoFilterIcon className="h-4 w-4 text-custom-text-300" />
                 )
               }
-              label={`Workspace ${activeLayout === "spreadsheet" ? "Issues" : "Views"}`}
+              label={`All ${activeLayout === "spreadsheet" ? "Issues" : "Views"}`}
             />
           </Breadcrumbs>
         </div>

From 024822d54f4061eb2686d811a2b87cd0789b6b90 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 27 Dec 2023 17:40:36 +0530
Subject: [PATCH 5/9] chore: refactor apply/ clear filter implementation in All
 Issues.

---
 .../filters/applied-filters/date.tsx          | 19 +++---
 .../filters/applied-filters/filters-list.tsx  | 60 +++++++++++++------
 .../filters/applied-filters/label.tsx         | 19 +++---
 .../filters/applied-filters/members.tsx       | 19 +++---
 .../filters/applied-filters/priority.tsx      | 19 +++---
 .../filters/applied-filters/project.tsx       | 19 +++---
 .../roots/global-view-root.tsx                | 12 +++-
 .../filters/applied-filters/state-group.tsx   | 19 +++---
 .../filters/applied-filters/state.tsx         | 19 +++---
 .../roots/all-issue-layout-root.tsx           | 12 +++-
 10 files changed, 140 insertions(+), 77 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
index c1e7b8cec2c..722579e9bf3 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
@@ -11,10 +11,11 @@ import { DATE_FILTER_OPTIONS } from "constants/filters";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedDateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values } = props;
+  const { handleRemove, values, disableClearOption } = props;
 
   const getDateLabel = (value: string): string => {
     let dateLabel = "";
@@ -40,13 +41,15 @@ export const AppliedDateFilters: React.FC<Props> = observer((props) => {
       {values.map((date) => (
         <div key={date} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <span className="normal-case">{getDateLabel(date)}</span>
-          <button
-            type="button"
-            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-            onClick={() => handleRemove(date)}
-          >
-            <X size={10} strokeWidth={2} />
-          </button>
+          {!disableClearOption && (
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(date)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
+          )}
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
index 5d1868a8ae6..9b7e3bab34d 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
@@ -24,13 +24,23 @@ type Props = {
   members?: IUserLite[] | undefined;
   projects?: IProject[] | undefined;
   states?: IState[] | undefined;
+  disableClearFilterOptions?: (keyof IIssueFilterOptions)[];
 };
 
 const membersFilters = ["assignees", "mentions", "created_by", "subscriber"];
 const dateFilters = ["start_date", "target_date"];
 
 export const AppliedFiltersList: React.FC<Props> = observer((props) => {
-  const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, members, projects, states } = props;
+  const {
+    appliedFilters,
+    handleClearAllFilters,
+    handleRemoveFilter,
+    labels,
+    members,
+    projects,
+    states,
+    disableClearFilterOptions,
+  } = props;
 
   if (!appliedFilters) return null;
 
@@ -52,16 +62,22 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
             <div className="flex flex-wrap items-center gap-1">
               {membersFilters.includes(filterKey) && (
                 <AppliedMembersFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter(filterKey, val)}
                   members={members}
                   values={value}
                 />
               )}
               {dateFilters.includes(filterKey) && (
-                <AppliedDateFilters handleRemove={(val) => handleRemoveFilter(filterKey, val)} values={value} />
+                <AppliedDateFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
+                  handleRemove={(val) => handleRemoveFilter(filterKey, val)}
+                  values={value}
+                />
               )}
               {filterKey === "labels" && (
                 <AppliedLabelsFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("labels", val)}
                   labels={labels}
                   values={value}
@@ -69,12 +85,14 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "priority" && (
                 <AppliedPriorityFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("priority", val)}
                   values={value}
                 />
               )}
               {filterKey === "state" && states && (
                 <AppliedStateFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("state", val)}
                   states={states}
                   values={value}
@@ -82,36 +100,42 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "state_group" && (
                 <AppliedStateGroupFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("state_group", val)}
                   values={value}
                 />
               )}
               {filterKey === "project" && (
                 <AppliedProjectFilters
+                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("project", val)}
                   projects={projects}
                   values={value}
                 />
               )}
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemoveFilter(filterKey, null)}
-              >
-                <X size={12} strokeWidth={2} />
-              </button>
+              {!disableClearFilterOptions?.includes(filterKey) && (
+                <button
+                  type="button"
+                  className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                  onClick={() => handleRemoveFilter(filterKey, null)}
+                >
+                  <X size={12} strokeWidth={2} />
+                </button>
+              )}
             </div>
           </div>
         );
       })}
-      <button
-        type="button"
-        onClick={handleClearAllFilters}
-        className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
-      >
-        Clear all
-        <X size={12} strokeWidth={2} />
-      </button>
-      </div>
+      {(!disableClearFilterOptions || disableClearFilterOptions.length === 0) && (
+        <button
+          type="button"
+          onClick={handleClearAllFilters}
+          className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
+        >
+          Clear all
+          <X size={12} strokeWidth={2} />
+        </button>
+      )}
+    </div>
   );
 });
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 9cec9b2f724..5d300a32fce 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -9,10 +9,11 @@ type Props = {
   handleRemove: (val: string) => void;
   labels: IIssueLabel[] | undefined;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, labels, values } = props;
+  const { handleRemove, labels, values, disableClearOption } = props;
 
   return (
     <>
@@ -30,13 +31,15 @@ export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
               }}
             />
             <span className="normal-case">{labelDetails.name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(labelId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {!disableClearOption && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(labelId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
index bfa7e9a29da..de24d0361b2 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -9,10 +9,11 @@ type Props = {
   handleRemove: (val: string) => void;
   members: IUserLite[] | undefined;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, members, values } = props;
+  const { handleRemove, members, values, disableClearOption } = props;
 
   return (
     <>
@@ -25,13 +26,15 @@ export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
           <div key={memberId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <Avatar name={memberDetails.display_name} src={memberDetails.avatar} showTooltip={false} />
             <span className="normal-case">{memberDetails.display_name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(memberId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {!disableClearOption && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(memberId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index e00d0d829e4..b5f8e60fbf8 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -9,10 +9,11 @@ import { TIssuePriorities } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values } = props;
+  const { handleRemove, values, disableClearOption } = props;
 
   return (
     <>
@@ -20,13 +21,15 @@ export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
         <div key={priority} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <PriorityIcon priority={priority as TIssuePriorities} className={`h-3 w-3`} />
           {priority}
-          <button
-            type="button"
-            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-            onClick={() => handleRemove(priority)}
-          >
-            <X size={10} strokeWidth={2} />
-          </button>
+          {!disableClearOption && (
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(priority)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
+          )}
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
index 01830986162..3e967cb23b9 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -10,10 +10,11 @@ type Props = {
   handleRemove: (val: string) => void;
   projects: IProject[] | undefined;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, projects, values } = props;
+  const { handleRemove, projects, values, disableClearOption } = props;
 
   return (
     <>
@@ -34,13 +35,15 @@ export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
               </span>
             )}
             <span className="normal-case">{projectDetails.name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(projectId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {!disableClearOption && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(projectId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
index 543d186451d..bf76a7f5e9e 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
@@ -1,3 +1,4 @@
+import React from "react";
 import { useRouter } from "next/router";
 import { observer } from "mobx-react-lite";
 
@@ -9,10 +10,16 @@ import { AppliedFiltersList } from "components/issues";
 import { IIssueFilterOptions } from "types";
 import { EFilterType } from "store/issues/types";
 
-export const GlobalViewsAppliedFiltersRoot = observer(() => {
+type Props = {
+  disableClearFilterOptions?: (keyof IIssueFilterOptions)[];
+};
+
+export const GlobalViewsAppliedFiltersRoot: React.FC<Props> = observer((props) => {
+  const { disableClearFilterOptions } = props;
+  // router
   const router = useRouter();
   const { workspaceSlug } = router.query as { workspaceSlug: string; globalViewId: string };
-
+  // mobx store
   const {
     project: { workspaceProjects },
     workspace: { workspaceLabels },
@@ -83,6 +90,7 @@ export const GlobalViewsAppliedFiltersRoot = observer(() => {
         appliedFilters={appliedFilters ?? {}}
         handleClearAllFilters={handleClearAllFilters}
         handleRemoveFilter={handleRemoveFilter}
+        disableClearFilterOptions={disableClearFilterOptions}
       />
 
       {/* {storedFilters && viewDetails && areFiltersDifferent(storedFilters, viewDetails.query_data.filters ?? {}) && (
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
index 64f95983e46..ac4ceaa0d6d 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
@@ -8,10 +8,11 @@ import { TStateGroups } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
+  disableClearOption?: boolean;
 };
 
 export const AppliedStateGroupFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values } = props;
+  const { handleRemove, values, disableClearOption } = props;
 
   return (
     <>
@@ -19,13 +20,15 @@ export const AppliedStateGroupFilters: React.FC<Props> = observer((props) => {
         <div key={stateGroup} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <StateGroupIcon stateGroup={stateGroup as TStateGroups} height="12px" width="12px" />
           {stateGroup}
-          <button
-            type="button"
-            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-            onClick={() => handleRemove(stateGroup)}
-          >
-            <X size={10} strokeWidth={2} />
-          </button>
+          {!disableClearOption && (
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(stateGroup)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
+          )}
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 8e759250557..1f43613ace1 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -10,10 +10,11 @@ type Props = {
   handleRemove: (val: string) => void;
   states: IState[];
   values: string[];
+  disableClearOption: boolean | undefined;
 };
 
 export const AppliedStateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, states, values } = props;
+  const { handleRemove, states, values, disableClearOption } = props;
 
   return (
     <>
@@ -26,13 +27,15 @@ export const AppliedStateFilters: React.FC<Props> = observer((props) => {
           <div key={stateId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <StateGroupIcon color={stateDetails.color} stateGroup={stateDetails.group} height="12px" width="12px" />
             {stateDetails.name}
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(stateId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {!disableClearOption && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(stateId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
index 7ab5621b8e4..8aa75c91135 100644
--- a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
+++ b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
@@ -110,7 +110,17 @@ export const AllIssueLayoutRoot: React.FC<Props> = observer((props) => {
         </div>
       ) : (
         <>
-          <GlobalViewsAppliedFiltersRoot />
+          <GlobalViewsAppliedFiltersRoot
+            disableClearFilterOptions={
+              type === "assigned"
+                ? ["assignees"]
+                : type === "created"
+                ? ["created_by"]
+                : type === "subscribed"
+                ? ["subscriber"]
+                : undefined
+            }
+          />
 
           {Object.keys(getIssues ?? {}).length == 0 ? (
             <>{/* <GlobalViewEmptyState /> */}</>

From cc4722f15f8061c82fd175328ce401bc85422c22 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Thu, 28 Dec 2023 14:14:43 +0530
Subject: [PATCH 6/9] Revert "chore: refactor apply/ clear filter
 implementation in All Issues."

This reverts commit 024822d54f4061eb2686d811a2b87cd0789b6b90.
---
 .../filters/applied-filters/date.tsx          | 19 +++---
 .../filters/applied-filters/filters-list.tsx  | 60 ++++++-------------
 .../filters/applied-filters/label.tsx         | 19 +++---
 .../filters/applied-filters/members.tsx       | 19 +++---
 .../filters/applied-filters/priority.tsx      | 19 +++---
 .../filters/applied-filters/project.tsx       | 19 +++---
 .../roots/global-view-root.tsx                | 12 +---
 .../filters/applied-filters/state-group.tsx   | 19 +++---
 .../filters/applied-filters/state.tsx         | 19 +++---
 .../roots/all-issue-layout-root.tsx           | 12 +---
 10 files changed, 77 insertions(+), 140 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
index 722579e9bf3..c1e7b8cec2c 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx
@@ -11,11 +11,10 @@ import { DATE_FILTER_OPTIONS } from "constants/filters";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedDateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values, disableClearOption } = props;
+  const { handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
     let dateLabel = "";
@@ -41,15 +40,13 @@ export const AppliedDateFilters: React.FC<Props> = observer((props) => {
       {values.map((date) => (
         <div key={date} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <span className="normal-case">{getDateLabel(date)}</span>
-          {!disableClearOption && (
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(date)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
-          )}
+          <button
+            type="button"
+            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+            onClick={() => handleRemove(date)}
+          >
+            <X size={10} strokeWidth={2} />
+          </button>
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
index 9b7e3bab34d..5d1868a8ae6 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
@@ -24,23 +24,13 @@ type Props = {
   members?: IUserLite[] | undefined;
   projects?: IProject[] | undefined;
   states?: IState[] | undefined;
-  disableClearFilterOptions?: (keyof IIssueFilterOptions)[];
 };
 
 const membersFilters = ["assignees", "mentions", "created_by", "subscriber"];
 const dateFilters = ["start_date", "target_date"];
 
 export const AppliedFiltersList: React.FC<Props> = observer((props) => {
-  const {
-    appliedFilters,
-    handleClearAllFilters,
-    handleRemoveFilter,
-    labels,
-    members,
-    projects,
-    states,
-    disableClearFilterOptions,
-  } = props;
+  const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, members, projects, states } = props;
 
   if (!appliedFilters) return null;
 
@@ -62,22 +52,16 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
             <div className="flex flex-wrap items-center gap-1">
               {membersFilters.includes(filterKey) && (
                 <AppliedMembersFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter(filterKey, val)}
                   members={members}
                   values={value}
                 />
               )}
               {dateFilters.includes(filterKey) && (
-                <AppliedDateFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
-                  handleRemove={(val) => handleRemoveFilter(filterKey, val)}
-                  values={value}
-                />
+                <AppliedDateFilters handleRemove={(val) => handleRemoveFilter(filterKey, val)} values={value} />
               )}
               {filterKey === "labels" && (
                 <AppliedLabelsFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("labels", val)}
                   labels={labels}
                   values={value}
@@ -85,14 +69,12 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "priority" && (
                 <AppliedPriorityFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("priority", val)}
                   values={value}
                 />
               )}
               {filterKey === "state" && states && (
                 <AppliedStateFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("state", val)}
                   states={states}
                   values={value}
@@ -100,42 +82,36 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "state_group" && (
                 <AppliedStateGroupFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("state_group", val)}
                   values={value}
                 />
               )}
               {filterKey === "project" && (
                 <AppliedProjectFilters
-                  disableClearOption={disableClearFilterOptions?.includes(filterKey)}
                   handleRemove={(val) => handleRemoveFilter("project", val)}
                   projects={projects}
                   values={value}
                 />
               )}
-              {!disableClearFilterOptions?.includes(filterKey) && (
-                <button
-                  type="button"
-                  className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                  onClick={() => handleRemoveFilter(filterKey, null)}
-                >
-                  <X size={12} strokeWidth={2} />
-                </button>
-              )}
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemoveFilter(filterKey, null)}
+              >
+                <X size={12} strokeWidth={2} />
+              </button>
             </div>
           </div>
         );
       })}
-      {(!disableClearFilterOptions || disableClearFilterOptions.length === 0) && (
-        <button
-          type="button"
-          onClick={handleClearAllFilters}
-          className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
-        >
-          Clear all
-          <X size={12} strokeWidth={2} />
-        </button>
-      )}
-    </div>
+      <button
+        type="button"
+        onClick={handleClearAllFilters}
+        className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
+      >
+        Clear all
+        <X size={12} strokeWidth={2} />
+      </button>
+      </div>
   );
 });
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 5d300a32fce..9cec9b2f724 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -9,11 +9,10 @@ type Props = {
   handleRemove: (val: string) => void;
   labels: IIssueLabel[] | undefined;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, labels, values, disableClearOption } = props;
+  const { handleRemove, labels, values } = props;
 
   return (
     <>
@@ -31,15 +30,13 @@ export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
               }}
             />
             <span className="normal-case">{labelDetails.name}</span>
-            {!disableClearOption && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(labelId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(labelId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
index de24d0361b2..bfa7e9a29da 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -9,11 +9,10 @@ type Props = {
   handleRemove: (val: string) => void;
   members: IUserLite[] | undefined;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, members, values, disableClearOption } = props;
+  const { handleRemove, members, values } = props;
 
   return (
     <>
@@ -26,15 +25,13 @@ export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
           <div key={memberId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <Avatar name={memberDetails.display_name} src={memberDetails.avatar} showTooltip={false} />
             <span className="normal-case">{memberDetails.display_name}</span>
-            {!disableClearOption && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(memberId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(memberId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index b5f8e60fbf8..e00d0d829e4 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -9,11 +9,10 @@ import { TIssuePriorities } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values, disableClearOption } = props;
+  const { handleRemove, values } = props;
 
   return (
     <>
@@ -21,15 +20,13 @@ export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
         <div key={priority} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <PriorityIcon priority={priority as TIssuePriorities} className={`h-3 w-3`} />
           {priority}
-          {!disableClearOption && (
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(priority)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
-          )}
+          <button
+            type="button"
+            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+            onClick={() => handleRemove(priority)}
+          >
+            <X size={10} strokeWidth={2} />
+          </button>
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
index 3e967cb23b9..01830986162 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -10,11 +10,10 @@ type Props = {
   handleRemove: (val: string) => void;
   projects: IProject[] | undefined;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, projects, values, disableClearOption } = props;
+  const { handleRemove, projects, values } = props;
 
   return (
     <>
@@ -35,15 +34,13 @@ export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
               </span>
             )}
             <span className="normal-case">{projectDetails.name}</span>
-            {!disableClearOption && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(projectId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(projectId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
index bf76a7f5e9e..543d186451d 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
@@ -1,4 +1,3 @@
-import React from "react";
 import { useRouter } from "next/router";
 import { observer } from "mobx-react-lite";
 
@@ -10,16 +9,10 @@ import { AppliedFiltersList } from "components/issues";
 import { IIssueFilterOptions } from "types";
 import { EFilterType } from "store/issues/types";
 
-type Props = {
-  disableClearFilterOptions?: (keyof IIssueFilterOptions)[];
-};
-
-export const GlobalViewsAppliedFiltersRoot: React.FC<Props> = observer((props) => {
-  const { disableClearFilterOptions } = props;
-  // router
+export const GlobalViewsAppliedFiltersRoot = observer(() => {
   const router = useRouter();
   const { workspaceSlug } = router.query as { workspaceSlug: string; globalViewId: string };
-  // mobx store
+
   const {
     project: { workspaceProjects },
     workspace: { workspaceLabels },
@@ -90,7 +83,6 @@ export const GlobalViewsAppliedFiltersRoot: React.FC<Props> = observer((props) =
         appliedFilters={appliedFilters ?? {}}
         handleClearAllFilters={handleClearAllFilters}
         handleRemoveFilter={handleRemoveFilter}
-        disableClearFilterOptions={disableClearFilterOptions}
       />
 
       {/* {storedFilters && viewDetails && areFiltersDifferent(storedFilters, viewDetails.query_data.filters ?? {}) && (
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
index ac4ceaa0d6d..64f95983e46 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
@@ -8,11 +8,10 @@ import { TStateGroups } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
-  disableClearOption?: boolean;
 };
 
 export const AppliedStateGroupFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values, disableClearOption } = props;
+  const { handleRemove, values } = props;
 
   return (
     <>
@@ -20,15 +19,13 @@ export const AppliedStateGroupFilters: React.FC<Props> = observer((props) => {
         <div key={stateGroup} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <StateGroupIcon stateGroup={stateGroup as TStateGroups} height="12px" width="12px" />
           {stateGroup}
-          {!disableClearOption && (
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(stateGroup)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
-          )}
+          <button
+            type="button"
+            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+            onClick={() => handleRemove(stateGroup)}
+          >
+            <X size={10} strokeWidth={2} />
+          </button>
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 1f43613ace1..8e759250557 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -10,11 +10,10 @@ type Props = {
   handleRemove: (val: string) => void;
   states: IState[];
   values: string[];
-  disableClearOption: boolean | undefined;
 };
 
 export const AppliedStateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, states, values, disableClearOption } = props;
+  const { handleRemove, states, values } = props;
 
   return (
     <>
@@ -27,15 +26,13 @@ export const AppliedStateFilters: React.FC<Props> = observer((props) => {
           <div key={stateId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <StateGroupIcon color={stateDetails.color} stateGroup={stateDetails.group} height="12px" width="12px" />
             {stateDetails.name}
-            {!disableClearOption && (
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemove(stateId)}
-              >
-                <X size={10} strokeWidth={2} />
-              </button>
-            )}
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(stateId)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
index 8aa75c91135..7ab5621b8e4 100644
--- a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
+++ b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
@@ -110,17 +110,7 @@ export const AllIssueLayoutRoot: React.FC<Props> = observer((props) => {
         </div>
       ) : (
         <>
-          <GlobalViewsAppliedFiltersRoot
-            disableClearFilterOptions={
-              type === "assigned"
-                ? ["assignees"]
-                : type === "created"
-                ? ["created_by"]
-                : type === "subscribed"
-                ? ["subscriber"]
-                : undefined
-            }
-          />
+          <GlobalViewsAppliedFiltersRoot />
 
           {Object.keys(getIssues ?? {}).length == 0 ? (
             <>{/* <GlobalViewEmptyState /> */}</>

From cbdc8e31f8f7e9be11c3b60803473c4956470c59 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Thu, 28 Dec 2023 14:14:59 +0530
Subject: [PATCH 7/9] Revert "chore: allow guest/ viewer to clear applied
 filters in project issues."

This reverts commit 3dae871d23424d55abac95e16522696ad3c2a5c4.
---
 .../filters/applied-filters/filters-list.tsx  | 50 +++++++++++++------
 .../filters/applied-filters/label.tsx         | 19 ++++---
 .../filters/applied-filters/members.tsx       | 19 ++++---
 .../filters/applied-filters/priority.tsx      | 19 ++++---
 .../filters/applied-filters/project.tsx       | 19 ++++---
 .../filters/applied-filters/state.tsx         | 19 ++++---
 6 files changed, 89 insertions(+), 56 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
index 5d1868a8ae6..7ff8056b9e1 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
@@ -1,4 +1,5 @@
 import { observer } from "mobx-react-lite";
+import { useMobxStore } from "lib/mobx/store-provider";
 // components
 import {
   AppliedDateFilters,
@@ -15,6 +16,8 @@ import { X } from "lucide-react";
 import { replaceUnderscoreIfSnakeCase } from "helpers/string.helper";
 // types
 import { IIssueFilterOptions, IIssueLabel, IProject, IState, IUserLite } from "types";
+// constants
+import { EUserWorkspaceRoles } from "constants/workspace";
 
 type Props = {
   appliedFilters: IIssueFilterOptions;
@@ -32,10 +35,16 @@ const dateFilters = ["start_date", "target_date"];
 export const AppliedFiltersList: React.FC<Props> = observer((props) => {
   const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, members, projects, states } = props;
 
+  const {
+    user: { currentProjectRole },
+  } = useMobxStore();
+
   if (!appliedFilters) return null;
 
   if (Object.keys(appliedFilters).length === 0) return null;
 
+  const isEditingAllowed = currentProjectRole && currentProjectRole >= EUserWorkspaceRoles.MEMBER;
+
   return (
     <div className="flex flex-wrap items-stretch gap-2 bg-custom-background-100">
       {Object.entries(appliedFilters).map(([key, value]) => {
@@ -52,6 +61,7 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
             <div className="flex flex-wrap items-center gap-1">
               {membersFilters.includes(filterKey) && (
                 <AppliedMembersFilters
+                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter(filterKey, val)}
                   members={members}
                   values={value}
@@ -62,6 +72,7 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "labels" && (
                 <AppliedLabelsFilters
+                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("labels", val)}
                   labels={labels}
                   values={value}
@@ -69,12 +80,14 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "priority" && (
                 <AppliedPriorityFilters
+                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("priority", val)}
                   values={value}
                 />
               )}
               {filterKey === "state" && states && (
                 <AppliedStateFilters
+                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("state", val)}
                   states={states}
                   values={value}
@@ -88,30 +101,35 @@ export const AppliedFiltersList: React.FC<Props> = observer((props) => {
               )}
               {filterKey === "project" && (
                 <AppliedProjectFilters
+                  editable={isEditingAllowed}
                   handleRemove={(val) => handleRemoveFilter("project", val)}
                   projects={projects}
                   values={value}
                 />
               )}
-              <button
-                type="button"
-                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-                onClick={() => handleRemoveFilter(filterKey, null)}
-              >
-                <X size={12} strokeWidth={2} />
-              </button>
+              {isEditingAllowed && (
+                <button
+                  type="button"
+                  className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                  onClick={() => handleRemoveFilter(filterKey, null)}
+                >
+                  <X size={12} strokeWidth={2} />
+                </button>
+              )}
             </div>
           </div>
         );
       })}
-      <button
-        type="button"
-        onClick={handleClearAllFilters}
-        className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
-      >
-        Clear all
-        <X size={12} strokeWidth={2} />
-      </button>
-      </div>
+      {isEditingAllowed && (
+        <button
+          type="button"
+          onClick={handleClearAllFilters}
+          className="flex items-center gap-2 rounded-md border border-custom-border-200 px-2 py-1 text-xs text-custom-text-300 hover:text-custom-text-200"
+        >
+          Clear all
+          <X size={12} strokeWidth={2} />
+        </button>
+      )}
+    </div>
   );
 });
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 9cec9b2f724..08e7aee4458 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -9,10 +9,11 @@ type Props = {
   handleRemove: (val: string) => void;
   labels: IIssueLabel[] | undefined;
   values: string[];
+  editable: boolean | undefined;
 };
 
 export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, labels, values } = props;
+  const { handleRemove, labels, values, editable } = props;
 
   return (
     <>
@@ -30,13 +31,15 @@ export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
               }}
             />
             <span className="normal-case">{labelDetails.name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(labelId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {editable && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(labelId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
index bfa7e9a29da..1dd61d3390b 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -9,10 +9,11 @@ type Props = {
   handleRemove: (val: string) => void;
   members: IUserLite[] | undefined;
   values: string[];
+  editable: boolean | undefined;
 };
 
 export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, members, values } = props;
+  const { handleRemove, members, values, editable } = props;
 
   return (
     <>
@@ -25,13 +26,15 @@ export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
           <div key={memberId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <Avatar name={memberDetails.display_name} src={memberDetails.avatar} showTooltip={false} />
             <span className="normal-case">{memberDetails.display_name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(memberId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {editable && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(memberId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index e00d0d829e4..88b39dc0033 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -9,10 +9,11 @@ import { TIssuePriorities } from "types";
 type Props = {
   handleRemove: (val: string) => void;
   values: string[];
+  editable: boolean | undefined;
 };
 
 export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, values } = props;
+  const { handleRemove, values, editable } = props;
 
   return (
     <>
@@ -20,13 +21,15 @@ export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
         <div key={priority} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
           <PriorityIcon priority={priority as TIssuePriorities} className={`h-3 w-3`} />
           {priority}
-          <button
-            type="button"
-            className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-            onClick={() => handleRemove(priority)}
-          >
-            <X size={10} strokeWidth={2} />
-          </button>
+          {editable && (
+            <button
+              type="button"
+              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+              onClick={() => handleRemove(priority)}
+            >
+              <X size={10} strokeWidth={2} />
+            </button>
+          )}
         </div>
       ))}
     </>
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
index 01830986162..b1e17cfe3dc 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -10,10 +10,11 @@ type Props = {
   handleRemove: (val: string) => void;
   projects: IProject[] | undefined;
   values: string[];
+  editable: boolean | undefined;
 };
 
 export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, projects, values } = props;
+  const { handleRemove, projects, values, editable } = props;
 
   return (
     <>
@@ -34,13 +35,15 @@ export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
               </span>
             )}
             <span className="normal-case">{projectDetails.name}</span>
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(projectId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {editable && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(projectId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 8e759250557..9cff84d9b7a 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -10,10 +10,11 @@ type Props = {
   handleRemove: (val: string) => void;
   states: IState[];
   values: string[];
+  editable: boolean | undefined;
 };
 
 export const AppliedStateFilters: React.FC<Props> = observer((props) => {
-  const { handleRemove, states, values } = props;
+  const { handleRemove, states, values, editable } = props;
 
   return (
     <>
@@ -26,13 +27,15 @@ export const AppliedStateFilters: React.FC<Props> = observer((props) => {
           <div key={stateId} className="flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <StateGroupIcon color={stateDetails.color} stateGroup={stateDetails.group} height="12px" width="12px" />
             {stateDetails.name}
-            <button
-              type="button"
-              className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
-              onClick={() => handleRemove(stateId)}
-            >
-              <X size={10} strokeWidth={2} />
-            </button>
+            {editable && (
+              <button
+                type="button"
+                className="grid place-items-center text-custom-text-300 hover:text-custom-text-200"
+                onClick={() => handleRemove(stateId)}
+              >
+                <X size={10} strokeWidth={2} />
+              </button>
+            )}
           </div>
         );
       })}

From db8bbd6740ffcc15efcef06d0a34a0a7e7dbbbe0 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Thu, 28 Dec 2023 14:15:25 +0530
Subject: [PATCH 8/9] Revert "chore: update `Workspace Issues` -> `All Issues`
 header."

This reverts commit 03f90be188bc6b2f98a780ae22e0a29d9c59268d.
---
 web/components/headers/global-issues.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/components/headers/global-issues.tsx b/web/components/headers/global-issues.tsx
index 0b27bdd816d..ef4c2b3f570 100644
--- a/web/components/headers/global-issues.tsx
+++ b/web/components/headers/global-issues.tsx
@@ -95,7 +95,7 @@ export const GlobalIssuesHeader: React.FC<Props> = observer((props) => {
                   <PhotoFilterIcon className="h-4 w-4 text-custom-text-300" />
                 )
               }
-              label={`All ${activeLayout === "spreadsheet" ? "Issues" : "Views"}`}
+              label={`Workspace ${activeLayout === "spreadsheet" ? "Issues" : "Views"}`}
             />
           </Breadcrumbs>
         </div>

From 092b9adaf5e8aaa339c5518777278cf2b77e5aaf Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Thu, 28 Dec 2023 15:57:23 +0530
Subject: [PATCH 9/9] chore: remove `cursor-pointer` style from non actionable
 issue properties.

---
 .../issues/issue-layouts/kanban/properties.tsx | 18 +++---------------
 .../issues/issue-layouts/list/properties.tsx   | 18 +++---------------
 2 files changed, 6 insertions(+), 30 deletions(-)

diff --git a/web/components/issues/issue-layouts/kanban/properties.tsx b/web/components/issues/issue-layouts/kanban/properties.tsx
index e6288d62c75..5be5a12c5b3 100644
--- a/web/components/issues/issue-layouts/kanban/properties.tsx
+++ b/web/components/issues/issue-layouts/kanban/properties.tsx
@@ -166,11 +166,7 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* sub-issues */}
       {displayProperties && displayProperties?.sub_issue_count && !!issue?.sub_issues_count && (
         <Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 cursor-default">
             <Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.sub_issues_count}</div>
           </div>
@@ -180,11 +176,7 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* attachments */}
       {displayProperties && displayProperties?.attachment_count && !!issue?.attachment_count && (
         <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 cursor-default">
             <Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.attachment_count}</div>
           </div>
@@ -194,11 +186,7 @@ export const KanBanProperties: React.FC<IKanBanProperties> = observer((props) =>
       {/* link */}
       {displayProperties && displayProperties?.link && !!issue?.link_count && (
         <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadOnly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 cursor-default">
             <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>
diff --git a/web/components/issues/issue-layouts/list/properties.tsx b/web/components/issues/issue-layouts/list/properties.tsx
index ba8a8142f94..07129910fe7 100644
--- a/web/components/issues/issue-layouts/list/properties.tsx
+++ b/web/components/issues/issue-layouts/list/properties.tsx
@@ -137,11 +137,7 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* sub-issues */}
       {displayProperties && displayProperties?.sub_issue_count && !!issue?.sub_issues_count && (
         <Tooltip tooltipHeading="Sub-issues" tooltipContent={`${issue.sub_issues_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 cursor-default items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
             <Layers className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.sub_issues_count}</div>
           </div>
@@ -151,11 +147,7 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* attachments */}
       {displayProperties && displayProperties?.attachment_count && !!issue?.attachment_count && (
         <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 cursor-default items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
             <Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.attachment_count}</div>
           </div>
@@ -165,11 +157,7 @@ export const ListProperties: FC<IListProperties> = observer((props) => {
       {/* link */}
       {displayProperties && displayProperties?.link && !!issue?.link_count && (
         <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
-          <div
-            className={`flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1 ${
-              isReadonly ? "cursor-not-allowed" : "cursor-pointer"
-            }`}
-          >
+          <div className="flex h-5 flex-shrink-0 cursor-default items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
             <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>