update comment changes

This commit is contained in:
YasinShaikh123
2024-11-25 16:41:19 +05:30
parent 5900f637be
commit 0c21e99732
17 changed files with 193 additions and 93 deletions

View File

@@ -152,7 +152,7 @@ const IOArtifactsAdd = ({ isOpen, onClose, firstField, actionId, setActionId, da
<DrawerBody>
<Stack spacing={4}>
<FormControl isInvalid={errors.artifactName}>
<FormControl isInvalid={errors.artifactName} isRequired>
<FormLabel fontSize={"sm"}>Artifact Name</FormLabel>
<Controller
name="artifactName"
@@ -166,7 +166,7 @@ const IOArtifactsAdd = ({ isOpen, onClose, firstField, actionId, setActionId, da
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={errors.artifactStreamingURL}>
<FormControl isInvalid={errors.artifactStreamingURL} isRequired>
<FormLabel fontSize={"sm"}>Artifact Streaming URL</FormLabel>
<Controller
name="artifactStreamingURL"

View File

@@ -25,9 +25,9 @@ import ToastBox from "../../../../Components/ToastBox";
import { useApproveIOCaseMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -124,8 +124,8 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -134,14 +134,14 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered </Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -2,6 +2,7 @@ import {
Box,
Button,
FormControl,
FormHelperText,
FormLabel,
Input,
Modal,
@@ -24,7 +25,8 @@ import ToastBox from "../../../../Components/ToastBox";
import { useRejectIOCaseMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
comments: yup.string().required("Comment is required"),
comments: yup.string().required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
});
const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
@@ -35,6 +37,7 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
const {
register,
reset,
watch,
handleSubmit,
formState: { errors },
} = useForm({
@@ -125,12 +128,17 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
placeholder={"Enter your comments...."}
rounded={"md"}
resize={"none"}
maxLength={200}
/>
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered </Box>
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>
<ModalFooter>

View File

@@ -25,9 +25,9 @@ import ToastBox from "../../../../Components/ToastBox";
import { useApproveIOCaseMutation, useApproveIONavMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -124,8 +124,8 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -134,14 +134,14 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -2,6 +2,7 @@ import {
Box,
Button,
FormControl,
FormHelperText,
FormLabel,
Input,
Modal,
@@ -24,7 +25,8 @@ import ToastBox from "../../../../Components/ToastBox";
import { useRejectIOCaseMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
comments: yup.string().required("Comment is required"),
comments: yup.string().required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
});
const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
@@ -35,6 +37,7 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
const {
register,
reset,
watch,
handleSubmit,
formState: { errors },
} = useForm({
@@ -125,12 +128,17 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
placeholder={"Enter your comments...."}
rounded={"md"}
resize={"none"}
maxLength={200}
/>
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered </Box>
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>
<ModalFooter>

View File

@@ -25,9 +25,9 @@ import {
import { useApproveDistributedMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -126,8 +126,8 @@ import {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -136,14 +136,14 @@ import {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}> Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -25,9 +25,9 @@ import {
import { useApproveInvestedMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -124,8 +124,8 @@ import {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -134,14 +134,14 @@ import {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -108,8 +108,8 @@ import {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -118,14 +118,14 @@ import {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -24,7 +24,7 @@ import {
import { useApproveExitTransactionMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -122,8 +122,8 @@ import {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -132,14 +132,14 @@ import {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -25,9 +25,9 @@ import ToastBox from "../../../../Components/ToastBox";
import { useApproveDistributionMutation, useApproveIOCaseMutation, useApproveIONavMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -123,8 +123,8 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -133,14 +133,14 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -25,9 +25,9 @@ import {
import { useApproveDistributionMutation, useApproveExitMutation, useApproveIOCaseMutation, useApproveIONavMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
// checkerComment: yup.string().required("Comment is required")
// comments: yup.string().required("Comment is required")
// .max(50, "Investment name cannot be more than 50 characters"),
checkerComment: yup
comments: yup
.string()
.required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
@@ -123,8 +123,8 @@ import {
<Textarea
rows={6}
focusBorderColor="green.400"
name="checkerComment"
{...register("checkerComment")}
name="comments"
{...register("comments")}
fontSize="sm"
type="textarea"
size="md"
@@ -133,14 +133,14 @@ import {
resize={"none"}
maxLength={200}
/>
{errors.checkerComment && (
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.checkerComment.message}
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("checkerComment")?.length || 0} characters.
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>

View File

@@ -2,6 +2,7 @@ import {
Box,
Button,
FormControl,
FormHelperText,
FormLabel,
Input,
Modal,
@@ -24,7 +25,8 @@ import ToastBox from "../../../../Components/ToastBox";
import { useRejectIOCaseMutation } from "../../../../Services/io.service";
export const conformModalSchema = yup.object().shape({
comments: yup.string().required("Comment is required"),
comments: yup.string().required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
});
const RequestRejectModal = ({ isOpen, onClose, firstField ,id, onBigModalClose}) => {
@@ -35,6 +37,7 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id, onBigModalClose})
const {
register,
reset,
watch,
handleSubmit,
formState: { errors },
} = useForm({
@@ -136,6 +139,10 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id, onBigModalClose})
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Box as="span" me={1}>Maximum length should be 200 characters. You have entered</Box>
{watch("comments")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>
<ModalFooter>

View File

@@ -508,7 +508,7 @@ console.log(IODetails?.investors);
>
Export xls
</Button>
<Box as="span">
{/* <Box as="span">
<Icon
ms={0}
animation={
@@ -524,7 +524,7 @@ console.log(IODetails?.investors);
_hover={{ bg: "gray.100" }}
cursor={"pointer"}
/>
</Box>
</Box> */}
</Box>
<HStack

View File

@@ -1,7 +1,10 @@
import {
Box,
Button,
Icon,
Input,
keyframes,
Stack,
Tab,
TabList,
TabPanel,
@@ -16,7 +19,7 @@ import { useContext, useEffect, useState } from "react";
import FormInputView from "../../../Components/FormInputView";
import { useForm } from "react-hook-form"; // assuming react-hook-form is used
import { OPACITY_ON_LOAD } from "../../../Layout/animations";
import { ArrowBackIcon } from "@chakra-ui/icons";
import { ArrowBackIcon, RepeatIcon } from "@chakra-ui/icons";
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
import ViewIOdataHeader from "./ViewIOdataHeader";
import ViewIOdetails from "./ViewIOdetails";
@@ -42,20 +45,30 @@ import IONAVDetails from "../CreateIO/IONAVDetails/IONAVDetails";
import IOTransaction from "../CreateIO/IOTransaction/IOTransaction";
import { GoDotFill } from "react-icons/go";
const rotate = keyframes`
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
`;
const ViewIOdata = () => {
const params = useParams();
const id = params?.id;
const { data, error, isLoading } = useGetIOprepopulateDataQuery();
const { data, error, isLoading, refetch } = useGetIOprepopulateDataQuery();
const { isOpen, onOpen, onClose } = useDisclosure();
const navigate = useNavigate();
const [isEditing, setIsEditing] = useState(false);
const [isRefetchLoading, setIsRefetchLoading] = useState(false);
const { IODetails, setIODetails } = useContext(GlobalStateContext);
console.log(IODetails?.isInvestedAmount);
console.log(IODetails?.isInvestedAmount);
const tabs = [
{ label: "IO Details", content: <ViewIOdetails data={data?.data} /> },
{
label: "Investment documents",
label: "Investment documents",
content: <InvestmentDocument data={data?.data} />,
},
{ label: "Key merits", content: <KeyMerits data={data?.data} /> },
@@ -75,9 +88,14 @@ const ViewIOdata = () => {
// { label: "Distribution to Investors", content: <UnderConstruction h={'75vh'} /> },
];
const handleRefresh = async () => {
setIsRefetchLoading(true);
await refetch();
setIsRefetchLoading(false);
};
console.log(IODetails?.ioNAVHistory);
return (
<Box
@@ -99,7 +117,7 @@ const ViewIOdata = () => {
<Tabs mt={4}>
<TabList justifyContent={"space-between"} pe={4} alignItems={"center"}>
<Box display={"flex"}>
<Box display={"flex"} position={"relative"} w={"100%"}>
{tabs.map(({ label }, index) => (
<Tab
px={3}
@@ -113,7 +131,6 @@ const ViewIOdata = () => {
? false
: !IODetails?.isInvestedAmount
}
// isDisabled={
// index === 0 ||
// index === 1 ||
@@ -132,11 +149,57 @@ const ViewIOdata = () => {
fontWeight={500}
position={"relative"}
>
{label} {index === 5 &&IODetails?.ioCashStatusHistory?.Pending?.length !== 0||
index === 6 && IODetails?.ioNAVStatusHistory?.Pending?.length !== 0 ||
index === 8 && IODetails?.ioTransactionRecords?.Pending?.length !== 0 ? <Box as="span" right={0} color={"forestGreen"} top={1} position={"absolute"}><GoDotFill /></Box>:""}
{label}{" "}
{(index === 5 &&
IODetails?.ioCashStatusHistory?.Pending?.length !== 0) ||
(index === 6 &&
IODetails?.ioNAVStatusHistory?.Pending?.length !== 0) ||
(index === 8 &&
IODetails?.ioTransactionRecords?.Pending?.length !== 0) ? (
<Box
as="span"
right={0}
color={"forestGreen"}
top={1}
position={"absolute"}
>
<GoDotFill />
</Box>
) : (
""
)}
</Tab>
))}
{/* <Box as="span" position={"absolute"} right={2} bottom={1}>
<Icon
ms={0}
animation={
isRefetchLoading ? `${rotate} 1s linear infinite` : "none"
}
bg={"gray.50"}
onClick={handleRefresh}
fontWeight={600}
as={RepeatIcon}
boxSize={8}
p={2}
rounded={"full"}
_hover={{ bg: "gray.100" }}
cursor={"pointer"}
/>
</Box> */}
<Stack position={"absolute"} right={2} bottom={1} direction="row" spacing={4}>
<Button
isLoading={isRefetchLoading}
loadingText="Refresh"
colorScheme="forestGreen"
variant="solid"
size={'xs'}
onClick={handleRefresh}
fontWeight={400}
>
Refresh
</Button>
</Stack>
</Box>
</TabList>
<TabPanels>

View File

@@ -1,4 +1,4 @@
import { Box, Button } from "@chakra-ui/react";
import { Box, Button, Text } from "@chakra-ui/react";
import React, { useContext, useEffect } from "react";
import { useNavigate, useParams } from "react-router-dom";
@@ -240,11 +240,6 @@ const ViewIOdetails = () => {
width: "32.3%",
value: IObyID?.data?.isShariah,
},
{
label: "Investment Type",
placeHolder: "Select option",
@@ -351,19 +346,22 @@ const ViewIOdetails = () => {
return (
<Box position={"relative"}>
<Button
position={"absolute"}
top={"-62px"}
right={0}
onClick={() => navigate(`/create-io/${params?.id}`)}
ps={4}
pe={4}
colorScheme="forestGreen"
rounded={"sm"}
size={"xs"}
>
Edit IO
</Button>
<Box display={"flex"} justifyContent={"space-between"}>
<Text></Text>
<Button
// position={"absolute"}
// top={"-62px"}
right={0}
onClick={() => navigate(`/create-io/${params?.id}`)}
ps={4}
pe={4}
colorScheme="forestGreen"
rounded={"sm"}
size={"xs"}
>
Edit IO
</Button>
</Box>
<FormInputView groupedFields={groupedFields} />
</Box>
);

View File

@@ -3,6 +3,7 @@ import {
Box,
Button,
FormControl,
FormHelperText,
FormLabel,
Heading,
HStack,
@@ -36,7 +37,8 @@ const FILE_TYPES = ["image/jpeg", "image/png", "image/gif"];
export const conformModalSchema = yup.object().shape({
investorAmount: yup.string().required("Investor amount is required"),
comment: yup.string().notRequired(),
comment: yup.string().notRequired()
.max(200, "Approve Comment cannot be more than 200 characters"),
});
const DrawalRequestApprove = ({
@@ -59,6 +61,7 @@ const DrawalRequestApprove = ({
const {
control,
register,
watch,
reset,
handleSubmit,
formState: { errors },
@@ -259,12 +262,17 @@ const DrawalRequestApprove = ({
size="sm"
placeholder={"Enter your comments...."}
resize={"none"}
maxLength={200}
/>
{errors.comment && (
<Text fontSize="xs" color="red">
{errors.comment.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Text as={"span"} me={1}>Maximum length should be 200 characters. You have entered</Text>
{watch("checkerComment")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>
<ModalFooter>

View File

@@ -2,6 +2,7 @@ import {
Box,
Button,
FormControl,
FormHelperText,
FormLabel,
Input,
Modal,
@@ -24,7 +25,8 @@ import {
import { useDepositRejectMutation } from "../../../Services/drawal.request.service";
export const conformModalSchema = yup.object().shape({
comments: yup.string().required("Comment is required"),
comments: yup.string().required("Comment is required")
.max(200, "Approve Comment cannot be more than 200 characters"),
});
const DrawalRequestReject = ({ isOpen, onClose, firstField ,id}) => {
@@ -34,6 +36,7 @@ import { useDepositRejectMutation } from "../../../Services/drawal.request.servi
const {
register,
watch,
reset,
handleSubmit,
formState: { errors },
@@ -101,16 +104,21 @@ import { useDepositRejectMutation } from "../../../Services/drawal.request.servi
placeholder={"Enter your comments...."}
rounded={"md"}
resize={"none"}
maxLength={200}
/>
{errors.comments && (
<Text fontSize="xs" color="red">
{errors.comments.message}
</Text>
)}
<FormHelperText fontSize="xs" color="gray.500">
<Text as={"span"} me={1}>Maximum length should be 200 characters. You have entered</Text>
{watch("checkerComment")?.length || 0} characters.
</FormHelperText>
</FormControl>
</ModalBody>
<ModalFooter>
<Button
<Button
colorScheme="gray"
mr={3}
onClick={onClose}