diff --git a/web/components/estimates/estimate-list-item.tsx b/web/components/estimates/estimate-list-item.tsx index 78e069f4e..becf16ff4 100644 --- a/web/components/estimates/estimate-list-item.tsx +++ b/web/components/estimates/estimate-list-item.tsx @@ -24,19 +24,15 @@ type Props = { export const EstimateListItem: React.FC = observer((props) => { const { estimate, editEstimate, deleteEstimate } = props; - // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; - // store const { project: projectStore } = useMobxStore(); - + const { currentProjectDetails } = projectStore; + // hooks const { setToastAlert } = useToast(); - // derived values - const projectDetails = projectStore.project_details?.[projectId?.toString()!]; - const handleUseEstimate = async () => { if (!workspaceSlug || !projectId) return; @@ -63,7 +59,7 @@ export const EstimateListItem: React.FC = observer((props) => {
{estimate.name} - {projectDetails?.estimate && projectDetails?.estimate === estimate.id && ( + {currentProjectDetails?.estimate && currentProjectDetails?.estimate === estimate.id && ( In use )}
@@ -72,7 +68,7 @@ export const EstimateListItem: React.FC = observer((props) => {

- {projectDetails?.estimate !== estimate?.id && estimate?.points?.length > 0 && ( + {currentProjectDetails?.estimate !== estimate?.id && estimate?.points?.length > 0 && ( @@ -88,7 +84,7 @@ export const EstimateListItem: React.FC = observer((props) => { Edit estimate
- {projectDetails?.estimate !== estimate.id && ( + {currentProjectDetails?.estimate !== estimate.id && ( { deleteEstimate(estimate.id); diff --git a/web/components/estimates/estimate-list.tsx b/web/components/estimates/estimate-list.tsx index a9fdb52f6..489545098 100644 --- a/web/components/estimates/estimate-list.tsx +++ b/web/components/estimates/estimate-list.tsx @@ -1,6 +1,5 @@ import React, { useState } from "react"; import { useRouter } from "next/router"; - // store import { observer } from "mobx-react-lite"; import { useMobxStore } from "lib/mobx/store-provider"; @@ -25,18 +24,15 @@ export const EstimatesList: React.FC = observer(() => { // store const { project: projectStore } = useMobxStore(); - + const { currentProjectDetails } = projectStore; // states const [estimateFormOpen, setEstimateFormOpen] = useState(false); const [estimateToDelete, setEstimateToDelete] = useState(null); const [estimateToUpdate, setEstimateToUpdate] = useState(); - // hooks const { setToastAlert } = useToast(); - // derived values const estimatesList = projectStore.projectEstimates; - const projectDetails = projectStore.project_details?.[projectId?.toString()!]; const editEstimate = (estimate: IEstimate) => { setEstimateFormOpen(true); @@ -88,7 +84,7 @@ export const EstimatesList: React.FC = observer(() => { > Add Estimate - {projectDetails?.estimate && ( + {currentProjectDetails?.estimate && ( diff --git a/web/components/headers/modules-list.tsx b/web/components/headers/modules-list.tsx index 01c6df5c8..02cec3dc6 100644 --- a/web/components/headers/modules-list.tsx +++ b/web/components/headers/modules-list.tsx @@ -29,10 +29,10 @@ const moduleViewOptions: { type: "list" | "grid" | "gantt_chart"; icon: any }[] export const ModulesListHeader: React.FC = observer(() => { // router const router = useRouter(); - const { workspaceSlug, projectId } = router.query; - + const { workspaceSlug } = router.query; + // store const { project: projectStore } = useMobxStore(); - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : undefined; + const { currentProjectDetails } = projectStore; const { storedValue: modulesView, setValue: setModulesView } = useLocalStorage("modules_view", "grid"); @@ -52,7 +52,7 @@ export const ModulesListHeader: React.FC = observer(() => { } /> - + diff --git a/web/components/headers/project-settings.tsx b/web/components/headers/project-settings.tsx index 44271a76e..4dd5aae98 100644 --- a/web/components/headers/project-settings.tsx +++ b/web/components/headers/project-settings.tsx @@ -17,10 +17,10 @@ export interface IProjectSettingHeader { export const ProjectSettingHeader: FC = observer((props) => { const { title } = props; const router = useRouter(); - const { workspaceSlug, projectId } = router.query; + const { workspaceSlug } = router.query; // store const { project: projectStore } = useMobxStore(); - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; + const { currentProjectDetails } = projectStore; return (
= observer((props) router.back()}> + -

{`${truncateText(projectDetails?.name ?? "Project", 32)}`}

+

{`${truncateText(currentProjectDetails?.name ?? "Project", 32)}`}

} diff --git a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx index 7eaeabf6a..467b1a29c 100644 --- a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx @@ -18,6 +18,10 @@ import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES } from "constants/issue"; export interface ICycleKanBanLayout {} export const CycleKanBanLayout: React.FC = observer(() => { + // router + const router = useRouter(); + const { workspaceSlug, cycleId } = router.query; + // store const { project: projectStore, cycleIssue: cycleIssueStore, @@ -25,9 +29,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { cycleIssueKanBanView: cycleIssueKanBanViewStore, issueDetail: issueDetailStore, } = useMobxStore(); - - const router = useRouter(); - const { workspaceSlug, projectId, cycleId } = router.query; + const { currentProjectDetails } = projectStore; const issues = cycleIssueStore?.getIssues; @@ -83,8 +85,6 @@ export const CycleKanBanLayout: React.FC = observer(() => { cycleIssueKanBanViewStore.handleKanBanToggle(toggle, value); }; - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -92,8 +92,8 @@ export const CycleKanBanLayout: React.FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx index e3e27dbf0..8360902ae 100644 --- a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx @@ -18,6 +18,9 @@ import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES } from "constants/issue"; export interface IModuleKanBanLayout {} export const ModuleKanBanLayout: React.FC = observer(() => { + const router = useRouter(); + const { workspaceSlug, moduleId } = router.query; + // store const { project: projectStore, moduleIssue: moduleIssueStore, @@ -25,9 +28,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { moduleIssueKanBanView: moduleIssueKanBanViewStore, issueDetail: issueDetailStore, } = useMobxStore(); - - const router = useRouter(); - const { workspaceSlug, projectId, moduleId } = router.query; + const { currentProjectDetails } = projectStore; const issues = moduleIssueStore?.getIssues; @@ -83,8 +84,6 @@ export const ModuleKanBanLayout: React.FC = observer(() => { moduleIssueKanBanViewStore.handleKanBanToggle(toggle, value); }; - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -92,8 +91,8 @@ export const ModuleKanBanLayout: React.FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-layouts/kanban/roots/project-root.tsx b/web/components/issues/issue-layouts/kanban/roots/project-root.tsx index 5527d3df4..927751249 100644 --- a/web/components/issues/issue-layouts/kanban/roots/project-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/project-root.tsx @@ -19,7 +19,7 @@ export interface IKanBanLayout {} export const KanBanLayout: React.FC = observer(() => { const router = useRouter(); - const { workspaceSlug, projectId } = router.query; + const { workspaceSlug } = router.query; const { project: projectStore, @@ -28,6 +28,7 @@ export const KanBanLayout: React.FC = observer(() => { issueKanBanView: issueKanBanViewStore, issueDetail: issueDetailStore, } = useMobxStore(); + const { currentProjectDetails } = projectStore; const issues = issueStore?.getIssues; @@ -74,8 +75,6 @@ export const KanBanLayout: React.FC = observer(() => { issueKanBanViewStore.handleKanBanToggle(toggle, value); }; - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -83,8 +82,8 @@ export const KanBanLayout: React.FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-layouts/list/roots/cycle-root.tsx b/web/components/issues/issue-layouts/list/roots/cycle-root.tsx index 771186c84..9a67b91c1 100644 --- a/web/components/issues/issue-layouts/list/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/cycle-root.tsx @@ -17,14 +17,15 @@ export interface ICycleListLayout {} export const CycleListLayout: React.FC = observer(() => { const router = useRouter(); - const { workspaceSlug, projectId, cycleId } = router.query; - + const { workspaceSlug, cycleId } = router.query; + // store const { project: projectStore, issueFilter: issueFilterStore, cycleIssue: cycleIssueStore, issueDetail: issueDetailStore, } = useMobxStore(); + const { currentProjectDetails } = projectStore; const issues = cycleIssueStore?.getIssues; @@ -54,8 +55,6 @@ export const CycleListLayout: React.FC = observer(() => { [cycleIssueStore, issueDetailStore, cycleId, workspaceSlug] ); - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -63,8 +62,8 @@ export const CycleListLayout: React.FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-layouts/list/roots/module-root.tsx b/web/components/issues/issue-layouts/list/roots/module-root.tsx index b32d303e1..fd748bc6c 100644 --- a/web/components/issues/issue-layouts/list/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/module-root.tsx @@ -17,7 +17,7 @@ export interface IModuleListLayout {} export const ModuleListLayout: React.FC = observer(() => { const router = useRouter(); - const { workspaceSlug, projectId, moduleId } = router.query; + const { workspaceSlug, moduleId } = router.query; const { project: projectStore, @@ -25,6 +25,7 @@ export const ModuleListLayout: React.FC = observer(() => { moduleIssue: moduleIssueStore, issueDetail: issueDetailStore, } = useMobxStore(); + const { currentProjectDetails } = projectStore; const issues = moduleIssueStore?.getIssues; @@ -54,8 +55,6 @@ export const ModuleListLayout: React.FC = observer(() => { [moduleIssueStore, issueDetailStore, moduleId, workspaceSlug] ); - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -63,8 +62,8 @@ export const ModuleListLayout: React.FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-layouts/list/roots/project-root.tsx b/web/components/issues/issue-layouts/list/roots/project-root.tsx index 47c1753c6..235ad2fd9 100644 --- a/web/components/issues/issue-layouts/list/roots/project-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/project-root.tsx @@ -15,14 +15,15 @@ import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES } from "constants/issue"; export const ListLayout: FC = observer(() => { const router = useRouter(); - const { workspaceSlug, projectId } = router.query; - + const { workspaceSlug } = router.query; + // store const { project: projectStore, issue: issueStore, issueDetail: issueDetailStore, issueFilter: issueFilterStore, } = useMobxStore(); + const { currentProjectDetails } = projectStore; const issues = issueStore?.getIssues; @@ -43,8 +44,6 @@ export const ListLayout: FC = observer(() => { [issueStore, issueDetailStore, workspaceSlug] ); - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : null; - const states = projectStore?.projectStates || null; const priorities = ISSUE_PRIORITIES || null; const labels = projectStore?.projectLabels || null; @@ -52,8 +51,8 @@ export const ListLayout: FC = observer(() => { const stateGroups = ISSUE_STATE_GROUPS || null; const projects = workspaceSlug ? projectStore?.projects[workspaceSlug.toString()] || null : null; const estimates = - projectDetails?.estimate !== null - ? projectStore.projectEstimates?.find((e) => e.id === projectDetails?.estimate) || null + currentProjectDetails?.estimate !== null + ? projectStore.projectEstimates?.find((e) => e.id === currentProjectDetails?.estimate) || null : null; return ( diff --git a/web/components/issues/issue-peek-overview/issue-detail.tsx b/web/components/issues/issue-peek-overview/issue-detail.tsx index 8218c53e8..2243c0497 100644 --- a/web/components/issues/issue-peek-overview/issue-detail.tsx +++ b/web/components/issues/issue-peek-overview/issue-detail.tsx @@ -31,7 +31,8 @@ export const PeekOverviewIssueDetails: FC = (props) = const { workspaceSlug, issue, issueReactions, user, issueUpdate, issueReactionCreate, issueReactionRemove } = props; // store const { user: userStore } = useMobxStore(); - const isAllowed = [5, 10].includes(userStore.projectMemberInfo?.role || 0); + const { currentProjectRole } = userStore; + const isAllowed = [5, 10].includes(currentProjectRole || 0); // states const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved"); const [characterLimit, setCharacterLimit] = useState(false); diff --git a/web/components/modules/gantt-chart/modules-list-layout.tsx b/web/components/modules/gantt-chart/modules-list-layout.tsx index 2a6d18834..b1da42fe1 100644 --- a/web/components/modules/gantt-chart/modules-list-layout.tsx +++ b/web/components/modules/gantt-chart/modules-list-layout.tsx @@ -9,12 +9,12 @@ import { ModuleGanttBlock, ModuleGanttSidebarBlock } from "components/modules"; import { IModule } from "types"; export const ModulesListGanttChartView: React.FC = observer(() => { + // router const router = useRouter(); - const { workspaceSlug, projectId } = router.query; - + const { workspaceSlug } = router.query; + // store const { project: projectStore, module: moduleStore } = useMobxStore(); - - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : undefined; + const { currentProjectDetails } = projectStore; const modules = moduleStore.projectModules; const handleModuleUpdate = (module: IModule, payload: IBlockUpdateData) => { @@ -36,7 +36,7 @@ export const ModulesListGanttChartView: React.FC = observer(() => { })) : []; - const isAllowed = projectDetails?.member_role === 20 || projectDetails?.member_role === 15; + const isAllowed = currentProjectDetails?.member_role === 20 || currentProjectDetails?.member_role === 15; return (
diff --git a/web/components/project/member-list-item.tsx b/web/components/project/member-list-item.tsx index 8454b6a10..b8a002f13 100644 --- a/web/components/project/member-list-item.tsx +++ b/web/components/project/member-list-item.tsx @@ -26,32 +26,28 @@ type Props = { export const ProjectMemberListItem: React.FC = observer((props) => { const { member } = props; - // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; - // states const [selectedRemoveMember, setSelectedRemoveMember] = useState(null); const [selectedInviteRemoveMember, setSelectedInviteRemoveMember] = useState(null); - // store const { user: userStore, project: projectStore } = useMobxStore(); - + // hooks const { setToastAlert } = useToast(); - + // fetching project members useSWR( workspaceSlug && projectId ? `PROJECT_MEMBERS_${projectId.toString().toUpperCase()}` : null, workspaceSlug && projectId ? () => projectStore.fetchProjectMembers(workspaceSlug.toString(), projectId.toString()) : null ); - // derived values const user = userStore.currentUser; - const memberDetails = userStore.projectMemberInfo; - const isAdmin = memberDetails?.role === 20; - const isOwner = memberDetails?.role === 20; + const { currentProjectRole } = userStore; + const isAdmin = currentProjectRole === 20; + const isOwner = currentProjectRole === 20; const projectMembers = projectStore.members?.[projectId?.toString()!]; const currentUser = projectMembers?.find((item) => item.member.id === user?.id); diff --git a/web/components/project/project-settings-member-defaults.tsx b/web/components/project/project-settings-member-defaults.tsx index 8dc539683..a8d8fc0c8 100644 --- a/web/components/project/project-settings-member-defaults.tsx +++ b/web/components/project/project-settings-member-defaults.tsx @@ -25,20 +25,16 @@ export const ProjectSettingsMemberDefaults: React.FC = observer(() => { // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; - // store const { user: userStore, project: projectStore } = useMobxStore(); - + const { currentProjectDetails } = projectStore; + const { currentProjectRole } = userStore; + const isAdmin = currentProjectRole === 20; // hooks const { setToastAlert } = useToast(); - - // derived values - const memberDetails = userStore.projectMemberInfo; - const isAdmin = memberDetails?.role === 20; - const projectDetails = projectStore.project_details[projectId?.toString()!]; - + // form info const { reset, control } = useForm({ defaultValues }); - + // fetching user members useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId.toString()) : null, workspaceSlug && projectId @@ -47,23 +43,23 @@ export const ProjectSettingsMemberDefaults: React.FC = observer(() => { ); useEffect(() => { - if (!projectDetails) return; + if (!currentProjectDetails) return; reset({ - ...projectDetails, - default_assignee: projectDetails.default_assignee?.id ?? projectDetails.default_assignee, - project_lead: (projectDetails.project_lead as IUserLite)?.id ?? projectDetails.project_lead, - workspace: (projectDetails.workspace as IWorkspace).id, + ...currentProjectDetails, + default_assignee: currentProjectDetails.default_assignee?.id ?? currentProjectDetails.default_assignee, + project_lead: (currentProjectDetails.project_lead as IUserLite)?.id ?? currentProjectDetails.project_lead, + workspace: (currentProjectDetails.workspace as IWorkspace).id, }); - }, [projectDetails, reset]); + }, [currentProjectDetails, reset]); const submitChanges = async (formData: Partial) => { if (!workspaceSlug || !projectId) return; reset({ - ...projectDetails, - default_assignee: projectDetails.default_assignee?.id ?? projectDetails.default_assignee, - project_lead: (projectDetails.project_lead as IUserLite)?.id ?? projectDetails.project_lead, + ...currentProjectDetails, + default_assignee: currentProjectDetails?.default_assignee?.id ?? currentProjectDetails?.default_assignee, + project_lead: (currentProjectDetails?.project_lead as IUserLite)?.id ?? currentProjectDetails?.project_lead, ...formData, }); @@ -96,7 +92,7 @@ export const ProjectSettingsMemberDefaults: React.FC = observer(() => {

Project Lead

- {projectDetails ? ( + {currentProjectDetails ? ( {

Default Assignee

- {projectDetails ? ( + {currentProjectDetails ? ( , - property: "cycle_view", }, { @@ -67,32 +67,30 @@ const getEventType = (feature: string, toggle: boolean): MiscellaneousEventType // services const trackEventService = new TrackEventService(); -export const ProjectFeaturesList: React.FC = observer((props) => { - const {} = props; - +export const ProjectFeaturesList: FC = observer(() => { + // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; - + // store const { project: projectStore, user: userStore } = useMobxStore(); - - const projectDetails = projectId ? projectStore.project_details[projectId.toString()] : undefined; - const user = userStore.currentUser ?? undefined; - const isAdmin = userStore.projectMemberInfo?.role === 20; - + const { currentUser, currentProjectRole } = userStore; + const { currentProjectDetails } = projectStore; + const isAdmin = currentProjectRole === 20; + // hooks const { setToastAlert } = useToast(); const handleSubmit = async (formData: Partial) => { - if (!workspaceSlug || !projectId || !projectDetails) return; - + if (!workspaceSlug || !projectId || !currentProjectDetails) return; setToastAlert({ type: "success", title: "Success!", message: "Project feature updated successfully.", }); - projectStore.updateProject(workspaceSlug.toString(), projectId.toString(), formData); }; + if (!currentUser) return <>; + return (
{PROJECT_FEATURES_LIST.map((feature) => ( @@ -108,21 +106,21 @@ export const ProjectFeaturesList: React.FC = observer((props) => {
{ trackEventService.trackMiscellaneousEvent( { - workspaceId: (projectDetails?.workspace as any)?.id, + workspaceId: (currentProjectDetails?.workspace as any)?.id, workspaceSlug, projectId, - projectIdentifier: projectDetails?.identifier, - projectName: projectDetails?.name, + projectIdentifier: currentProjectDetails?.identifier, + projectName: currentProjectDetails?.name, }, - getEventType(feature.title, !projectDetails?.[feature.property as keyof IProject]), - user + getEventType(feature.title, !currentProjectDetails?.[feature.property as keyof IProject]), + currentUser ); handleSubmit({ - [feature.property]: !projectDetails?.[feature.property as keyof IProject], + [feature.property]: !currentProjectDetails?.[feature.property as keyof IProject], }); }} disabled={!isAdmin} diff --git a/web/components/states/project-setting-state-list.tsx b/web/components/states/project-setting-state-list.tsx index d8405f675..37205f4f9 100644 --- a/web/components/states/project-setting-state-list.tsx +++ b/web/components/states/project-setting-state-list.tsx @@ -1,9 +1,6 @@ import React, { useState } from "react"; - import { useRouter } from "next/router"; - import useSWR from "swr"; - // store import { observer } from "mobx-react-lite"; import { useMobxStore } from "lib/mobx/store-provider"; @@ -22,10 +19,9 @@ export const ProjectSettingStateList: React.FC = observer(() => { // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; - // store const { project: projectStore } = useMobxStore(); - + const { currentProjectDetails } = projectStore; // state const [activeGroup, setActiveGroup] = useState(null); const [selectedState, setSelectedState] = useState(null); @@ -47,7 +43,6 @@ export const ProjectSettingStateList: React.FC = observer(() => { // derived values const states = projectStore.projectStatesByGroups; - const projectDetails = projectStore.project_details[projectId?.toString()!] ?? null; const orderedStateGroups = orderStateGroups(states!); const statesList = getStatesList(orderedStateGroups); @@ -60,7 +55,7 @@ export const ProjectSettingStateList: React.FC = observer(() => { />
- {states && projectDetails && orderedStateGroups ? ( + {states && currentProjectDetails && orderedStateGroups ? ( Object.keys(orderedStateGroups || {}).map((key) => { if (orderedStateGroups[key].length !== 0) return ( diff --git a/web/components/workspace/settings/members-list-item.tsx b/web/components/workspace/settings/members-list-item.tsx index df2defd5b..46a242578 100644 --- a/web/components/workspace/settings/members-list-item.tsx +++ b/web/components/workspace/settings/members-list-item.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useState, FC } from "react"; import Link from "next/link"; import { useRouter } from "next/router"; // mobx store @@ -35,20 +35,19 @@ type Props = { // services const workspaceService = new WorkspaceService(); -export const WorkspaceMembersListItem: React.FC = (props) => { +export const WorkspaceMembersListItem: FC = (props) => { const { member } = props; - - const [removeMemberModal, setRemoveMemberModal] = useState(false); - + // router const router = useRouter(); const { workspaceSlug } = router.query; - - const { setToastAlert } = useToast(); - + // store const { workspace: workspaceStore, user: userStore } = useMobxStore(); - - const user = userStore.workspaceMemberInfo; - const isAdmin = userStore.workspaceMemberInfo?.role === 20; + const { currentWorkspaceMemberInfo, currentWorkspaceRole } = userStore; + const isAdmin = currentWorkspaceRole === 20; + // states + const [removeMemberModal, setRemoveMemberModal] = useState(false); + // hooks + const { setToastAlert } = useToast(); const handleRemoveMember = async () => { if (!workspaceSlug) return; @@ -83,7 +82,7 @@ export const WorkspaceMembersListItem: React.FC = (props) => { }); }; - if (!user) return null; + if (!currentWorkspaceMemberInfo) return null; return ( <> @@ -141,12 +140,12 @@ export const WorkspaceMembersListItem: React.FC = (props) => {
{ROLE[member.role as keyof typeof ROLE]} - {member.memberId !== user.member && ( + {member.memberId !== currentWorkspaceMemberInfo.member && ( @@ -155,7 +154,7 @@ export const WorkspaceMembersListItem: React.FC = (props) => { } value={member.role} onChange={(value: 5 | 10 | 15 | 20 | undefined) => { - if (!workspaceSlug) return; + if (!workspaceSlug || !value) return; workspaceStore .updateMember(workspaceSlug.toString(), member.id, { @@ -170,12 +169,15 @@ export const WorkspaceMembersListItem: React.FC = (props) => { }); }} disabled={ - member.memberId === user.member || !member.status || (user.role !== 20 && user.role < member.role) + member.memberId === currentWorkspaceMemberInfo.member || + !member.status || + Boolean(currentWorkspaceRole && currentWorkspaceRole !== 20 && currentWorkspaceRole < member.role) } placement="bottom-end" > {Object.keys(ROLE).map((key) => { - if (user.role !== 20 && user.role < parseInt(key)) return null; + if (currentWorkspaceRole && currentWorkspaceRole !== 20 && currentWorkspaceRole < parseInt(key)) + return null; return ( @@ -185,7 +187,11 @@ export const WorkspaceMembersListItem: React.FC = (props) => { })} {isAdmin && ( - +