Mirrors/plane
1
0
Fork 0
mirror of https://github.com/makeplane/plane.git synced 2026-07-13 22:09:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

[WEB-4509] fix: layout switcher in global views #3672

Browse Source
This commit is contained in:
Vamsi Krishna
2025-07-15 15:29:17 +05:30
committed by GitHub
parent b14ec68f90
commit c7c31d9cfb
1 changed files with 18 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
apps/web/ee/components/views/helper.tsx
View File

@@ -1,5 +1,5 @@
import { useEffect } from "react";
import { E_FEATURE_FLAGS, EIssueFilterType, EIssueLayoutTypes } from "@plane/constants";
import { E_FEATURE_FLAGS, EIssueLayoutTypes } from "@plane/constants";
import { EIssuesStoreType } from "@plane/types";
import { TLayoutSelectionProps } from "@/ce/components/views/helper";
import { LayoutSelection } from "@/components/issues";
@@ -8,6 +8,8 @@ import { useIssues } from "@/hooks/store";
import { useFlag } from "@/plane-web/hooks/store";
import { WorkspaceGanttRoot } from "../issues/issue-layouts/gantt/root";
const ALLOWED_LAYOUTS = [EIssueLayoutTypes.SPREADSHEET, EIssueLayoutTypes.GANTT];
/**
* @description Global view layout selection component
* @param {TLayoutSelectionProps} props
@@ -16,37 +18,27 @@ import { WorkspaceGanttRoot } from "../issues/issue-layouts/gantt/root";
export const GlobalViewLayoutSelection = ({ onChange, selectedLayout, workspaceSlug }: TLayoutSelectionProps) => {
const isGanttLayoutEnabled = useFlag(workspaceSlug, E_FEATURE_FLAGS.GLOBAL_VIEWS_TIMELINE);
if (!isGanttLayoutEnabled) return null;
return (
<LayoutSelection
layouts={[EIssueLayoutTypes.SPREADSHEET, EIssueLayoutTypes.GANTT]}
onChange={onChange}
selectedLayout={selectedLayout}
/>
);
};
export const WorkspaceAdditionalLayouts = (props: TWorkspaceLayoutProps) => {
const isGanttLayoutEnabled = useFlag(props.workspaceSlug, E_FEATURE_FLAGS.GLOBAL_VIEWS_TIMELINE);
const {
issuesFilter: { updateFilters },
} = useIssues(EIssuesStoreType.GLOBAL);
/** To handle layout switch when downgraded */
/** To handle layout switch when downgraded and to reset default layout to SPREADSHEET*/
useEffect(() => {
if (!isGanttLayoutEnabled && props.activeLayout === EIssueLayoutTypes.GANTT) {
updateFilters(
props.workspaceSlug,
undefined,
EIssueFilterType.DISPLAY_FILTERS,
{ layout: EIssueLayoutTypes.SPREADSHEET },
props.globalViewId
);
}
}, [isGanttLayoutEnabled, props.activeLayout, props.workspaceSlug, props.globalViewId, updateFilters]);
const shouldSwitchToSpreadsheet =
!ALLOWED_LAYOUTS.includes(selectedLayout) ||
(!isGanttLayoutEnabled && selectedLayout === EIssueLayoutTypes.GANTT);
if (shouldSwitchToSpreadsheet) {
onChange(EIssueLayoutTypes.SPREADSHEET);
}
}, [isGanttLayoutEnabled, selectedLayout, workspaceSlug, updateFilters, onChange]);
if (!isGanttLayoutEnabled) return null;
return <LayoutSelection layouts={ALLOWED_LAYOUTS} onChange={onChange} selectedLayout={selectedLayout} />;
};
export const WorkspaceAdditionalLayouts = (props: TWorkspaceLayoutProps) => {
switch (props.activeLayout) {
case EIssueLayoutTypes.GANTT:
return <WorkspaceGanttRoot {...props} />;