add product id

src/pages/invoice/DetailPerfomaInvoice.tsx

@@ -89,6 +89,10 @@ const DetailPerfomaInvoice: FC = () => {
               {invoice.items?.map((item) => {
                 const discounts = formatItemDiscountDisplay(item);
                 const lineTotal = item.total ?? 0;
+                const convertToOrderUrl = `${Paths.convertToOrder}?${new URLSearchParams({
+                  invoiceItemId: item.id,
+                  productId: item.product?.id ?? '',
+                }).toString()}`;
                 return (
                   <tr key={item.id} className="border-b border-border/50">
                     <td className="py-3">{item.product?.title ?? '-'}</td>
@@ -105,7 +109,7 @@ const DetailPerfomaInvoice: FC = () => {
                     <td className="py-3">
                       {item.id && (
                         <Link
-                          to={Paths.convertToOrder + '?invoiceItemId=' + item.id}
+                          to={convertToOrderUrl}
                         >
                           <button
                             type="button"

src/pages/invoice/components/InvoiceItemRow.tsx

@@ -40,6 +40,12 @@ const InvoiceItemRow: FC<Props> = ({
   const total = getItemLineTotal(item);
   const subTotal = getItemSubTotal(item);
   const isPercentDiscount = item.discountPercent != null;
+  const convertToOrderUrl = item.id
+    ? `${Paths.convertToOrder}?${new URLSearchParams({
+      invoiceItemId: item.id,
+      productId: item.productId,
+    }).toString()}`
+    : "";
 
   const handleProductChange = (e: ChangeEvent<HTMLSelectElement>) => {
     onChange(index, "productId", e.target.value);
@@ -183,7 +189,7 @@ const InvoiceItemRow: FC<Props> = ({
           </button>
         )}
         {item.id && (
-          <Link to={Paths.convertToOrder + '?invoiceItemId=' + item.id}>
+          <Link to={convertToOrderUrl}>
             <button
               type="button"
               onClick={onConvertToOrder}