fix: resolved rendering issues in list and kanban layout when we apply group-by filter (#4028)

This commit is contained in:
guru_sainath 2024-03-21 20:47:36 +05:30 committed by GitHub
parent 991b8e7703
commit 86ae79f851
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 25 additions and 15 deletions

View File

@ -25,7 +25,7 @@ import {
} from "@/hooks/store";
// types
// parent components
import { getGroupByColumns } from "../utils";
import { getGroupByColumns, isWorkspaceLevel } from "../utils";
// components
import { KanbanStoreType } from "./base-kanban-root";
import { HeaderGroupByCard } from "./headers/group-by-card";
@ -102,7 +102,9 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
moduleInfo,
label,
projectState,
member
member,
true,
isWorkspaceLevel(storeType)
);
if (!list) return null;

View File

@ -13,7 +13,7 @@ import {
} from "@plane/types";
// components
import { useCycle, useLabel, useMember, useModule, useProject, useProjectState } from "@/hooks/store";
import { getGroupByColumns } from "../utils";
import { getGroupByColumns, isWorkspaceLevel } from "../utils";
import { KanbanStoreType } from "./base-kanban-root";
import { KanBan } from "./default";
import { HeaderGroupByCard } from "./headers/group-by-card";
@ -291,7 +291,9 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
projectModule,
label,
projectState,
member
member,
true,
isWorkspaceLevel(storeType)
);
const subGroupByList = getGroupByColumns(
sub_group_by as GroupByColumnTypes,
@ -300,7 +302,9 @@ export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
projectModule,
label,
projectState,
member
member,
true,
isWorkspaceLevel(storeType)
);
if (!groupByList || !subGroupByList) return null;

View File

@ -13,9 +13,8 @@ import { IssueBlocksList, ListQuickAddIssueForm } from "@/components/issues";
// hooks
import { EIssuesStoreType } from "@/constants/issue";
import { useCycle, useLabel, useMember, useModule, useProject, useProjectState } from "@/hooks/store";
// constants
// types
import { getGroupByColumns } from "../utils";
// utils
import { getGroupByColumns, isWorkspaceLevel } from "../utils";
import { HeaderGroupByCard } from "./headers/group-by-card";
export interface IGroupByList {
@ -78,7 +77,7 @@ const GroupByList: React.FC<IGroupByList> = (props) => {
projectState,
member,
true,
true
isWorkspaceLevel(storeType)
);
if (!groups) return null;

View File

@ -70,8 +70,8 @@ export const HeaderGroupByCard = observer(
{icon ? icon : <CircleDashed className="h-3.5 w-3.5" strokeWidth={2} />}
</div>
<div className="flex w-full flex-row items-center gap-1">
<div className="line-clamp-1 font-medium text-custom-text-100">{title}</div>
<div className="relative flex w-full flex-row items-center gap-1 overflow-hidden">
<div className="inline-block line-clamp-1 truncate font-medium text-custom-text-100">{title}</div>
<div className="pl-2 text-sm font-medium text-custom-text-300">{count || 0}</div>
</div>

View File

@ -4,7 +4,7 @@ import { Avatar, CycleGroupIcon, DiceIcon, PriorityIcon, StateGroupIcon } from "
// components
import { ProjectLogo } from "@/components/project";
// stores
import { ISSUE_PRIORITIES } from "@/constants/issue";
import { ISSUE_PRIORITIES, EIssuesStoreType } from "@/constants/issue";
import { STATE_GROUPS } from "@/constants/state";
import { ICycleStore } from "@/store/cycle.store";
import { ILabelStore } from "@/store/label.store";
@ -16,6 +16,9 @@ import { IStateStore } from "@/store/state.store";
// constants
// types
export const isWorkspaceLevel = (type: EIssuesStoreType) =>
[EIssuesStoreType.PROFILE, EIssuesStoreType.GLOBAL].includes(type) ? true : false;
export const getGroupByColumns = (
groupBy: GroupByColumnTypes | null,
project: IProjectStore,

View File

@ -96,7 +96,9 @@ export const GlobalViewsHeader: React.FC = observer(() => {
</Link>
))}
{currentWorkspaceViews?.map((viewId) => <ViewTab key={viewId} viewId={viewId} />)}
{currentWorkspaceViews?.map((viewId) => (
<ViewTab key={viewId} viewId={viewId} />
))}
</div>
{isAuthorizedUser && (

View File

@ -29,8 +29,8 @@ const GlobalViewIssuesPage: NextPageWithLayout = observer(() => {
currentWorkspace?.name && defaultView?.label
? `${currentWorkspace?.name} - ${defaultView?.label}`
: currentWorkspace?.name && globalViewDetails?.name
? `${currentWorkspace?.name} - ${globalViewDetails?.name}`
: undefined;
? `${currentWorkspace?.name} - ${globalViewDetails?.name}`
: undefined;
return (
<>