From 0d09bfda0411d2146c93cfb978124a0e40a0955f Mon Sep 17 00:00:00 2001
From: Pramod Mahajan <pramodmahajan1411200@gmail.com>
Date: Fri, 23 May 2025 18:22:01 +0530
Subject: [PATCH] added in List view active or inactive contacts

---
 .../Directory/CardViewDirectory.jsx           | 99 ++++++++++---------
 1 file changed, 55 insertions(+), 44 deletions(-)

diff --git a/src/components/Directory/CardViewDirectory.jsx b/src/components/Directory/CardViewDirectory.jsx
index 657f7353..a7fe7d32 100644
--- a/src/components/Directory/CardViewDirectory.jsx
+++ b/src/components/Directory/CardViewDirectory.jsx
@@ -1,13 +1,23 @@
 import React from "react";
 import Avatar from "../common/Avatar";
-import {getBucketNameById} from "./DirectoryUtils";
-import {useBuckets} from "../../hooks/useDirectory";
+import { getBucketNameById } from "./DirectoryUtils";
+import { useBuckets } from "../../hooks/useDirectory";
 import { getPhoneIcon } from "./DirectoryUtils";
-const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModal, setOpen_contact, setIsOpenModalNote, IsDeleted} ) =>
-{
-  const {buckets} = useBuckets()
+const CardViewDirectory = ({
+  IsActive,
+  contact,
+  setSelectedContact,
+  setIsOpenModal,
+  setOpen_contact,
+  setIsOpenModalNote,
+  IsDeleted,
+}) => {
+  const { buckets } = useBuckets();
   return (
-    <div className="card text-start border-1" style={{background:`${!IsActive ? "#f8f6f6":""}`}}>
+    <div
+      className="card text-start border-1"
+      style={{ background: `${!IsActive ? "#f8f6f6" : ""}` }}
+    >
       <div className="card-body  px-1 py-2 pb-0">
         <div className="d-flex justify-content-between">
           <div className="d-flex align-items-center">
@@ -40,25 +50,23 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
                 ></i>
               </button>
               <ul className="dropdown-menu dropdown-menu-end w-auto">
-             <li
-  onClick={() => {
-    if (!IsActive) {
-      setSelectedContact(contact);
-      setIsOpenModal(true);
-    }
-  }}
-  style={{
-    cursor: IsActive ? 'not-allowed' : 'pointer',
-    opacity: IsActive ? 0.6 : 1,
-  }}
->
+                <li
+                  onClick={() => {
+                    setSelectedContact(contact);
+                    setIsOpenModal(true);
+                  }}
+                 
+                >
                   <a className="dropdown-item px-2 py-0">
                     <i className="bx bx-pencil bx-xs me-2"></i>
                     <span className="align-left small-text">Modify</span>
                   </a>
                 </li>
                 <li>
-                  <a className="dropdown-item  px-2 py-0" onClick={()=> IsDeleted(contact.id)}>
+                  <a
+                    className="dropdown-item  px-2 py-0"
+                    onClick={() => IsDeleted(contact.id)}
+                  >
                     <i className="bx bx-trash bx-xs me-2"></i>
                     <span className="align-left small-text">Delete</span>
                   </a>
@@ -69,23 +77,23 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
         </div>
 
         <ul className="list-inline m-0 ps-4">
-          <li className="list-inline-item me-1" style={{fontSize:"10px"}}>
+          <li className="list-inline-item me-1" style={{ fontSize: "10px" }}>
             <i className="bx bx-building bx-xs"></i>
           </li>
-          <li className="list-inline-item" style={{fontSize:"10px"}}>
+          <li className="list-inline-item" style={{ fontSize: "10px" }}>
             {contact.organization}
           </li>
         </ul>
       </div>
-      <div className="card-footer text-start px-1 py-1" onClick={() =>
-      {
-        if ( IsActive )
-        {
-        
-        setIsOpenModalNote(true)
-        setOpen_contact(contact)
-      }
-      }}>
+      <div
+        className="card-footer text-start px-1 py-1"
+        onClick={() => {
+          if (IsActive) {
+            setIsOpenModalNote(true);
+            setOpen_contact(contact);
+          }
+        }}
+      >
         <hr className="my-0" />
         {contact.contactEmails[0] && (
           <ul className="list-inline my-1 ">
@@ -101,7 +109,11 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
         {contact.contactPhones[0] && (
           <ul className="list-inline m-0">
             <li className="list-inline-item me-2">
-              <i className={` ${getPhoneIcon(contact.contactPhones[0].label)} bx-xs`} ></i>
+              <i
+                className={` ${getPhoneIcon(
+                  contact.contactPhones[0].label
+                )} bx-xs`}
+              ></i>
             </li>
             <li className="list-inline-item small-text">
               {contact.contactPhones[0]?.phoneNumber}
@@ -118,19 +130,18 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
           </li>
         </ul>
 
-       <ul className="list-inline m-0">
-  {contact.bucketIds.map((bucketId) => (
-    <React.Fragment key={bucketId}>
-      <li className="list-inline-item me-1">
-        <i className="bx bx-pin bx-xs"></i>
-      </li>
-      <li className="list-inline-item small-text">
-        {getBucketNameById(buckets, bucketId)}
-      </li>
-    </React.Fragment>
-  ))}
-</ul>
-
+        <ul className="list-inline m-0">
+          {contact.bucketIds.map((bucketId) => (
+            <React.Fragment key={bucketId}>
+              <li className="list-inline-item me-1">
+                <i className="bx bx-pin bx-xs"></i>
+              </li>
+              <li className="list-inline-item small-text">
+                {getBucketNameById(buckets, bucketId)}
+              </li>
+            </React.Fragment>
+          ))}
+        </ul>
       </div>
     </div>
   );