Compito: Creazione di una Notifica Chat

Progettiamo un meccanismo per mostrare una notifica solo quando un utente ha messaggi non letti. Verificheremo se l'utente ha messaggi non letti. Se questa condizione è vera, mostreremo una notifica che indica il numero di messaggi. Tuttavia, non verrà visualizzato nulla se l'utente non ha messaggi.

Il compito è:

• Creare due componenti: App come componente genitore e Notification come componente figlio.
• Il componente genitore, App, deve passare una prop chiamata messages al componente figlio. La prop messages è un array che contiene i messaggi. Nel componente figlio, è necessario controllare la lunghezza dell'array messages.
• Se ci sono messaggi nell'array, mostrare una stringa che dice: You have <amount> of unread messages. Il <amount> deve essere sostituito con il numero effettivo di messaggi non letti.

1. Per determinare se ci sono messaggi nell'array, possiamo controllare la sua proprietà length utilizzando la sintassi - array.length.
2. In React, utilizziamo l'operatore && per implementare la logica di una dichiarazione if.
3. Per costruire correttamente la stringa, sostituire il segnaposto amount con la lunghezza effettiva dell'array.
4. Utilizzare le parentesi graffe {array.length} per inserire la lunghezza dell'array nella stringa.