fix: remove availableContacts state and update contact filtering logic
This commit is contained in:
@@ -7,7 +7,6 @@ import Badge from "@/components/ui/Badge";
|
|||||||
export default function ProjectContactSelector({ projectId, onChange }) {
|
export default function ProjectContactSelector({ projectId, onChange }) {
|
||||||
const [contacts, setContacts] = useState([]);
|
const [contacts, setContacts] = useState([]);
|
||||||
const [projectContacts, setProjectContacts] = useState([]);
|
const [projectContacts, setProjectContacts] = useState([]);
|
||||||
const [availableContacts, setAvailableContacts] = useState([]);
|
|
||||||
const [showSelector, setShowSelector] = useState(false);
|
const [showSelector, setShowSelector] = useState(false);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
const [searchTerm, setSearchTerm] = useState("");
|
const [searchTerm, setSearchTerm] = useState("");
|
||||||
@@ -37,7 +36,6 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
setProjectContacts(data);
|
setProjectContacts(data);
|
||||||
updateAvailableContacts(data);
|
|
||||||
onChange?.(data);
|
onChange?.(data);
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@@ -45,14 +43,6 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateAvailableContacts(linkedContacts) {
|
|
||||||
const linkedIds = linkedContacts.map((c) => c.contact_id);
|
|
||||||
const available = contacts.filter(
|
|
||||||
(c) => !linkedIds.includes(c.contact_id)
|
|
||||||
);
|
|
||||||
setAvailableContacts(available);
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleAddContact(contactId) {
|
async function handleAddContact(contactId) {
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
try {
|
try {
|
||||||
@@ -125,14 +115,14 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const filteredAvailable = searchTerm
|
const filteredAvailable = searchTerm
|
||||||
? availableContacts.filter(
|
? contacts.filter(
|
||||||
(c) =>
|
(c) =>
|
||||||
c.name?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
c.name?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
||||||
c.phone?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
c.phone?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
||||||
c.email?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
c.email?.toLowerCase().includes(searchTerm.toLowerCase()) ||
|
||||||
c.company?.toLowerCase().includes(searchTerm.toLowerCase())
|
c.company?.toLowerCase().includes(searchTerm.toLowerCase())
|
||||||
)
|
)
|
||||||
: availableContacts;
|
: contacts;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
@@ -246,15 +236,22 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
<p className="text-sm text-gray-500 text-center py-4">
|
<p className="text-sm text-gray-500 text-center py-4">
|
||||||
{searchTerm
|
{searchTerm
|
||||||
? "Nie znaleziono kontaktów"
|
? "Nie znaleziono kontaktów"
|
||||||
: "Wszystkie kontakty są już dodane"}
|
: "Brak dostępnych kontaktów"}
|
||||||
</p>
|
</p>
|
||||||
) : (
|
) : (
|
||||||
filteredAvailable.map((contact) => {
|
filteredAvailable.map((contact) => {
|
||||||
const typeBadge = getContactTypeBadge(contact.contact_type);
|
const typeBadge = getContactTypeBadge(contact.contact_type);
|
||||||
|
const isAlreadyAdded = projectContacts.some(
|
||||||
|
(pc) => pc.contact_id === contact.contact_id
|
||||||
|
);
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
key={contact.contact_id}
|
key={contact.contact_id}
|
||||||
className="flex items-center justify-between p-2 hover:bg-gray-50 rounded border border-gray-200"
|
className={`flex items-center justify-between p-2 rounded border ${
|
||||||
|
isAlreadyAdded
|
||||||
|
? "bg-gray-100 border-gray-300"
|
||||||
|
: "hover:bg-gray-50 border-gray-200"
|
||||||
|
}`}
|
||||||
>
|
>
|
||||||
<div className="flex-1">
|
<div className="flex-1">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
@@ -264,6 +261,11 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
<Badge variant={typeBadge.variant} size="xs">
|
<Badge variant={typeBadge.variant} size="xs">
|
||||||
{typeBadge.label}
|
{typeBadge.label}
|
||||||
</Badge>
|
</Badge>
|
||||||
|
{isAlreadyAdded && (
|
||||||
|
<Badge variant="secondary" size="xs">
|
||||||
|
Już dodany
|
||||||
|
</Badge>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="text-xs text-gray-600 mt-1">
|
<div className="text-xs text-gray-600 mt-1">
|
||||||
{contact.phone && <span>{contact.phone}</span>}
|
{contact.phone && <span>{contact.phone}</span>}
|
||||||
@@ -282,9 +284,9 @@ export default function ProjectContactSelector({ projectId, onChange }) {
|
|||||||
type="button"
|
type="button"
|
||||||
size="sm"
|
size="sm"
|
||||||
onClick={() => handleAddContact(contact.contact_id)}
|
onClick={() => handleAddContact(contact.contact_id)}
|
||||||
disabled={loading}
|
disabled={loading || isAlreadyAdded}
|
||||||
>
|
>
|
||||||
Dodaj
|
{isAlreadyAdded ? "Dodany" : "Dodaj"}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user