diff --git a/src/components/Form/index.tsx b/src/components/Form/index.tsx new file mode 100644 index 0000000..3a1aca0 --- /dev/null +++ b/src/components/Form/index.tsx @@ -0,0 +1,56 @@ +import Button from '@mui/material/Button'; +import TextField from '@mui/material/TextField'; +import Dialog from '@mui/material/Dialog'; +import DialogActions from '@mui/material/DialogActions'; +import DialogContent from '@mui/material/DialogContent'; +import DialogContentText from '@mui/material/DialogContentText'; +import DialogTitle from '@mui/material/DialogTitle'; +import { useEffect, useState } from 'react'; + +export default function FormDialog({ openForm, onSubmit }) { + const [open, setOpen] = useState(false) + const [descriptionReview, setDescriptionReview] = useState() + + + const handleConfirmation = (event: { target: { value: any; }; }) => { + let description = event.target.value; + setDescriptionReview(description); + } + + const handleClose = () => { + setOpen(false); + }; + + const handleSubmit = () => { + onSubmit(descriptionReview); + handleClose(); + }; + + useEffect(() => { + setOpen(openForm) + }, []) + + return ( + + Review Description + + + Add your Task Description + + (handleConfirmation(event))} + /> + + + + + + + ); +} diff --git a/src/components/Task/CardTask.tsx b/src/components/Task/CardTask.tsx index b2a3cc4..e127e20 100644 --- a/src/components/Task/CardTask.tsx +++ b/src/components/Task/CardTask.tsx @@ -11,7 +11,7 @@ import Close from '@mui/icons-material/Close'; import Check from '@mui/icons-material/Check'; import { useSnackBar } from 'src/contexts/SnackBarContext'; import { ethers } from 'ethers'; -import { set } from 'date-fns'; +import FormDialog from '../Form'; /** * CardTasks Component @@ -26,7 +26,7 @@ import { set } from 'date-fns'; */ -export const CardTask = ({ taskId, taskData, loading }: any) => { +export const CardTask = ({ taskId, taskData, loading, setNewReview }: any) => { const { startTask, reviewTask, completeTask, cancelTask, hasMemberRole, hasLeaderRole, hasVoted, getMinQuorum, getQuorumApprovals } = useTaskService(); const [openError, setOpenError] = useState(false); const [error, setError] = useState(); @@ -35,6 +35,21 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { const [approvals, setApprovals] = useState(); const [isMember, setIsMember] = useState(false); const [isLeader, setIsLeader] = useState(false); + const [openForm, setOpenForm] = useState(false); + + const handleOpenForm = async () => { + setOpenForm(true); + }; + + const handleFormSubmit = async (metadata: any) => { + console.log('metadata ', metadata); + setOpenForm(false); + console.log('taskId HANDLEFORMSUBMIT - CARDTASK', taskId); + console.log('dataForm HANDLEFORMSUBMIT - CARDTASK', metadata) + await reviewTask(BigInt(taskId), metadata).then(result => { setNewReview(true), handleSnackbar('Review Task process initiated with success!', 'info'), console.log('result', result) }); + + } + const theme = useTheme(); const isSmallScreen = useMediaQuery(theme.breakpoints.down('sm')); @@ -68,12 +83,13 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { handleSnackbar('Task Start process initiated with success!', 'info') break; case "Progress": - await reviewTask(BigInt(taskId), "Hello, I already finished"); - handleSnackbar('Review Task process initiated with success!', 'info') + handleOpenForm(); + + break; case "Review": - await reviewTask(BigInt(taskId), "Awesome, contact me on Discord!"); - handleSnackbar('Review Task process initiated with success!', 'info') + handleOpenForm(); + break; default: break; @@ -114,7 +130,7 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { } catch (error) { setError(error.message) setOpenError(true); - } + } } useEffect(() => { @@ -177,7 +193,6 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { variant="body2" style={{ textAlign: isSmallScreen ? 'left' : 'center', - // marginLeft: isSmallScreen ? 'auto' : 'unset', backgroundColor: '#000000', }} > @@ -196,42 +211,42 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { {taskData.title} - - { - isLeader && taskData.status != "Canceled" && - - - {approvals} - - - } - - { - isLeader && taskData.status != "Canceled" && - - - - - - } - - { - isLeader && taskData.status != "Canceled" && - - - + + { + isLeader && taskData.status != "Canceled" && + + + {approvals} + + + } + + { + isLeader && taskData.status != "Canceled" && + + + + + + } + + { + isLeader && taskData.status != "Canceled" && + + + + + + } + + + + - } - - - - - - @@ -255,14 +270,19 @@ export const CardTask = ({ taskId, taskData, loading }: any) => { { taskData.status != "Completed" && taskData.status != "Canceled" && - + + {openForm && } + + - variant="contained" - component="span" - onClick={handleAction} - > - {action} - }