Compito: Creazione di una Notifica Chat

Progettare un meccanismo per visualizzare una notifica solo quando un utente ha messaggi non letti. Verificare se l'utente ha messaggi non letti. Se questa condizione è vera, mostrare una notifica che indica il numero di messaggi. Tuttavia, non visualizzare 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, visualizzare 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, è possibile controllare la sua proprietà length. La sintassi è - array.length.
2. In React, si utilizza l'operatore && per implementare la logica di una istruzione 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.