Remove payments button for client in project page

This commit is contained in:
Hazem Krimi
2023-05-24 13:44:17 +01:00
parent 032137e004
commit 3792581758
+68 -107
View File
@@ -11,7 +11,6 @@ import {
Empty, Empty,
FullBuild, FullBuild,
MVP, MVP,
Payment,
Settings, Settings,
Specification, Specification,
} from '../../assets'; } from '../../assets';
@@ -86,38 +85,41 @@ const Project = () => {
const [fullBuildModal, setFullBuildModal] = useState<boolean>(false); const [fullBuildModal, setFullBuildModal] = useState<boolean>(false);
const [transactionsData, setTransactionsData] = useState<TransactionData>(); const [transactionsData, setTransactionsData] = useState<TransactionData>();
const [getProjectsByClientId, { loading: clientProjectsLoading, error: clientProjectsError }] = const [
useLazyQuery< getProjectsByClientId,
GetAllProjectsByClientIdQuery, { loading: clientProjectsLoading, error: clientProjectsError },
GetAllProjectsByClientIdQueryVariables ] = useLazyQuery<
>(GET_ALL_PROJECTS_BY_CLIENT_ID, { GetAllProjectsByClientIdQuery,
variables: { GetAllProjectsByClientIdQueryVariables
id: currentUser?.id!, >(GET_ALL_PROJECTS_BY_CLIENT_ID, {
}, variables: {
onCompleted({ getAllProjectsByClientId }) { id: currentUser?.id!,
if (getAllProjectsByClientId.length > 0) },
onCompleted({ getAllProjectsByClientId }) {
if (getAllProjectsByClientId.length > 0)
setProject(getAllProjectsByClientId[0]); setProject(getAllProjectsByClientId[0]);
}, },
});
const [getProjects, { loading: projectsLoading, error: projectsError }] = useLazyQuery<
GetAllProjectsQuery,
GetAllUsersQueryVariables
>(GET_ALL_PROJECTS, {
onCompleted({ getAllProjects }) {
if (getAllProjects.length > 0)
setProject(getAllProjects[0]);
}
}); });
const [getProject, { loading: projectLoading, error: projectError }] = useLazyQuery< const [getProjects, { loading: projectsLoading, error: projectsError }] =
GetProjectByIdQuery, useLazyQuery<GetAllProjectsQuery, GetAllUsersQueryVariables>(
GetProjectByIdQueryVariables GET_ALL_PROJECTS,
>(GET_PROJECT_BY_ID, { {
onCompleted({ getProjectById }) { onCompleted({ getAllProjects }) {
setProject(getProjectById); if (getAllProjects.length > 0) setProject(getAllProjects[0]);
} },
}); }
);
const [getProject, { loading: projectLoading, error: projectError }] =
useLazyQuery<GetProjectByIdQuery, GetProjectByIdQueryVariables>(
GET_PROJECT_BY_ID,
{
onCompleted({ getProjectById }) {
setProject(getProjectById);
},
}
);
const [changeProjectState] = useMutation< const [changeProjectState] = useMutation<
ChangeProjectStateMutation, ChangeProjectStateMutation,
@@ -277,29 +279,27 @@ const Project = () => {
}, },
}); });
if (role === 'admin') return ( if (role === 'admin') return <Navigate to='/clients' />;
<Navigate to='/clients' />
);
if (clientProjectsLoading || projectsLoading || projectLoading) return ( if (clientProjectsLoading || projectsLoading || projectLoading)
<Spinner fullScreen color={role || 'client'} /> return <Spinner fullScreen color={role || 'client'} />;
);
if (clientProjectsError || projectsError || projectError || !project) return ( if (clientProjectsError || projectsError || projectError || !project)
<Wrapper color={role}> return (
<Box <Wrapper color={role}>
width='100%' <Box
height='100vh' width='100%'
display='grid' height='100vh'
alignItems='center' display='grid'
justifyContent='center' alignItems='center'
> justifyContent='center'
<Box> >
<Empty /> <Box>
<Empty />
</Box>
</Box> </Box>
</Box> </Wrapper>
</Wrapper> );
);
return ( return (
<> <>
@@ -316,9 +316,7 @@ const Project = () => {
label='File' label='File'
file file
color={role || 'client'} color={role || 'client'}
onChange={async ( onChange={async (event: React.ChangeEvent<HTMLInputElement>) => {
event: React.ChangeEvent<HTMLInputElement>
) => {
const formData = new FormData(); const formData = new FormData();
if (event.target.files && event.target.files[0]) { if (event.target.files && event.target.files[0]) {
@@ -364,9 +362,7 @@ const Project = () => {
label='File' label='File'
file file
color={role || 'client'} color={role || 'client'}
onChange={async ( onChange={async (event: React.ChangeEvent<HTMLInputElement>) => {
event: React.ChangeEvent<HTMLInputElement>
) => {
const formData = new FormData(); const formData = new FormData();
if (event.target.files && event.target.files[0]) { if (event.target.files && event.target.files[0]) {
@@ -392,8 +388,7 @@ const Project = () => {
}} }}
error={ error={
addMvpForm.touched.fileName && addMvpForm.touched.fileName &&
(!!addMvpForm.errors.fileName || (!!addMvpForm.errors.fileName || !!addMvpForm.errors.fileSource)
!!addMvpForm.errors.fileSource)
} }
errorMessage={addMvpForm.errors.fileName} errorMessage={addMvpForm.errors.fileName}
/> />
@@ -458,18 +453,6 @@ const Project = () => {
} }
/> />
</Box> </Box>
{role === 'client' && (
<Box marginRight='20px'>
<Button
color={role || 'client'}
variant='primary-action'
text='Payments'
iconLeft={<Payment />}
disabled={transactionsData?.status}
onClick={() => navigate(`/payments/${project.id}`)}
/>
</Box>
)}
{role === 'client' && ( {role === 'client' && (
<Box> <Box>
<Button <Button
@@ -484,8 +467,7 @@ const Project = () => {
</> </>
) : ( ) : (
<> <>
{project.state === 'OnReview' && {project.state === 'OnReview' && role === 'productOwner' ? (
role === 'productOwner' ? (
<> <>
<Box marginRight='20px'> <Box marginRight='20px'>
<Button <Button
@@ -540,11 +522,7 @@ const Project = () => {
)} )}
</Box> </Box>
{project.template.features && ( {project.template.features && (
<Box <Box display='flex' flexDirection='column' marginBottom='30px'>
display='flex'
flexDirection='column'
marginBottom='30px'
>
<Box marginBottom='10px'> <Box marginBottom='10px'>
<Text variant='headline' gutterBottom> <Text variant='headline' gutterBottom>
Features Features
@@ -590,11 +568,7 @@ const Project = () => {
justifyContent='space-between' justifyContent='space-between'
marginBottom='10px' marginBottom='10px'
> >
<Box <Box display='flex' flexDirection='row' alignItems='center'>
display='flex'
flexDirection='row'
alignItems='center'
>
<Box marginRight='10px'> <Box marginRight='10px'>
<Specification /> <Specification />
</Box> </Box>
@@ -627,11 +601,7 @@ const Project = () => {
justifyContent='space-between' justifyContent='space-between'
marginBottom='10px' marginBottom='10px'
> >
<Box <Box display='flex' flexDirection='row' alignItems='center'>
display='flex'
flexDirection='row'
alignItems='center'
>
<Box marginRight='10px'> <Box marginRight='10px'>
<Design /> <Design />
</Box> </Box>
@@ -703,11 +673,7 @@ const Project = () => {
justifyContent='space-between' justifyContent='space-between'
marginBottom='10px' marginBottom='10px'
> >
<Box <Box display='flex' flexDirection='row' alignItems='center'>
display='flex'
flexDirection='row'
alignItems='center'
>
<Box marginRight='10px'> <Box marginRight='10px'>
<MVP /> <MVP />
</Box> </Box>
@@ -784,11 +750,7 @@ const Project = () => {
justifyContent='space-between' justifyContent='space-between'
marginBottom='10px' marginBottom='10px'
> >
<Box <Box display='flex' flexDirection='row' alignItems='center'>
display='flex'
flexDirection='row'
alignItems='center'
>
<Box marginRight='10px'> <Box marginRight='10px'>
<FullBuild /> <FullBuild />
</Box> </Box>
@@ -861,16 +823,15 @@ const Project = () => {
</Box> </Box>
</Box> </Box>
)} )}
{project.template.specification && {project.template.specification && project.template.features && (
project.template.features && ( <Box display='none'>
<Box display='none'> <SpecificationPrint
<SpecificationPrint ref={printRef}
ref={printRef} specification={project.template.specification}
specification={project.template.specification} features={project.template.features}
features={project.template.features} />
/> </Box>
</Box> )}
)}
</Box> </Box>
</Wrapper> </Wrapper>
</> </>