From de008ff44243abbf7bdd3e25fbbbe9dbb23e7501 Mon Sep 17 00:00:00 2001 From: Akshita Goyal <36129505+gakshita@users.noreply.github.com> Date: Thu, 22 Aug 2024 13:08:06 +0530 Subject: [PATCH] [WEB-2268] feat: persisted filters for project grouping (#899) * feat: persisted filters for project grouping * fix: css --- .../projects/layouts/attributes.tsx | 14 ++++- .../projects/layouts/list/block.tsx | 13 ++--- .../projects/layouts/list/list-group.tsx | 2 +- .../filters/filters.ts | 53 +++++++++++-------- 4 files changed, 51 insertions(+), 31 deletions(-) diff --git a/web/ee/components/projects/layouts/attributes.tsx b/web/ee/components/projects/layouts/attributes.tsx index f4d5895537..22c2d7028d 100644 --- a/web/ee/components/projects/layouts/attributes.tsx +++ b/web/ee/components/projects/layouts/attributes.tsx @@ -21,9 +21,19 @@ type Props = { currentWorkspace: IWorkspace; cta?: React.ReactNode; dateClassname?: string; + containerClass?: string; }; const Attributes: React.FC = observer((props) => { - const { project, isArchived, handleUpdateProject, workspaceSlug, currentWorkspace, cta, dateClassname } = props; + const { + project, + isArchived, + handleUpdateProject, + workspaceSlug, + currentWorkspace, + cta, + dateClassname, + containerClass = "", + } = props; const projectMembersIds = project.members?.map((member) => member.member_id); const { getUserDetails } = useMember(); @@ -41,7 +51,7 @@ const Attributes: React.FC = observer((props) => { e.preventDefault(); }; return ( -
+
{
{ }} >
-
+
-
- +
+
@@ -83,7 +83,7 @@ export const ProjectBlock = observer((props: ProjectBlockProps) => { className={cn("w-full truncate cursor-pointer text-sm text-custom-text-100", {})} > -

{projectDetails.name}

+

{projectDetails.name}

 ) : ( @@ -98,7 +98,7 @@ export const ProjectBlock = observer((props: ProjectBlockProps) => { )}
{ workspaceSlug={workspaceSlug.toString()} currentWorkspace={currentWorkspace} cta={filters?.scope === EProjectScope.ALL_PROJECTS && } + containerClass="px-0 py-0 md:pb-4 lg:py-2" />
{ return groupedProjectIds.length > 0 ? (
-
+
void; - updateScope: (workspaceSlug: string, scope: TProjectScope) => void; - updateLayout: (workspaceSlug: string, layout: TProjectLayouts) => void; + updateScope: (workspaceSlug: string, scope: TProjectScope, setLocalStorage?: boolean) => void; + updateLayout: (workspaceSlug: string, layout: TProjectLayouts, setLocalStorage?: boolean) => void; updateAttributes: ( workspaceSlug: string, key: T, - values: TProjectAttributes[T] + values: TProjectAttributes[T], + setLocalStorage?: boolean ) => void; updateDisplayFilters: ( workspaceSlug: string, key: T, - values: TProjectDisplayFilters[T] + values: TProjectDisplayFilters[T], + setLocalStorage?: boolean ) => void; bulkUpdateDisplayFilters: (workspaceSlug: string, values: Partial) => void; updateSearchQuery: (query: string | undefined) => void; @@ -215,22 +217,19 @@ export class ProjectFilterStore extends ProjectFilterHelper implements IProjectF ); if (!this.layoutMap[workspaceSlug]) { - this.updateLayout(workspaceSlug, savedFilters.layout || EProjectLayouts.GALLERY); - } - if (!this.layoutMap[workspaceSlug]) { - this.updateLayout(workspaceSlug, savedFilters.layout || EProjectLayouts.GALLERY); + this.updateLayout(workspaceSlug, savedFilters?.layout || EProjectLayouts.GALLERY, false); } if (!this.attributesMap[workspaceSlug]) { - this.updateAttributes(workspaceSlug, "priority", []); - this.updateAttributes(workspaceSlug, "state", []); - this.updateAttributes(workspaceSlug, "lead", []); - this.updateAttributes(workspaceSlug, "members", []); - this.updateAttributes(workspaceSlug, "access", []); + this.updateAttributes(workspaceSlug, "priority", savedFilters?.attributes?.priority || [], false); + this.updateAttributes(workspaceSlug, "state", savedFilters?.attributes?.state || [], false); + this.updateAttributes(workspaceSlug, "lead", savedFilters?.attributes?.lead || [], false); + this.updateAttributes(workspaceSlug, "members", savedFilters?.attributes?.members || [], false); + this.updateAttributes(workspaceSlug, "access", savedFilters?.attributes?.access || [], false); } if (!this.displayFiltersMap[workspaceSlug]) { - this.updateDisplayFilters(workspaceSlug, "group_by", "states"); - this.updateDisplayFilters(workspaceSlug, "sort_by", "manual"); - this.updateDisplayFilters(workspaceSlug, "sort_order", "asc"); + this.updateDisplayFilters(workspaceSlug, "group_by", savedFilters?.display_filters?.group_by || "states", false); + this.updateDisplayFilters(workspaceSlug, "sort_by", savedFilters?.display_filters?.sort_by || "manual", false); + this.updateDisplayFilters(workspaceSlug, "sort_order", savedFilters?.display_filters?.sort_order || "asc", false); } }; @@ -240,9 +239,9 @@ export class ProjectFilterStore extends ProjectFilterHelper implements IProjectF * @param { TProjectScope } scope * @returns { void } */ - updateScope = (workspaceSlug: string, scope: TProjectScope): void => { + updateScope = (workspaceSlug: string, scope: TProjectScope, setLocalStorage = true): void => { set(this.scopeMap, workspaceSlug, scope); - this.handleProjectLocalFilters.set("scope", workspaceSlug, { scope }); + setLocalStorage && this.handleProjectLocalFilters.set("scope", workspaceSlug, { scope }); }; /** @@ -251,9 +250,9 @@ export class ProjectFilterStore extends ProjectFilterHelper implements IProjectF * @param { TProjectLayouts } layout * @returns { void } */ - updateLayout = (workspaceSlug: string, layout: TProjectLayouts): void => { + updateLayout = (workspaceSlug: string, layout: TProjectLayouts, setLocalStorage = true): void => { set(this.layoutMap, workspaceSlug, layout); - this.handleProjectLocalFilters.set("layout", workspaceSlug, { layout }); + setLocalStorage && this.handleProjectLocalFilters.set("layout", workspaceSlug, { layout }); }; /** @@ -266,9 +265,14 @@ export class ProjectFilterStore extends ProjectFilterHelper implements IProjectF updateAttributes = ( workspaceSlug: string, key: T, - values: TProjectAttributes[T] + values: TProjectAttributes[T], + setLocalStorage = true ): void => { set(this.attributesMap, [workspaceSlug, key], values); + setLocalStorage && + this.handleProjectLocalFilters.set("attributes", workspaceSlug, { + attributes: { ...this.attributesMap[workspaceSlug], [key]: values }, + }); }; /** @@ -281,9 +285,14 @@ export class ProjectFilterStore extends ProjectFilterHelper implements IProjectF updateDisplayFilters = ( workspaceSlug: string, key: T, - values: TProjectDisplayFilters[T] + values: TProjectDisplayFilters[T], + setLocalStorage = true ): void => { set(this.displayFiltersMap, [workspaceSlug, key], values); + setLocalStorage && + this.handleProjectLocalFilters.set("display_filters", workspaceSlug, { + display_filters: { ...this.displayFiltersMap[workspaceSlug], [key]: values }, + }); }; /**