From c97e41851530fbb0426c542fa8739ab95218f8a5 Mon Sep 17 00:00:00 2001
From: b-saikrishnakanth <130811169+b-saikrishnakanth@users.noreply.github.com>
Date: Tue, 30 Dec 2025 14:59:16 +0530
Subject: [PATCH] [WEB-4959]chore: refactor project member page #8464
---
.../settings/(workspace)/layout.tsx | 4 +-
.../settings/(workspace)/members/page.tsx | 3 +-
.../settings/projects/[projectId]/layout.tsx | 10 +++--
.../members/members-activity-button.tsx | 10 +++++
.../ce/components/settings/right-sidebar.tsx | 10 +++++
.../workspace/right-sidebar/index.ts | 1 -
.../workspace/right-sidebar/root.tsx | 10 -----
.../ce/store/member/project-member.store.ts | 9 +++++
.../core/components/project/member-list.tsx | 5 +++
.../settings/invitations-list-item.tsx | 3 --
.../workspace/settings/member-columns.tsx | 3 --
.../workspace/settings/members-list-item.tsx | 3 +-
apps/web/core/constants/fetch-keys.ts | 6 ++-
.../project/base-project-member.store.ts | 21 +++++++---
.../workspace/workspace-member.store.ts | 38 ++++++++++---------
15 files changed, 85 insertions(+), 51 deletions(-)
create mode 100644 apps/web/ce/components/projects/members/members-activity-button.tsx
create mode 100644 apps/web/ce/components/settings/right-sidebar.tsx
delete mode 100644 apps/web/ce/components/workspace/right-sidebar/index.ts
delete mode 100644 apps/web/ce/components/workspace/right-sidebar/root.tsx
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/layout.tsx
index 783f7a0dd..5ac77bccc 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/layout.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/layout.tsx
@@ -9,7 +9,7 @@ import { SettingsMobileNav } from "@/components/settings/mobile";
import { WORKSPACE_SETTINGS_ACCESS } from "@plane/constants";
import type { EUserWorkspaceRoles } from "@plane/types";
// plane web components
-import { WorkspaceSettingsRightSidebar } from "@/plane-web/components/workspace/right-sidebar";
+import { SettingsRightSidebar } from "@/plane-web/components/settings/right-sidebar";
// hooks
import { useUserPermissions } from "@/hooks/store/user";
// local components
@@ -48,7 +48,7 @@ const WorkspaceSettingLayout = observer(function WorkspaceSettingLayout({ params
-
+
)}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
index 5c1fc059d..1de0255b6 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
@@ -42,7 +42,7 @@ const WorkspaceMembersSettingsPage = observer(function WorkspaceMembersSettingsP
const {
workspace: { workspaceMemberIds, inviteMembersToWorkspace, filtersStore },
} = useMember();
- const { currentWorkspace, mutateWorkspaceMembersActivity } = useWorkspace();
+ const { currentWorkspace } = useWorkspace();
const { t } = useTranslation();
// derived values
@@ -55,7 +55,6 @@ const WorkspaceMembersSettingsPage = observer(function WorkspaceMembersSettingsP
const handleWorkspaceInvite = async (data: IWorkspaceBulkInviteFormData) => {
try {
await inviteMembersToWorkspace(workspaceSlug, data);
- void mutateWorkspaceMembersActivity(workspaceSlug);
setInviteModal(false);
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/layout.tsx
index 8e8c09064..2128bd2f2 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/layout.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/layout.tsx
@@ -7,10 +7,13 @@ import { SettingsMobileNav } from "@/components/settings/mobile";
import { ProjectSettingsSidebar } from "@/components/settings/project/sidebar";
// plane web imports
import { ProjectAuthWrapper } from "@/plane-web/layouts/project-wrapper";
+import { SettingsRightSidebar } from "@/plane-web/components/settings/right-sidebar";
// types
import type { Route } from "./+types/layout";
-function ProjectDetailSettingsLayout({ params }: Route.ComponentProps) {
+export const ProjectDetailSettingsLayout = observer(function ProjectDetailSettingsLayout({
+ params,
+}: Route.ComponentProps) {
const { workspaceSlug, projectId } = params;
// router
const pathname = usePathname();
@@ -24,10 +27,11 @@ function ProjectDetailSettingsLayout({ params }: Route.ComponentProps) {
+
>
);
-}
+});
-export default observer(ProjectDetailSettingsLayout);
+export default ProjectDetailSettingsLayout;
diff --git a/apps/web/ce/components/projects/members/members-activity-button.tsx b/apps/web/ce/components/projects/members/members-activity-button.tsx
new file mode 100644
index 000000000..169d47a93
--- /dev/null
+++ b/apps/web/ce/components/projects/members/members-activity-button.tsx
@@ -0,0 +1,10 @@
+import { observer } from "mobx-react";
+
+type TProjectMembersActivityButtonProps = { workspaceSlug: string; projectId: string };
+
+export const ProjectMembersActivityButton = observer(function ProjectMembersActivityButton(
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
+ props: TProjectMembersActivityButtonProps
+) {
+ return <>>;
+});
diff --git a/apps/web/ce/components/settings/right-sidebar.tsx b/apps/web/ce/components/settings/right-sidebar.tsx
new file mode 100644
index 000000000..887da2f8e
--- /dev/null
+++ b/apps/web/ce/components/settings/right-sidebar.tsx
@@ -0,0 +1,10 @@
+import { observer } from "mobx-react";
+
+type TSettingsRightSidebarProps = { workspaceSlug: string; projectId?: string };
+
+export const SettingsRightSidebar = observer(function SettingsRightSidebar(
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
+ props: TSettingsRightSidebarProps
+) {
+ return <>>;
+});
diff --git a/apps/web/ce/components/workspace/right-sidebar/index.ts b/apps/web/ce/components/workspace/right-sidebar/index.ts
deleted file mode 100644
index 1efe34c51..000000000
--- a/apps/web/ce/components/workspace/right-sidebar/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "./root";
diff --git a/apps/web/ce/components/workspace/right-sidebar/root.tsx b/apps/web/ce/components/workspace/right-sidebar/root.tsx
deleted file mode 100644
index c98bb682a..000000000
--- a/apps/web/ce/components/workspace/right-sidebar/root.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { observer } from "mobx-react";
-
-type TWorkspaceSettingsRightSidebarProps = { workspaceSlug: string };
-
-export const WorkspaceSettingsRightSidebar = observer(function WorkspaceSettingsRightSidebar(
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- props: TWorkspaceSettingsRightSidebarProps
-) {
- return <>>;
-});
diff --git a/apps/web/ce/store/member/project-member.store.ts b/apps/web/ce/store/member/project-member.store.ts
index f0e5b3069..1be3ee1c1 100644
--- a/apps/web/ce/store/member/project-member.store.ts
+++ b/apps/web/ce/store/member/project-member.store.ts
@@ -41,4 +41,13 @@ export class ProjectMemberStore extends BaseProjectMemberStore implements IProje
* @param userId - The ID of the user to remove from the project
*/
processMemberRemoval = (projectId: string, userId: string) => this.handleMemberRemoval(projectId, userId);
+
+ /**
+ * @description Mutate project members activity
+ * @param workspaceSlug
+ * @param projectId
+ */
+ mutateProjectMembersActivity = async (_workspaceSlug: string, _projectId: string) => {
+ // No-op in default/CE version
+ };
}
diff --git a/apps/web/core/components/project/member-list.tsx b/apps/web/core/components/project/member-list.tsx
index 5dbe78d72..acc32265f 100644
--- a/apps/web/core/components/project/member-list.tsx
+++ b/apps/web/core/components/project/member-list.tsx
@@ -14,6 +14,8 @@ import { useUserPermissions } from "@/hooks/store/user";
import { MemberListFiltersDropdown } from "./dropdowns/filters/member-list";
import { ProjectMemberListItem } from "./member-list-item";
import { SendProjectInvitationModal } from "./send-project-invitation-modal";
+// plane web components
+import { ProjectMembersActivityButton } from "@/plane-web/components/projects/members/members-activity-button";
type TProjectMemberListProps = {
projectId: string;
@@ -84,6 +86,7 @@ export const ProjectMemberList = observer(function ProjectMemberList(props: TPro
className="w-full max-w-[234px] border-none bg-transparent text-13 focus:outline-none placeholder:text-placeholder"
placeholder="Search"
value={searchQuery}
+ // eslint-disable-next-line jsx-a11y/no-autofocus
autoFocus
onChange={(e) => setSearchQuery(e.target.value)}
/>
@@ -93,9 +96,11 @@ export const ProjectMemberList = observer(function ProjectMemberList(props: TPro
handleUpdate={handleRoleFilterUpdate}
memberType="project"
/>
+ {isAdmin && }
{isAdmin && (