diff --git a/src/Components/EmptySearchList.jsx b/src/Components/EmptySearchList.jsx index e7d5dfb..2354f62 100644 --- a/src/Components/EmptySearchList.jsx +++ b/src/Components/EmptySearchList.jsx @@ -9,7 +9,7 @@ const EmptySearchList = ({message}) => { justifyContent={'center'} alignItems={'center'} flexDirection={'column'} - w={"100%"} h={"80vh"} + w={"100%"} h={"40vh"} > empty list {message} diff --git a/src/Components/FormField.jsx b/src/Components/FormField.jsx index 3e08e34..ff0be2f 100644 --- a/src/Components/FormField.jsx +++ b/src/Components/FormField.jsx @@ -65,6 +65,8 @@ const FormField = ({ width, value, handleInputChange, + align, + maxLength, ...props }) => ( ); } else if (type === "checkbox") { @@ -471,7 +473,7 @@ const FormField = ({ {...field} {...props} placeholder={placeHolder ? placeHolder : label} - textAlign={arabic || type === "number" ? "right" : "left"} + textAlign={arabic || type === "number" ? "right" : align ? align : "left"} _placeholder={{ fontSize: "sm" }} min={type === "date" ? today : undefined} defaultValue={type === "date" ? new Date(value) : undefined} diff --git a/src/Components/FormInputMain.jsx b/src/Components/FormInputMain.jsx index 27aede6..ed5b377 100644 --- a/src/Components/FormInputMain.jsx +++ b/src/Components/FormInputMain.jsx @@ -17,6 +17,7 @@ const FormInputMain = ({ w, btnLoading, btnhidden, + }) => { return ( @@ -57,6 +58,8 @@ const FormInputMain = ({ width, value, handleInputChange, + align, + maxLength }, key ) => ( @@ -82,6 +85,8 @@ const FormInputMain = ({ width={width} value={value} handleInputChange={handleInputChange} + align={align} + maxLength={maxLength} /> ) )} diff --git a/src/Components/FormInputView.jsx b/src/Components/FormInputView.jsx index bc3cee5..cf27df1 100644 --- a/src/Components/FormInputView.jsx +++ b/src/Components/FormInputView.jsx @@ -20,7 +20,7 @@ const FormInputView = ({ {/* */} {fields.map( - ({ value, label, id, width, btn, arabic, type }, key) => + ({ value, label, id, width, btn, arabic, type, align }, key) => type === "table" ? ( @@ -109,13 +109,13 @@ const FormInputView = ({ {label} {type === "number" ? value : value} diff --git a/src/Constants/Constants.js b/src/Constants/Constants.js index 931a3a2..ead0967 100644 --- a/src/Constants/Constants.js +++ b/src/Constants/Constants.js @@ -1,6 +1,6 @@ export const getFileNameFromPath = (filePath) => { - const parts = filePath.split("/"); - return parts[parts.length - 1]; + const parts = filePath?.split("/"); + return parts?.[parts?.length - 1]; }; export function debounce(func, delay) { diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx index 0f2610d..a14a5db 100644 --- a/src/Contexts/GlobalStateProvider.jsx +++ b/src/Contexts/GlobalStateProvider.jsx @@ -20,12 +20,11 @@ const getRandomDate = (start, end) => { const startDate = new Date(2020, 0, 1); // January 1, 2020 const endDate = new Date(); // Current date - export const generateUniqueId = () => { - const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; - const digits = '0123456789'; + const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; + const digits = "0123456789"; - let id = ''; + let id = ""; // Generate three random uppercase letters for (let i = 0; i < 3; i++) { @@ -38,7 +37,7 @@ export const generateUniqueId = () => { } return id; -} +}; const GlobalStateProvider = ({ children }) => { const [isAuthenticate, setIsAuthenticate] = useState(false); @@ -47,7 +46,8 @@ const GlobalStateProvider = ({ children }) => { const [slideFromRight, setSlideFormRight] = useState(false); const { colorMode, toggleColorMode } = useColorMode(); const [sponser, setSponser] = useState([]); - + const [ioStatus, setIoStatus] = useState([]); + const [investors, setInvestors] = useState([ { id: 1, @@ -337,6 +337,30 @@ const GlobalStateProvider = ({ children }) => { status: true, }, ]); + + const [iOArtifactsTwo, setIOArtifactsTwo] = useState([ + { + id: 1, + videoFileName: "Property preview", + status: true, + }, + { + id: 2, + videoFileName: "Property preview", + status: true, + }, + { + id: 3, + videoFileName: "Property preview", + status: true, + }, + { + id: 4, + videoFileName: "Property preview", + status: true, + }, + ]); + const [investmentType, setInvestmentType] = useState([ { id: 1, @@ -503,216 +527,216 @@ const GlobalStateProvider = ({ children }) => { const [InvestorDetails, setInvestorDetails] = useState([ { id: 1, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, { id: 2, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Incompleted", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Incompleted", + status: "Unban", }, { id: 3, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, { id: 4, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Incompleted", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Incompleted", + status: "Unban", }, { id: 5, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, { id: 6, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, { id: 7, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Incompleted", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Incompleted", + status: "Unban", }, { id: 8, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Incompleted", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Incompleted", + status: "Unban", }, { id: 9, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, { id: 10, - clientId:"SA00000001", - fullName:"John David", - firstName:"John", + clientId: "SA00000001", + fullName: "John David", + firstName: "John", lastName: "David", country: "Saudi Arabia", phoneNumber: "8940035906", - address:"Saudi Arabia", + address: "Saudi Arabia", emailID: "john@gmail.com", - bankName:"Lorem Text", - branchAddress:"Hohenzollernring 58, 95444", - iban:"DE 1234 5678 9012 3456", - swiftCode:"BC12345", - referenceID:"FRYU FHDU 1234", - kycStatus:"Completed", - status:"Unban", + bankName: "Lorem Text", + branchAddress: "Hohenzollernring 58, 95444", + iban: "DE 1234 5678 9012 3456", + swiftCode: "BC12345", + referenceID: "FRYU FHDU 1234", + kycStatus: "Completed", + status: "Unban", }, ]); const [viewInvestor, setViewInvestor] = useState([ { id: 1, - dealId:"UWE3424992", + dealId: "UWE3424992", dealName: "KKR Private Equity Fund", sponsorName: "KKR", investAmount: "$100,000", holdingPeriod: "4-5 years", - estimatedReturn:"50-60%", - kycStatus:"Open", + estimatedReturn: "50-60%", + kycStatus: "Open", }, { id: 2, - dealId:"UWE3424992", + dealId: "UWE3424992", dealName: "Blackstone Real Estate Income Trust", sponsorName: "Blackstone", investAmount: "$100,000", holdingPeriod: "4-5 years", - estimatedReturn:"50-60%", - kycStatus:"Pending", + estimatedReturn: "50-60%", + kycStatus: "Pending", }, { id: 3, - dealId:"UWE3424992", + dealId: "UWE3424992", dealName: "J.P. Morgan", sponsorName: "J.P. Morgan", investAmount: "$100,000", holdingPeriod: "4-5 years", - estimatedReturn:"50-60%", - kycStatus:"Closed", + estimatedReturn: "50-60%", + kycStatus: "Closed", }, ]); @@ -750,7 +774,7 @@ const GlobalStateProvider = ({ children }) => { const [pendingRequest, setPendingRequest] = useState([ { id: 1, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -758,11 +782,11 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "SAR", withDrawalAmount: "$100,000", - amountcurrency:"382574.17", + amountcurrency: "382574.17", }, { id: 2, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "KU00000001", firstName: "Faisal", lastName: "Aljalahma", @@ -770,11 +794,11 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "KWD", withDrawalAmount: "$200,000", - amountcurrency:"62438.98", + amountcurrency: "62438.98", }, { id: 3, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "BH00000001", firstName: "Nawaf", lastName: "Almaskati", @@ -782,11 +806,11 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "BHD", withDrawalAmount: "$300,000", - amountcurrency:"115328.04", + amountcurrency: "115328.04", }, { id: 4, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000002", firstName: "Sulaiman", lastName: "AlBassam", @@ -794,13 +818,13 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "SAR", withDrawalAmount: "$400,000", - amountcurrency:"1530296.67", + amountcurrency: "1530296.67", }, ]); const [viewHistory, setViewHistory] = useState([ { id: 1, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -808,12 +832,12 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "SAR", withDrawalAmount: "$100,000", - amountcurrency:"382574.17", - status:"Approved", + amountcurrency: "382574.17", + status: "Approved", }, { id: 2, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "KU00000001", firstName: "Faisal", lastName: "Aljalahma", @@ -821,12 +845,12 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "KWD", withDrawalAmount: "$200,000", - amountcurrency:"62438.98", - status:"Rejected", + amountcurrency: "62438.98", + status: "Rejected", }, { id: 3, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "BH00000001", firstName: "Nawaf", lastName: "Almaskati", @@ -834,12 +858,12 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "BHD", withDrawalAmount: "$300,000", - amountcurrency:"115328.04", - status:"Approved", + amountcurrency: "115328.04", + status: "Approved", }, { id: 4, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000002", firstName: "Sulaiman", lastName: "AlBassam", @@ -847,8 +871,8 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "SAR", withDrawalAmount: "$400,000", - amountcurrency:"1530296.67", - status:"Rejected", + amountcurrency: "1530296.67", + status: "Rejected", }, ]); const [upgradeHistory, setUpgradeHistory] = useState([ @@ -1322,12 +1346,12 @@ const GlobalStateProvider = ({ children }) => { }, ]); - const [ IODetails, setIODetails ] = useState({}) + const [IODetails, setIODetails] = useState({}); const [depositRequest, setDepositRequest] = useState([ { id: 1, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1335,13 +1359,13 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "SAR", depositAmount: "$100,000", - fees:"$2,000", - totalAmount:"$102,000", - amountcurrency:"382574.17", + fees: "$2,000", + totalAmount: "$102,000", + amountcurrency: "382574.17", }, { id: 2, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "KU00000001", firstName: "Faisal", lastName: "Aljalahma", @@ -1349,13 +1373,13 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "KWD", depositAmount: "$200,000", - fees:"$4,000", - totalAmount:"$204,000", - amountcurrency:"62438.98", + fees: "$4,000", + totalAmount: "$204,000", + amountcurrency: "62438.98", }, { id: 3, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "BH00000001", firstName: "Nawaf", lastName: "Almaskati", @@ -1363,13 +1387,13 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "BHD", depositAmount: "$300,000", - fees:"$6,000", - totalAmount:"$306,000", - amountcurrency:"115328.04", + fees: "$6,000", + totalAmount: "$306,000", + amountcurrency: "115328.04", }, { id: 4, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000002", firstName: "Sulaiman", lastName: "AlBassam", @@ -1377,16 +1401,16 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "SAR", depositAmount: "$400,000", - fees:"$8,000", - totalAmount:"$408,000", - amountcurrency:"1530296.67", + fees: "$8,000", + totalAmount: "$408,000", + amountcurrency: "1530296.67", }, ]); const [depositHistory, setDepositHistory] = useState([ { id: 1, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1394,14 +1418,14 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "SAR", depositAmount: "$100,000", - fees:"$2,000", - totalAmount:"$102,000", - amountcurrency:"382574.17", - status:"Approved", + fees: "$2,000", + totalAmount: "$102,000", + amountcurrency: "382574.17", + status: "Approved", }, { id: 2, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "KU00000001", firstName: "Faisal", lastName: "Aljalahma", @@ -1409,14 +1433,14 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "KWD", depositAmount: "$200,000", - fees:"$4,000", - totalAmount:"$204,000", - amountcurrency:"62438.98", - status:"Rejected" + fees: "$4,000", + totalAmount: "$204,000", + amountcurrency: "62438.98", + status: "Rejected", }, { id: 3, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "BH00000001", firstName: "Nawaf", lastName: "Almaskati", @@ -1424,14 +1448,14 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8940035906", currency: "BHD", depositAmount: "$300,000", - fees:"$6,000", - totalAmount:"$306,000", - amountcurrency:"115328.04", - status:"Approved" + fees: "$6,000", + totalAmount: "$306,000", + amountcurrency: "115328.04", + status: "Approved", }, { id: 4, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000002", firstName: "Sulaiman", lastName: "AlBassam", @@ -1439,17 +1463,17 @@ const GlobalStateProvider = ({ children }) => { phoneNumber: "8226278945", currency: "SAR", depositAmount: "$400,000", - fees:"$8,000", - totalAmount:"$408,000", - amountcurrency:"1530296.67", - status:"Rejected" + fees: "$8,000", + totalAmount: "$408,000", + amountcurrency: "1530296.67", + status: "Rejected", }, ]); const [bankInvestor, setBankInvestor] = useState([ { id: 1, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1460,7 +1484,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 2, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1471,7 +1495,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 3, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1482,7 +1506,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 4, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1493,7 +1517,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 5, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1504,7 +1528,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 6, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1515,7 +1539,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 7, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1526,7 +1550,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 8, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1537,7 +1561,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 9, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1548,7 +1572,7 @@ const GlobalStateProvider = ({ children }) => { }, { id: 10, - date:"02-Jan-2024", + date: "02-Jan-2024", clientId: "SA00000001", firstName: "John", lastName: "David", @@ -1559,42 +1583,42 @@ const GlobalStateProvider = ({ children }) => { }, ]); - const [manageAcademy , setManageAcademy] = useState([ + const [manageAcademy, setManageAcademy] = useState([ { id: 1, - header:"Investing in Private Equity", + header: "Investing in Private Equity", content: "Private equity investing involve...", bannerImage: "John", }, { id: 2, - header:"Investing in Private Equity", + header: "Investing in Private Equity", content: "Private equity investing involve...", bannerImage: "John", }, { id: 3, - header:"Investing in Private Equity", + header: "Investing in Private Equity", content: "Private equity investing involve...", bannerImage: "John", }, - ]) + ]); - const [manageVideo , setManageVideo] = useState([ + const [manageVideo, setManageVideo] = useState([ { id: 1, - name:"Investing in Private Equity", + name: "Investing in Private Equity", videoUploaded: "Video.mp4", }, - ]) + ]); - const [academicDocuments , setAcademicDocuments] = useState([ + const [academicDocuments, setAcademicDocuments] = useState([ { id: 1, - fullName:"Investing in Private Equity", + fullName: "Investing in Private Equity", document: "Video.mp4", }, - ]) + ]); return ( { setKeyMerits, iOArtifacts, setIOArtifacts, - investors, - setInvestors,IODetails, setIODetails, - navDetails, + investors, + setInvestors, + IODetails, + setIODetails, + navDetails, setNavDetails, caseDetails, setCaseDetails, @@ -1661,6 +1687,10 @@ const GlobalStateProvider = ({ children }) => { setManageVideo, academicDocuments, setAcademicDocuments, + iOArtifactsTwo, + setIOArtifactsTwo, + ioStatus, + setIoStatus, }} > {children} diff --git a/src/Pages/IO_Management/CreateIO/CreateIO.jsx b/src/Pages/IO_Management/CreateIO/CreateIO.jsx index 8381450..eb0e8ce 100644 --- a/src/Pages/IO_Management/CreateIO/CreateIO.jsx +++ b/src/Pages/IO_Management/CreateIO/CreateIO.jsx @@ -19,6 +19,7 @@ import { useGetIOprepopulateDataQuery } from "../../../Services/io.service"; const CreateIO = () => { const id = useParams()?.id; const { data, error, isLoading } = useGetIOprepopulateDataQuery(); + // console.log(data?.data); diff --git a/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx b/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx index dfe72eb..d9524ad 100644 --- a/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx +++ b/src/Pages/IO_Management/CreateIO/IOArtifacts.jsx @@ -1,8 +1,10 @@ import { + Badge, Box, Button, HStack, Input, + Link, Text, Tooltip, useDisclosure, @@ -12,27 +14,58 @@ import DataTable from "../../../Components/DataTable/DataTable"; import CustomAlertDialog from "../../../Components/CustomAlertDialog"; import GlobalStateContext from "../../../Contexts/GlobalStateContext"; import { debounce } from "../../Master/Sponser/AddSponser"; -import { formatDate } from "../../../Components/Functions/UTCConvertor"; import { AddIcon, DeleteIcon, - DownloadIcon, EditIcon, + ExternalLinkIcon, ViewIcon, } from "@chakra-ui/icons"; import IOArtifactsAdd from "../IOArtifactsAdd"; +import IOArtifactsVideo from "./IOArtifactsVideo"; +import SetDisplayOrder from "./SetDisplayOrder"; +import { useParams } from "react-router-dom"; +import { + useDeleteVideoArtifactsMutation, + useGetIOByIdQuery, +} from "../../../Services/io.service"; +import { getFileNameFromPath } from "../../../Constants/Constants"; + +const IOArtifacts = ({ enableNextTab, index, data }) => { + const params = useParams(); + const id = params?.id; + + const { + data: IObyID, + isLoading: IObyIDisLoading, + error: IObyIDerror, + } = useGetIOByIdQuery(id, { skip: !id }); + + console.log(IObyID?.data?.artifactsImage); + console.log(IObyID?.data?.artifactsVideo); -const IOArtifacts = ({enableNextTab, index}) => { const { iOArtifacts, setIOArtifacts, slideFromRight } = useContext(GlobalStateContext); + const { iOArtifactsTwo, setIOArtifactsTwo } = useContext(GlobalStateContext); const firstField = useRef(); + const secondField = useRef(); const [searchTerm, setSearchTerm] = useState(""); + const [searchTermTwo, setSearchTermTwo] = useState(""); const [isLoading, setIsLoading] = useState(true); + const [isLoadingBtn, setIsLoadingBtn] = useState(false); const [deleteAlert, setDeleteAlert] = useState(false); const [actionId, setActionId] = useState(false); const [mouseEntered, setMouseEntered] = useState(false); const [mouseEnteredId, setMouseEnteredId] = useState(""); + const { isOpen, onOpen, onClose } = useDisclosure(); + const [deleteVideoArtifacts] = useDeleteVideoArtifactsMutation(); + + const { + isOpen: isOpenVideo, + onOpen: onOpenVideo, + onClose: onCloseVideo, + } = useDisclosure(); useEffect(() => { // Simulate loading @@ -44,14 +77,6 @@ const IOArtifacts = ({enableNextTab, index}) => { return () => clearTimeout(timer); }, []); - const tableHeadRow = [ - "Sr.no", - "Type", - "File Name", - "Document", - "Action" - ]; - const handleUpdateStatus = debounce((id) => { setIOArtifacts((prevIOArtifacts) => prevIOArtifacts.map((iOArtifacts) => @@ -60,34 +85,62 @@ const IOArtifacts = ({enableNextTab, index}) => { : iOArtifacts ) ); + setIOArtifactsTwo((prevIOArtifactsTwo) => + prevIOArtifactsTwo.map((iOArtifactsTwo) => + iOArtifactsTwo.id === id + ? { ...iOArtifactsTwo, status: !iOArtifactsTwo.status } + : iOArtifactsTwo + ) + ); toast({ render: () => , }); }, 300); - const filteredData = iOArtifacts?.filter((item) => { - // Filter by name (case insensitive) - const name = item.type; - const searchLower = searchTerm.toLowerCase(); - const nameMatches = name.toLowerCase().includes(searchLower); - - return nameMatches; - }); - - const handleDelete = () => { - const updatedIOArtifacts = iOArtifacts.filter( - (iOArtifacts) => iOArtifacts.id !== actionId - ); - - setTimeout(() => { - setSponser(updatedIOArtifacts); - setDeleteAlert(false); - setIsLoading(false); - }, 100); - setIsLoading(true); + const handleDeleteVideo = async (id) => { + setIsLoadingBtn(true); + try { + const res = await deleteVideoArtifacts(id); + console.log(res?.data?.statusCode); + if (res?.data?.statusCode === 200) { + setDeleteAlert(false); + onCloseVideo(); + setIsLoadingBtn(false); + } + } catch (error) { + console.log(error); + } }; - const extractedArray = filteredData?.map((item, index) => ({ + + const handleDeleteImage = async (id) => { + setIsLoadingBtn(true); + try { + const res = await deleteVideoArtifacts(id); + console.log(res?.data?.statusCode); + if (res?.data?.statusCode === 200) { + setDeleteAlert(false); + onCloseVideo(); + setIsLoadingBtn(false); + } + } catch (error) { + console.log(error); + } + }; + + + + + + const tableHeadRow = [ + "Sr.no", + "File Name", + // "Document", + "View image", + "Action", + ]; + + const extractedArray = IObyID?.data?.artifactsImage?.map((item, index) => ({ "Sr.no": ( { {index + 1} ), - Type: ( - - {item.type} - - ), "File Name": ( - {item.fileName} + {item.artifactName} ), - "Document": ( + Document: ( { fontWeight={"500"} className="d-flex align-items-center web-text-small" > - {item.document} + {getFileNameFromPath(item.artifactPathName)} + + ), + "View image": ( + + + + View + + ), Action: ( - { > - + */} { ), })); + const tableHeadRowTwo = [ + "Sr.no", + "File Name", + "Video streaming uRL", + "Action", + ]; + + const extractedArrayTwo = IObyID?.data?.artifactsVideo?.map( + (item, index) => ({ + "Sr.no": ( + + {index + 1} + + ), + "File Name": ( + + + {item.artifactName} + + + ), + "Video streaming uRL": ( + + + + View + + + + ), + Action: ( + + {/* + + */} + + + + + + + + ), + }) + ); + return ( - setSearchTerm(e.target.value)} - /> - + + Manage iO images + + + {/* */} + + + + + { isLoading={isLoading} viewActionId={actionId} setViewActionId={setActionId} - // totalPages={10} - setMouseEnteredId={setMouseEnteredId} setMouseEntered={setMouseEntered} /> - - + + + Manage IO videos + + + + + + + + + + + {/* - + */} setDeleteAlert(false)} isOpen={deleteAlert} message={"Are you sure you want to delete sponers?"} - alertHandler={handleDelete} - isLoading={isLoading} + alertHandler={() => handleDeleteVideo(actionId)} + isLoading={isLoadingBtn} /> ); diff --git a/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx b/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx new file mode 100644 index 0000000..a047950 --- /dev/null +++ b/src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx @@ -0,0 +1,174 @@ +import { + Box, + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + DrawerOverlay, + FormControl, + FormErrorMessage, + FormLabel, + Input, + Stack, + useToast, +} from "@chakra-ui/react"; +import * as yup from "yup"; +import React, { useState } from "react"; +import { useForm, Controller } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import CustomAlertDialog from "../../../Components/CustomAlertDialog"; +import { v4 as uuidv4 } from "uuid"; +import { useCreateVideoArtifactsMutation, useDeleteVideoArtifactsMutation } from "../../../Services/io.service"; +import { useParams } from "react-router-dom"; +import ToastBox from "../../../Components/ToastBox"; + +const investmentVideoSchema = yup.object().shape({ + artifactName: yup.string().required("Artifact name is required"), + artifactStreamingURL: yup.string().required("Artifact streaming URL is required").url("Invalid URL format"), +}); + +const IOArtifactsAdd = ({ isOpen, onClose, firstField }) => { + const params = useParams() + const id = params?.id + const [file, setFile] = useState(""); + const [fileName, setFileName] = useState(""); + const [ isLoading, setIsLoading] = useState(false) + const [alert, setAlert] = useState(false); + const toast = useToast(); + + const [ createArtifactsVideo ] = useCreateVideoArtifactsMutation() + // const { + // data + // } = useGetArtifactsQuery(id) + + const { + control, + handleSubmit, + reset, + formState: { errors }, + } = useForm({ + resolver: yupResolver(investmentVideoSchema), + }); + + const onSubmit = async (data) => { + setIsLoading(true) + + try { + const res = await createArtifactsVideo({data, id}) + if (res?.data?.statusCode === 200) { + toast({ + render: () => , + }); + reset() + setAlert(false); + setIsLoading(false) + onClose(); + } + + + } catch (error) { + console.log(error); + + } + + }; + + + + const handleConfirm = () => { + handleSubmit(onSubmit)(); + }; + + const handleSave = () => { + handleSubmit(onSubmit)(); + }; + + const handleClose = () => { + onClose() + reset() + } + + return ( + <> + + + + + IO Artifacts Image + + + + + Artifact Name + ( + + )} + /> + + {errors.artifactName?.message} + + + + + Artifact Streaming URL + ( + + )} + /> + + {errors.artifactStreamingURL?.message} + + + + + + + + + + + + + setAlert(false)} + alertHandler={handleSave} + message={"Are you sure you want to add this artifact?"} + isLoading={isLoading} + /> + + ); +}; + +export default IOArtifactsAdd; diff --git a/src/Pages/IO_Management/CreateIO/IODetails.jsx b/src/Pages/IO_Management/CreateIO/IODetails.jsx index b775afe..ea01028 100644 --- a/src/Pages/IO_Management/CreateIO/IODetails.jsx +++ b/src/Pages/IO_Management/CreateIO/IODetails.jsx @@ -51,13 +51,13 @@ const schema = yup.object().shape({ .string() .required("Description in English is required") .min(10, "Description in English must be at least 10 characters long") - .max(500, "Description in English must be at most 500 characters long"), + .max(1000, "Description in English must be at most 1000 characters long"), descriptionArabic: yup .string() .required("Description in Arabic is required") .min(10, "Description in Arabic must be at least 10 characters long") - .max(500, "Description in Arabic must be at most 500 characters long"), + .max(2000, "Description in Arabic must be at most 500 characters long"), goalAmount: yup .number() @@ -82,7 +82,9 @@ const schema = yup.object().shape({ InvestmentDetails: yup.string(), - comment: yup.string(), + comment: yup.string() + .min(10, "Comment must be at least 10 characters long") + .max(150, "Comment must be at most 150 characters long"), expectedReturn: yup .number() @@ -123,6 +125,9 @@ const IODetails = ({ enableNextTab, index, data }) => { isLoading: IObyIDisLoading, error: IObyIDerror, } = useGetIOByIdQuery(id, { skip: !id }); + + + const [creatIO] = useCreateIOMutation(); const [updateIO] = useUpdateIOMutation(); @@ -237,6 +242,7 @@ const IODetails = ({ enableNextTab, index, data }) => { isRequired: true, section: " ", width: "49%", + maxLength:1000 }, { label: "Description (Arabic)", @@ -247,6 +253,7 @@ const IODetails = ({ enableNextTab, index, data }) => { arabic: true, section: " ", width: "49%", + }, { label: "Investment Type", @@ -300,7 +307,7 @@ const IODetails = ({ enableNextTab, index, data }) => { value: IObyID?.data?.holdingPeriod, }, { - label: "Expected Return Estimated", + label: "Expected Return", placeHolder: "$00.00", name: "expectedReturn", type: "number", @@ -313,7 +320,8 @@ const IODetails = ({ enableNextTab, index, data }) => { label: "ISIN", placeHolder: "", name: "ISIN", - type: "number", + type: "text", + align:"right", section: " ", width: "32.3%", }, @@ -350,6 +358,7 @@ const IODetails = ({ enableNextTab, index, data }) => { width: "100%", options: investmentTypeOptions, value: IObyID?.data?.comment, + maxLength:150 }, ]; //=======================[ Editor ] @@ -530,24 +539,23 @@ const IODetails = ({ enableNextTab, index, data }) => { if (id) { const res = await updateIO({ data: formData, id }); console.log(res); - if (res?.error?.status === 400 || res?.error?.status === 500) { + if (res?.data?.statusCode === 200) { setIsLoading(false); toast({ - render: () => ( - - ), + render: () => , }); - navigate(`/view-io/${id}`); + enableNextTab(index); + } else if(res?.error?.status === 400){ setIsLoading(false); + toast({ + render: () => , + }); } - - navigate(`/view-io/${id}`); - setIsLoading(false); } else { try { const res = await creatIO(formData); - console.log(res); + console.log(res?.error?.status); if (res?.data?.statusCode === 200) { setIsLoading(false); toast({ @@ -555,6 +563,11 @@ const IODetails = ({ enableNextTab, index, data }) => { }); navigate(`/view-io/${res?.data?.data}`); enableNextTab(index); + } else if(res?.error?.status === 400){ + setIsLoading(false); + toast({ + render: () => , + }); } } catch (error) { setIsLoading(false); diff --git a/src/Pages/IO_Management/CreateIO/InvestmentDocument.jsx b/src/Pages/IO_Management/CreateIO/InvestmentDocument.jsx index a95480b..a30ffd7 100644 --- a/src/Pages/IO_Management/CreateIO/InvestmentDocument.jsx +++ b/src/Pages/IO_Management/CreateIO/InvestmentDocument.jsx @@ -33,6 +33,7 @@ import { import ToastBox from "../../../Components/ToastBox"; import { getFileNameFromPath } from "../../../Constants/Constants"; import { TbFileTypeDocx } from "react-icons/tb"; +import SetDisplayOrder from "./SetDisplayOrder"; const downloadFile = (filePath, fileName) => { console.log("https://admin.tanami.betadelivery.com/" + filePath); @@ -206,7 +207,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => { fontWeight="500" className="d-flex align-items-center web-text-small" > - {getFileNameFromPath(item?.documentType)} + {getFileNameFromPath(item?.documentPath)} ), Action: ( @@ -292,17 +293,10 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => { return ( - - setSearchTerm(e.target.value)} - /> + + + + { secondField={secondField} /> { - const toast = useToast() +const KeyMerits = ({ enableNextTab, index, data:prepopData }) => { + const toast = useToast(); const params = useParams(); + // =====================[ variables ] const id = params?.id; const { data, isLoading, error } = useGetKeyMeritsQuery(id, { skip: !id, }); + console.log(data?.data); const { keyMerits, setKeyMerits, slideFromRight } = useContext(GlobalStateContext); @@ -52,8 +57,12 @@ const KeyMerits = ({ enableNextTab, index }) => { const [isBtnLoading, setIsBtnLoading] = useState(false); const [mouseEnteredId, setMouseEnteredId] = useState(""); const { isOpen, onOpen, onClose } = useDisclosure(); - const { isOpen: isEditOpen, onOpen: onEditOpen, onClose: onEditCloseOpen } = useDisclosure(); - const [ deleteKeyMerits ] = useDeleteKeyMeritsMutation() + const { + isOpen: isEditOpen, + onOpen: onEditOpen, + onClose: onEditCloseOpen, + } = useDisclosure(); + const [deleteKeyMerits] = useDeleteKeyMeritsMutation(); const tableHeadRow = ["Sr.no", "Title", "Sub title", "Icon", "Action"]; @@ -80,19 +89,17 @@ const KeyMerits = ({ enableNextTab, index }) => { }); const handleDelete = async () => { - setIsBtnLoading(true) + setIsBtnLoading(true); try { - const res = await deleteKeyMerits(actionId) - if(res?.data?.statusCode === 200){ + const res = await deleteKeyMerits(actionId); + if (res?.data?.statusCode === 200) { toast({ render: () => , }); - setIsBtnLoading(false) - setDeleteAlert(false) + setIsBtnLoading(false); + setDeleteAlert(false); } - } catch (error) { - - } + } catch (error) {} }; const extractedArray = filteredData?.map((item, index) => ({ @@ -126,23 +133,21 @@ const KeyMerits = ({ enableNextTab, index }) => { ), - Icon: ( - item.iconFilePath && - - - - // https://admin.tanami.betadelivery.com/public/icons/linkedin.png ), + + // https://admin.tanami.betadelivery.com/public/icons/linkedin.png Action: ( {/* { ) : ( - - + {/* { focusBorderColor="green.500" value={searchTerm} onChange={(e) => setSearchTerm(e.target.value)} - /> + /> */} - - - - + + + - - - { ), Icon: ( - item.iconFilePath && diff --git a/src/Pages/IO_Management/EditIO/InvestmentEdit.jsx b/src/Pages/IO_Management/EditIO/InvestmentEdit.jsx index 863b7e6..aeb40ad 100644 --- a/src/Pages/IO_Management/EditIO/InvestmentEdit.jsx +++ b/src/Pages/IO_Management/EditIO/InvestmentEdit.jsx @@ -1,153 +1,284 @@ import { - Button, - Drawer, - DrawerBody, - DrawerCloseButton, - DrawerContent, - DrawerFooter, - DrawerHeader, - FormControl, - FormLabel, - Input, - Box, - Text, - } from "@chakra-ui/react"; - import React, { useContext, useEffect, useState } from "react"; - import { bytesToMB, getFileIcon, investmentDocSchema } from "../InvestmentDocuments"; - import { yupResolver } from "@hookform/resolvers/yup"; - import { useForm } from "react-hook-form"; - import GlobalStateContext from "../../../Contexts/GlobalStateContext"; - - const InvestmentEdit = ({ isOpen, onClose, thirdField, id }) => { - const { create, setCreate } = useContext(GlobalStateContext); - const [file, setFile] = useState(null); - const filteredObject = create?.find((item) => item?.id === id) - const { - control, - watch, - setValue, - handleSubmit, - reset, - register, - formState: { errors }, - } = useForm({ - resolver: yupResolver(investmentDocSchema), - }); + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + FormControl, + FormLabel, + Input, + Box, + Text, + useToast, +} from "@chakra-ui/react"; +import React, { useContext, useEffect, useState } from "react"; +import { + bytesToMB, + getFileIcon, + investmentDocSchema, +} from "../InvestmentDocuments"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { useForm } from "react-hook-form"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { getFileNameFromPath } from "../../../Constants/Constants"; +import CustomAlertDialog from "../../../Components/CustomAlertDialog"; +import { useUpdateInvestmentDocumentsMutation } from "../../../Services/io.service"; +import ToastBox from "../../../Components/ToastBox"; - - useEffect(() => { - if (filteredObject) { - reset({ - fileName:filteredObject?.fileName, - document: filteredObject?.document, - Type: filteredObject?.Type +const InvestmentEdit = ({ isOpen, onClose, thirdField, id, data }) => { + const toast = useToast(); + const { create, setCreate } = useContext(GlobalStateContext); + const [formData, setFormData] = useState(null); + const [alert, setAlert] = useState(false); + const [file, setFile] = useState(null); + const [isLoading, setIsLoading] = useState(false); + const filteredObject = create?.find((item) => item?.id === id); + + const [updateInvestmentDocuments] = useUpdateInvestmentDocumentsMutation(); + + // =====================[ variables ] + // const id = params?.id; + console.log(id); + console.log(data); + const filterObject = data?.find((item) => item?.id === id); + + console.log(filterObject); + + const getFileTitle = (type) => { + switch (type) { + case "application/pdf": + return "PDF"; + case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": + case "application/msword": + return "DOCX"; + case "image/jpeg": + case "image/png": + case "image/gif": + return "JPG"; + default: + return "HH"; + } + }; + + const { + control, + watch, + setValue, + handleSubmit, + reset, + register, + formState: { errors }, + } = useForm({ + resolver: yupResolver(investmentDocSchema), + }); + + // useEffect to reset the form when `found` changes + useEffect(() => { + if (filterObject) { + reset({ + document: filterObject?.documentPath, + fileName: filterObject?.documentName, + }); + } + }, [filterObject, reset]); + + useEffect(() => { + if (filteredObject) { + reset({ + fileName: filteredObject?.fileName, + document: filteredObject?.document, + Type: filteredObject?.Type, + }); + } + }, [id, create, reset]); + + const handleConfirm = async () => { + setIsLoading(true); + try { + const res = await updateInvestmentDocuments({ data: formData, id }); + console.log(res); + if (res?.error) { + toast({ + render: () => ( + + ), + }); + setIsLoading(false); + } else if (res?.data?.statusCode === 201) { + toast({ + render: () => , }); + onClose(); + setIsLoading(false); + setFile(null); + reset(); } - }, [id, create, reset]); + } catch (error) { + console.log(error); + if (error) { + toast({ + render: () => ( + + ), + }); + onClose(); + setIsLoading(false); + setFile(null); + reset(); + } + } - - const onSubmit = (data) => { -// setValue('Type',data.Type[0]?.type) - const updatedCreate = create.map((item) => - item.id === id ? { ...item, ...data } : item - ); - setCreate(updatedCreate); - onClose(); - }; + setAlert(false); + }; + + const onSubmit = (data) => { + console.log(data); + // setValue('Type',data.Type[0]?.type) + // const updatedCreate = create.map((item) => + // item.id === id ? { ...item, ...data } : item + // ); + // setCreate(updatedCreate); + // onClose(); + + console.log("sibmited"); + console.log(errors); + if (Object.keys(errors).length === 0) { + const formData = new FormData(); + formData.append("documentName", data.fileName); + typeof data?.document !== "string" + ? formData.append("document", data?.document[0]) + : null; + setFormData(formData); + setAlert(true); + } + }; - const handleFileChange = (event) => { const selectedFile = event.target.files[0]; setFile(selectedFile); }; - - return ( - - - - Edit Document - - - - File Name - - {errors.fileName && ( - - {errors.fileName.message} - - )} - - - Document - - {errors.document && ( - - {errors.document.message} - - )} - - - Type - - {errors.type && ( - - {errors.type.message} - - )} - - {file === null ? - {filteredObject?.Type}: ( - - - {getFileIcon(file.type)} - - {file.name} - - - {bytesToMB(file.size)} - - )} - - - - - - - - - ); - }; - - export default InvestmentEdit; - \ No newline at end of file + {...register("fileName")} + /> + {errors.fileName && ( + + {errors.fileName.message} + + )} + + + Document + + {errors.document && ( + + {errors.document.message} + + )} + + {filterObject !== null && file === null ? ( + + + + {getFileIcon(filterObject?.documentType)} + + + {getFileNameFromPath(filterObject?.documentPath)} + + + {/* {bytesToMB(file.size)} */} + + ) : ( + + + {getFileIcon(file.type)} + + {file.name} + + + {bytesToMB(file.size)} + + )} + + + + + + + + + setAlert(false)} + alertHandler={handleConfirm} + isLoading={isLoading} + message="Are you sure you want to add this document?" + /> + + ); +}; + +export default InvestmentEdit; diff --git a/src/Pages/IO_Management/IOArtifactsAdd.jsx b/src/Pages/IO_Management/IOArtifactsAdd.jsx index 1f32600..35f2eb9 100644 --- a/src/Pages/IO_Management/IOArtifactsAdd.jsx +++ b/src/Pages/IO_Management/IOArtifactsAdd.jsx @@ -1,135 +1,192 @@ import { - Box, - Button, - Drawer, - DrawerBody, - DrawerCloseButton, - DrawerContent, - DrawerFooter, - DrawerHeader, - DrawerOverlay, - FormControl, - FormLabel, - Input, - InputGroup, - Stack, - } from "@chakra-ui/react"; - import * as yup from "yup"; - import React, { useContext, useEffect, useRef, useState } from "react"; - import FormInputMain from "../../Components/FormInputMain"; - import { useForm } from "react-hook-form"; - import { yupResolver } from "@hookform/resolvers/yup"; - import CustomAlertDialog from "../../Components/CustomAlertDialog"; - - export const investmentDoct = yup.object().shape({ - type: yup.string().required("Sponser name is required"), - document: yup.string().required("Sponser name is required"), - fileName: yup.string().required("Mobile no is required"), + Box, + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + DrawerOverlay, + FormControl, + FormErrorMessage, + FormLabel, + Image, + Input, + Stack, + useToast, +} from "@chakra-ui/react"; +import * as yup from "yup"; +import React, { useState } from "react"; +import { useForm, Controller } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import CustomAlertDialog from "../../Components/CustomAlertDialog"; +import { useCreateImageArtifactsMutation } from "../../Services/io.service"; +import { useParams } from "react-router-dom"; +import ToastBox from "../../Components/ToastBox"; + +const investmentImageSchema = yup.object().shape({ + artifactName: yup.string().required("Artifact image name is required"), + artifactPathName: yup.mixed().required("Artifact image is required"), +}); + +const IOArtifactsAdd = ({ isOpen, onClose, firstField }) => { + const params = useParams() + const id = params?.id + const [file, setFile] = useState(null); + const [preview, setPreview] = useState(null); + const [alert, setAlert] = useState(false); + const [loading, setIsLoading] = useState(false); + const toast = useToast(); + + const [ createImageArtifacts ] = useCreateImageArtifactsMutation() + + const { + control, + handleSubmit, + reset, + setValue, + formState: { errors }, + } = useForm({ + resolver: yupResolver(investmentImageSchema), }); + + console.log(errors); + + const onSubmit = async (data) => { + setIsLoading(true) + const formData = new FormData(); + formData.append('artifactName', data.artifactName); + formData.append('artifactPathName', file); // Assuming artifactPathName is an array of files - const IOArtifactsAdd = ({ id, isOpen, onClose, firstField }) => { - const [file, setFile] = useState(""); - const [fileName, setFileName] = useState(""); - const [alert, setAlert] = useState(false); - - const { - control, - handleSubmit, - formState: { errors }, - } = useForm({ - resolver: yupResolver(investmentDoct), - }); - - - - const onSubmit = (data) => { - setSponser([ - { - ...data, - status: true, - id: uuidv4(), - createdAt: new Date().toISOString(), - }, - ...investmentDoct, - ]); - }; - - const handleSave = () => { - setAlert(false) - onClose() - + console.log('FormData:', formData); + for (let [key, value] of formData.entries()) { + console.log(`${key}:`, value); } + + try { + const res = await createImageArtifacts({data: formData, id}) + if (res?.data?.statusCode === 200) { + toast({ + render: () => , + }); + reset() + setIsLoading(false) + setAlert(false); + onClose(); + } + + } catch (error) { + console.log(error); + } + + + - return ( - <> - - - - - IO Artifacts - - - - - File Name - setFileName(e.target.value)} - fontSize={"sm"} - type="text" - size={"sm"} - /> - - - Document - setFile(e.target.value)} - fontSize={"sm"} - type="file" - className="form-control" - size={"sm"} - /> - - - - - - - - - - - setAlert(false)} - alertHandler={handleSave} - message={"Are you sure you want to add this document?"} - /> - - ); + // Close the form/modal + // onClose(); }; - export default IOArtifactsAdd; - \ No newline at end of file + + const handleFileChange = (e) => { + const file = e.target.files[0]; + setFile(file); + setValue("artifactPathName", file) + const reader = new FileReader(); + reader.onloadend = () => { + setPreview(reader.result); + }; + reader.readAsDataURL(file); + }; + + const handleSave = () => { + handleSubmit(onSubmit)(); + }; + + const handleClose = () => { + + } + + return ( + <> + + + + + IO Artifacts Image + + + + + Artifact Name + ( + + )} + /> + + {errors.artifactName?.message} + + + + + Artifact Image + + + {!preview && errors.artifactPathName?.message && errors.artifactPathName?.message} + + {preview && } + + + + + + + + + + + + setAlert(false)} + alertHandler={handleSave} + message={"Are you sure you want to add this artifact?"} + isLoading={loading} + /> + + ); +}; + +export default IOArtifactsAdd; diff --git a/src/Pages/IO_Management/InvestmentDocuments.jsx b/src/Pages/IO_Management/InvestmentDocuments.jsx index bab1490..3a37bb5 100644 --- a/src/Pages/IO_Management/InvestmentDocuments.jsx +++ b/src/Pages/IO_Management/InvestmentDocuments.jsx @@ -42,7 +42,7 @@ export const getFileIcon = (type) => { return ; case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": case "application/msword": - return ; + return ; case "image/jpeg": case "image/png": case "image/gif": @@ -67,7 +67,6 @@ const InvestmentDocuments = ({ firstField, create, setCreate, - data }) => { const toast = useToast(); const params = useParams(); @@ -79,17 +78,12 @@ const InvestmentDocuments = ({ // =====================[ variables ] const id = params?.id; - const filterObject = data?.find((item)=> item?.id === id) - - console.log(filterObject); // =====================[ RTK Api calls ] const [createInvestmentDocument] = useCreateInvestmentDocumentsMutation(); const navigate = useNavigate(); - console.log(data); - const { register, handleSubmit, @@ -99,7 +93,6 @@ const InvestmentDocuments = ({ resolver: yupResolver(investmentDocSchema), }); - const onSubmit = async (data) => { console.log("sibmited"); console.log(errors); @@ -194,6 +187,7 @@ const InvestmentDocuments = ({ return ( <> Cancel - @@ -270,7 +269,7 @@ const InvestmentDocuments = ({ setAlert(false)} + onClose={() => setAlert(false)} alertHandler={handleConfirm} isLoading={isLoading} message="Are you sure you want to add this document?" diff --git a/src/Pages/IO_Management/KeyMeritsAdd.jsx b/src/Pages/IO_Management/KeyMeritsAdd.jsx index 3ac2bc6..c2d0f2a 100644 --- a/src/Pages/IO_Management/KeyMeritsAdd.jsx +++ b/src/Pages/IO_Management/KeyMeritsAdd.jsx @@ -11,9 +11,16 @@ import { FormControl, FormErrorMessage, FormLabel, + HStack, Image, Input, + Menu, + MenuButton, + MenuItem, + MenuList, Stack, + Text, + Textarea, useToast, } from "@chakra-ui/react"; import React, { useRef, useState } from "react"; @@ -23,44 +30,56 @@ import CustomAlertDialog from "../../Components/CustomAlertDialog"; import { useCreateKeyMeritsMutation } from "../../Services/io.service"; import * as yup from "yup"; import ToastBox from "../../Components/ToastBox"; +import { ChevronDownIcon } from "@chakra-ui/icons"; // Import ChevronDownIcon for the dropdown button const keyMeritsSchema = yup.object().shape({ meritsHeader: yup.string().required("Title is required"), - meritsDescription: yup.string().required("Sub title is required"), - iconImage: yup.mixed().required("Icon is required"), // Adjust based on file or string + meritsDescription: yup.string().required("Description is required"), + meritsHeaderArabic: yup.string().required("Arabic title is required"), + meritsDescriptionArabic: yup + .string() + .required("Arabic Description is required"), + icon_xid: yup.string().required("Icon is required"), // Adjust based on file or string }); -const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => { - const toast = useToast() +const KeyMeritsAdd = ({ isOpen, onClose, firstField, id, icons }) => { + const toast = useToast(); + const [formData, setFormData] = useState(null); const [alert, setAlert] = useState(false); const [createKeyMerits] = useCreateKeyMeritsMutation(); const [isLoading, setIsLoading] = useState(false); const [file, setFile] = useState(null); + const [selectedIcon, setSelectedIcon] = useState("Select Icon"); + const [selectedImageIcon, setSelectedImageIcon] = useState(null); const { control, reset, handleSubmit, + setValue, // Add setValue to programmatically set the selected icon formState: { errors }, } = useForm({ resolver: yupResolver(keyMeritsSchema), defaultValues: { meritsHeader: "", meritsDescription: "", - iconImage: null, + meritsHeaderArabic: "", + meritsDescriptionArabic: "", + icon_xid: "", }, }); - const onSubmit = async (data) => { + const onSubmit = (data) => { + if (Object.keys(errors).length === 0) { + console.log("hit"); + setFormData(data); + setAlert(true); + } + }; + + const handleConfirm = async () => { setIsLoading(true); try { - const formData = new FormData(); - formData.append("meritsHeader", data.meritsHeader); - formData.append("meritsDescription", data.meritsDescription); - if (data.iconImage && data.iconImage instanceof File) { - formData.append("iconImage", data.iconImage); - console.log(data.iconImage); - } const res = await createKeyMerits({ data: formData, id }); if (res?.data?.statusCode === 201) { toast({ @@ -69,38 +88,51 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => { setAlert(false); onClose(); setIsLoading(false); - reset() - return - } - if(res?.error?.data?.code === 400){ + reset(); + + return; + } + if (res?.error?.data?.code === 400) { toast({ - render: () => , + render: () => ( + + ), }); - setAlert(false); - onClose(); setIsLoading(false); - reset() - return + onClose(); + setAlert(false); + reset(); + setFile(null); + setSelectedImageIcon(null); + setSelectedIcon("Select Icon"); + return; } } catch (error) { if (error) { toast({ - render: () => , + render: () => ( + + ), }); } setIsLoading(false); - setAlert(false); onClose(); - reset() + setAlert(false); + reset(); + setFile(null); + setSelectedImageIcon(null); + setSelectedIcon("Select Icon"); } - reset() + reset(); }; const handleSave = () => { handleSubmit(onSubmit)(); }; - const handleFileChange = (e) => { const file = e.target.files[0]; console.log(file); @@ -109,46 +141,91 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => { } }; + const handleIconSelect = (id, iconName, iconFilePath) => { + setValue("icon_xid", id); + setSelectedIcon(iconName); // Update selected icon name + setSelectedImageIcon(iconFilePath); + }; + + const handleClose = () => { + onClose(); + setAlert(false); + reset(); + setFile(null); + setSelectedImageIcon(null); + setSelectedIcon("Select Icon"); + }; return ( <> - Key Merits + Key Merits - - - Title + + + + + Title (English) ( - )} - /> + )}/> {errors.meritsHeader?.message} - - Sub Title + + + + Title (Arabic) + ( + + )} + /> + + {errors.meritsHeaderArabic?.message} + + + + + Description (English) ( - )} /> @@ -156,33 +233,107 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => { {errors.meritsDescription?.message} - - Icon + + + + Description (Arabic) ( - { - onChange(e.target.files[0]); - handleFileChange(e); - }} - onBlur={onBlur} + render={({ field }) => ( +