@servicetitan/titan-chat-ui 2.0.0 → 2.0.2

package/src/stores/__tests__/chat-ui.store.test.ts

@@ -0,0 +1,531 @@
+import { expect } from '@jest/globals';
+import { initTestContainer } from '@local/utils';
+import { FileDescriptor } from '@servicetitan/form';
+import { Container } from '@servicetitan/react-ioc';
+import {
+    ChatCustomizations,
+    ChatEndReason,
+    ChatError,
+    ChatMessageModelBase,
+    ChatMessageModelText,
+    ChatMessageModelWelcome,
+    ChatMessageState,
+    ChatParticipantIcon,
+    ChatRunState,
+} from '../../models';
+import { ChatUiEvent, ChatUiStore, symbolAgent, symbolUser } from '../chat-ui.store';
+
+const mockAudio = {
+    Audio: {
+        play: jest.fn().mockResolvedValue(undefined),
+    },
+};
+const mockEventEmitter = {
+    on: jest.fn(),
+    off: jest.fn(),
+    emit: jest.fn(),
+    listeners: jest.fn(),
+    listenerCount: jest.fn(),
+};
+jest.mock('events', () => ({
+    EventEmitter: class {
+        on = mockEventEmitter.on;
+        off = mockEventEmitter.off;
+        emit = mockEventEmitter.emit;
+        listeners = mockEventEmitter.listeners;
+        listenerCount = mockEventEmitter.listenerCount;
+    },
+}));
+
+const initContainer = initTestContainer(ChatUiStore, () => {});
+
+describe('[ChatUiStore]', () => {
+    let container: Container;
+    let store: ChatUiStore<ChatCustomizations>;
+    let audioBackup: any;
+
+    beforeEach(() => {
+        container = initContainer();
+        store = container.get(ChatUiStore);
+        jest.useFakeTimers();
+        jest.setSystemTime(Date.parse('2021-01-01T00:00:00.000Z'));
+        audioBackup = global.Audio;
+        global.Audio = jest.fn().mockImplementation(() => ({
+            play: mockAudio.Audio.play,
+        }));
+    });
+
+    afterEach(() => {
+        if (audioBackup) {
+            global.Audio = audioBackup;
+        }
+        jest.useRealTimers();
+        jest.clearAllMocks();
+        mockEventEmitter.on.mockClear();
+        mockEventEmitter.off.mockClear();
+        mockEventEmitter.emit.mockClear();
+        mockEventEmitter.listeners.mockClear();
+        mockEventEmitter.listenerCount.mockClear();
+    });
+
+    test('should initialize with default values', () => {
+        expect(store.isAgentTyping).toBe(false);
+        expect(store.status).toBe(ChatRunState.Offline);
+        expect(store.isFilePickerEnabled).toBe(false);
+        expect(store.file).toBeUndefined();
+        expect(store.currentFileMessage).toBeUndefined();
+        expect(store.error).toBeUndefined();
+        expect(store.endReason).toBeUndefined();
+        expect(store.messages).toEqual([]);
+        expect(store.scrollCounter).toBe(1);
+        expect(store.timer).toBeUndefined();
+        expect(store.participants[symbolAgent].isAgent).toBe(true);
+        expect(store.participants[symbolAgent].name).toBe('Agent');
+        expect(store.participants[symbolAgent].icon).toBe(ChatParticipantIcon.Initials);
+        expect(store.participants[symbolUser].isAgent).toBe(false);
+        expect(store.participants[symbolUser].name).toBe('User');
+        expect(store.participants[symbolUser].icon).toBe(ChatParticipantIcon.Initials);
+        // Getters
+        expect(store.agent).toBe(store.participants[symbolAgent]);
+        expect(store.user).toBe(store.participants[symbolUser]);
+        expect(store.isStarted).toBe(false);
+        expect(store.isError).toBe(false);
+        expect(store.isEnded).toBe(false);
+        expect(store.isStarting).toBe(false);
+        expect(store.customizations).toEqual({});
+    });
+
+    test('should subscribe and unsubscribe to events', () => {
+        const mockCallback = jest.fn();
+        store.on('testEvent', mockCallback);
+        expect(mockEventEmitter.on).toHaveBeenCalledWith('testEvent', mockCallback);
+
+        store.off('testEvent', mockCallback);
+        expect(mockEventEmitter.off).toHaveBeenCalledWith('testEvent', mockCallback);
+    });
+
+    test('should set customizations context', async () => {
+        const customizations = { abc: '123' } as ChatCustomizations;
+        store.setCustomizationContext(customizations);
+        expect(store.customizations).toEqual(customizations);
+        await checkScrollTriggered();
+    });
+
+    test('should getLastFailedMessages', () => {
+        store.addMessage(false, 'message1');
+        const m2 = store.addMessage(false, 'message2');
+        const m3 = store.addMessage(false, 'message3');
+        expect(store.getLastFailedMessages()).toEqual([]);
+
+        store.setMessageState(m3, ChatMessageState.Failed);
+        let failedMessages = store.getLastFailedMessages();
+        expect(failedMessages).toEqual([m3]);
+
+        store.setMessageState(m2, ChatMessageState.Failed);
+        failedMessages = store.getLastFailedMessages();
+        expect(failedMessages).toEqual([m3, m2]);
+    });
+
+    describe('with file messages', () => {
+        test('should set file', () => {
+            const file = mockFile();
+            store.setFile(file);
+            expect(store.file).toBe(file);
+
+            store.setFile(undefined);
+            expect(store.file).toBeUndefined();
+        });
+
+        test('should set file picker enabled state', async () => {
+            store.setFile(mockFile());
+            store.setFilePickerEnabled(true);
+            expect(store.isFilePickerEnabled).toBe(true);
+            expect(store.file).toBeUndefined();
+            await checkScrollTriggered();
+
+            store.setFile(mockFile());
+            store.setFilePickerEnabled(false);
+            expect(store.isFilePickerEnabled).toBe(false);
+            expect(store.file).toBeUndefined();
+            await checkScrollTriggered();
+        });
+    });
+
+    describe('with chat errors', () => {
+        test('should set error', async () => {
+            store.setError('Test error', {
+                title: 'Test error title',
+                recoverStrategy: { recoverButtonTitle: 'Test error button' },
+                data: { some: 'data' },
+            });
+            expect(store.error?.toJSON()).toEqual({
+                data: { some: 'data' },
+                message: 'Test error',
+                name: 'ChatError',
+                recoverStrategy: {
+                    recoverButtonTitle: 'Test error button',
+                },
+                title: 'Test error title',
+            });
+            expect(store.status).toBe(ChatRunState.Error);
+            expect(store.isError).toBe(true);
+            await checkScrollTriggered();
+        });
+
+        test('should reset error', async () => {
+            store.setError('Test error');
+            store.resetError(ChatRunState.Started);
+            expect(store.error).toBeUndefined();
+            expect(store.status).toBe(ChatRunState.Started);
+            await checkScrollTriggered();
+        });
+    });
+
+    describe('with messages', () => {
+        function expectText(message: ChatMessageModelBase, expected: string) {
+            expect(message.type).toBe('message');
+            expect((message as ChatMessageModelText).message).toBe(expected);
+        }
+
+        test('should add message without sound', async () => {
+            store.addMessageWelcome('welcome');
+            await jest.runOnlyPendingTimersAsync();
+            expect(mockAudio.Audio.play).toHaveBeenCalledTimes(0);
+        });
+
+        test('should add message', async () => {
+            store.setIncomingSound('non-existing-sound.mp3');
+            store.setIncomingSound('non-existing-sound2.mp3');
+
+            // Welcome message
+            store.addMessageWelcome('welcome');
+            await jest.runOnlyPendingTimersAsync();
+            expect(mockAudio.Audio.play).toHaveBeenCalledTimes(1);
+
+            // Incoming message
+            store.addMessage(true, 'message1');
+            await jest.runOnlyPendingTimersAsync();
+            expect(mockAudio.Audio.play).toHaveBeenCalledTimes(2);
+
+            // Outgoing message
+            store.addMessage(false, 'message2');
+            await jest.runOnlyPendingTimersAsync();
+            expect(mockAudio.Audio.play).toHaveBeenCalledTimes(2); // No sound for outgoing messages
+
+            // File message
+            store.addMessageFile({
+                file: new File([], 'fileName'),
+                displayName: 'displayName',
+            });
+            await jest.runOnlyPendingTimersAsync();
+            expect(mockAudio.Audio.play).toHaveBeenCalledTimes(2); // No sound for outgoing messages
+
+            expect(store.messages.length).toBe(4);
+            expect(store.messages[0].participant.isAgent).toBe(true);
+            expect((store.messages[0] as ChatMessageModelWelcome).message).toBe('welcome');
+            expect(store.messages[1].participant.isAgent).toBe(true);
+            expectText(store.messages[1], 'message1');
+            expect(store.messages[2].participant.isAgent).toBe(false);
+            expectText(store.messages[2], 'message2');
+            expect(store.messages[3].participant.isAgent).toBe(false);
+            expect(store.messages[3].type).toBe('file');
+        });
+
+        test('should addMessageTimeout', async () => {
+            // Adding timeout message should not happen when no messages are present
+            store.addMessageTimeout();
+            expect(store.messages.length).toBe(0);
+
+            // Adding timeout message should not happen when no non-welcome messages are present
+            store.addMessageWelcome('welcome');
+            store.addMessageTimeout();
+            expect(store.messages.length).toBe(1);
+            expect(store.messages[0].type).toBe('welcome');
+
+            // Adding timeout message should happen when at least one message is present
+            store.addMessage(true, 'message1');
+            store.addMessageTimeout();
+            expect(store.messages.length).toBe(3);
+            expect(store.messages.at(-1)?.type).toBe('timeout');
+
+            // Adding new message should dismiss the timeout message
+            store.addMessage(true, 'message2');
+            expect(store.messages.some(message => message.type === 'timeout')).toBe(false);
+            await checkScrollTriggered();
+        });
+    });
+
+    test('should configure', () => {
+        store.configure({
+            agentIcon: ChatParticipantIcon.Bot,
+            agentName: 'Test Agent',
+        });
+        expect(store.participants[symbolAgent].icon).toBe(ChatParticipantIcon.Bot);
+        expect(store.participants[symbolAgent].name).toBe('Test Agent');
+    });
+
+    describe('with chat events', () => {
+        test('should run', async () => {
+            // Without subscription: should throw an error
+            mockEventEmitter.listeners.mockImplementation(() => []);
+            await expect(store.run()).rejects.toThrow(
+                "No listeners for ChatUiEvent.eventRun ('eventRun')"
+            );
+
+            const spyConfigure = jest.spyOn(store, 'configure');
+            mockEmit();
+
+            await store.run(
+                {
+                    agentIcon: ChatParticipantIcon.Bot,
+                    agentName: 'Test Agent',
+                },
+                'chat data'
+            );
+
+            expect(spyConfigure).toHaveBeenCalled();
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventRun,
+                expect.any(Function),
+                expect.any(Function),
+                'chat data'
+            );
+        });
+
+        test('should recover', async () => {
+            mockEmit();
+            store.setError('Test error');
+            await store.recover();
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventRecover,
+                expect.any(Function),
+                expect.any(Function),
+                new ChatError('Test error')
+            );
+        });
+
+        test('should destroy', async () => {
+            const spyReset = jest.spyOn(store, 'reset');
+            mockEmit();
+            await store.destroy();
+            expect(spyReset).toHaveBeenCalledWith();
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventDestroy,
+                expect.any(Function),
+                expect.any(Function)
+            );
+        });
+
+        test('should restart', async () => {
+            const spyReset = jest.spyOn(store, 'reset');
+            mockEmit();
+            await store.restart();
+            expect(spyReset).toHaveBeenCalledWith();
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventRestart,
+                expect.any(Function),
+                expect.any(Function)
+            );
+        });
+
+        test('should cancelChat', async () => {
+            mockEmit();
+            await store.cancelChat();
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventCancel,
+                expect.any(Function),
+                expect.any(Function)
+            );
+        });
+
+        test('should endChat', async () => {
+            mockEmit();
+            await store.endChat(ChatEndReason.ByAgent);
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventEndChat,
+                expect.any(Function),
+                expect.any(Function),
+                ChatEndReason.ByAgent
+            );
+        });
+
+        test('should chasitorTyping', async () => {
+            mockEmit();
+            await store.chasitorTyping(false);
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventChasitorTyping,
+                expect.any(Function),
+                expect.any(Function),
+                false
+            );
+
+            await store.chasitorTyping(true);
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventChasitorTyping,
+                expect.any(Function),
+                expect.any(Function),
+                true
+            );
+        });
+
+        test('should sendMessageText', async () => {
+            mockEmit();
+            await store.sendMessageText('Hello, world!');
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventMessageSend,
+                expect.any(Function),
+                expect.any(Function),
+                expect.objectContaining({
+                    message: 'Hello, world!',
+                    type: 'message',
+                    state: ChatMessageState.Delivering,
+                })
+            );
+            expect(store.messages.length).toBe(1);
+            expect(store.messages[0].type).toBe('message');
+            expect((store.messages[0] as ChatMessageModelText).message).toBe('Hello, world!');
+            await checkScrollTriggered();
+        });
+
+        test('should sendMessageText with file', async () => {
+            mockEmit();
+            const file = mockFile();
+            store.setFilePickerEnabled(true);
+            store.setFile(file);
+            await store.sendMessageText('Hello, world!');
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventMessageSendFile,
+                expect.any(Function),
+                expect.any(Function),
+                store.currentFileMessage,
+                store.file,
+                expect.objectContaining({
+                    message: 'Hello, world!',
+                    type: 'message',
+                    state: ChatMessageState.Delivering,
+                })
+            );
+            expect(store.messages.length).toBe(2);
+            expect(store.messages[0].type).toBe('file');
+            expect(store.messages[1].type).toBe('message');
+            expect((store.messages[1] as ChatMessageModelText).message).toBe('Hello, world!');
+            expect(store.currentFileMessage).toBeDefined();
+            await checkScrollTriggered();
+        });
+
+        test('should sendMessageText empty', async () => {
+            mockEmit();
+            await store.sendMessageText('   ');
+            expect(mockEventEmitter.emit).not.toHaveBeenCalled();
+        });
+
+        test('should sendMessageRetry', async () => {
+            mockEmit();
+
+            store.setError('Test error');
+            const message = store.addMessage(true, 'message1');
+            store.setMessageState(message, ChatMessageState.Failed);
+
+            const p = store.sendMessageRetry(message);
+
+            expect(message.state).toBe(ChatMessageState.Delivering);
+            await p;
+            expect(store.isError).toBe(false);
+            expect(store.status).toBe(ChatRunState.Started);
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventMessageSendRetry,
+                expect.any(Function),
+                expect.any(Function),
+                message
+            );
+            expect(message.state).toBe(ChatMessageState.Delivering);
+            await checkScrollTriggered();
+        });
+
+        test('should sendMessageFileRetry', async () => {
+            mockEmit();
+
+            store.setError('Test error');
+            const fileMessage = store.addMessageFile({
+                file: new File([], 'fileName'),
+                displayName: 'displayName',
+            });
+            store.setMessageState(fileMessage, ChatMessageState.Failed);
+
+            const p = store.sendMessageFileRetry(fileMessage);
+
+            expect(fileMessage.state).toBe(ChatMessageState.Delivering);
+            await p;
+            expect(store.isError).toBe(false);
+            expect(store.status).toBe(ChatRunState.Started);
+            expect(mockEventEmitter.emit).toHaveBeenCalledWith(
+                ChatUiEvent.eventMessageSendFileRetry,
+                expect.any(Function),
+                expect.any(Function),
+                fileMessage
+            );
+            expect(fileMessage.state).toBe(ChatMessageState.Delivering);
+            await checkScrollTriggered();
+        });
+    });
+
+    test('should setTimer', () => {
+        store.setTimer({ secondsLeft: 10, secondsTotal: 20 });
+        expect(store.timer).toEqual({
+            secondsLeft: 10,
+            secondsTotal: 20,
+        });
+    });
+
+    test('should setAgentTyping', async () => {
+        store.setAgentTyping(true);
+        expect(store.isAgentTyping).toBe(true);
+        await checkScrollTriggered();
+
+        store.setAgentTyping(false);
+        expect(store.isAgentTyping).toBe(false);
+        await checkScrollTriggered();
+    });
+
+    test('should setEndReason', async () => {
+        store.setEndReason(ChatEndReason.ByTimeout);
+        expect(store.endReason).toBe(ChatEndReason.ByTimeout);
+        await checkScrollTriggered();
+    });
+
+    test('should setEndedChatState', async () => {
+        store.isFilePickerEnabled = true;
+        store.setFile(mockFile());
+        store.setEndedChatState(ChatEndReason.ByTimeout);
+        expect(store.endReason).toBe(ChatEndReason.ByTimeout);
+        expect(store.status).toBe(ChatRunState.Ended);
+        expect(store.isAgentTyping).toBe(false);
+        expect(store.currentFileMessage).toBeUndefined();
+        expect(store.file).toBeUndefined();
+        expect(store.isFilePickerEnabled).toBe(false);
+        await checkScrollTriggered();
+    });
+
+    function mockFile() {
+        const file: FileDescriptor = {
+            file: new File(['content'], 'file.txt', { type: 'text/plain' }),
+            displayName: 'file.txt',
+        };
+        return file;
+    }
+
+    function mockEmit() {
+        mockEventEmitter.listeners.mockImplementation(() => ['1']);
+        mockEventEmitter.listenerCount.mockReturnValue(1);
+        mockEventEmitter.emit.mockImplementation(async (eventName: string, resolve: () => void) => {
+            await Promise.resolve();
+            resolve();
+        });
+    }
+
+    async function checkScrollTriggered() {
+        const counter = store.scrollCounter;
+        await jest.runOnlyPendingTimersAsync();
+        expect(counter < store.scrollCounter).toBe(true);
+    }
+});

package/src/stores/chat-ui.store.ts

@@ -237,8 +237,7 @@ export class ChatUiStore<T extends ChatCustomizations> implements IChatUiStore<T
 
     @action
     setError<T = any>(message: string, options?: ChatErrorOptions<T>) {
-        this.error = new ChatError(message, options);
-        this.setChatError(this.error);
+        this.setChatError(new ChatError(message, options));
     }
 
     @action
@@ -332,11 +331,12 @@ export class ChatUiStore<T extends ChatCustomizations> implements IChatUiStore<T
 
     @action
     async sendMessageText(message: string) {
-        await this.restartTimers();
         if (this.isFilePickerEnabled && this.file) {
             // Send text message with file
-            this.isFilePickerEnabled = false;
-            this.currentFileMessage = this.addMessageFile(this.file);
+            runInAction(() => {
+                this.isFilePickerEnabled = false;
+                this.currentFileMessage = this.addMessageFile(this.file!);
+            });
             let messageModel: ChatMessageModelText | undefined;
             if (message.trim() !== '') {
                 messageModel = this.addMessage(false, message);
@@ -355,10 +355,10 @@ export class ChatUiStore<T extends ChatCustomizations> implements IChatUiStore<T
 
     @action
     async sendMessageRetry(messageModel: ChatMessageModelBase) {
-        await this.restartTimers();
         this.resetError(ChatRunState.Started);
         this.setMessageState(messageModel, ChatMessageState.Delivering);
         await this.emitAsync(ChatUiEvent.eventMessageSendRetry, messageModel);
+        await this.restartTimers();
     }
 
     @action
@@ -460,7 +460,7 @@ export class ChatUiStore<T extends ChatCustomizations> implements IChatUiStore<T
         for (let i = this.messages.length - 1; i >= 0; i--) {
             const message = this.messages[i];
             if (message.type === 'message' && !message.participant.isAgent) {
-                if (message.state === ChatMessageState.Delivered) {
+                if (message.state !== ChatMessageState.Failed) {
                     break;
                 }
                 result.push(message as ChatMessageModelText);
@@ -494,12 +494,11 @@ export class ChatUiStore<T extends ChatCustomizations> implements IChatUiStore<T
         } else {
             this.restartTimers().then(() => {});
         }
-        const newMessage = this.createMessage<T>(message);
-        this.setMessages([...this.messages, newMessage]);
+        this.setMessages([...this.messages, this.createMessage<T>(message)]);
         if (message.participant.isAgent) {
             this.beepIncoming().catch(() => {});
         }
-        return newMessage;
+        return this.messages.at(-1) as T;
     }
 
     protected removeMessageByType(type: string) {

package/src/utils/__tests__/text-utils.test.ts

@@ -0,0 +1,70 @@
+import { expect } from '@jest/globals';
+import {
+    extractFilenameAndExt,
+    formatChatMessageDate,
+    getFirstName,
+    getNameInitials,
+    getNameInitialsFirst,
+} from '../text-utils';
+
+describe('text-utils', () => {
+    test('should get initials from name', () => {
+        expect(getNameInitials('')).toEqual('');
+        expect(getNameInitials('A')).toEqual('A');
+        expect(getNameInitials('AB')).toEqual('A');
+        expect(getNameInitials('abcd')).toEqual('A');
+        expect(getNameInitials('  abcd   ')).toEqual('A');
+        expect(getNameInitials('   a b c   ')).toEqual('AB');
+        expect(getNameInitials('abcd ef')).toEqual('AE');
+        expect(getNameInitials('a b c d')).toEqual('AB');
+    });
+
+    test('should extract filename and ext', () => {
+        expect(extractFilenameAndExt('')).toEqual(['', '']);
+        expect(extractFilenameAndExt('a')).toEqual(['a', '']);
+        expect(extractFilenameAndExt('a.')).toEqual(['a.', '']);
+        expect(extractFilenameAndExt('a.b')).toEqual(['a.', 'b']);
+        expect(extractFilenameAndExt('a.b.c')).toEqual(['a.b.', 'c']);
+        expect(extractFilenameAndExt('aaaa.bbbb.cccc')).toEqual(['aaaa.bbbb.', 'cccc']);
+    });
+
+    test('should getFirstName', () => {
+        expect(getFirstName('')).toEqual('');
+        expect(getFirstName('A')).toEqual('A');
+        expect(getFirstName('AB')).toEqual('AB');
+        expect(getFirstName('abcd')).toEqual('abcd');
+        expect(getFirstName('  abcd   ')).toEqual('abcd');
+        expect(getFirstName('   a b c   ')).toEqual('a');
+        expect(getFirstName('abcd ef')).toEqual('abcd');
+        expect(getFirstName('a b c d')).toEqual('a');
+    });
+
+    test('should getNameInitialsFirst', () => {
+        expect(getNameInitials('')).toEqual('');
+        expect(getNameInitials('A')).toEqual('A');
+        expect(getNameInitials('AB')).toEqual('A');
+        expect(getNameInitials('abcd')).toEqual('A');
+        expect(getNameInitials('  abcd   ')).toEqual('A');
+        expect(getNameInitials('   a b c   ')).toEqual('AB');
+        expect(getNameInitials('abcd ef')).toEqual('AE');
+        expect(getNameInitials('a b c d')).toEqual('AB');
+    });
+
+    test('should formatChatMessageDate', () => {
+        const date = new Date('2023-10-01T12:00:00Z');
+        expect(formatChatMessageDate(date)).toEqual('12:00 PM');
+        expect(formatChatMessageDate(new Date('2023-10-01T00:00:00Z'))).toEqual('12:00 AM');
+        expect(formatChatMessageDate(new Date('2023-10-01T23:59:59Z'))).toEqual('11:59 PM');
+    });
+
+    test('should getNameInitialsFirst', () => {
+        expect(getNameInitialsFirst('')).toEqual('');
+        expect(getNameInitialsFirst('A')).toEqual('A');
+        expect(getNameInitialsFirst('AB')).toEqual('A');
+        expect(getNameInitialsFirst('abcd')).toEqual('A');
+        expect(getNameInitialsFirst('  abcd   ')).toEqual('A');
+        expect(getNameInitialsFirst('   a b c   ')).toEqual('A');
+        expect(getNameInitialsFirst('abcd ef')).toEqual('A');
+        expect(getNameInitialsFirst('a b c d')).toEqual('A');
+    });
+});