modified enable option only active contact

This commit is contained in:
Pramod Mahajan 2025-05-23 16:56:52 +05:30
parent af996196a1
commit 6943f4e9ca

View File

@ -3,11 +3,11 @@ import Avatar from "../common/Avatar";
import {getBucketNameById} from "./DirectoryUtils"; import {getBucketNameById} from "./DirectoryUtils";
import {useBuckets} from "../../hooks/useDirectory"; import {useBuckets} from "../../hooks/useDirectory";
import { getPhoneIcon } from "./DirectoryUtils"; import { getPhoneIcon } from "./DirectoryUtils";
const CardViewDirectory = ( {contact, setSelectedContact, setIsOpenModal, setOpen_contact, setIsOpenModalNote, IsDeleted} ) => const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModal, setOpen_contact, setIsOpenModalNote, IsDeleted} ) =>
{ {
const {buckets} = useBuckets() const {buckets} = useBuckets()
return ( return (
<div className="card text-start border-1"> <div className="card text-start border-1" style={{background:`${!IsActive ? "#f8f6f6":""}`}}>
<div className="card-body px-1 py-2 pb-0"> <div className="card-body px-1 py-2 pb-0">
<div className="d-flex justify-content-between"> <div className="d-flex justify-content-between">
<div className="d-flex align-items-center"> <div className="d-flex align-items-center">
@ -23,7 +23,7 @@ const CardViewDirectory = ( {contact, setSelectedContact, setIsOpenModal, setOpe
<p className="m-0">{contact.name}</p> <p className="m-0">{contact.name}</p>
</div> </div>
<div> <div>
<div className="dropdown z-2 "> <div className={`dropdown z-2 ${!IsActive && "d-none"}`}>
<button <button
type="button" type="button"
className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0" className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0"
@ -40,12 +40,18 @@ const CardViewDirectory = ( {contact, setSelectedContact, setIsOpenModal, setOpe
></i> ></i>
</button> </button>
<ul className="dropdown-menu dropdown-menu-end w-auto"> <ul className="dropdown-menu dropdown-menu-end w-auto">
<li <li
onClick={() => { onClick={() => {
setSelectedContact(contact); if (!IsActive) {
setIsOpenModal(true); setSelectedContact(contact);
}} setIsOpenModal(true);
> }
}}
style={{
cursor: IsActive ? 'not-allowed' : 'pointer',
opacity: IsActive ? 0.6 : 1,
}}
>
<a className="dropdown-item px-2 py-0"> <a className="dropdown-item px-2 py-0">
<i className="bx bx-pencil bx-xs me-2"></i> <i className="bx bx-pencil bx-xs me-2"></i>
<span className="align-left small-text">Modify</span> <span className="align-left small-text">Modify</span>
@ -73,8 +79,12 @@ const CardViewDirectory = ( {contact, setSelectedContact, setIsOpenModal, setOpe
</div> </div>
<div className="card-footer text-start px-1 py-1" onClick={() => <div className="card-footer text-start px-1 py-1" onClick={() =>
{ {
if ( IsActive )
{
setIsOpenModalNote(true) setIsOpenModalNote(true)
setOpen_contact(contact) setOpen_contact(contact)
}
}}> }}>
<hr className="my-0" /> <hr className="my-0" />
{contact.contactEmails[0] && ( {contact.contactEmails[0] && (
@ -108,19 +118,19 @@ const CardViewDirectory = ( {contact, setSelectedContact, setIsOpenModal, setOpe
</li> </li>
</ul> </ul>
<ul className="list-inline m-0"> <ul className="list-inline m-0">
{contact.bucketIds.map( ( bucketId ) => ( {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>
<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></>
))}
</ul>
</div> </div>
</div> </div>
); );