feat(ui): display total contact count

Valik3201 · Jan 23, 2024 · 86d05b7 · 86d05b7
1 parent f1ce057
commit 86d05b7
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/components/ContactList.jsx b/src/components/ContactList.jsx
@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import { useState } from 'react';
-import { ListGroup, Row, Col, Button } from 'react-bootstrap';
+import { ListGroup, Row, Col, Button, Alert } from 'react-bootstrap';
 import { ContactEditModal } from './ContactEditModal';
 
 /**
@@ -65,6 +65,13 @@ export const ContactList = ({
 
   return (
     <>
+      {sortedContacts.length === 0 ? (
+        <Alert variant="danger">No contacts found. Please add contacts.</Alert>
+      ) : (
+        <Alert variant="primary">
+          You have {sortedContacts.length} contacts.
+        </Alert>
+      )}
       <ListGroup as="ul">
         {sortedContacts.map(contact => (
           <ContactListItem