@rh-support/troubleshoot 2.6.358 → 2.6.361

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseAttachment.js

@@ -17,6 +17,7 @@ import { deleteCaseAttachment, formatDateTime, humanizeSize, updateCaseAttachmen
 import isEmpty from 'lodash/isEmpty';
 import React, { useContext, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { useCaseUpdateErrorMessage } from '../../../../hooks/useCaseUpdateErrorMessage';
 import { ATTACHMENT_DESCRIPTION_LENGTH_LIMIT } from '../../../../reducers/CaseConstNTypes';
 import { DiscussionType } from '../../../../reducers/CaseDiscussionTabReducer';
 import { PDFContext } from '../../PDFContainer';
@@ -25,6 +26,7 @@ import { JumpAndCopyLink } from './JumpAndCopyLink';
 const CaseAttachment = React.forwardRef((props, ref) => {
     var _a;
     const { t } = useTranslation();
+    const caseUpdateError = useCaseUpdateErrorMessage();
     const clipboardRef = useRef(null);
     const { clipboardText, copyToClipboard } = useCopyToClipboard(clipboardRef);
     const { request, isFetching: isDeleting } = useFetch(deleteCaseAttachment, { propgateErrors: true });
@@ -39,7 +41,7 @@ const CaseAttachment = React.forwardRef((props, ref) => {
     const canEditCase = useCanEditCase();
     const onDescriptionSave = () => __awaiter(void 0, void 0, void 0, function* () {
         if (!apolloClient.mutate) {
-            ToastNotification.addDangerMessage(t('Failed to update attachment description'));
+            caseUpdateError.showFieldError({}, t('Attachment description'));
             return;
         }
         setIsUpdating(true);
@@ -47,8 +49,8 @@ const CaseAttachment = React.forwardRef((props, ref) => {
             const updatedAttachment = yield updateCaseAttachmentDescriptionByGraphQL(apolloClient, props.attachment, attachmentDescription);
             props.onMetadataUpdate && props.onMetadataUpdate(props.attachment.uuid, updatedAttachment);
         }
-        catch (_a) {
-            ToastNotification.addDangerMessage(t('Failed to update attachment description'));
+        catch (e) {
+            caseUpdateError.showFieldError(e, t('Attachment description'), onDescriptionSave);
         }
         finally {
             setIsUpdating(false);

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseComments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseComments.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/CaseComments.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AA2BvE,OAAO,KAAwC,MAAM,OAAO,CAAC;AAU7D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,kBAAkB,EAAE,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAChH;AAED,QAAA,MAAM,YAAY,4EA8UhB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"CaseComments.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/CaseComments.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AA2BvE,OAAO,KAAwC,MAAM,OAAO,CAAC;AAW7D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,kBAAkB,EAAE,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAChH;AAED,QAAA,MAAM,YAAY,4EAgXhB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseComments.js

@@ -25,6 +25,7 @@ import { Trans } from 'react-i18next';
 // TODO: Re-enable after GraphQL migration of feedback
 // import { useTranslation } from 'react-i18next';
 import { DiscussionType } from '../../../../reducers/CaseDiscussionTabReducer';
+import { linkifyHtmlTextNodes } from '../../../../utils/linkifyHtmlTextNodes';
 import { PDFContext } from '../../PDFContainer';
 import { DiscussionItemLink } from './DiscussionItemLink';
 import { JumpAndCopyLink } from './JumpAndCopyLink';
@@ -149,6 +150,34 @@ const CaseComments = React.forwardRef((props, ref) => {
             return React.createElement(Trans, null, "Automated comment");
         }
     };
+    // Tags the Quill RTE legitimately produces — everything else was typed
+    // literally by the user or injected from an external source (SFDC) and
+    // should render as visible text, not interpreted as HTML formatting.
+    const QUILL_TAGS = new Set([
+        'p',
+        'br',
+        'strong',
+        'em',
+        'u',
+        's',
+        'ul',
+        'ol',
+        'li',
+        'a',
+        'img',
+        'h1',
+        'h2',
+        'h3',
+        'h4',
+        'h5',
+        'h6',
+        'span',
+        'pre',
+        'blockquote',
+        'sub',
+        'sup',
+    ]);
+    const escapeNonQuillTags = (html) => html.replace(/<(\/?)([\w-]+)([^>]*)>/g, (match, slash, tag, attrs) => QUILL_TAGS.has(tag.toLowerCase()) ? match : `&lt;${slash}${tag}${attrs}&gt;`);
     const sanitizeHtml = (html) => {
         DOMPurify.addHook('afterSanitizeAttributes', (node) => {
             if (node.tagName === 'A') {
@@ -156,7 +185,7 @@ const CaseComments = React.forwardRef((props, ref) => {
                 node.setAttribute('rel', 'noopener noreferrer');
             }
         });
-        const clean = DOMPurify.sanitize(html, { ADD_ATTR: ['target', 'rel'] });
+        const clean = DOMPurify.sanitize(escapeNonQuillTags(html), { ADD_ATTR: ['target', 'rel'] });
         DOMPurify.removeHook('afterSanitizeAttributes');
         return clean;
     };
@@ -216,6 +245,7 @@ const CaseComments = React.forwardRef((props, ref) => {
         }
         // HTML comments (new rich text or legacy markdown — both stored as HTML)
         let htmlString = comment.commentBody;
+        htmlString = linkifyHtmlTextNodes(htmlString);
         if (isExportingPDF) {
             htmlString = formatMarkdownHtmlForPDF(htmlString);
         }
@@ -251,8 +281,8 @@ const CaseComments = React.forwardRef((props, ref) => {
             React.createElement("span", { className: "pull-right pf-v6-l-flex pf-m-align-items-center" },
                 props.showJumpToComment && (React.createElement(DiscussionItemLink, { onClick: onJumpToComment(props.comment.id), discussionType: DiscussionType.COMMENT, itemId: props.comment.id, caseNumber: caseNumber, isCopyLink: false },
                     React.createElement(Trans, null, "Jump to comment"))),
-                React.createElement(JumpAndCopyLink, { caseNumber: caseNumber, cardId: props.comment.id, discussionType: DiscussionType.COMMENT }),
                 React.createElement("button", { onClick: () => props.onReply(props.comment.lastModifiedById, props.comment.id, props.comment.lastModifiedDate), className: `btn btn-app btn-link case-reply-button ${isExportingPDF ? 'hide-in-pdf' : ''}`, "data-tracking-id": "case-comment-reply", type: "button" },
-                    React.createElement(Trans, null, "Reply"))))));
+                    React.createElement(Trans, null, "Reply")),
+                React.createElement(JumpAndCopyLink, { caseNumber: caseNumber, cardId: props.comment.id, discussionType: DiscussionType.COMMENT })))));
 });
 export default CaseComments;

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseDiscussion.d.ts

@@ -9,6 +9,12 @@ interface IProps {
     tabRef: React.MutableRefObject<HTMLDivElement>;
     isDiscussionTab: boolean;
     refetchComments: () => Promise<unknown> | void;
+    fetchMore?: () => Promise<unknown> | void;
+    hasNextPage?: boolean;
+    isLoadingMore?: boolean;
+    loadMoreError?: boolean;
+    loadMoreRetryCount?: number;
+    retryLoadMore?: () => Promise<unknown> | void;
 }
 export default function CaseDiscussion(props: IProps): React.JSX.Element;
 export {};

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseDiscussion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CaseDiscussion.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/CaseDiscussion.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAkBvE,OAAO,KAAoE,MAAM,OAAO,CAAC;AAsCzF,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IAGxB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC/C,eAAe,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;CAClD;AAOD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,MAAM,qBAshBnD"}
+{"version":3,"file":"CaseDiscussion.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/CaseDiscussion.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAoBvE,OAAO,KAA6E,MAAM,OAAO,CAAC;AAwClG,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IAGxB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC/C,eAAe,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;CACjD;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,MAAM,qBAyzBnD"}

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/CaseDiscussion.js

@@ -8,25 +8,27 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { useApolloClient } from '@apollo/client/react';
-import { MenuToggle, Select, SelectList, SelectOption } from '@patternfly/react-core';
+import { Button, MenuToggle, Select, SelectList, SelectOption } from '@patternfly/react-core';
 import { AlertMessage, AlertType, ErrorBoundary, LoadingIndicator, ToastNotification } from '@rh-support/components';
 import { useGlobalStateContext } from '@rh-support/react-context';
 import { AbilityContext, CaseDetailsFields, resourceActions, resources } from '@rh-support/user-permissions';
-import { downloadCaseAttachment, dtmTrackEventCaseStepEncountered, getUrlParsedParams, scrollIntoView, } from '@rh-support/utils';
+import { downloadCaseAttachment, dtmTrackEventCaseStepEncountered, getDropdownBtnPlaceholder, getUrlParsedParams, scrollIntoView, } from '@rh-support/utils';
 import cloneDeep from 'lodash/cloneDeep';
 import filter from 'lodash/filter';
 import findIndex from 'lodash/findIndex';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
+import orderBy from 'lodash/orderBy';
 import Mark from 'mark.js';
-import React, { useContext, useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { useInView } from 'react-intersection-observer';
 import { useLocation } from 'react-router-dom';
 import { AutoSizer, CellMeasurer, CellMeasurerCache, List, WindowScroller } from 'react-virtualized';
 import { useCaseDispatch, useCaseSelector } from '../../../../context/CaseContext';
 import { useCaseDetailsPageDispatchContext, useCaseDetailsPageStateContext, } from '../../../../context/CaseDetailsPageContext';
 import { useCaseDiscussionTabDispatchContext, useCaseDiscussionTabStateContext, } from '../../../../context/CaseDiscussionTabContext';
-import { clearReplyingTo, discussionSortOrderConst, DiscussionType, setDiscussions, setReplyingTo, setSort, updateAttachment, updateAttacmentsAfterRemoval, updateDiscussionStateAttachments, } from '../../../../reducers/CaseDiscussionTabReducer';
+import { clearReplyingTo, discussionSortOrderConst, DiscussionType, setDiscussions, setFilter, setReplyingTo, setSort, updateAttachment, updateAttacmentsAfterRemoval, updateDiscussionStateAttachments, } from '../../../../reducers/CaseDiscussionTabReducer';
 import { setCaseState } from '../../../../reducers/CaseReducer';
 import { AttachmentContextProvider } from '../../../shared/fileUpload/reducer/AttachmentReducerContext';
 import { PDFContext } from '../../PDFContainer';
@@ -37,11 +39,8 @@ import { CommentSearch } from './CommentSearch';
 import { PostComment } from './PostComment';
 /** Threshold above which comments render in a virtualized (windowed) list for performance. */
 const VC_MINIMUM_COMMENT = 150;
-let cellMeasureCache = new CellMeasurerCache({
-    fixedWidth: true,
-    defaultHeight: 100,
-});
 export default function CaseDiscussion(props) {
+    var _a;
     const { t } = useTranslation();
     const { isPostingRemoteRequestCommentCompleted, product, version, caseSalesforceId } = useCaseSelector((state) => ({
         isPostingRemoteRequestCommentCompleted: state.isPostingRemoteRequestCommentCompleted,
@@ -52,7 +51,7 @@ export default function CaseDiscussion(props) {
     const urlSearchParams = getUrlParsedParams(useLocation().search);
     const discussionIdFromUrl = ((urlSearchParams === null || urlSearchParams === void 0 ? void 0 : urlSearchParams.commentId) || (urlSearchParams === null || urlSearchParams === void 0 ? void 0 : urlSearchParams.attachmentId));
     const activeDiscussionElementRef = useRef(null);
-    const { sort, discussionFiltersListState, allDiscussions, replyingToAuthor, replyingToTimestamp } = useCaseDiscussionTabStateContext();
+    const { sort, discussionFiltersListState, replyingToAuthor, replyingToTimestamp } = useCaseDiscussionTabStateContext();
     const { globalMetadataState: { navBarRef, loggedInUsersAccount }, } = useGlobalStateContext();
     const dispatchDiscussion = useCaseDiscussionTabDispatchContext();
     const { caseDetailsPageState: { caseAttachmentHydra }, } = useCaseDetailsPageStateContext();
@@ -66,7 +65,9 @@ export default function CaseDiscussion(props) {
     const listRef = React.useRef(null);
     const windowScrollerRef = React.useRef(null);
     const commentRef = React.useRef(null);
+    const cellMeasureCacheRef = useRef(new CellMeasurerCache({ fixedWidth: true, defaultHeight: 100 }));
     const { isExportingPDF } = useContext(PDFContext);
+    const { ref: sentinelRef, inView } = useInView({ threshold: 0, rootMargin: '200px' });
     const [searchResult, setSearchResult] = useState([]);
     const [searchCommentText, setSearchCommentText] = useState('');
     const [commentIndex, setCommentIndex] = useState(-1);
@@ -74,19 +75,105 @@ export default function CaseDiscussion(props) {
     const [isJumpToCommentClicked, setJumpToCommentClicked] = useState(false);
     const [canUpdateScrollTop, setCanUpdateScrollTop] = useState(true);
     const [discussionSectionWidth, setDiscussionSectionWidth] = useState(null);
+    const [debouncedShowSkeleton, setDebouncedShowSkeleton] = useState(false);
+    const [isOpen, setIsOpen] = useState(false);
+    const [selectedFilterItems, setSelectedFilterItems] = useState([]);
     const [isSortOpen, setIsSortOpen] = useState(false);
     const [sortSelected, setSortSelected] = useState('Select a value');
-    if (props.isDiscussionTab) {
-        cellMeasureCache = new CellMeasurerCache({
-            fixedWidth: true,
-            defaultHeight: 100,
+    const { hasNextPage, isLoadingMore, loadMoreError, fetchMore } = props;
+    const isCommentFilterActive = discussionFiltersListState.some((f) => (f.value === DiscussionType.COMMENT || f.value === DiscussionType.ALL) && f.isSelected);
+    useEffect(() => {
+        console.log('[CaseDiscussion] fetchMore useEffect', {
+            inView,
+            hasNextPage,
+            isLoadingMore,
+            loadMoreError,
+            hasFetchMore: !!fetchMore,
+            isCommentFilterActive,
+            willFetch: inView && hasNextPage && !isLoadingMore && !loadMoreError && !!fetchMore && isCommentFilterActive,
         });
+        if (inView && hasNextPage && !isLoadingMore && !loadMoreError && fetchMore && isCommentFilterActive) {
+            fetchMore();
+        }
+    }, [inView, hasNextPage, isLoadingMore, loadMoreError, fetchMore, isCommentFilterActive]);
+    useEffect(() => {
+        if (props.isLoadingMore && props.hasNextPage) {
+            const timer = setTimeout(() => setDebouncedShowSkeleton(true), 300);
+            return () => clearTimeout(timer);
+        }
+        setDebouncedShowSkeleton(false);
+    }, [props.isLoadingMore, props.hasNextPage]);
+    const cellMeasureCache = cellMeasureCacheRef.current;
+    const allDiscussions = useMemo(() => {
+        var _a, _b, _c;
+        const allComments = (props.caseComments || [])
+            .filter((comment) => comment.isDraft === false)
+            .map((comment) => ({
+            item: Object.assign(Object.assign({}, comment), { isPublic: comment.isPublic === undefined ? true : comment.isPublic, last_modified_date: comment.lastModifiedDate || comment.createdDate }),
+            discussionType: DiscussionType.COMMENT,
+            last_modified_date: comment.lastModifiedDate || comment.createdDate,
+        }));
+        let allAttachments = canSeeAttachments
+            ? (caseAttachmentHydra.data || [])
+                .filter((attachment) => (attachment === null || attachment === void 0 ? void 0 : attachment.lastModifiedDate) || (attachment === null || attachment === void 0 ? void 0 : attachment.createdDate))
+                .map((attachment) => ({
+                item: Object.assign(Object.assign({}, attachment), { lastModifiedDate: attachment.lastModifiedDate || attachment.createdDate }),
+                last_modified_date: (attachment.lastModifiedDate || attachment.createdDate),
+                discussionType: DiscussionType.ATTACHMENT,
+            }))
+            : [];
+        if (props.hasNextPage && allComments.length > 0) {
+            const sortOrder = (_a = sort === null || sort === void 0 ? void 0 : sort.sortOrder) !== null && _a !== void 0 ? _a : 'desc';
+            const commentDates = allComments.map((c) => c.last_modified_date).filter(Boolean);
+            if (commentDates.length > 0) {
+                if (sortOrder === 'desc') {
+                    const oldestLoaded = commentDates.reduce((min, d) => (d < min ? d : min));
+                    allAttachments = allAttachments.filter((a) => a.last_modified_date >= oldestLoaded);
+                }
+                else {
+                    const newestLoaded = commentDates.reduce((max, d) => (d > max ? d : max));
+                    allAttachments = allAttachments.filter((a) => a.last_modified_date <= newestLoaded);
+                }
+            }
+        }
+        const merged = [...allComments, ...allAttachments];
+        return orderBy(merged, ['last_modified_date', (d) => { var _a; return (_a = d.item.id) !== null && _a !== void 0 ? _a : ''; }], [(_b = sort === null || sort === void 0 ? void 0 : sort.sortOrder) !== null && _b !== void 0 ? _b : 'desc', (_c = sort === null || sort === void 0 ? void 0 : sort.sortOrder) !== null && _c !== void 0 ? _c : 'desc']);
+    }, [props.caseComments, caseAttachmentHydra.data, canSeeAttachments, sort, props.hasNextPage]);
+    const usedPaginationRef = useRef(false);
+    if (props.hasNextPage || props.isLoadingMore) {
+        usedPaginationRef.current = true;
     }
-    const shouldRenderRVComponent = !isExportingPDF && allDiscussions.length > VC_MINIMUM_COMMENT;
+    const shouldRenderRVComponent = !isExportingPDF && allDiscussions.length > VC_MINIMUM_COMMENT && !usedPaginationRef.current;
+    const list = discussionFiltersListState.filter((f) => f.canSee);
+    const computeFilterComment = () => {
+        return filter(allDiscussions, (discussion) => {
+            const activeFilter = discussionFiltersListState.filter((f) => f.value === discussion.discussionType && f.isSelected);
+            return activeFilter.length === 1 ? discussion : null;
+        });
+    };
+    const computeFilteredComments = computeFilterComment();
     const comuteSearchedComments = searchResult.length === 0
-        ? cloneDeep(allDiscussions)
-        : filter([...allDiscussions], (o) => { var _a; return searchResult.indexOf((_a = o === null || o === void 0 ? void 0 : o.item) === null || _a === void 0 ? void 0 : _a.id) !== -1; });
-    const isSearchResultEmpty = !isEmpty(searchCommentText) && (searchResult.length === 0 || comuteSearchedComments.length === 0);
+        ? cloneDeep(computeFilteredComments)
+        : filter([...computeFilteredComments], (o) => { var _a; return searchResult.indexOf((_a = o === null || o === void 0 ? void 0 : o.item) === null || _a === void 0 ? void 0 : _a.id) !== -1; });
+    const isRefetching = props.commentsLoading && !props.isLoadingMore;
+    const isSearchResultEmpty = !isRefetching &&
+        !isEmpty(searchCommentText) &&
+        (searchResult.length === 0 || comuteSearchedComments.length === 0);
+    // DEBUG: track every render of CaseDiscussion
+    console.log('[CaseDiscussion] render', {
+        commentsLoading: props.commentsLoading,
+        isLoadingMore: props.isLoadingMore,
+        hasNextPage: props.hasNextPage,
+        loadMoreError: props.loadMoreError,
+        isRefetching,
+        isSearchResultEmpty,
+        allDiscussionsLen: allDiscussions.length,
+        filteredLen: computeFilteredComments.length,
+        searchedLen: comuteSearchedComments.length,
+        caseCommentsLen: (_a = props.caseComments) === null || _a === void 0 ? void 0 : _a.length,
+        inView,
+        isCommentFilterActive,
+    });
     const setVRCommentIndex = (cId) => {
         setCommentIndex(cId < 0 ? 0 : cId);
         setJumpToCommentClicked(true);
@@ -100,11 +187,15 @@ export default function CaseDiscussion(props) {
             (allDiscussions || []).length === 0) {
             return;
         }
+        const targetIndex = findIndex([...comuteSearchedComments], (discussion) => discussion.item.id === discussionIdFromUrl);
+        // Comment is on a later page — wait until keep-fetching brings it in.
+        if (targetIndex < 0) {
+            return;
+        }
         activeElementId.current = discussionIdFromUrl;
         if (allDiscussions.length > VC_MINIMUM_COMMENT) {
-            const commentIndex = findIndex([...comuteSearchedComments], (discussion) => discussion.item.id === discussionIdFromUrl);
-            setVRCommentIndex(commentIndex);
-            if (0 <= commentIndex && commentIndex <= 3) {
+            setVRCommentIndex(targetIndex);
+            if (targetIndex <= 3) {
                 const offset = 80;
                 const scrollTopValue = ((_a = windowScrollerRef === null || windowScrollerRef === void 0 ? void 0 : windowScrollerRef.current) === null || _a === void 0 ? void 0 : _a._positionFromTop) - offset;
                 const scrollLeftValue = (_b = windowScrollerRef === null || windowScrollerRef === void 0 ? void 0 : windowScrollerRef.current) === null || _b === void 0 ? void 0 : _b._positionFromLeft;
@@ -126,13 +217,13 @@ export default function CaseDiscussion(props) {
                 });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [discussionIdFromUrl, allDiscussions, activeElementId.current]);
+    }, [discussionIdFromUrl]);
     useEffect(() => {
-        if (!isExportingPDF) {
-            setDiscussions(dispatchDiscussion, props.caseComments, [], caseAttachmentHydra.data, [], [], discussionFiltersListState, false, false, canSeeAttachments);
-        }
+        if (isExportingPDF)
+            return;
+        setDiscussions(dispatchDiscussion, props.caseComments, [], caseAttachmentHydra.data, [], [], discussionFiltersListState, false, false, canSeeAttachments, sort);
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.caseComments, caseAttachmentHydra, canSeeAttachments]);
+    }, [props.caseComments, caseAttachmentHydra, canSeeAttachments, sort]);
     useEffect(() => {
         if (!caseAttachmentHydra.isFetching && caseAttachmentHydra.isError) {
             ToastNotification.addDangerMessage(t('There was an error loading attachments.'));
@@ -238,6 +329,15 @@ export default function CaseDiscussion(props) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [discussionSectionWidth, shouldRenderRVComponent]);
+    useEffect(() => {
+        var _a;
+        if (shouldRenderRVComponent) {
+            cellMeasureCache.clearAll();
+            (_a = listRef.current) === null || _a === void 0 ? void 0 : _a.recomputeRowHeights();
+        }
+        usedPaginationRef.current = false;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [sort]);
     const renderVRCommentElement = () => {
         return (React.createElement(WindowScroller, { ref: windowScrollerRef, onScroll: handleScroll }, ({ height, registerChild, onChildScroll, isScrolling, scrollTop }) => {
             return (React.createElement("div", { ref: commentRef, "data-tracking-id": "vr-case-comments" },
@@ -313,6 +413,22 @@ export default function CaseDiscussion(props) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [isPostingRemoteRequestCommentCompleted]);
+    const onToggleClick = (e) => {
+        e.stopPropagation();
+        setIsOpen(!isOpen);
+    };
+    const onFilterSelect = (_event, prevOption) => {
+        const isFilterSelected = !prevOption.isSelected;
+        const prevSelectedFilters = list.filter((option) => option.isSelected && option.value !== prevOption.value);
+        const prevSelectedFiltersValue = prevSelectedFilters.map((option) => option.value);
+        const newSelectedFilters = isFilterSelected
+            ? [...prevSelectedFiltersValue, prevOption.value]
+            : prevSelectedFiltersValue;
+        setFilter(dispatchDiscussion, newSelectedFilters, discussionFiltersListState);
+        shouldRenderRVComponent && setCanUpdateScrollTop(false);
+        setSelectedFilterItems(prevSelectedFiltersValue);
+    };
+    const filterToggle = (toggleRef) => (React.createElement(MenuToggle, { ref: toggleRef, onClick: onToggleClick, isExpanded: isOpen, isFullWidth: true }, getDropdownBtnPlaceholder(t('Select a filter'), list.filter((i) => i.isSelected).map((i) => i.filterLabel), ' ', list.length, t('All comments'))));
     const onSortToggleClick = (e) => {
         e.stopPropagation();
         setIsSortOpen(!isSortOpen);
@@ -327,24 +443,83 @@ export default function CaseDiscussion(props) {
     };
     const onSortToggle = (toggleRef) => (React.createElement(MenuToggle, { ref: toggleRef, onClick: onSortToggleClick, isExpanded: isSortOpen, isFullWidth: true }, sort.name));
     return (React.createElement(React.Fragment, null,
+        (() => {
+            const showInitialLoading = props.commentsLoading && allDiscussions.length === 0;
+            const showNoComments = !props.commentsLoading && !props.commentsError && allDiscussions.length === 0;
+            const showDiscussions = allDiscussions.length !== 0;
+            const showSkeleton = debouncedShowSkeleton;
+            const showNoMore = !props.hasNextPage &&
+                !props.isLoadingMore &&
+                !props.commentsLoading &&
+                !props.loadMoreError &&
+                comuteSearchedComments.length > 0;
+            console.log('[CaseDiscussion] RENDER DECISION', {
+                showInitialLoading,
+                showNoComments,
+                showDiscussions,
+                isRefetching,
+                showSkeleton,
+                showNoMore,
+                isSearchResultEmpty,
+                shouldRenderRVComponent,
+            });
+            return null;
+        })(),
         React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading post comment section') } },
             React.createElement(AttachmentContextProvider, null,
                 React.createElement(PostComment, { caseNumber: caseNumber, allDiscussions: allDiscussions, onCommentAdded: onCommentAdded, onAttachmentAdded: onAttachmentAdded, onAttachmentRemove: onAttachmentRemove, replyingToAuthor: replyingToAuthor, replyingToTimestamp: replyingToTimestamp, onClearReply: onClearReply }))),
         props.commentsLoading && allDiscussions.length === 0 && React.createElement(LoadingIndicator, { size: "sm" }),
         props.commentsError && allDiscussions.length === 0 && (React.createElement(AlertMessage, { variant: AlertType.DANGER, show: true, title: t('Failed to load comments. Try refreshing.') })),
-        !props.commentsLoading && !props.commentsError && allDiscussions.length === 0 && (React.createElement(Trans, null, "No comments")),
+        !props.commentsLoading && !props.commentsError && allDiscussions.length === 0 && (React.createElement("p", null,
+            React.createElement(Trans, null, "No comments"))),
         allDiscussions.length !== 0 && (React.createElement(ErrorBoundary, { errorMsgInfo: { message: t('There was an error loading comments. Try refreshing.') } },
             React.createElement("div", { className: `pfe-l-grid pfe-m-all-6-col pfe-m-gutters push-bottom ${isExportingPDF ? 'hide-in-pdf' : ''}` },
-                React.createElement("div", { className: "pfe-m-12-col" }, allDiscussions.length > 20 && (React.createElement(CommentSearch, { caseDiscussions: allDiscussions || [], onCommentSearch: onCaseCommentSearch, isCommentSearchCleared: isCommentSearchCleared }))),
+                React.createElement("div", { className: "pfe-m-12-col" }, allDiscussions.length > 20 && (React.createElement(CommentSearch, { caseDiscussions: computeFilteredComments || [], onCommentSearch: onCaseCommentSearch, isCommentSearchCleared: isCommentSearchCleared }))),
+                React.createElement("span", { className: "push-top-narrow" },
+                    React.createElement("label", { htmlFor: "case-list-comments-dropdown", className: "pf-v6-u-mb-sm" }, t('Filter by')),
+                    React.createElement(Select, { "data-tracking-id": "discussions-filter-comments-dropdown", id: "case-list-comments-dropdown", role: "menu", isOpen: isOpen, selected: selectedFilterItems, onSelect: onFilterSelect, onOpenChange: (isOpen) => setIsOpen(isOpen), toggle: filterToggle, popperProps: { direction: 'down', enableFlip: false }, zIndex: 9 },
+                        React.createElement(SelectList, null, list.map((option) => (React.createElement(SelectOption, { key: option.value, hasCheckbox: true, value: option, isSelected: option.isSelected, isDisabled: option.isDisabled }, option.filterLabel)))))),
                 React.createElement("span", { className: "push-top-narrow" },
                     React.createElement("label", { htmlFor: "se-discussion-sort", className: "pf-v6-u-mb-sm" }, t('Sort by')),
                     React.createElement(Select, { id: "se-discussion-sort", "data-tracking-id": "discussions-sort-dropdown", isOpen: isSortOpen, selected: sortSelected, onSelect: onSortSelect, onOpenChange: (isSortOpen) => setIsSortOpen(isSortOpen), toggle: onSortToggle, shouldFocusToggleOnSelect: true, popperProps: { direction: 'down', enableFlip: false }, zIndex: 9 },
-                        React.createElement(SelectList, null, discussionSortOrderConst.map((option) => (React.createElement(SelectOption, { value: option.name, isSelected: isEqual(sort.name, option.name) }, option.name))))))),
-            React.createElement("div", { className: "support-comment-section" }, !shouldRenderRVComponent &&
-                !isSearchResultEmpty &&
-                comuteSearchedComments.map((discussion, index) => {
-                    return renderCaseCommentElement(discussion);
-                })),
-            isSearchResultEmpty && (React.createElement(AlertMessage, { variant: AlertType.WARNING, show: true, title: t('No result found') })),
-            shouldRenderRVComponent && !isSearchResultEmpty && renderVRCommentElement()))));
+                        React.createElement(SelectList, null, discussionSortOrderConst.map((option) => (React.createElement(SelectOption, { key: option.name, value: option.name, isSelected: isEqual(sort.name, option.name) }, option.name))))))),
+            React.createElement("div", { className: "support-comment-section" },
+                isRefetching && React.createElement(LoadingIndicator, { size: "sm" }),
+                !isRefetching &&
+                    !shouldRenderRVComponent &&
+                    !isSearchResultEmpty &&
+                    comuteSearchedComments.map((discussion, index) => {
+                        return renderCaseCommentElement(discussion);
+                    })),
+            isSearchResultEmpty && (React.createElement("p", { className: "infinite-scroll-end-status" },
+                React.createElement(Trans, null, "No results found"))),
+            !isRefetching && shouldRenderRVComponent && !isSearchResultEmpty && renderVRCommentElement(),
+            React.createElement("div", { ref: sentinelRef, "aria-hidden": "true", style: { height: 10, marginBottom: -10 } }),
+            debouncedShowSkeleton && (React.createElement("div", { className: "load-more-skeleton", role: "status", "aria-label": t('Loading more comments') },
+                React.createElement("div", { className: "load-more-skeleton__header" },
+                    React.createElement("div", { className: "load-more-skeleton__avatar" }),
+                    React.createElement("div", { className: "load-more-skeleton__name" }),
+                    React.createElement("div", { className: "load-more-skeleton__timestamp" })),
+                React.createElement("div", { className: "load-more-skeleton__body" },
+                    React.createElement("div", { className: "load-more-skeleton__line", style: { width: '100%' } }),
+                    React.createElement("div", { className: "load-more-skeleton__line", style: { width: '85%' } }),
+                    React.createElement("div", { className: "load-more-skeleton__line", style: { width: '60%' } })))),
+            props.loadMoreError && props.loadMoreRetryCount <= 1 && (React.createElement("div", { className: "infinite-scroll-footer-message" },
+                React.createElement(Button, { variant: "secondary", onClick: props.retryLoadMore, icon: React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" },
+                        React.createElement("polyline", { points: "23 4 23 10 17 10" }),
+                        React.createElement("path", { d: "M20.49 15a9 9 0 1 1-2.12-9.36L23 10" })) },
+                    React.createElement(Trans, null, "try loading again")))),
+            props.loadMoreError && props.loadMoreRetryCount > 1 && (React.createElement("p", { className: "infinite-scroll-end-status" },
+                React.createElement(Trans, null, "We're having trouble loading your comments. Please refresh or"),
+                ' ',
+                React.createElement(Button, { variant: "link", isInline: true, onClick: props.retryLoadMore },
+                    React.createElement(Trans, null, "try again")),
+                ".")),
+            !props.hasNextPage &&
+                !props.isLoadingMore &&
+                !props.commentsLoading &&
+                !props.loadMoreError &&
+                comuteSearchedComments.length > 0 &&
+                props.retryLoadMore !== undefined && (React.createElement("p", { className: "infinite-scroll-end-status" },
+                React.createElement(Trans, null, "No more comments to load")))))));
 }

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/PostComment/useCommentDrafts.d.ts

@@ -10,7 +10,7 @@ interface UseCommentDraftsParams {
     applySignature: (text: string) => void;
 }
 export declare function useCommentDrafts({ caseNumber, loggedInUserSSO, isInternal, commentSignature, canPostPrivateComments, setCommentText, setIsPublic, applySignature, }: UseCommentDraftsParams): {
-    saveDraft: (...args: any[]) => void;
+    saveDraft: import("lodash").DebouncedFunc<(value: string, publicFlag: boolean) => Promise<void>>;
     clearDraft: () => Promise<void>;
 };
 export {};

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/PostComment/useCommentDrafts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCommentDrafts.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/PostComment/useCommentDrafts.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAsB,MAAM,OAAO,CAAC;AAMrE,UAAU,sBAAsB;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,sBAAsB,EAAE,OAAO,CAAC;IAChC,cAAc,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACjD,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAC/C,cAAc,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,gBAAgB,CAAC,EAC7B,UAAU,EACV,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,EACd,WAAW,EACX,cAAc,GACjB,EAAE,sBAAsB;;;EA4DxB"}
+{"version":3,"file":"useCommentDrafts.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/PostComment/useCommentDrafts.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAsB,MAAM,OAAO,CAAC;AAMrE,UAAU,sBAAsB;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,sBAAsB,EAAE,OAAO,CAAC;IAChC,cAAc,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACjD,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAC/C,cAAc,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,gBAAgB,CAAC,EAC7B,UAAU,EACV,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,sBAAsB,EACtB,cAAc,EACd,WAAW,EACX,cAAc,GACjB,EAAE,sBAAsB;sDAGmB,MAAM,cAAc,OAAO;;EA2DtE"}

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/PostComment/useCommentDrafts.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { debounce } from '@patternfly/react-core';
+import debounce from 'lodash/debounce';
 import { useEffect, useMemo } from 'react';
 import { CaseDetailsCacheNamespaces } from '../../../../../enums/cache';
 import { CaseDetailsCacheUtils } from '../../../../../utils/caseDetailsCacheUtils';
@@ -28,6 +28,8 @@ export function useCommentDrafts({ caseNumber, loggedInUserSSO, isInternal, comm
         });
     }, 500), [caseNumber, commentSignature, loggedInUserSSO]);
     const clearDraft = () => __awaiter(this, void 0, void 0, function* () {
+        // RTE onChange keeps scheduling saves; cancel so submit/reset cannot resurrect the draft.
+        saveDraft.cancel();
         const { value: prevDraftComments = {} } = (yield CaseDetailsCacheUtils.get(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserSSO)) || {};
         delete prevDraftComments[caseNumber];
         CaseDetailsCacheUtils.set(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserSSO, {

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/PostComment.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PostComment.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/PostComment.tsx"],"names":[],"mappings":"AAUA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAOpF,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAmB5E,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,WAAW,EAAE,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,qBAobxC"}
+{"version":3,"file":"PostComment.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/PostComment.tsx"],"names":[],"mappings":"AAUA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAOpF,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAmB5E,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,WAAW,EAAE,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,qBAibxC"}

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/PostComment.js

@@ -36,7 +36,6 @@ export function PostComment(props) {
     var _a, _b, _c, _d, _e, _f, _g;
     const { t } = useTranslation();
     let { caseNumber } = props;
-    const [isTextAreaFocused, setIsTextAreaFocused] = useState(false);
     const canPostPrivateComments = ability.can(resourceActions.PATCH, resources.CASE_COMMENTS, CaseDiscussionFields.POST_PRIVATE_COMMENT);
     const { createComment, loading: isPostingComment } = useCreateCaseComment();
     const dispatchToAttachmentReducer = useContext(AttachmentDispatchContext);
@@ -133,11 +132,10 @@ export function PostComment(props) {
         applySignature,
     });
     const resetCommentSection = () => __awaiter(this, void 0, void 0, function* () {
-        setCommentText('');
-        setIsTextAreaFocused(false);
-        resetIsPublic();
         yield clearDraft();
-        setCommentText(commentSignature ? `<p><br></p><p>${commentSignature}</p>` : '');
+        const resetText = commentSignature ? `<p><br></p><p>${commentSignature}</p>` : '';
+        setCommentText(resetText);
+        resetIsPublic();
     });
     const resetAttachmentSection = () => {
         resetAttachment(dispatchToAttachmentReducer);
@@ -259,18 +257,18 @@ export function PostComment(props) {
     const onFileUploadClick = () => {
         ToastNotification.addInfoMessage(t('Uploading Attachment(s)'));
     };
-    const onTextAreaBlur = () => {
-        if (!commentText)
-            setIsTextAreaFocused(false);
-    };
     const onCommentExceedCharsLimit = (lengthExceededNew) => {
         if (isCommentTooLong !== lengthExceededNew)
             setIsCommentTooLong(lengthExceededNew);
     };
     // Submit stays independent of attachment upload so comments can be posted mid-upload (PCM-15915).
-    const isSubmitDisabled = isCommentEmpty || isPostCommentDisabled || (isConfirmedStateSideSupport && !cssCommentAgreed) || isCaseReadOnly;
+    const isSubmitDisabled = isCommentEmpty ||
+        isPostCommentDisabled ||
+        isCommentTooLong ||
+        (isConfirmedStateSideSupport && !cssCommentAgreed) ||
+        isCaseReadOnly;
     return (React.createElement("div", { className: `pf-v6-u-mb-md ${isExportingPDF ? 'hide-in-pdf' : ''}`, ref: componentRef },
-        props.replyingToAuthor && (React.createElement("div", { className: "post-comment-reply-banner pf-v6-u-mb-sm", "data-tracking-id": "reply-banner" },
+        props.replyingToAuthor && (React.createElement("output", { className: "post-comment-reply-banner pf-v6-u-mb-sm", "aria-label": `Replying to ${props.replyingToAuthor}`, "data-tracking-id": "reply-banner" },
             React.createElement("span", null,
                 React.createElement(Trans, null, "Replying to"),
                 " ",
@@ -281,11 +279,7 @@ export function PostComment(props) {
                     ")"))),
             React.createElement(Button, { variant: ButtonVariant.plain, "aria-label": t('Cancel reply'), onClick: props.onClearReply, "data-tracking-id": "cancel-reply-button" },
                 React.createElement(TimesIcon, null)))),
-        React.createElement(RichTextEditor, { key: `${caseNumber}-${isCaseReadOnly}`, className: `${!isPublic && canPostPrivateComments ? 'is-private' : ''}`, disabled: isProcessing || isCaseReadOnly, hideToolbar: isCaseReadOnly, "aria-label": "comment text area", onFocus: () => {
-                if (isCaseReadOnly)
-                    return;
-                setIsTextAreaFocused(true);
-            }, onBlur: onTextAreaBlur, onChange: onCommentTextChange, value: commentText, height: isTextAreaFocused ? 313 : 120, onCharLimitExceeded: onCommentExceedCharsLimit, placeholder: !isPublic && canPostPrivateComments
+        React.createElement(RichTextEditor, { key: `${caseNumber}-${isCaseReadOnly}`, className: `${!isPublic && canPostPrivateComments ? 'is-private' : ''}`, disabled: isProcessing || isCaseReadOnly, hideToolbar: isCaseReadOnly, "aria-label": "comment text area", onChange: onCommentTextChange, value: commentText, height: 313, onCharLimitExceeded: onCommentExceedCharsLimit, placeholder: !isPublic && canPostPrivateComments
                 ? 'Add a comment or attach a file privately'
                 : 'Add a comment to this case', charLimit: 32000, onImageUpload: onImageUpload, bindEditor: (editor) => {
                 quillEditorRef.current = editor;
@@ -303,7 +297,7 @@ export function PostComment(props) {
                     React.createElement(PlusIcon, null),
                     " ",
                     React.createElement(Trans, null, "Attach files")) }),
-            React.createElement(Button, { className: "secondary-button-pill", "data-tracking-id": "postcomment-cancel-button", type: "button", variant: ButtonVariant.link, onClick: onCancelClick, isDisabled: isCommentEmpty || isProcessing || isCaseReadOnly },
+            React.createElement(Button, { className: "secondary-button-pill", "data-tracking-id": "postcomment-cancel-button", type: "button", variant: ButtonVariant.link, onClick: onCancelClick, isDisabled: isCommentSignatureMatch() || isProcessing || isCaseReadOnly },
                 React.createElement(Trans, null, "Cancel")),
             canPostPrivateComments && (React.createElement("span", { className: "post-comment-checkbox" },
                 React.createElement(Checkbox, { label: t('Private'), isChecked: !isPublic && canPostPrivateComments, isDisabled: isCaseReadOnly, onChange: handleCheckboxToggle, "aria-label": t('Private'), id: "private-comment", name: "private-comment", "data-tracking-id": "private-comment-checkbox" }))))),

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/VerifyCaseStatusModal/VerifyCaseStatusModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerifyCaseStatusModal.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/VerifyCaseStatusModal/VerifyCaseStatusModal.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAa3E,UAAU,MAAM;IACZ,SAAS,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,qBAiJlD"}
+{"version":3,"file":"VerifyCaseStatusModal.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/VerifyCaseStatusModal/VerifyCaseStatusModal.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAsD,MAAM,OAAO,CAAC;AAa3E,UAAU,MAAM;IACZ,SAAS,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,qBA8IlD"}

package/lib/esm/components/CaseEditView/Tabs/CaseDiscussion/VerifyCaseStatusModal/VerifyCaseStatusModal.js

@@ -71,7 +71,7 @@ export function VerifyCaseStatusModal(props) {
             }
             catch (e) {
                 setStatusUpdating(caseOverviewDispatch, false);
-                caseUpdateError.showError(e, t('Status failed to update, try refreshing the page. Please contact us if the problem persists.'));
+                caseUpdateError.showFieldError(e, t('Status'), () => updateStatusState(statusVal, onStatusUpdate));
             }
         }
         else {