Update order page

app/dashboard/orders/[id]/page.tsx

@@ -1,4 +1,3 @@
-
 "use client";
 
 import { fetchData } from '@/lib/data-service';
@@ -34,6 +33,7 @@ interface Order {
   status: string;
   pgpAddress: string;
   shippingMethod: { type: string; price: number };
+  txid: Array<string>;
   products: Array<{
     _id: string;
     productId: string;
@@ -75,6 +75,7 @@ export default function OrderDetailsPage() {
       results.forEach((product, index) => {
         productNamesMap[productIds[index]] = product.name || "Unknown Product";
       });
+
     } catch (err) {
       console.error("Failed to fetch product names:", err);
     }
@@ -130,6 +131,7 @@ export default function OrderDetailsPage() {
 
         const data: Order = await res;
         setOrder(data);
+        console.log(data);
 
         const productIds = data.products.map((product) => product.productId);
         const productNamesMap = await fetchProductNames(productIds, authToken);
@@ -292,6 +294,28 @@ export default function OrderDetailsPage() {
             </Table>
           </CardContent>
         </Card>
+
+        {/* Add Crypto Transaction Details */}
+        <div className="rounded-lg border bg-card text-card-foreground shadow-sm">
+          <div className="p-6">
+            <h3 className="text-lg font-semibold mb-4">Crypto Transactions</h3>
+            {order?.txid && order.txid.length > 0 ? (
+              <div className="space-y-3">
+                {order.txid.slice(order.txid.length > 2 ? 1 : 0).map((txid: string, index: number) => (
+                  <div 
+                    key={index}
+                    className="p-3 bg-muted rounded-md"
+                  >
+                    <code className="text-sm">{txid}</code>
+                  </div>
+                ))}
+              </div>
+            ) : (
+              <p className="text-muted-foreground">No crypto transactions associated with this order</p>
+            )}
+          </div>
+        </div>
+
         <div className="flex justify-end space-x-4">
           <Button size="lg" onClick={handleMarkAsPaid} disabled={isPaid}>
             {isPaid ? "Order Marked as Paid" : "Mark Order as Paid"}