[WEB-2357] fix: update and redefine user roles across the platform (#5466)

* chore: removed viewer role * chore: indentation * chore: remove viewer role * chore: handled user permissions in store * chore: updated the migration file * chore: updated user permissions store * chore: removed the owner key * chore: code refactor * chore: code refactor * chore: code refactor * chore: code refactor * chore: code refactor * fix: build error * chore: updated user permissions store and handled the permissions fetch in workspace and project wrappers * chore: package user enum updated * chore: user permission updated * chore: user permission updated * chore: resolved build errors * chore: resolved build error * chore: resolved build errors * chore: computedFn deep map issue resolved * chore: added back migration * chore: added new field in project table * chore: removed member store in users * chore: private project for admins * chore: workspace notification access validation updated * fix: workspace member edit option * fix: project intake permission validation updated * chore: workspace export settings permission updated * chore: guest_view_all_issues added * chore: guest_view_all_issues added * chore: key changed for guest access * chore: added validation for individual issues * chore: changed the dashboard issues count * chore: added new yarn file * chore: modified yarn file * chore: project page permission updated * chore: project page permission updated * chore: member setting ux updated * chore: build error * fix: yarn lock * fix: build error --------- Co-authored-by: gurusainath <gurusainath007@gmail.com> Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
2024-09-11 17:10:15 +05:30 · 2024-09-11 17:10:15 +05:30 · fdcd9a376c
commit fdcd9a376c
parent 7013a36629
172 changed files with 2057 additions and 1627 deletions
--- a/web/core/components/modules/analytics-sidebar/root.tsx
+++ b/web/core/components/modules/analytics-sidebar/root.tsx
@ -47,15 +47,15 @@ import {
  MODULE_UPDATED,
 } from "@/constants/event-tracker";
 import { MODULE_STATUS } from "@/constants/module";
-import { EUserProjectRoles } from "@/constants/project";
 // helpers
 import { getDate, renderFormattedPayloadDate } from "@/helpers/date-time.helper";
 import { copyUrlToClipboard } from "@/helpers/string.helper";
 // hooks
-import { useModule, useUser, useEventTracker, useProjectEstimates } from "@/hooks/store";
+import { useModule, useEventTracker, useProjectEstimates, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 // plane web constants
 import { EEstimateSystem } from "@/plane-web/constants/estimates";
+import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";

 const defaultValues: Partial<IModule> = {
  lead_id: "",
@ -84,9 +84,9 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
  const { workspaceSlug, projectId } = useParams();

  // store hooks
-  const {
-    membership: { currentProjectRole },
-  } = useUser();
+
+  const { allowPermissions } = useUserPermissions();
+
  const { getModuleById, updateModuleDetails, createModuleLink, updateModuleLink, deleteModuleLink, restoreModule } =
    useModule();
  const { setTrackElement, captureModuleEvent, captureEvent } = useEventTracker();
@ -264,7 +264,10 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
      ? "0 Issue"
      : `${moduleDetails.completed_estimate_points}/${moduleDetails.total_estimate_points}`;

-  const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER;
+  const isEditingAllowed = allowPermissions(
+    [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
+    EUserPermissionsLevel.PROJECT
+  );

  return (
    <div className="relative">
@ -550,7 +553,7 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
                  <Transition show={open}>
                    <Disclosure.Panel>
                      <div className="mt-2 flex min-h-72 w-full flex-col space-y-3 overflow-y-auto">
-                        {currentProjectRole && moduleDetails.link_module && moduleDetails.link_module.length > 0 ? (
+                        {isEditingAllowed && moduleDetails.link_module && moduleDetails.link_module.length > 0 ? (
                          <>
                            {isEditingAllowed && !isArchived && (
                              <div className="flex w-full items-center justify-end">
@ -569,13 +572,7 @@ export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
                                moduleId={moduleId}
                                handleEditLink={handleEditLink}
                                handleDeleteLink={handleDeleteLink}
-                                userAuth={{
-                                  isGuest: currentProjectRole === EUserProjectRoles.GUEST,
-                                  isViewer: currentProjectRole === EUserProjectRoles.VIEWER,
-                                  isMember: currentProjectRole === EUserProjectRoles.MEMBER,
-                                  isOwner: currentProjectRole === EUserProjectRoles.ADMIN,
-                                }}
-                                disabled={isArchived}
+                                disabled={!isEditingAllowed || isArchived}
                              />
                            )}
                          </>
--- a/web/core/components/modules/links/list.tsx
+++ b/web/core/components/modules/links/list.tsx
@ -2,7 +2,7 @@
 import { useCallback } from "react";
 import { observer } from "mobx-react";
 // plane types
-import { ILinkDetails, UserAuth } from "@plane/types";
+import { ILinkDetails } from "@plane/types";
 // components
 import { ModulesLinksListItem } from "@/components/modules";
 // hooks
@ -13,11 +13,10 @@ type Props = {
  handleDeleteLink: (linkId: string) => void;
  handleEditLink: (link: ILinkDetails) => void;
  moduleId: string;
-  userAuth: UserAuth;
 };

 export const ModuleLinksList: React.FC<Props> = observer((props) => {
-  const { moduleId, handleDeleteLink, handleEditLink, userAuth, disabled } = props;
+  const { moduleId, handleDeleteLink, handleEditLink, disabled } = props;
  // store hooks
  const { getModuleById } = useModule();
  // derived values
@ -36,7 +35,7 @@ export const ModuleLinksList: React.FC<Props> = observer((props) => {
          key={link.id}
          handleDeleteLink={() => memoizedDeleteLink(link.id)}
          handleEditLink={() => memoizedEditLink(link)}
-          isEditingAllowed={(userAuth.isMember || userAuth.isOwner) && !disabled}
+          isEditingAllowed={!disabled}
          link={link}
        />
      ))}
--- a/web/core/components/modules/module-card-item.tsx
+++ b/web/core/components/modules/module-card-item.tsx
@ -17,16 +17,16 @@ import { ModuleStatusDropdown } from  "@/components/modules/module-status-dropdo
 import { PROGRESS_STATE_GROUPS_DETAILS } from "@/constants/common";
 import { MODULE_FAVORITED, MODULE_UNFAVORITED } from "@/constants/event-tracker";
 import { MODULE_STATUS } from "@/constants/module";
-import { EUserProjectRoles } from "@/constants/project";
 // helpers
 import { getDate, renderFormattedPayloadDate } from "@/helpers/date-time.helper";
 import { generateQueryParams } from "@/helpers/router.helper";
 // hooks
-import { useEventTracker, useMember, useModule, useProjectEstimates, useUser } from "@/hooks/store";
+import { useEventTracker, useMember, useModule, useProjectEstimates, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web constants
 import { EEstimateSystem } from "@/plane-web/constants/estimates";
+import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";

 type Props = {
  moduleId: string;
@ -42,9 +42,7 @@ export const ModuleCardItem: React.FC<Props> = observer((props) => {
  const searchParams = useSearchParams();
  const pathname = usePathname();
  // store hooks
-  const {
-    membership: { currentProjectRole },
-  } = useUser();
+  const { allowPermissions } = useUserPermissions();
  const { getModuleById, addModuleToFavorites, removeModuleFromFavorites, updateModuleDetails } = useModule();
  const { getUserDetails } = useMember();
  const { captureEvent } = useEventTracker();
@ -52,7 +50,10 @@ export const ModuleCardItem: React.FC<Props> = observer((props) => {

  // derived values
  const moduleDetails = getModuleById(moduleId);
-  const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER;
+  const isEditingAllowed = allowPermissions(
+    [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
+    EUserPermissionsLevel.PROJECT
+  );
  const isDisabled = !isEditingAllowed || !!moduleDetails?.archived_at;
  const renderIcon = Boolean(moduleDetails?.start_date) || Boolean(moduleDetails?.target_date);

--- a/web/core/components/modules/module-list-item-action.tsx
+++ b/web/core/components/modules/module-list-item-action.tsx
@ -12,14 +12,14 @@ import { FavoriteStar, TOAST_TYPE, Tooltip, setPromiseToast, setToast } from "@p
 // components
 import { DateRangeDropdown } from "@/components/dropdowns";
 import { ModuleQuickActions } from "@/components/modules";
-import { ModuleStatusDropdown } from  "@/components/modules/module-status-dropdown";
+import { ModuleStatusDropdown } from "@/components/modules/module-status-dropdown";
 // constants
 import { MODULE_FAVORITED, MODULE_UNFAVORITED } from "@/constants/event-tracker";
 import { MODULE_STATUS } from "@/constants/module";
-import { EUserProjectRoles } from "@/constants/project";
 // hooks
 import { renderFormattedPayloadDate, getDate } from "@/helpers/date-time.helper";
-import { useEventTracker, useMember, useModule, useUser } from "@/hooks/store";
+import { useEventTracker, useMember, useModule, useUserPermissions } from "@/hooks/store";
+import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 import { ButtonAvatars } from "../dropdowns/member/avatar";

 type Props = {
@ -33,9 +33,7 @@ export const ModuleListItemAction: FC<Props> = observer((props) => {
  // router
  const { workspaceSlug, projectId } = useParams();
  //   store hooks
-  const {
-    membership: { currentProjectRole },
-  } = useUser();
+  const { allowPermissions } = useUserPermissions();
  const { addModuleToFavorites, removeModuleFromFavorites, updateModuleDetails } = useModule();
  const { getUserDetails } = useMember();
  const { captureEvent } = useEventTracker();
@ -43,7 +41,10 @@ export const ModuleListItemAction: FC<Props> = observer((props) => {
  // derived values

  const moduleStatus = MODULE_STATUS.find((status) => status.value === moduleDetails.status);
-  const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER;
+  const isEditingAllowed = allowPermissions(
+    [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
+    EUserPermissionsLevel.PROJECT
+  );
  const isDisabled = !isEditingAllowed || !!moduleDetails?.archived_at;
  const renderIcon = Boolean(moduleDetails.start_date) || Boolean(moduleDetails.target_date);

@ -140,9 +141,9 @@ export const ModuleListItemAction: FC<Props> = observer((props) => {
        }}
        onSelect={(val) => {
          handleModuleDetailsChange({
-            start_date: (val?.from ? renderFormattedPayloadDate(val.from) : null),
-            target_date: (val?.to ? renderFormattedPayloadDate(val.to) : null)
-          })
+            start_date: val?.from ? renderFormattedPayloadDate(val.from) : null,
+            target_date: val?.to ? renderFormattedPayloadDate(val.to) : null,
+          });
        }}
        placeholder={{
          from: "Start date",
@ -154,9 +155,9 @@ export const ModuleListItemAction: FC<Props> = observer((props) => {

      {moduleStatus && (
        <ModuleStatusDropdown
-        isDisabled={isDisabled}
-        moduleDetails={moduleDetails}
-        handleModuleDetailsChange={handleModuleDetailsChange}
+          isDisabled={isDisabled}
+          moduleDetails={moduleDetails}
+          handleModuleDetailsChange={handleModuleDetailsChange}
        />
      )}

@ -191,4 +192,4 @@ export const ModuleListItemAction: FC<Props> = observer((props) => {
      )}
    </>
  );
-});
+});
--- a/web/core/components/modules/quick-actions.tsx
+++ b/web/core/components/modules/quick-actions.tsx
@ -9,14 +9,13 @@ import { ArchiveRestoreIcon, ExternalLink, LinkIcon, Pencil, Trash2 } from "luci
 import { ArchiveIcon, ContextMenu, CustomMenu, TContextMenuItem, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { ArchiveModuleModal, CreateUpdateModuleModal, DeleteModuleModal } from "@/components/modules";
-// constants
-import { EUserProjectRoles } from "@/constants/project";
 // helpers
 import { cn } from "@/helpers/common.helper";
 import { copyUrlToClipboard } from "@/helpers/string.helper";
 // hooks
-import { useModule, useEventTracker, useUser } from "@/hooks/store";
+import { useModule, useEventTracker, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
+import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";

 type Props = {
  parentRef: React.RefObject<HTMLDivElement>;
@ -35,16 +34,19 @@ export const ModuleQuickActions: React.FC<Props> = observer((props) => {
  const [deleteModal, setDeleteModal] = useState(false);
  // store hooks
  const { setTrackElement } = useEventTracker();
-  const {
-    membership: { currentWorkspaceAllProjectsRole },
-  } = useUser();
+  const { allowPermissions } = useUserPermissions();
+
  const { getModuleById, restoreModule } = useModule();
  // derived values
  const moduleDetails = getModuleById(moduleId);
  const isArchived = !!moduleDetails?.archived_at;
  // auth
-  const isEditingAllowed =
-    !!currentWorkspaceAllProjectsRole && currentWorkspaceAllProjectsRole[projectId] >= EUserProjectRoles.MEMBER;
+  const isEditingAllowed = allowPermissions(
+    [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
+    EUserPermissionsLevel.PROJECT,
+    workspaceSlug,
+    projectId
+  );

  const moduleState = moduleDetails?.status?.toLocaleLowerCase();
  const isInArchivableGroup = !!moduleState && ["completed", "cancelled"].includes(moduleState);