Hay una lista del backend. La lista entrante es la lista de facturas. Muestro estas facturas en 2 pestañas diferentes como pagadas y no pagadas. "status 3" de facturas pagadas. "estado 6" de facturas pagadas. A veces no hay facturas pendientes. En este caso, quiero eliminar la tabla de facturas impagas y reemplazarla con un mensaje de notificación.

pago-info.js

Aquí puedes ver dos pestañas diferentes

 <TabPanel value={value} index={0} > <PaymentTable variant="edit" paymentList={paymentInfoData} value={value} collectionMethod={collectionMethod} /> <div className={hiddenControlButtonClass}> <AS.Button variant="outlined" onClick={handlePayment}> Continue </AS.Button> </div> </TabPanel> <TabPanel value={value} index={1}> <PaymentTable variant="read" paymentList={paymentInfoData} value={value} /> </TabPanel>

tabla-de-pago.js

props.paymentList.policyInstallmentDtoList = artículo

 if (props.value === 0 && item.status !== '3') { ... //unpaid bills } if (props.value === 0 && !props.paymentInfoData?.policyInstallmentDtoList?.some((e) => e['status'] === '6')) { return ( <div>You do not have any outstanding invoices</div> ); } // I tried to print a message if there is no unpaid invoice by navigating the incoming list here. if (props.value === 1 && item.status === '3') { ... //paid invoice }

Como hay demasiadas líneas en los bloques if, lo escribí abreviado

¿Cómo imprimo el mensaje si no hay factura sin pagar?