Agent Zero
74 lines
2.5 KiB
TypeScript
74 lines
2.5 KiB
TypeScript
/**
|
|
* Contact Detail Page — loads a single contact by ID from route params.
|
|
*/
|
|
|
|
import React from 'react';
|
|
import { useParams, useNavigate } from 'react-router-dom';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { ContactDetail } from '@/components/contacts/ContactDetail';
|
|
import { ContactEditForm } from '@/components/contacts/ContactEditForm';
|
|
import { useWindowStore } from '@/store/windowStore';
|
|
import { useUnifiedContact, type UnifiedContact } from '@/api/hooks';
|
|
import { Button } from '@/components/ui/Button';
|
|
import { ChevronLeft } from 'lucide-react';
|
|
import { PrintButton } from '@/components/common/PrintButton';
|
|
import { usePermission } from '@/hooks/usePermission';
|
|
import { useAuthStore } from '@/store/authStore';
|
|
|
|
export function ContactDetailPage() {
|
|
const { t } = useTranslation();
|
|
const { id } = useParams<{ id: string }>();
|
|
const navigate = useNavigate();
|
|
const { data: contact, isLoading } = useUnifiedContact(id);
|
|
const openWindow = useWindowStore((s) => s.openWindow);
|
|
const { hasPermission } = usePermission();
|
|
const authUser = useAuthStore((state) => state.user);
|
|
const canAccess = (perm: string): boolean => {
|
|
return hasPermission(perm);
|
|
};
|
|
|
|
const handleEdit = () => {
|
|
if (contact) {
|
|
openWindow({
|
|
title: t('contacts.edit'),
|
|
type: 'contact-edit',
|
|
component: ContactEditForm,
|
|
componentProps: {
|
|
contact,
|
|
onClose: () => {},
|
|
onSaved: () => {},
|
|
},
|
|
});
|
|
}
|
|
};
|
|
|
|
const handleDeleted = () => {
|
|
navigate('/contacts');
|
|
};
|
|
|
|
return (
|
|
<div className="flex flex-col h-full" data-testid="contact-detail-page">
|
|
<div className="flex items-center gap-2 px-4 py-2 border-b border-secondary-200 bg-white">
|
|
<button
|
|
onClick={() => navigate('/contacts')}
|
|
className="inline-flex items-center gap-1 px-2 py-1 rounded text-sm text-secondary-700 hover:bg-secondary-100 min-h-touch"
|
|
aria-label={t('common.back')}
|
|
>
|
|
<ChevronLeft className="w-4 h-4" aria-hidden="true" strokeWidth={2} />
|
|
<span>{t('contacts.title')}</span>
|
|
</button>
|
|
<div className="flex-1" />
|
|
{canAccess('contacts:read') && <PrintButton targetId="contact-detail" />}
|
|
</div>
|
|
<div className="flex-1 overflow-y-auto" id="contact-detail">
|
|
<ContactDetail
|
|
contact={contact ?? null}
|
|
loading={isLoading}
|
|
onEdit={canAccess('contacts:write') ? handleEdit : undefined}
|
|
onDeleted={handleDeleted}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|