From b7ebc195d6a666855cebc8232bd215f789da8e1e Mon Sep 17 00:00:00 2001 From: shreeyash07 Date: Wed, 31 Jul 2024 11:56:58 +0545 Subject: [PATCH] Add graphql mutation for patch framework in project --- .../UserTable/AddUserModal/index.tsx | 2 +- .../AnalyticalFramework/UserTable/index.tsx | 2 +- .../Framework/FrameworkDetail/index.tsx | 101 +++++++++++++----- 3 files changed, 75 insertions(+), 30 deletions(-) diff --git a/app/views/AnalyticalFramework/UserTable/AddUserModal/index.tsx b/app/views/AnalyticalFramework/UserTable/AddUserModal/index.tsx index 66fd778525..bb66c873d4 100644 --- a/app/views/AnalyticalFramework/UserTable/AddUserModal/index.tsx +++ b/app/views/AnalyticalFramework/UserTable/AddUserModal/index.tsx @@ -45,7 +45,7 @@ type FormSchemaFields = ReturnType const schema: FormSchema = { fields: (value): FormSchemaFields => { - if (isDefined(value?.frameworkId)) { + if (isDefined(value?.id)) { return ({ member: [], role: [requiredCondition], diff --git a/app/views/AnalyticalFramework/UserTable/index.tsx b/app/views/AnalyticalFramework/UserTable/index.tsx index 4dead1309f..cde7d31535 100644 --- a/app/views/AnalyticalFramework/UserTable/index.tsx +++ b/app/views/AnalyticalFramework/UserTable/index.tsx @@ -217,7 +217,7 @@ function UserTable(props: Props) { itemKey: userId, onEditClick: handleUserEditClick, onDeleteClick: handleUserDeleteClick, - disabled: data.id === activeUserId, + disabled: data.member.id === activeUserId, editButtonTitle: _ts('analyticalFramework', 'editUserLabel'), deleteButtonTitle: _ts('analyticalFramework', 'deleteUserLabel'), deleteConfirmationMessage: _ts('analyticalFramework', 'removeUserConfirmation'), diff --git a/app/views/ProjectEdit/Framework/FrameworkDetail/index.tsx b/app/views/ProjectEdit/Framework/FrameworkDetail/index.tsx index 7f557ac187..7123c0a52e 100644 --- a/app/views/ProjectEdit/Framework/FrameworkDetail/index.tsx +++ b/app/views/ProjectEdit/Framework/FrameworkDetail/index.tsx @@ -5,7 +5,7 @@ import { isDefined, } from '@togglecorp/fujs'; import { generatePath } from 'react-router-dom'; -import { gql, useQuery } from '@apollo/client'; +import { gql, useMutation, useQuery } from '@apollo/client'; import { IoCopyOutline, IoCheckmark, @@ -35,6 +35,7 @@ import { TextOutput, RawButton, Button, + useAlert, } from '@the-deep/deep-ui'; import { removeNull } from '@togglecorp/toggle-form'; @@ -44,14 +45,14 @@ import { DeepReplace, } from '#utils/types'; import FrameworkImageButton from '#components/framework/FrameworkImageButton'; -import { useLazyRequest } from '#base/utils/restRequest'; import { ProjectContext } from '#base/context/ProjectContext'; import { useModalState } from '#hooks/stateManagement'; import routes from '#base/configs/routes'; import Section from '#components/entry/Section'; import _ts from '#ts'; -import { ProjectDetails } from '#types'; import { + AnalyticalFrameworkPatchMutation, + AnalyticalFrameworkPatchMutationVariables, FrameworkDetailsQuery, FrameworkDetailsQueryVariables, WidgetType as WidgetRaw, @@ -66,6 +67,25 @@ function noop() {} const emptyObject = {}; +const ANALYTICAL_FRAMEWORK_PATCH = gql` + mutation AnalyticalFrameworkPatch( + $projectId: ID!, + $frameworkId: ID, + ) { + project(id: $projectId) { + projectUpdate(data: {analysisFramework: $frameworkId}) { + ok + errors + result { + analysisFramework { + id + } + } + } + } + } +`; + const FRAMEWORK_DETAILS = gql` ${FRAMEWORK_FRAGMENT} query FrameworkDetails( @@ -155,6 +175,7 @@ function FrameworkDetail(props: Props) { const { setProject } = useContext(ProjectContext); const [activeTab, setActiveTab] = useState<'primary' | 'secondary' | undefined>('primary'); + const alert = useAlert(); const [selectedSection, setSelectedSection] = useState(); const variables = useMemo( @@ -236,31 +257,50 @@ function FrameworkDetail(props: Props) { frameworkDetailsResponse?.projects, ]); - const { - pending: projectPatchPending, - trigger: projectPatch, - } = useLazyRequest({ - url: `server://projects/${projectId}/`, - method: 'PATCH', - body: ({ - analysisFramework: frameworkId, - }), - onSuccess: (response) => { - setProject((oldProjectDetails) => { - const { analysisFramework } = response; - if (!oldProjectDetails || isNotDefined(analysisFramework)) { - return oldProjectDetails; + const [ + projectPatch, + { + loading: projectPatchPending, + }, + ] = useMutation( + ANALYTICAL_FRAMEWORK_PATCH, + { + onCompleted: (response) => { + if (!response || !response.project?.projectUpdate) { + return; } - return ({ - ...oldProjectDetails, - analysisFramework: { - id: String(analysisFramework), - }, - }); - }); + const { + ok, + errors, + result, + } = response.project.projectUpdate; + + const analysisFrameworkId = result?.analysisFramework?.id; + + if (errors) { + alert.show( + 'Failed to create assessment registry.', + { variant: 'error' }, + ); + } else if (ok) { + if (!analysisFrameworkId) { + return; + } + setProject((oldProjectDetails) => { + if (!oldProjectDetails) { + return oldProjectDetails; + } + return ({ + ...oldProjectDetails, + analysisFramework: { + id: analysisFrameworkId, + }, + }); + }); + } + }, }, - failureMessage: _ts('projectEdit', 'projectDetailsLabel'), - }); + ); const itemRendererParams = useCallback((_: string, data: { title: string; id: string }) => ({ className: styles.projectTitle, @@ -275,8 +315,13 @@ function FrameworkDetail(props: Props) { ] = useModalState(false); const handleUseFrameworkClick = useCallback(() => { - projectPatch(null); - }, [projectPatch]); + projectPatch({ + variables: { + projectId, + frameworkId, + }, + }); + }, [projectPatch, projectId, frameworkId]); const handleNewFrameworkAddSuccess = useCallback((newFrameworkId: string) => { onFrameworkCreate(newFrameworkId);