"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
require("@testing-library/jest-dom");
const react_1 = require("@testing-library/react");
const Chatbot_1 = require("../Chatbot/Chatbot");
const ChatbotConversationHistoryNav_1 = __importDefault(require("./ChatbotConversationHistoryNav"));
const react_core_1 = require("@patternfly/react-core");
const react_icons_1 = require("@patternfly/react-icons");
const ERROR = {
    bodyText: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["To try again, check your connection and reload this page. If the issue persists,", ' ', (0, jsx_runtime_1.jsx)("a", { href: "", children: "contact the support team" }), "."] })),
    buttonText: 'Reload',
    buttonIcon: (0, jsx_runtime_1.jsx)(react_core_1.Spinner, { size: "sm" }),
    hasButton: true,
    titleText: 'Could not load chat history',
    status: react_core_1.EmptyStateStatus.danger,
    onClick: () => alert('Clicked Reload')
};
const NO_RESULTS = {
    bodyText: 'Adjust your search query and try again. Check your spelling or try a more general term.',
    titleText: 'No results found',
    icon: react_icons_1.SearchIcon
};
const EMPTY_STATE = {
    bodyText: 'Access timely assistance by starting a conversation with an AI model.',
    titleText: 'Start a new chat',
    icon: react_icons_1.OutlinedCommentsIcon
};
const ERROR_WITHOUT_BUTTON = {
    bodyText: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["To try again, check your connection and reload this page. If the issue persists,", ' ', (0, jsx_runtime_1.jsx)("a", { href: "", children: "contact the support team" }), "."] })),
    buttonText: 'Reload',
    buttonIcon: (0, jsx_runtime_1.jsx)(react_core_1.Spinner, { size: "sm" }),
    hasButton: false,
    titleText: 'Could not load chat history',
    status: react_core_1.EmptyStateStatus.danger,
    onClick: () => alert('Clicked Reload')
};
describe('ChatbotConversationHistoryNav', () => {
    const onDrawerToggle = jest.fn();
    const initialConversations = [
        {
            id: '1',
            text: 'ChatBot documentation'
        }
    ];
    it('should open the conversation history navigation drawer', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations }));
        expect(react_1.screen.queryByText('ChatBot documentation')).toBeInTheDocument();
    });
    it('should display the conversations for grouped conversations', () => {
        const groupedConversations = {
            Today: [...initialConversations, { id: '2', text: 'Chatbot extension' }]
        };
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: groupedConversations }));
        expect(react_1.screen.queryByText('Chatbot extension')).toBeInTheDocument();
    });
    it('should apply the reversed class when reverseButtonOrder is true', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: true, conversations: initialConversations }));
        expect(react_1.screen.getByTestId('chatbot-nav-drawer-actions')).toHaveClass('pf-v6-c-drawer__actions--reversed');
    });
    it('should disable new chat button', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: true, conversations: initialConversations, newChatButtonProps: { isDisabled: true }, onNewChat: jest.fn() }));
        expect(react_1.screen.getByRole('button', { name: 'New chat' })).toBeDisabled();
    });
    it('should not apply the reversed class when reverseButtonOrder is false', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, conversations: initialConversations }));
        expect(react_1.screen.getByTestId('chatbot-nav-drawer-actions')).not.toHaveClass('pf-v6-c-drawer__actions--reversed');
    });
    it('should invoke handleTextInputChange callback when user searches for conversations', () => {
        const handleSearch = jest.fn();
        const groupedConversations = {
            Today: [...initialConversations, { id: '2', text: 'Chatbot extension' }]
        };
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, conversations: groupedConversations, handleTextInputChange: handleSearch }));
        const searchInput = react_1.screen.getByPlaceholderText(/Search/i);
        react_1.fireEvent.change(searchInput, { target: { value: 'Chatbot' } });
        expect(handleSearch).toHaveBeenCalledWith('Chatbot');
    });
    it('should close the drawer when escape key is pressed', () => __awaiter(void 0, void 0, void 0, function* () {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations }));
        react_1.fireEvent.keyDown(react_1.screen.getByPlaceholderText(/Search/i), {
            key: 'Escape',
            code: 'Escape',
            keyCode: 27,
            charCode: 27
        });
        (0, react_1.waitFor)(() => {
            expect(react_1.screen.queryByText('ChatBot documentation')).not.toBeInTheDocument();
        });
    }));
    it('should be resizable', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerPanelContentProps: { isResizable: true, minSize: '200px' } }));
        expect(react_1.screen.getByRole('dialog', { name: /Resize/i })).toBeTruthy();
        expect(react_1.screen.getByRole('separator', { name: /Resize/i })).toBeTruthy();
        expect(react_1.screen.getByRole('dialog', { name: /Resize/i })).toHaveAttribute('style', '--pf-v6-c-drawer__panel--md--FlexBasis: 384px; --pf-v6-c-drawer__panel--md--FlexBasis--min: 200px;');
    });
    it('should accept drawerContentProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerContentProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should accept drawerContentBodyProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerContentBodyProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should accept drawerHeadProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerHeadProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should accept drawerActionsProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerActionsProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should accept drawerCloseButtonProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerCloseButtonProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should accept drawerPanelBodyProps', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, drawerPanelBodyProps: { className: 'test' } }));
        const element = container.querySelector('.test');
        expect(element).toBeInTheDocument();
    });
    it('should show loading state if triggered', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, isLoading: true }));
        expect(react_1.screen.getByRole('dialog', { name: /Loading chatbot conversation history/i })).toBeTruthy();
        expect(react_1.screen.getByRole('button', { name: /Close drawer panel/i })).toBeTruthy();
    });
    it('should pass alternative aria label to loading state', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, isLoading: true, loadingState: { screenreaderText: 'I am a test' } }));
        expect(react_1.screen.getByRole('dialog', { name: /I am a test/i })).toBeTruthy();
    });
    it('should accept errorState', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, errorState: ERROR }));
        expect(react_1.screen.getByRole('dialog', {
            name: /Could not load chat history To try again, check your connection and reload this page. If the issue persists, contact the support team . Loading... Reload/i
        })).toBeTruthy();
        expect(react_1.screen.getByRole('button', { name: /Close drawer panel/i })).toBeTruthy();
        expect(react_1.screen.getByRole('button', { name: /Loading... Reload/i })).toBeTruthy();
        expect(react_1.screen.getByRole('textbox', { name: /Search previous conversations/i })).toBeTruthy();
        expect(react_1.screen.getByRole('heading', { name: /Could not load chat history/i })).toBeTruthy();
    });
    it('should accept errorState without button', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, errorState: ERROR_WITHOUT_BUTTON }));
        expect(react_1.screen.getByRole('dialog', {
            name: /Could not load chat history To try again, check your connection and reload this page. If the issue persists, contact the support team ./i
        })).toBeTruthy();
        expect(react_1.screen.getByRole('button', { name: /Close drawer panel/i })).toBeTruthy();
        expect(react_1.screen.queryByRole('button', { name: /Loading... Reload/i })).toBeFalsy();
        expect(react_1.screen.getByRole('textbox', { name: /Search previous conversations/i })).toBeTruthy();
        expect(react_1.screen.getByRole('heading', { name: /Could not load chat history/i })).toBeTruthy();
    });
    it('should show loading state over error state if both are supplied', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, isLoading: true, errorState: ERROR }));
        expect(react_1.screen.getByRole('dialog', { name: /Loading/i })).toBeTruthy();
    });
    it('should accept emptyState', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, emptyState: EMPTY_STATE }));
        expect(react_1.screen.getByRole('dialog', {
            name: /Start a new chat Access timely assistance by starting a conversation with an AI model./i
        })).toBeTruthy();
    });
    it('should accept no results state', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, noResultsState: NO_RESULTS }));
        expect(react_1.screen.getByRole('dialog', {
            name: /No results found Adjust your search query and try again. Check your spelling or try a more general term./i
        })).toBeTruthy();
    });
    it('should handle isCompact', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), reverseButtonOrder: false, handleTextInputChange: jest.fn(), conversations: initialConversations, noResultsState: NO_RESULTS, isCompact: true, "data-testid": "drawer" }));
        expect(react_1.screen.getByTestId('drawer')).toHaveClass('pf-m-compact');
    });
    it('should display the default title', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations }));
        expect(react_1.screen.getByText('Chat history')).toBeInTheDocument();
    });
    it('should display the custom title', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { title: "PatternFly history", onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations }));
        expect(react_1.screen.getByText('PatternFly history')).toBeInTheDocument();
    });
    it('should display the clock icon', () => {
        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations }));
        const iconElement = container.querySelector('.pf-chatbot__title-icon');
        expect(iconElement).toBeInTheDocument();
    });
    it('Passes listTitleProps to Title', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, listTitleProps: { className: 'test' } }));
        expect(react_1.screen.getByRole('heading', { name: /Today/i })).toHaveClass('test');
    });
    it('Overrides list title heading level when titleProps.headingLevel is passed', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, listTitleProps: { headingLevel: 'h2' } }));
        expect(react_1.screen.queryByRole('heading', { name: /Today/i, level: 4 })).not.toBeInTheDocument();
        expect(react_1.screen.getByRole('heading', { name: /Today/i, level: 2 })).toBeInTheDocument();
    });
    it('Passes listProps to List when conversations is an array', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, listProps: { className: 'test' } }));
        expect(react_1.screen.getByRole('list')).toHaveClass('test');
    });
    it('Passes listProps to List when conversations is an object', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, listProps: { Today: { className: 'test' } } }));
        expect(react_1.screen.getByRole('list')).toHaveClass('test');
    });
    it('Passes listItemProps to ListItem', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: [{ id: '1', text: 'ChatBot documentation', listItemProps: { className: 'test' } }] }));
        expect(react_1.screen.getByRole('listitem')).toHaveClass('test');
    });
    it('should be able to spread search input props when searchInputProps is passed', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, handleTextInputChange: jest.fn(), searchInputProps: { value: 'I am a sample search' } }));
        expect(react_1.screen.getByRole('dialog', { name: /Chat history I am a sample search/i })).toBeInTheDocument();
    });
    it('overrides nav title heading level when navTitleProps.headingLevel is passed', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, navTitleProps: { headingLevel: 'h1' } }));
        expect(react_1.screen.queryByRole('heading', { name: /Chat history/i, level: 2 })).not.toBeInTheDocument();
        expect(react_1.screen.getByRole('heading', { name: /Chat history/i, level: 1 })).toBeInTheDocument();
    });
    it('overrides nav title icon when navTitleIcon is passed in', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, navTitleIcon: (0, jsx_runtime_1.jsx)(react_icons_1.BellIcon, { "data-testid": "bell" }) }));
        expect(react_1.screen.getByTestId('bell')).toBeInTheDocument();
    });
});
