# Pull Request Template ## Description This PR fixes a crash where opening a conversation threw `TypeError: Cannot read properties of null (reading 'localeCompare')` and prevented the agent assignment dropdown from rendering. Since #14866, agent bots are included in the assignable agents list. `AgentBot#name` is not presence-validated, so system bots (account-less, global) can have a `null` name. Those nameless bots flowed into name-based operations that assumed a string, causing crashes and warnings across multiple surfaces: * **Assignment dropdown sort:** `getAgentsByAvailability` called `a.name.localeCompare(b.name)`, causing a `localeCompare` `TypeError`. * **Dropdown search:** `MultiselectDropdownItems` called `option.name.toLowerCase()`, causing a `toLowerCase` `TypeError`. * **Agent Bots settings:** `Avatar` received `name=null` for a `String` prop, triggering a Vue prop validation warning. ### What changed * Keep nameless agent bots in the assignment dropdown and render a `-` fallback label in `useAgentsList`. These are still valid, assignable-by-ID records: the assignable agents API includes accessible bots, and `Conversations::AssignmentService` assigns them by ID. Preserving them avoids hiding valid assignment targets. Bots are still included only when `includeAgentBots` is enabled. * Make the sort in `getAgentsByAvailability` null-safe by coercing missing names to an empty string (defense in depth). * Make the search filter in `MultiselectDropdownItems` null-safe (defense in depth). * Pass a null-safe `name` prop to `Avatar` in the Agent Bots settings list to eliminate the Vue prop validation warning. Fixes https://linear.app/chatwoot/issue/CW-7670/agent-assignment-dropdown-crashes-with-cannot-read-properties-of-null ## Type of change - [x] Bug fix (non-breaking change which fixes an issue) ## How Has This Been Tested? 1. Have a system agent bot (`name: null`) that is assignable to an inbox. 2. Open any conversation in that inbox. * The agent assignment dropdown renders without console errors. * The nameless bot is listed with a `-` label and can be assigned. 3. Go to **Settings → Agent Bots**. * The page renders without the `Avatar` prop validation warning. ## Checklist: - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my code - [x] I have commented on my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] Any dependent changes have been merged and published in downstream modules
107 lines
3.0 KiB
JavaScript
107 lines
3.0 KiB
JavaScript
import {
|
|
getAgentsByAvailability,
|
|
getSortedAgentsByAvailability,
|
|
getAgentsByUpdatedPresence,
|
|
} from '../agentHelper';
|
|
import {
|
|
allAgentsData,
|
|
onlineAgentsData,
|
|
busyAgentsData,
|
|
offlineAgentsData,
|
|
sortedByAvailability,
|
|
formattedAgentsByPresenceOnline,
|
|
formattedAgentsByPresenceOffline,
|
|
} from 'dashboard/helper/specs/fixtures/agentFixtures';
|
|
|
|
describe('agentHelper', () => {
|
|
describe('getAgentsByAvailability', () => {
|
|
it('returns agents by availability', () => {
|
|
expect(getAgentsByAvailability(allAgentsData, 'online')).toEqual(
|
|
onlineAgentsData
|
|
);
|
|
expect(getAgentsByAvailability(allAgentsData, 'busy')).toEqual(
|
|
busyAgentsData
|
|
);
|
|
expect(getAgentsByAvailability(allAgentsData, 'offline')).toEqual(
|
|
offlineAgentsData
|
|
);
|
|
});
|
|
|
|
it('does not throw when an agent has a null name', () => {
|
|
const agents = [
|
|
{ id: 1, name: null, availability_status: 'offline' },
|
|
{ id: 2, name: 'Zoe', availability_status: 'offline' },
|
|
];
|
|
|
|
expect(() => getAgentsByAvailability(agents, 'offline')).not.toThrow();
|
|
expect(
|
|
getAgentsByAvailability(agents, 'offline').map(agent => agent.id)
|
|
).toEqual([1, 2]);
|
|
});
|
|
});
|
|
|
|
describe('getSortedAgentsByAvailability', () => {
|
|
it('returns sorted agents by availability', () => {
|
|
expect(getSortedAgentsByAvailability(allAgentsData)).toEqual(
|
|
sortedByAvailability
|
|
);
|
|
});
|
|
|
|
it('returns an empty array when given an empty input', () => {
|
|
expect(getSortedAgentsByAvailability([])).toEqual([]);
|
|
});
|
|
|
|
it('maintains the order of agents with the same availability status', () => {
|
|
const result = getSortedAgentsByAvailability(allAgentsData);
|
|
expect(result[2].name).toBe('Honey Bee');
|
|
expect(result[3].name).toBe('Samuel Keta');
|
|
});
|
|
});
|
|
|
|
describe('getAgentsByUpdatedPresence', () => {
|
|
it('returns agents with updated presence', () => {
|
|
const currentUser = {
|
|
id: 1,
|
|
accounts: [{ id: 1, availability_status: 'offline' }],
|
|
};
|
|
const currentAccountId = 1;
|
|
|
|
expect(
|
|
getAgentsByUpdatedPresence(
|
|
formattedAgentsByPresenceOnline,
|
|
currentUser,
|
|
currentAccountId
|
|
)
|
|
).toEqual(formattedAgentsByPresenceOffline);
|
|
});
|
|
|
|
it('does not modify other agents presence', () => {
|
|
const currentUser = {
|
|
id: 2,
|
|
accounts: [{ id: 1, availability_status: 'offline' }],
|
|
};
|
|
const currentAccountId = 1;
|
|
|
|
expect(
|
|
getAgentsByUpdatedPresence(
|
|
formattedAgentsByPresenceOnline,
|
|
currentUser,
|
|
currentAccountId
|
|
)
|
|
).toEqual(formattedAgentsByPresenceOnline);
|
|
});
|
|
|
|
it('handles empty agent list', () => {
|
|
const currentUser = {
|
|
id: 1,
|
|
accounts: [{ id: 1, availability_status: 'offline' }],
|
|
};
|
|
const currentAccountId = 1;
|
|
|
|
expect(
|
|
getAgentsByUpdatedPresence([], currentUser, currentAccountId)
|
|
).toEqual([]);
|
|
});
|
|
});
|
|
});
|