Clicking an email address in the viewer already shows a contact detail sidebar. An "Edit" button now appears there (for known contacts) that navigates directly to the contact edit form via the existing URL-param intent system (?contactId=…&view=edit), removing the need to open the Contacts page manually and search for the contact.
107 lines
3.1 KiB
TypeScript
107 lines
3.1 KiB
TypeScript
import { render, screen, fireEvent } from '@testing-library/react';
|
|
import { describe, it, expect, vi, beforeEach } from 'vitest';
|
|
import { ContactSidebarPanel } from '../email-viewer';
|
|
import type { ContactCard } from '@/lib/jmap/types';
|
|
|
|
const contact: ContactCard = {
|
|
id: 'c1',
|
|
addressBookIds: {},
|
|
name: {
|
|
components: [
|
|
{ kind: 'given', value: 'Alice' },
|
|
{ kind: 'surname', value: 'Smith' },
|
|
],
|
|
isOrdered: true,
|
|
},
|
|
emails: { e0: { address: 'alice@example.com' } },
|
|
};
|
|
|
|
const unknownEmail = 'unknown@example.com';
|
|
|
|
describe('ContactSidebarPanel', () => {
|
|
beforeEach(() => {
|
|
Object.assign(navigator, {
|
|
clipboard: { writeText: vi.fn().mockResolvedValue(undefined) },
|
|
});
|
|
});
|
|
|
|
it('shows Edit button when contact is known and onEditContact is provided', () => {
|
|
render(
|
|
<ContactSidebarPanel
|
|
email="alice@example.com"
|
|
contact={contact}
|
|
onClose={vi.fn()}
|
|
onEditContact={vi.fn()}
|
|
/>,
|
|
);
|
|
// useTranslations mock returns the key, so we look for the common.edit key
|
|
expect(screen.getByTitle('contact_sidebar.action_edit_title')).toBeInTheDocument();
|
|
expect(screen.getByText('edit')).toBeInTheDocument();
|
|
});
|
|
|
|
it('calls onEditContact when Edit button is clicked', () => {
|
|
const onEditContact = vi.fn();
|
|
render(
|
|
<ContactSidebarPanel
|
|
email="alice@example.com"
|
|
contact={contact}
|
|
onClose={vi.fn()}
|
|
onEditContact={onEditContact}
|
|
/>,
|
|
);
|
|
fireEvent.click(screen.getByTitle('contact_sidebar.action_edit_title'));
|
|
expect(onEditContact).toHaveBeenCalledOnce();
|
|
});
|
|
|
|
it('does not show Edit button when contact is null', () => {
|
|
render(
|
|
<ContactSidebarPanel
|
|
email={unknownEmail}
|
|
contact={null}
|
|
onClose={vi.fn()}
|
|
onEditContact={vi.fn()}
|
|
/>,
|
|
);
|
|
expect(screen.queryByTitle('contact_sidebar.action_edit_title')).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('does not show Edit button when onEditContact is not provided', () => {
|
|
render(
|
|
<ContactSidebarPanel
|
|
email="alice@example.com"
|
|
contact={contact}
|
|
onClose={vi.fn()}
|
|
/>,
|
|
);
|
|
expect(screen.queryByTitle('contact_sidebar.action_edit_title')).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('shows "not in contacts" message and Add button for unknown email', () => {
|
|
const onAddToContacts = vi.fn();
|
|
render(
|
|
<ContactSidebarPanel
|
|
email={unknownEmail}
|
|
contact={null}
|
|
onClose={vi.fn()}
|
|
onAddToContacts={onAddToContacts}
|
|
/>,
|
|
);
|
|
expect(screen.getByText('contact_sidebar.not_in_contacts')).toBeInTheDocument();
|
|
fireEvent.click(screen.getByText('contact_sidebar.add_to_contacts'));
|
|
expect(onAddToContacts).toHaveBeenCalledWith(unknownEmail, undefined);
|
|
});
|
|
|
|
it('calls onClose when the close button is clicked', () => {
|
|
const onClose = vi.fn();
|
|
render(
|
|
<ContactSidebarPanel
|
|
email="alice@example.com"
|
|
contact={contact}
|
|
onClose={onClose}
|
|
/>,
|
|
);
|
|
fireEvent.click(screen.getByLabelText('contact_sidebar.close'));
|
|
expect(onClose).toHaveBeenCalledOnce();
|
|
});
|
|
});
|