Styled Card - Copy this React, Mui Component to your project
Generate UI in form of table and it should be expandible for the same data [ { "@odata.etag": "W/\"JzE5OzkxNTEwMzQ5MDM3MTgwODAwNzcxOzAwOyc=\"", "id": "157ea2ee 0195 ef11 8a73 6045bdc91196", "number": "102202", "externalDocumentNumber": "", "invoiceDate": "2024 04 05", "postingDate": "2024 04 05", "dueDate": "2024 05 05", "promisedPayDate": "0001 01 01", "customerPurchaseOrderReference": "OPEN", "customerId": "91ffb1e2 0195 ef11 8a73 6045bdc91196", "customerNumber": "30000", "customerName": "John Haddock Insurance Co.", "billToName": "John Haddock Insurance Co.", "billToCustomerId": "91ffb1e2 0195 ef11 8a73 6045bdc91196", "billToCustomerNumber": "30000", "shipToName": "John Haddock Insurance Co.", "shipToContact": "Meagan Bond", "sellToAddressLine1": "10 High Tower Green", "sellToAddressLine2": "", "sellToCity": "Chicago", "sellToCountry": "US", "sellToState": "", "sellToPostCode": "US IL 61236", "billToAddressLine1": "10 High Tower Green", "billToAddressLine2": "", "billToCity": "Chicago", "billToCountry": "US", "billToState": "", "billToPostCode": "US IL 61236", "shipToAddressLine1": "10 High Tower Green", "shipToAddressLine2": "", "shipToCity": "Chicago", "shipToCountry": "US", "shipToState": "", "shipToPostCode": "US IL 61236", "currencyId": "00000000 0000 0000 0000 000000000000", "shortcutDimension1Code": "", "shortcutDimension2Code": "MEDIUM", "currencyCode": "INR", "orderId": "00000000 0000 0000 0000 000000000000", "orderNumber": "", "paymentTermsId": "71fdb1e2 0195 ef11 8a73 6045bdc91196", "shipmentMethodId": "00000000 0000 0000 0000 000000000000", "salesperson": "OF", "disputeStatusId": "00000000 0000 0000 0000 000000000000", "disputeStatus": "", "pricesIncludeTax": false, "remainingAmount": 2591.63, "discountAmount": 0, "discountAppliedBeforeTax": true, "totalAmountExcludingTax": 2591.63, "totalTaxAmount": 0, "totalAmountIncludingTax": 2591.63, "status": "Draft", "lastModifiedDateTime": "2024 12 06T06:33:28.237Z", "phoneNumber": "", "email": "miss.patricia.doyle@contoso.com", "salesInvoiceLines": [ { "@odata.etag": "W/\"JzIwOzEwOTY0NzYxNTcyNTU3NTE4Mzc1MTswMDsn\"", "id": "37cac80d 0295 ef11 8a73 6045bdc91196", "documentId": "157ea2ee 0195 ef11 8a73 6045bdc91196", "sequence": 10000, "itemId": "9dffb1e2 0195 ef11 8a73 6045bdc91196", "accountId": "00000000 0000 0000 0000 000000000000", "lineType": "Item", "lineObjectNumber": "1920 S", "description": "ANTWERP Conference Table", "description2": "", "unitOfMeasureId": "1d00b2e2 0195 ef11 8a73 6045bdc91196", "unitOfMeasureCode": "PCS", "quantity": 4, "unitPrice": 647.908, "discountAmount": 0, "discountPercent": 0, "discountAppliedBeforeTax": false, "amountExcludingTax": 2591.63, "taxCode": "STANDARD", "taxPercent": 0, "totalTaxAmount": 0, "amountIncludingTax": 2591.63, "invoiceDiscountAllocation": 0, "netAmount": 2591.63, "netTaxAmount": 0, "netAmountIncludingTax": 2591.63, "shipmentDate": "2024 10 28", "itemVariantId": "00000000 0000 0000 0000 000000000000", "locationId": "3afeb1e2 0195 ef11 8a73 6045bdc91196" } ] }, { "@odata.etag": "W/\"JzE5Ozc4MDEzNDI2NDk2MTk3MTU3NjAxOzAwOyc=\"", "id": "177ea2ee 0195 ef11 8a73 6045bdc91196", "number": "102203", "externalDocumentNumber": "", "invoiceDate": "2024 05 13", "postingDate": "2024 05 13", "dueDate": "2024 06 13", "promisedPayDate": "0001 01 01", "customerPurchaseOrderReference": "OPEN", "customerId": "91ffb1e2 0195 ef11 8a73 6045bdc91196", "customerNumber": "30000", "customerName": "John Haddock Insurance Co.", "billToName": "John Haddock Insurance Co.", "billToCustomerId": "91ffb1e2 0195 ef11 8a73 6045bdc91196", "billToCustomerNumber": "30000", "shipToName": "John Haddock Insurance Co.", "shipToContact": "Meagan Bond", "sellToAddressLine1": "10 High Tower Green", "sellToAddressLine2": "", "sellToCity": "Chicago", "sellToCountry": "US", "sellToState": "", "sellToPostCode": "US IL 61236", "billToAddressLine1": "10 High Tower Green", "billToAddressLine2": "", "billToCity": "Chicago", "billToCountry": "US", "billToState": "", "billToPostCode": "US IL 61236", "shipToAddressLine1": "10 High Tower Green", "shipToAddressLine2": "", "shipToCity": "Chicago", "shipToCountry": "US", "shipToState": "", "shipToPostCode": "US IL 61236", "currencyId": "00000000 0000 0000 0000 000000000000", "shortcutDimension1Code": "", "shortcutDimension2Code": "MEDIUM", "currencyCode": "INR", "orderId": "00000000 0000 0000 0000 000000000000", "orderNumber": "", "paymentTermsId": "71fdb1e2 0195 ef11 8a73 6045bdc91196", "shipmentMethodId": "00000000 0000 0000 0000 000000000000", "salesperson": "OF", "disputeStatusId": "00000000 0000 0000 0000 000000000000", "disputeStatus": "", "pricesIncludeTax": false, "remainingAmount": 6479.08, "discountAmount": 0, "discountAppliedBeforeTax": true, "totalAmountExcludingTax": 6479.08, "totalTaxAmount": 0, "totalAmountIncludingTax": 6479.08, "status": "Draft", "lastModifiedDateTime": "2024 12 06T06:33:28.28Z", "phoneNumber": "", "email": "miss.patricia.doyle@contoso.com", "salesInvoiceLines": [ { "@odata.etag": "W/\"JzIwOzE1MTY4NTkxMjQ2NjI1MDM0MzQxMTswMDsn\"", "id": "38cac80d 0295 ef11 8a73 6045bdc91196", "documentId": "177ea2ee 0195 ef11 8a73 6045bdc91196", "sequence": 10000, "itemId": "9dffb1e2 0195 ef11 8a73 6045bdc91196", "accountId": "00000000 0000 0000 0000 000000000000", "lineType": "Item", "lineObjectNumber": "1920 S", "description": "ANTWERP Conference Table", "description2": "", "unitOfMeasureId": "1d00b2e2 0195 ef11 8a73 6045bdc91196", "unitOfMeasureCode": "PCS", "quantity": 10, "unitPrice": 647.908, "discountAmount": 0, "discountPercent": 0, "discountAppliedBeforeTax": false, "amountExcludingTax": 6479.08, "taxCode": "STANDARD", "taxPercent": 0, "totalTaxAmount": 0, "amountIncludingTax": 6479.08, "invoiceDiscountAllocation": 0, "netAmount": 6479.08, "netTaxAmount": 0, "netAmountIncludingTax": 6479.08, "shipmentDate": "2024 10 28", "itemVariantId": "00000000 0000 0000 0000 000000000000", "locationId": "3afeb1e2 0195 ef11 8a73 6045bdc91196" } ] },