Uppgift: Skapa chattnotifikation

Utveckla en mekanism för att visa en notifikation endast när en användare har olästa meddelanden. Vi ska kontrollera om användaren har några olästa meddelanden. Om detta villkor är uppfyllt, visas en notifikation som anger antalet meddelanden. Om användaren inte har några meddelanden visas ingenting.

Uppgiften är:

• Skapa två komponenter: App som föräldrakomponent och Notification som barnkomponent.
• Föräldrakomponenten, App, ska skicka en prop som heter messages till barnkomponenten. messages-propen är en array som innehåller meddelanden. I barnkomponenten behöver du kontrollera längden på messages-arrayen.
• Om det finns några meddelanden i arrayen, visa en sträng som säger: You have <amount> of unread messages. Här ska <amount> ersättas med det faktiska antalet olästa meddelanden.

1. För att avgöra om det finns några meddelanden i arrayen kan vi kontrollera dess length med hjälp av length-egenskapen. Syntaxen är - array.length.
2. I React används operatorn && för att implementera logiken för ett if-villkor.
3. För att konstruera strängen korrekt, ersätt platshållaren amount med det faktiska värdet av arrayens längd.
4. Använd måsvingar {array.length} för att sätta in arrayens längd i strängen.