diff --git a/web/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx b/web/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
index 09173fec8..0133f9015 100644
--- a/web/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
+++ b/web/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
@@ -47,8 +47,7 @@ export const DisplayFiltersSelection: React.FC<Props> = observer((props) => {
       {isDisplayFilterEnabled("group_by") && (
         <div className="py-2">
           <FilterGroupBy
-            selectedGroupBy={displayFilters.group_by}
-            selectedSubGroupBy={displayFilters.sub_group_by}
+            displayFilters={displayFilters}
             groupByOptions={layoutDisplayFiltersOptions?.display_filters.group_by ?? []}
             handleUpdate={(val) =>
               handleDisplayFiltersUpdate({
@@ -65,8 +64,7 @@ export const DisplayFiltersSelection: React.FC<Props> = observer((props) => {
         displayFilters.layout === "kanban" && (
           <div className="py-2">
             <FilterSubGroupBy
-              selectedGroupBy={displayFilters.group_by}
-              selectedSubGroupBy={displayFilters.sub_group_by}
+              displayFilters={displayFilters}
               handleUpdate={(val) =>
                 handleDisplayFiltersUpdate({
                   sub_group_by: val,
diff --git a/web/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx b/web/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
index b74fe2761..aa057e417 100644
--- a/web/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
+++ b/web/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
@@ -4,23 +4,23 @@ import { observer } from "mobx-react-lite";
 // components
 import { FilterHeader, FilterOption } from "components/issues";
 // types
-import { TIssueGroupByOptions } from "types";
+import { IIssueDisplayFilterOptions, TIssueGroupByOptions } from "types";
 // constants
 import { ISSUE_GROUP_BY_OPTIONS } from "constants/issue";
 
 type Props = {
-  selectedGroupBy: TIssueGroupByOptions | undefined;
-  selectedSubGroupBy: TIssueGroupByOptions | undefined;
+  displayFilters: IIssueDisplayFilterOptions;
   groupByOptions: TIssueGroupByOptions[];
   handleUpdate: (val: TIssueGroupByOptions) => void;
 };
 
 export const FilterGroupBy: React.FC<Props> = observer((props) => {
-  const { selectedGroupBy, selectedSubGroupBy, groupByOptions, handleUpdate } = props;
+  const { displayFilters, groupByOptions, handleUpdate } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
 
-  const activeGroupBy = selectedGroupBy ?? null;
+  const selectedGroupBy = displayFilters.group_by ?? null;
+  const selectedSubGroupBy = displayFilters.sub_group_by ?? null;
 
   return (
     <>
@@ -32,12 +32,13 @@ export const FilterGroupBy: React.FC<Props> = observer((props) => {
       {previewEnabled && (
         <div>
           {ISSUE_GROUP_BY_OPTIONS.filter((option) => groupByOptions.includes(option.key)).map((groupBy) => {
-            if (selectedSubGroupBy !== null && groupBy.key === selectedSubGroupBy) return null;
+            if (displayFilters.layout === "kanban" && selectedSubGroupBy !== null && groupBy.key === selectedSubGroupBy)
+              return null;
 
             return (
               <FilterOption
                 key={groupBy?.key}
-                isChecked={activeGroupBy === groupBy?.key ? true : false}
+                isChecked={selectedGroupBy === groupBy?.key ? true : false}
                 onClick={() => handleUpdate(groupBy.key)}
                 title={groupBy.title}
                 multiple={false}
diff --git a/web/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx b/web/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
index 83f09092d..f66422427 100644
--- a/web/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
+++ b/web/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
@@ -4,22 +4,24 @@ import { observer } from "mobx-react-lite";
 // components
 import { FilterHeader, FilterOption } from "components/issues";
 // types
-import { TIssueGroupByOptions } from "types";
+import { IIssueDisplayFilterOptions, TIssueGroupByOptions } from "types";
 // constants
 import { ISSUE_GROUP_BY_OPTIONS } from "constants/issue";
 
 type Props = {
-  selectedGroupBy: TIssueGroupByOptions | undefined;
-  selectedSubGroupBy: TIssueGroupByOptions | undefined;
+  displayFilters: IIssueDisplayFilterOptions;
   handleUpdate: (val: TIssueGroupByOptions) => void;
   subGroupByOptions: TIssueGroupByOptions[];
 };
 
 export const FilterSubGroupBy: React.FC<Props> = observer((props) => {
-  const { selectedGroupBy, selectedSubGroupBy, handleUpdate, subGroupByOptions } = props;
+  const { displayFilters, handleUpdate, subGroupByOptions } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
 
+  const selectedGroupBy = displayFilters.group_by ?? null;
+  const selectedSubGroupBy = displayFilters.sub_group_by ?? null;
+
   return (
     <>
       <FilterHeader
diff --git a/web/store/issue/issue_filters.store.ts b/web/store/issue/issue_filters.store.ts
index 91f86b713..f6e84c622 100644
--- a/web/store/issue/issue_filters.store.ts
+++ b/web/store/issue/issue_filters.store.ts
@@ -186,6 +186,13 @@ export class IssueFilterStore implements IIssueFilterStore {
     // set sub_group_by to null if group_by is set to null
     if (newViewProps.display_filters.group_by === null) newViewProps.display_filters.sub_group_by = null;
 
+    // set sub_group_by to null if layout is switched to kanban group_by and sub_group_by are same
+    if (
+      newViewProps.display_filters.layout === "kanban" &&
+      newViewProps.display_filters.group_by === newViewProps.display_filters.sub_group_by
+    )
+      newViewProps.display_filters.sub_group_by = null;
+
     // set group_by to state if layout is switched to kanban and group_by is null
     if (newViewProps.display_filters.layout === "kanban" && newViewProps.display_filters.group_by === null)
       newViewProps.display_filters.group_by = "state";