{/* Mobile Header */}
@@ -1028,72 +1220,120 @@ const validateClientAddress = useCallback((value) => {
(itemRefsMobile.current[index] = el)}
placeholder="Enter Description"
- className="w-full border-gray-300 text-black"
+ className={`w-full border-gray-300 text-black ${itemErrors[index]?.description ? "border-red-500" : ""}`}
name="description"
value={itemData[index]?.description ?? ""}
onChange={(e) => handleItemData(e, index)}
onSelectProduct={(product) => handleProductSelect(product, index)}
catalogMetadata={catalogMetadata}
/>
+ {itemErrors[index]?.description && (
+ {itemErrors[index].description}
+ )}
@@ -1148,56 +1383,77 @@ const validateClientAddress = useCallback((value) => {
)}
- {/* Desktop Layout - Grid */}
-
+
(itemRefsDesktop.current[index] = el)}
placeholder="Enter Description"
- className="w-full border-gray-300 text-black py-2"
+ className={`w-full border-gray-300 text-black py-2 ${itemErrors[index]?.description ? "border-red-500" : ""}`}
name="description"
value={itemData[index]?.description ?? ""}
onChange={(e) => handleItemData(e, index)}
onSelectProduct={(product) => handleProductSelect(product, index)}
catalogMetadata={catalogMetadata}
/>
+ {itemErrors[index]?.description && (
+ {itemErrors[index].description}
+ )}
-
+
handleItemData(e, index)}
+ onKeyDown={(e) => {
+ if (['e', 'E', '+', '-'].includes(e.key)) {
+ e.preventDefault();
+ }
+ }}
/>
-
+
handleItemData(e, index)}
/>
@@ -1209,12 +1465,7 @@ const validateClientAddress = useCallback((value) => {
className="w-full bg-gray-50 border-gray-300 text-gray-700 py-2"
name="amount"
disabled
- value={String(
- (parseFloat(itemData[index]?.qty) || 0) *
- (parseFloat(itemData[index]?.unitPrice) || 0) -
- (parseFloat(itemData[index]?.discount) || 0) +
- (parseFloat(itemData[index]?.tax) || 0)
- )}
+ value={getSafeLineAmountDisplay(itemData[index]) || "0"}
/>
@@ -1268,6 +1519,12 @@ const validateClientAddress = useCallback((value) => {
: selectedToken?.symbol || "TOKEN"}
+ {totalAmountError && (
+
+ )}
diff --git a/frontend/src/page/CreateInvoicesBatch.jsx b/frontend/src/page/CreateInvoicesBatch.jsx
index bbf0eaea..affdc308 100644
--- a/frontend/src/page/CreateInvoicesBatch.jsx
+++ b/frontend/src/page/CreateInvoicesBatch.jsx
@@ -7,7 +7,7 @@ import {
Contract,
ethers,
formatUnits,
- parseUnits,
+ JsonRpcProvider,
} from "ethers";
import { useAccount, useWalletClient } from "wagmi";
import { ChainvoiceABI } from "../contractsABI/ChainvoiceABI";
@@ -31,6 +31,7 @@ import {
AlertTriangle,
Users,
Receipt,
+ AlertCircle,
} from "lucide-react";
import { cn } from "@/lib/utils";
import { format } from "date-fns";
@@ -44,8 +45,18 @@ import TokenIntegrationRequest from "@/components/TokenIntegrationRequest";
import { ERC20_ABI } from "@/contractsABI/ERC20_ABI";
import WalletConnectionAlert from "../components/WalletConnectionAlert";
import TokenPicker, { ToggleSwitch } from "@/components/TokenPicker";
+import { AmountTypeToggle } from "../components/AmountTypeToggle";
import { CopyButton } from "@/components/ui/copyButton";
import CountryPicker from "@/components/CountryPicker";
+import {
+ getLineAmountDetails,
+ getSafeLineAmountDisplay,
+ INVOICE_DECIMALS,
+} from "@/utils/invoiceCalculations";
+import {
+ getClientAddressError,
+ validateBatchInvoiceData,
+} from "@/utils/invoiceValidation";
import ProductCatalogImport from "@/components/ProductCatalogImport";
import ProductAutocompleteInput from "@/components/ProductAutocompleteInput";
import { useProductCatalog } from "@/hooks/useProductCatalog";
@@ -54,6 +65,17 @@ import {
createEmptyInvoiceItem,
} from "@/utils/productCatalogInvoiceHelpers";
+/** Public RPC URLs by chain ID for token verification when visitor has no wallet. */
+const CHAIN_ID_TO_PUBLIC_RPC = {
+ 1: "https://eth.llamarpc.com",
+ 61: "https://etc.blockscout.com",
+ 137: "https://polygon-rpc.com",
+ 56: "https://bsc-dataseed.binance.org",
+ 8453: "https://mainnet.base.org",
+ 11155111: "https://rpc.ankr.com/eth_sepolia",
+ 5115: "https://rpc.testnet.citrea.xyz",
+};
+
function CreateInvoicesBatch() {
const { data: walletClient } = useWalletClient();
const { isConnected, chainId } = useAccount();
@@ -72,6 +94,10 @@ function CreateInvoicesBatch() {
const [tokenVerificationState, setTokenVerificationState] = useState("idle");
const [verifiedToken, setVerifiedToken] = useState(null);
const [showWalletAlert, setShowWalletAlert] = useState(!isConnected);
+ const [clientAddressErrors, setClientAddressErrors] = useState({});
+ const [rowTotalErrors, setRowTotalErrors] = useState({});
+ const [rowItemErrors, setRowItemErrors] = useState({});
+ const [fieldErrors, setFieldErrors] = useState({});
// UI state for collapsible invoices
const [expandedInvoice, setExpandedInvoice] = useState(0);
@@ -108,18 +134,16 @@ function CreateInvoicesBatch() {
setInvoiceRows((prev) =>
prev.map((row) => {
const total = row.itemData.reduce((sum, item) => {
- const qty = parseUnits(item.qty || "0", 18);
- const unitPrice = parseUnits(item.unitPrice || "0", 18);
- const discount = parseUnits(item.discount || "0", 18);
- const tax = parseUnits(item.tax || "0", 18);
- const lineTotal = (qty * unitPrice) / parseUnits("1", 18);
- const adjusted = lineTotal - discount + tax;
+ const { valid, amountWei } = getLineAmountDetails(item);
+ if (!valid) return sum;
+ let adjusted = amountWei;
+ if (adjusted < 0n) adjusted = 0n;
return sum + adjusted;
}, 0n);
return {
...row,
- totalAmountDue: formatUnits(total, 18),
+ totalAmountDue: formatUnits(total, INVOICE_DECIMALS),
};
})
);
@@ -131,6 +155,36 @@ function CreateInvoicesBatch() {
setShowWalletAlert(!isConnected);
}, [isConnected]);
+ const resolveTokenDecimals = async (tokenAddress, fallbackDecimals) => {
+ if (
+ fallbackDecimals !== undefined &&
+ fallbackDecimals !== null &&
+ !Number.isNaN(Number(fallbackDecimals))
+ ) {
+ return Number(fallbackDecimals);
+ }
+
+ try {
+ let provider;
+ const rpcUrl = chainId && CHAIN_ID_TO_PUBLIC_RPC[Number(chainId)];
+
+ if (rpcUrl) {
+ provider = new JsonRpcProvider(rpcUrl);
+ } else if (typeof window !== "undefined" && window.ethereum) {
+ provider = new BrowserProvider(window.ethereum);
+ } else {
+ return null;
+ }
+
+ const contract = new ethers.Contract(tokenAddress, ERC20_ABI, provider);
+ const decimals = await contract.decimals();
+ return Number(decimals);
+ } catch (error) {
+ console.warn("Failed to resolve token decimals:", error);
+ return null;
+ }
+ };
+
// Invoice management
const addInvoiceRow = () => {
const newIndex = invoiceRows.length;
@@ -149,16 +203,54 @@ function CreateInvoicesBatch() {
},
]);
setExpandedInvoice(newIndex);
- toast.success("New invoice added to batch");
};
const removeInvoiceRow = (index) => {
if (invoiceRows.length > 1) {
setInvoiceRows((prev) => prev.filter((_, i) => i !== index));
+ const reindexSimpleErrors = (prev) => {
+ const next = {};
+ Object.entries(prev).forEach(([key, value]) => {
+ const numericKey = Number(key);
+ if (numericKey < index) next[numericKey] = value;
+ if (numericKey > index) next[numericKey - 1] = value;
+ });
+ return next;
+ };
+
+ const reindexItemErrors = (prev) => {
+ const next = {};
+ Object.entries(prev).forEach(([key, value]) => {
+ const [rowStr, itemStr] = key.split("_");
+ const rowIndex = Number(rowStr);
+ if (rowIndex < index) next[key] = value;
+ if (rowIndex > index) next[`${rowIndex - 1}_${itemStr}`] = value;
+ });
+ return next;
+ };
+
+ const reindexFieldErrors = (prev) => {
+ const next = {};
+ Object.entries(prev).forEach(([key, value]) => {
+ if (!key.includes("_")) {
+ next[key] = value;
+ } else {
+ const [rowStr, fieldStr] = key.split("_");
+ const rowIndex = Number(rowStr);
+ if (rowIndex < index) next[key] = value;
+ if (rowIndex > index) next[`${rowIndex - 1}_${fieldStr}`] = value;
+ }
+ });
+ return next;
+ };
+
+ setClientAddressErrors(reindexSimpleErrors);
+ setRowTotalErrors(reindexSimpleErrors);
+ setFieldErrors(reindexFieldErrors);
+ setRowItemErrors(reindexItemErrors);
if (expandedInvoice === index) {
setExpandedInvoice(0);
}
- toast.success("Invoice removed from batch");
}
};
@@ -172,6 +264,20 @@ function CreateInvoicesBatch() {
const handleItemData = (e, rowIndex, itemIndex) => {
const { name, value } = e.target;
+ if (["qty", "unitPrice", "discount", "tax"].includes(name) && value !== "") {
+ if (/[^0-9.]/.test(value)) return;
+ const parts = value.split(".");
+ if (parts.length > 2) return;
+
+ const numValue = parseFloat(value);
+ if (
+ (name === "discount" && invoiceRows[rowIndex]?.itemData[itemIndex]?.discountType === "percentage" && (numValue < 0 || numValue > 100)) ||
+ (name === "tax" && invoiceRows[rowIndex]?.itemData[itemIndex]?.taxType === "percentage" && (numValue < 0 || numValue > 100))
+ ) {
+ return;
+ }
+ }
+
setInvoiceRows((prevRows) =>
prevRows.map((row, rIndex) => {
if (rIndex === rowIndex) {
@@ -184,15 +290,12 @@ function CreateInvoicesBatch() {
name === "discount" ||
name === "tax"
) {
- const qty = parseUnits(updatedItem.qty || "0", 18);
- const unitPrice = parseUnits(updatedItem.unitPrice || "0", 18);
- const discount = parseUnits(updatedItem.discount || "0", 18);
- const tax = parseUnits(updatedItem.tax || "0", 18);
-
- const lineTotal = (qty * unitPrice) / parseUnits("1", 18);
- const finalAmount = lineTotal - discount + tax;
-
- updatedItem.amount = formatUnits(finalAmount, 18);
+ const { valid } = getLineAmountDetails(updatedItem);
+ if (!valid) {
+ updatedItem.amount = "";
+ } else {
+ updatedItem.amount = getSafeLineAmountDisplay(updatedItem);
+ }
}
return updatedItem;
}
@@ -204,6 +307,20 @@ function CreateInvoicesBatch() {
return row;
})
);
+
+ if (rowItemErrors[`${rowIndex}_${itemIndex}`]?.[name]) {
+ setRowItemErrors((prev) => {
+ const next = { ...prev };
+ const itemErr = { ...next[`${rowIndex}_${itemIndex}`] };
+ delete itemErr[name];
+ if (Object.keys(itemErr).length === 0) {
+ delete next[`${rowIndex}_${itemIndex}`];
+ } else {
+ next[`${rowIndex}_${itemIndex}`] = itemErr;
+ }
+ return next;
+ });
+ }
};
const addItem = (rowIndex) => {
@@ -279,21 +396,126 @@ function CreateInvoicesBatch() {
// Enhanced error handling for batch creation
const getErrorMessage = (error) => {
- if (error.code === "ACTION_REJECTED") {
+ if (error?.code === "ACTION_REJECTED") {
return "Transaction was cancelled by user";
- } else if (error.message?.includes("insufficient")) {
+ }
+
+ if (error?.message?.toLowerCase().includes("insufficient")) {
return "Insufficient balance to complete transaction";
- } else if (error.message?.includes("network")) {
+ }
+
+ if (error?.message?.toLowerCase().includes("network")) {
return "Network error. Please check your connection and try again";
- } else if (error.reason) {
+ }
+
+ if (error?.reason) {
return `Transaction failed: ${error.reason}`;
- } else if (error.message) {
+ }
+
+ if (error?.message) {
return error.message;
+ }
+
+ return "Failed to create invoice batch. Please try again.";
+ };
+
+ const handleFieldChange = (name, value) => {
+ setUserInfo((prev) => ({ ...prev, [name]: value }));
+ if (fieldErrors[name]) {
+ setFieldErrors((prev) => {
+ const newErrors = { ...prev };
+ delete newErrors[name];
+ return newErrors;
+ });
+ }
+ };
+
+ const handleInvoiceChange = (rowIndex, field, value) => {
+ setInvoiceRows((prev) =>
+ prev.map((row, i) => (i === rowIndex ? { ...row, [field]: value } : row))
+ );
+
+ if (field === "clientAddress") {
+ if (clientAddressErrors[rowIndex]) {
+ setClientAddressErrors((prev) => {
+ const next = { ...prev };
+ delete next[rowIndex];
+ return next;
+ });
+ }
} else {
- return "Failed to create invoice batch. Please try again.";
+ if (fieldErrors[`${rowIndex}_${field}`]) {
+ setFieldErrors((prev) => {
+ const next = { ...prev };
+ delete next[`${rowIndex}_${field}`];
+ return next;
+ });
+ }
+ }
+ };
+
+ const handleFieldBlur = (name, value) => {
+ let error = "";
+ if (name === "userFname") {
+ if (!value.trim()) error = "First name is required";
+ } else if (name === "userEmail") {
+ if (!value.trim()) error = "Email is required";
+ else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) error = "Invalid email address";
+ }
+
+ if (error) {
+ setFieldErrors((prev) => ({ ...prev, [name]: error }));
}
};
+ const validateClientAddress = (rowIndex, value, options = {}) => {
+ const error = getClientAddressError(value, {
+ ...options,
+ ownerAddress: account.address,
+ });
+ setClientAddressErrors((prev) => {
+ if (!error && !prev[rowIndex]) return prev;
+ const next = { ...prev };
+ if (error) {
+ next[rowIndex] = error;
+ } else {
+ delete next[rowIndex];
+ }
+ return next;
+ });
+ return !error;
+ };
+
+ const validateInvoicesBeforeSubmit = (rows, paymentToken) => {
+ const validation = validateBatchInvoiceData({
+ rows,
+ paymentToken,
+ ownerAddress: account.address,
+ userInfo: userInfo,
+ });
+
+ if (!validation.isValid) {
+ setClientAddressErrors(validation.addressErrors || {});
+ setRowTotalErrors(validation.totalErrors || {});
+ setRowItemErrors(validation.itemErrors || {});
+ setFieldErrors(validation.fieldErrors || {});
+
+ const hasFieldErrors = Object.keys(validation.addressErrors || {}).length > 0 ||
+ Object.keys(validation.totalErrors || {}).length > 0 ||
+ Object.keys(validation.itemErrors || {}).length > 0 ||
+ Object.keys(validation.fieldErrors || {}).length > 0;
+
+ toast.error(validation.errorMessage || "Please fix the required fields");
+ return null;
+ }
+
+ setClientAddressErrors({});
+ setRowTotalErrors({});
+ setRowItemErrors({});
+ setFieldErrors({});
+ return { validInvoices: validation.validInvoices };
+ };
+
// Create batch invoices
const createInvoicesRequest = async () => {
if (!isConnected || !walletClient) {
@@ -315,17 +537,20 @@ function CreateInvoicesBatch() {
return;
}
- // Validate invoices
- const validInvoices = invoiceRows.filter(
- (row) => row.clientAddress && parseFloat(row.totalAmountDue) > 0
- );
+ const tokenDecimals = Number(paymentToken?.decimals);
+ if (!Number.isInteger(tokenDecimals) || tokenDecimals < 0) {
+ toast.error("Selected token has invalid decimals");
+ return;
+ }
- if (validInvoices.length === 0) {
- toast.error(
- "Please add at least one valid invoice with client address and amount"
- );
+ const validationResult = validateInvoicesBeforeSubmit(
+ invoiceRows,
+ paymentToken
+ );
+ if (!validationResult) {
return;
}
+ const { validInvoices } = validationResult;
// Prepare batch arrays
const tos = [];
@@ -350,7 +575,7 @@ function CreateInvoicesBatch() {
paymentToken: {
address: paymentToken.address,
symbol: paymentToken.symbol,
- decimals: Number(paymentToken.decimals),
+ decimals: tokenDecimals,
},
user: {
address: account?.address.toString(),
@@ -370,7 +595,10 @@ function CreateInvoicesBatch() {
city: row.clientCity,
postalcode: row.clientPostalcode,
},
- items: row.itemData,
+ items: row.itemData.map((item) => ({
+ ...item,
+ amount: getSafeLineAmountDisplay(item),
+ })),
// Add batch metadata
batchInfo: {
batchId: `batch_${Date.now()}`,
@@ -387,12 +615,20 @@ function CreateInvoicesBatch() {
// Add to batch arrays
tos.push(row.clientAddress);
- amounts.push(
- ethers.parseUnits(
+ let amountForContract;
+ try {
+ amountForContract = ethers.parseUnits(
row.totalAmountDue.toString(),
- paymentToken.decimals
- )
- );
+ tokenDecimals
+ );
+ } catch {
+ toast.error(
+ `Invoice #${index + 1} total exceeds ${tokenDecimals} decimals for ${paymentToken.symbol || "selected token"}`
+ );
+ return;
+ }
+
+ amounts.push(amountForContract);
encryptedPayloads.push(encryptedStringBase64);
encryptedHashes.push(dataToEncryptHash);
}
@@ -425,11 +661,7 @@ function CreateInvoicesBatch() {
toast.success(
`Successfully created ${validInvoices.length} invoices in batch!`
);
- toast.success(
- `Gas saved: ~${
- (validInvoices.length - 1) * 75
- }% compared to individual transactions!`
- );
+ toast.success(`Estimated gas savings: ~${(validInvoices.length - 1) * 75}%`);
setTimeout(() => navigate("/dashboard/sent"), 3000);
} catch (err) {
@@ -604,19 +836,18 @@ function CreateInvoicesBatch() {
{
+ onSelect={async (token) => {
+ const address = token.contract_address || token.address;
+ const decimals = await resolveTokenDecimals(
+ address,
+ token.decimals
+ );
+
+ if (decimals === null) {
+ toast.error(
+ "Failed to fetch token decimals for selected token"
+ );
+ return false;
+ }
+
setSelectedToken({
- address: token.contract_address,
+ address,
symbol: token.symbol,
name: token.name,
logo: token.image,
- decimals: 18,
+ decimals,
});
toast.success(`Selected ${token.symbol}`);
+ return true;
}}
chainId={account?.chainId || 1}
disabled={loading}
@@ -906,75 +1150,58 @@ function CreateInvoicesBatch() {
Client Information
-
-
+
- updateInvoiceRow(
- rowIndex,
- "clientFname",
- e.target.value
- )
- }
+ onChange={(e) => handleInvoiceChange(rowIndex, "clientFname", e.target.value)}
/>
+ {fieldErrors[`${rowIndex}_clientFname`] && (
+
{fieldErrors[`${rowIndex}_clientFname`]}
+ )}
-
+
- updateInvoiceRow(
- rowIndex,
- "clientLname",
- e.target.value
- )
- }
+ onChange={(e) => handleInvoiceChange(rowIndex, "clientLname", e.target.value)}
/>
-
+
- updateInvoiceRow(
- rowIndex,
- "clientEmail",
- e.target.value
- )
- }
+ onChange={(e) => handleInvoiceChange(rowIndex, "clientEmail", e.target.value)}
/>
+ {fieldErrors[`${rowIndex}_clientEmail`] && (
+
{fieldErrors[`${rowIndex}_clientEmail`]}
+ )}
-
+
DESCRIPTION
QTY
UNIT PRICE
-
DISCOUNT
-
TAX(%)
+
+
+ DISCOUNT
+
{
+ setInvoiceRows((prev) =>
+ prev.map((r, ri) => {
+ if (ri === rowIndex) {
+ return {
+ ...r,
+ itemData: r.itemData.map((item) => {
+ const updated = { ...item, discountType: newType };
+ const { valid } = getLineAmountDetails(updated);
+ updated.amount = valid ? getSafeLineAmountDisplay(updated) : "";
+ return updated;
+ })
+ };
+ }
+ return r;
+ })
+ );
+ }}
+ />
+
+
+
+
+ TAX
+
{
+ setInvoiceRows((prev) =>
+ prev.map((r, ri) => {
+ if (ri === rowIndex) {
+ return {
+ ...r,
+ itemData: r.itemData.map((item) => {
+ const updated = { ...item, taxType: newType };
+ const { valid } = getLineAmountDetails(updated);
+ updated.amount = valid ? getSafeLineAmountDisplay(updated) : "";
+ return updated;
+ })
+ };
+ }
+ return r;
+ })
+ );
+ }}
+ />
+
+
AMOUNT
ACTION
@@ -1020,18 +1297,21 @@ function CreateInvoicesBatch() {
{row.itemData.map((item, itemIndex) => (
(itemRefs.current[`${rowIndex}-${itemIndex}`] = el)}
placeholder="Enter Description"
- className="w-full border-gray-300 text-black"
+ className={`w-full border-gray-300 text-black ${rowItemErrors[`${rowIndex}_${itemIndex}`]?.description ? "border-red-500" : ""}`}
name="description"
value={item.description}
onChange={(e) =>
@@ -1042,64 +1322,130 @@ function CreateInvoicesBatch() {
}
catalogMetadata={catalogMetadata}
/>
-
+ {rowItemErrors[`${rowIndex}_${itemIndex}`]?.description && (
+
{rowItemErrors[`${rowIndex}_${itemIndex}`].description}
+ )}
+
-
-
diff --git a/frontend/src/utils/invoiceCalculations.js b/frontend/src/utils/invoiceCalculations.js
new file mode 100644
index 00000000..457136b6
--- /dev/null
+++ b/frontend/src/utils/invoiceCalculations.js
@@ -0,0 +1,88 @@
+import { formatUnits, parseUnits } from "ethers";
+
+export const INVOICE_DECIMALS = 18;
+const ONE_INVOICE_UNIT = parseUnits("1", INVOICE_DECIMALS);
+const HUNDRED_INVOICE_UNITS = parseUnits("100", INVOICE_DECIMALS);
+
+export const parseNumericInputToWei = (value) => {
+ const normalized = String(value ?? "").trim();
+
+ if (!normalized) return 0n;
+ if (
+ normalized === "." ||
+ normalized === "-" ||
+ !/^-?\d*(\.\d*)?$/.test(normalized)
+ ) {
+ return null;
+ }
+
+ try {
+ return parseUnits(normalized, INVOICE_DECIMALS);
+ } catch {
+ return null;
+ }
+};
+
+export const getLineAmountDetails = (item) => {
+ const qtyWei = parseNumericInputToWei(item?.qty);
+ const unitPriceWei = parseNumericInputToWei(item?.unitPrice);
+ const discountWei = parseNumericInputToWei(item?.discount);
+ const taxRateWei = parseNumericInputToWei(item?.tax);
+
+ if (
+ qtyWei === null ||
+ unitPriceWei === null ||
+ discountWei === null ||
+ taxRateWei === null
+ ) {
+ return {
+ valid: false,
+ amountWei: 0n,
+ lineTotalWei: 0n,
+ qtyWei: 0n,
+ unitPriceWei: 0n,
+ discountWei: 0n,
+ taxRateWei: 0n,
+ taxAmountWei: 0n,
+ };
+ }
+
+ const lineTotalWei = (qtyWei * unitPriceWei) / ONE_INVOICE_UNIT;
+
+ const discountType = item?.discountType || "amount";
+ const taxType = item?.taxType || "percentage";
+
+ let finalDiscountWei = 0n;
+ if (discountType === "percentage") {
+ finalDiscountWei = (lineTotalWei * discountWei) / HUNDRED_INVOICE_UNITS;
+ } else {
+ finalDiscountWei = discountWei;
+ }
+
+ let taxAmountWei = 0n;
+ if (taxType === "percentage") {
+ taxAmountWei = (lineTotalWei * taxRateWei) / HUNDRED_INVOICE_UNITS;
+ } else {
+ taxAmountWei = taxRateWei;
+ }
+
+ const amountWei = lineTotalWei - finalDiscountWei + taxAmountWei;
+
+ return {
+ valid: true,
+ amountWei,
+ lineTotalWei,
+ qtyWei,
+ unitPriceWei,
+ discountWei,
+ taxRateWei,
+ taxAmountWei,
+ };
+};
+
+export const getSafeLineAmountDisplay = (item) => {
+ const { valid, amountWei } = getLineAmountDetails(item);
+ if (!valid) return "";
+ const safeAmount = amountWei < 0n ? 0n : amountWei;
+ return formatUnits(safeAmount, INVOICE_DECIMALS);
+};
diff --git a/frontend/src/utils/invoiceValidation.js b/frontend/src/utils/invoiceValidation.js
new file mode 100644
index 00000000..4d249d1e
--- /dev/null
+++ b/frontend/src/utils/invoiceValidation.js
@@ -0,0 +1,329 @@
+import { ethers } from "ethers";
+import { getLineAmountDetails, parseNumericInputToWei } from "./invoiceCalculations";
+
+export const getClientAddressError = (value, options = {}) => {
+ const { required = false, ownerAddress } = options;
+ const trimmed = (value || "").trim();
+
+ if (!trimmed) {
+ return required ? "Please enter a client wallet address" : "";
+ }
+
+ if (!trimmed.startsWith("0x") || trimmed.length !== 42 || !ethers.isAddress(trimmed)) {
+ return "Please enter a valid wallet address";
+ }
+
+ if (ownerAddress && trimmed.toLowerCase() === ownerAddress.toLowerCase()) {
+ return "You cannot create an invoice for your own wallet";
+ }
+
+ return "";
+};
+
+const getTokenDecimalsError = (amountAsString, paymentToken) => {
+ const tokenDecimals = Number(paymentToken?.decimals);
+ if (!Number.isInteger(tokenDecimals) || tokenDecimals < 0) {
+ return null;
+ }
+
+ try {
+ ethers.parseUnits(amountAsString.toString(), tokenDecimals);
+ return null;
+ } catch {
+ return `Invoice total supports up to ${tokenDecimals} decimals for ${paymentToken?.symbol || "selected token"}`;
+ }
+};
+
+const getLineItemError = (lineLabel, item) => {
+ let errors = {};
+
+ if (!item.description || !item.description.trim()) {
+ errors.description = "Required";
+ }
+
+ const { valid, amountWei, qtyWei, unitPriceWei, discountWei, taxRateWei } = getLineAmountDetails(item);
+
+ if (!item.qty || qtyWei === 0n) {
+ errors.qty = "Required";
+ } else if (qtyWei < 0n) {
+ errors.qty = "Cannot be negative";
+ }
+
+ if (!item.unitPrice || unitPriceWei === 0n) {
+ errors.unitPrice = "Required";
+ } else if (unitPriceWei < 0n) {
+ errors.unitPrice = "Cannot be negative";
+ }
+
+ const HUNDRED_PERCENT_WEI = 100000000000000000000n; // 100 * 10^18
+
+ if (discountWei < 0n) {
+ errors.discount = "Cannot be negative";
+ } else if (item.discountType === "percentage" && discountWei > HUNDRED_PERCENT_WEI) {
+ errors.discount = "Cannot exceed 100%";
+ }
+
+ if (taxRateWei < 0n) {
+ errors.tax = "Cannot be negative";
+ } else if (item.taxType === "percentage" && taxRateWei > HUNDRED_PERCENT_WEI) {
+ errors.tax = "Cannot exceed 100%";
+ }
+
+ if (!valid) {
+ errors.amount = "Invalid number format";
+ } else if (amountWei < 0n) {
+ errors.amount = "Amount cannot be negative. Reduce discount or update values";
+ }
+
+ if (Object.keys(errors).length > 0) {
+ return errors;
+ }
+
+ return null;
+};
+
+export const validateSingleInvoiceData = ({
+ clientAddress,
+ itemData,
+ totalAmountDue,
+ paymentToken,
+ ownerAddress,
+ userFname,
+ userEmail,
+ clientFname,
+ clientEmail,
+}) => {
+ const fieldErrors = {};
+ let hasFieldErrors = false;
+
+ const addressError = getClientAddressError(clientAddress, {
+ required: true,
+ ownerAddress,
+ });
+
+ if (addressError) {
+ fieldErrors.clientAddress = addressError;
+ hasFieldErrors = true;
+ }
+
+ if (!userFname || !userFname.trim()) {
+ fieldErrors.userFname = "First name is required";
+ hasFieldErrors = true;
+ }
+
+ if (!userEmail || !userEmail.trim()) {
+ fieldErrors.userEmail = "Email is required";
+ hasFieldErrors = true;
+ } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(userEmail)) {
+ fieldErrors.userEmail = "Invalid email address";
+ hasFieldErrors = true;
+ }
+
+ if (!clientFname || !clientFname.trim()) {
+ fieldErrors.clientFname = "First name is required";
+ hasFieldErrors = true;
+ }
+
+ if (!clientEmail || !clientEmail.trim()) {
+ fieldErrors.clientEmail = "Email is required";
+ hasFieldErrors = true;
+ } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(clientEmail)) {
+ fieldErrors.clientEmail = "Invalid email address";
+ hasFieldErrors = true;
+ }
+
+ let hasItemErrors = false;
+ const itemErrorsObj = {};
+
+ const isItemBlank = (item) => {
+ return !item.description && !item.qty && !item.unitPrice && !item.discount && !item.tax;
+ };
+
+ for (let i = 0; i < itemData.length; i += 1) {
+ if (itemData.length > 1 && isItemBlank(itemData[i])) {
+ continue;
+ }
+ const itemErrors = getLineItemError(`Line item ${i + 1}`, itemData[i]);
+ if (itemErrors) {
+ itemErrorsObj[`item_${i}`] = itemErrors;
+ hasItemErrors = true;
+ }
+ }
+
+ if (hasItemErrors || hasFieldErrors) {
+ // If there is an address error, we can prioritize its message, otherwise a generic one.
+ const errorMessage = addressError || "Please fix the required fields";
+ return {
+ isValid: false,
+ errorMessage,
+ fieldErrors: { ...itemErrorsObj, ...fieldErrors },
+ };
+ }
+
+ const totalWei = parseNumericInputToWei(totalAmountDue);
+ if (totalWei === null || totalWei <= 0n) {
+ return {
+ isValid: false,
+ errorMessage: "Invoice total must be greater than 0",
+ fieldErrors: { totalAmountDue: "Invoice total must be greater than 0" },
+ };
+ }
+
+ const decimalsError = getTokenDecimalsError(totalAmountDue, paymentToken);
+ if (decimalsError) {
+ return {
+ isValid: false,
+ errorMessage: decimalsError,
+ fieldErrors: { totalAmountDue: decimalsError },
+ };
+ }
+
+ return {
+ isValid: true,
+ errorMessage: "",
+ fieldErrors: {},
+ };
+};
+
+export const validateBatchInvoiceData = ({
+ rows,
+ paymentToken,
+ ownerAddress,
+ userInfo,
+}) => {
+ const normalizedRows = rows.map((row) => ({
+ ...row,
+ clientAddress: (row.clientAddress || "").trim(),
+ }));
+
+ const duplicateTracker = new Map();
+ const pendingAddressErrors = {};
+ const pendingTotalErrors = {};
+ const pendingItemErrors = {};
+ const pendingFieldErrors = {};
+
+ let globalHasErrors = false;
+
+ if (!userInfo?.userFname || !userInfo.userFname.trim()) {
+ pendingFieldErrors.userFname = "First name is required";
+ globalHasErrors = true;
+ }
+
+ if (!userInfo?.userEmail || !userInfo.userEmail.trim()) {
+ pendingFieldErrors.userEmail = "Email is required";
+ globalHasErrors = true;
+ } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(userInfo.userEmail)) {
+ pendingFieldErrors.userEmail = "Invalid email address";
+ globalHasErrors = true;
+ }
+
+ for (let rowIndex = 0; rowIndex < normalizedRows.length; rowIndex += 1) {
+ const row = normalizedRows[rowIndex];
+ const rowLabel = `Invoice #${rowIndex + 1}`;
+ const hasMeaningfulInput = row.clientAddress || parseFloat(row.totalAmountDue) > 0;
+
+ if (!hasMeaningfulInput) {
+ continue;
+ }
+
+ const addressError = getClientAddressError(row.clientAddress, {
+ required: true,
+ ownerAddress,
+ });
+
+ if (addressError) {
+ pendingAddressErrors[rowIndex] = addressError;
+ globalHasErrors = true;
+ }
+
+ if (!row.clientFname || !row.clientFname.trim()) {
+ pendingFieldErrors[`${rowIndex}_clientFname`] = "First name is required";
+ globalHasErrors = true;
+ }
+
+ if (!row.clientEmail || !row.clientEmail.trim()) {
+ pendingFieldErrors[`${rowIndex}_clientEmail`] = "Email is required";
+ globalHasErrors = true;
+ } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(row.clientEmail)) {
+ pendingFieldErrors[`${rowIndex}_clientEmail`] = "Invalid email address";
+ globalHasErrors = true;
+ }
+
+ const normalizedAddress = row.clientAddress.toLowerCase();
+ if (normalizedAddress && !addressError) {
+ if (duplicateTracker.has(normalizedAddress)) {
+ const firstIndex = duplicateTracker.get(normalizedAddress);
+ pendingAddressErrors[firstIndex] = "Duplicate wallet address in batch";
+ pendingAddressErrors[rowIndex] = "Duplicate wallet address in batch";
+ globalHasErrors = true;
+ } else {
+ duplicateTracker.set(normalizedAddress, rowIndex);
+ }
+ }
+
+ const isItemBlank = (item) => {
+ return !item.description && !item.qty && !item.unitPrice && !item.discount && !item.tax;
+ };
+
+ for (let itemIndex = 0; itemIndex < row.itemData.length; itemIndex += 1) {
+ if (row.itemData.length > 1 && isItemBlank(row.itemData[itemIndex])) {
+ continue;
+ }
+ const itemErrors = getLineItemError(`${rowLabel}, line item ${itemIndex + 1}`, row.itemData[itemIndex]);
+ if (itemErrors) {
+ pendingItemErrors[`${rowIndex}_${itemIndex}`] = itemErrors;
+ globalHasErrors = true;
+ }
+ }
+
+ const totalWei = parseNumericInputToWei(row.totalAmountDue);
+ if (totalWei === null || totalWei <= 0n) {
+ pendingTotalErrors[rowIndex] = "Invoice total must be greater than 0";
+ globalHasErrors = true;
+ }
+
+ const decimalsError = getTokenDecimalsError(row.totalAmountDue, paymentToken);
+ if (decimalsError) {
+ pendingTotalErrors[rowIndex] = decimalsError;
+ globalHasErrors = true;
+ }
+ }
+
+ const validInvoices = normalizedRows.filter(
+ (row) => row.clientAddress && parseFloat(row.totalAmountDue) > 0
+ );
+
+ if (globalHasErrors) {
+ return {
+ isValid: false,
+ errorMessage: "Please fix the required fields",
+ addressErrors: pendingAddressErrors,
+ totalErrors: pendingTotalErrors,
+ itemErrors: pendingItemErrors,
+ fieldErrors: pendingFieldErrors,
+ validInvoices: [],
+ };
+ }
+
+ if (validInvoices.length === 0) {
+ return {
+ isValid: false,
+ errorMessage: "Please add at least one valid invoice with client address and amount",
+ addressErrors: pendingAddressErrors,
+ totalErrors: pendingTotalErrors,
+ itemErrors: pendingItemErrors,
+ fieldErrors: pendingFieldErrors,
+ validInvoices: [],
+ };
+ }
+
+ return {
+ isValid: true,
+ errorMessage: "",
+ addressErrors: {},
+ totalErrors: {},
+ itemErrors: {},
+ fieldErrors: {},
+ validInvoices,
+ };
+};
\ No newline at end of file
diff --git a/frontend/src/utils/productCatalogInvoiceHelpers.js b/frontend/src/utils/productCatalogInvoiceHelpers.js
index 9bb71b20..81de977a 100644
--- a/frontend/src/utils/productCatalogInvoiceHelpers.js
+++ b/frontend/src/utils/productCatalogInvoiceHelpers.js
@@ -1,7 +1,6 @@
-import { formatUnits, parseUnits } from 'ethers';
+// import { parseUnits } from 'ethers';
-const PRECISION = 18;
-const ONE = parseUnits('1', PRECISION);
+import { getSafeLineAmountDisplay } from './invoiceCalculations';
export const createEmptyInvoiceItem = () => ({
id: crypto.randomUUID(),
@@ -11,27 +10,10 @@ export const createEmptyInvoiceItem = () => ({
discount: '',
tax: '',
amount: '',
+ discountType: 'amount',
+ taxType: 'percentage',
});
-/**
- * Computes the line-item amount from qty, unitPrice, discount, and tax.
- * Returns a formatted string or "0" on invalid input.
- */
-const computeLineAmount = (qty, unitPrice, discount, tax) => {
- try {
- const qtyBN = parseUnits(qty || '0', PRECISION);
- const priceBN = parseUnits(unitPrice || '0', PRECISION);
- const discountBN = parseUnits(discount || '0', PRECISION);
- const taxBN = parseUnits(tax || '0', PRECISION);
-
- const lineTotal = (qtyBN * priceBN) / ONE;
- const finalAmount = lineTotal - discountBN + taxBN;
- return formatUnits(finalAmount, PRECISION);
- } catch {
- return '0';
- }
-};
-
/**
* Applies product catalog data onto an existing invoice item,
* filling description, price, and optional fields.
@@ -46,12 +28,7 @@ export const applyProductToInvoiceItem = (item, product) => {
qty: String(product.qty ?? (item.qty || '1')),
};
- updatedItem.amount = computeLineAmount(
- updatedItem.qty,
- updatedItem.unitPrice,
- updatedItem.discount,
- updatedItem.tax,
- );
+ updatedItem.amount = getSafeLineAmountDisplay(updatedItem);
return updatedItem;
};