@rh-support/troubleshoot 2.6.295 → 2.6.299

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":"AA8BA,OAAO,KAAwE,MAAM,OAAO,CAAC;AAQ7F,OAAO,EAAkB,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAsB5F,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,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,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,WAAW,EAAE,CAAC;CACjC;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,qBA+iBxC"}
+{"version":3,"file":"PostComment.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseDiscussion/PostComment.tsx"],"names":[],"mappings":"AAQA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAMpF,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAqB5E,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAIrC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,WAAW,EAAE,CAAC;CACjC;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,qBA4VxC"}

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

@@ -7,104 +7,92 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { publicApi } from '@cee-eng/hydrajs';
-import { Button, ButtonVariant, Checkbox, debounce, Tooltip } from '@patternfly/react-core';
-import PlusIcon from '@patternfly/react-icons/dist/js/icons/plus-icon';
-import { EditorMode, LoadingIndicator, MarkdownEditor, ToastNotification, useFetch, usePrevious, } from '@rh-support/components';
-import { FeatureAnnouncementKeys, GlobalMetadataStateContext, NewFeaturePopoverAnnouncement, useCanEditCase, useUserPreferences, } from '@rh-support/react-context';
-import { ability, CaseDiscussionFields, CaseListFields, resourceActions, resources, } from '@rh-support/user-permissions';
-import { pendoTrackEvent } from '@rh-support/utils';
+// TODO: Re-enable after GraphQL migration of attachments
+// import { IAttachment } from '@cee-eng/hydrajs/@types/models/attachment';
+import { Button, ButtonVariant, Checkbox } from '@patternfly/react-core';
+import { EditorMode, LoadingIndicator, MarkdownEditor, ToastNotification, usePrevious } from '@rh-support/components';
+import { GlobalMetadataStateContext, useCanEditCase, useUserPreferences } from '@rh-support/react-context';
+import { ability, CaseDiscussionFields, resourceActions, resources } from '@rh-support/user-permissions';
 import isEmpty from 'lodash/isEmpty';
 import isEqual from 'lodash/isEqual';
-import uniqBy from 'lodash/uniqBy';
-import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
-import { useDropzone } from 'react-dropzone';
+import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useCaseDispatch, useCaseSelector } from '../../../../context/CaseContext';
-import { CaseDetailsCacheNamespaces } from '../../../../enums/cache';
+import { useCreateCaseComment } from '../../../../hooks/useCaseComments';
 import { useCaseUpdateErrorMessage } from '../../../../hooks/useCaseUpdateErrorMessage';
-import { DiscussionType } from '../../../../reducers/CaseDiscussionTabReducer';
-import { addingNotifiedUsers, checkForCaseStatusToggleOnAttachOrComment, setNotifiedUser, } from '../../../../reducers/CaseReducer';
-import { CaseDetailsCacheUtils } from '../../../../utils/caseDetailsCacheUtils';
-import { markdownFilePasteEvent } from '../../../shared/Constants';
-import { AttachmentDispatchContext, AttachmentStateContext, hasSomeSelectedFiles, hasSomeUnUploadedAttachments, isUploadingAttachment, resetAttachment, } from '../../../shared/fileUpload';
-import FileSelectorButton from '../../../shared/fileUpload/fileSelectors/FileSelectorButton';
-import FileUpload from '../../../shared/fileUpload/FileUpload';
+import { checkForCaseStatusToggleOnAttachOrComment } from '../../../../reducers/CaseReducer';
+// TODO: Re-enable after GraphQL migration of attachments
+// import { markdownFilePasteEvent } from '../../../shared/Constants';
+// import {
+//     AttachmentDispatchContext,
+//     AttachmentStateContext,
+//     hasSomeSelectedFiles,
+//     hasSomeUnUploadedAttachments,
+//     isUploadingAttachment,
+//     resetAttachment,
+// } from '../../../shared/fileUpload';
+// import FileSelectorButton from '../../../shared/fileUpload/fileSelectors/FileSelectorButton';
+// import FileUpload from '../../../shared/fileUpload/FileUpload';
 import { PDFContext } from '../../PDFContainer';
-import { useMarkdownFileUploader } from './PostComment/useMarkdownFileUploader';
+// TODO: Re-enable after GraphQL migration of attachments
+// import { useAttachmentUploadCompletion } from './PostComment/useAttachmentUploadCompletion';
+import { useCommentDrafts } from './PostComment/useCommentDrafts';
+// import { useMarkdownFileUploader } from './PostComment/useMarkdownFileUploader';
 import { VerifyCaseStatusModal } from './VerifyCaseStatusModal/VerifyCaseStatusModal';
 export function PostComment(props) {
-    var _a, _b;
+    var _a;
     const { t } = useTranslation();
     const caseUpdateError = useCaseUpdateErrorMessage();
     let { caseNumber } = props;
     const [isTextAreaFocused, setIsTextAreaFocused] = useState(false);
-    const canAddAttachments = ability.can(resourceActions.PATCH, resources.CASE_CREATE, CaseListFields.ATTACHMENTS);
     const canPostPrivateComments = ability.can(resourceActions.PATCH, resources.CASE_COMMENTS, CaseDiscussionFields.POST_PRIVATE_COMMENT);
-    const { request, isFetching: isPostingComment } = useFetch(publicApi.kase.postComment, {
-        propgateErrors: true,
-    });
-    const dispatchToAttachmentReducer = useContext(AttachmentDispatchContext);
-    const { attachmentState } = useContext(AttachmentStateContext);
-    const [commentText, setCommentText] = useState(props.commentText || '');
+    const { createComment, loading: isPostingComment } = useCreateCaseComment();
     const [isPublic, setIsPublic] = useState(props.defaultIsPublic === null ? true : props.defaultIsPublic);
-    const isPublicRef = useRef(isPublic);
-    const isUploadingAttachmentPrevious = useRef(false);
-    const isUploadingAttachments = isUploadingAttachment(attachmentState.caseFiles.selectedLocalFiles);
-    const hasSomeUnUploadedFiles = hasSomeUnUploadedAttachments(attachmentState.caseFiles.selectedLocalFiles);
-    const hasSomeSelectedFilesLocal = hasSomeSelectedFiles(attachmentState.caseFiles.selectedLocalFiles);
     const [commentType, setCommentType] = useState(EditorMode.PLAIN);
     const [commentSignature, setCommentSignature] = useState('');
+    const [commentText, setCommentText] = useState(props.commentText || '');
     const { isExportingPDF } = useContext(PDFContext);
     const { getCommentTypeFromPreference, getCommentSignature } = useUserPreferences();
-    const userOriginalCommentPrefs = () => __awaiter(this, void 0, void 0, function* () {
-        try {
-            const retrievedComment = yield getCommentTypeFromPreference();
-            const retrievedCommentSignature = yield getCommentSignature();
-            const defaultCommentType = retrievedComment ? retrievedComment : EditorMode.PLAIN;
-            // @ts-ignore
-            setCommentType(defaultCommentType);
-            const defaultCommentSignature = retrievedCommentSignature || '';
-            setCommentSignature(defaultCommentSignature);
-            if (isEmpty(commentText) && !isEmpty(defaultCommentSignature)) {
-                setCommentText(`\n ${defaultCommentSignature}` || '');
-            }
-        }
-        catch (error) {
-            console.log(error);
-        }
-    });
+    const applySignature = useCallback((text) => {
+        if (isEmpty(commentSignature))
+            return;
+        const signed = text.includes(commentSignature) ? text : text + '\n' + commentSignature;
+        setCommentText(signed);
+    }, [commentSignature]);
     useEffect(() => {
-        userOriginalCommentPrefs();
+        function loadPrefs() {
+            return __awaiter(this, void 0, void 0, function* () {
+                try {
+                    yield getCommentTypeFromPreference();
+                    const sig = (yield getCommentSignature()) || '';
+                    setCommentType(EditorMode.PLAIN);
+                    setCommentSignature(sig);
+                    if (isEmpty(commentText) && !isEmpty(sig)) {
+                        setCommentText(`\n ${sig}`);
+                    }
+                }
+                catch (error) {
+                    console.error('Failed to load comment preferences:', error);
+                }
+            });
+        }
+        loadPrefs();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     const [isModalOpen, setIsModalOpen] = useState(false);
     const [cssCommentAgreed, setCssCommentAgreed] = useState(false);
-    const [isProcessing, setIsProcessing] = useState(isPostingComment || isUploadingAttachments);
+    const [isProcessing, setIsProcessing] = useState(false);
     const { globalMetadataState: { loggedInUser, loggedInUserRights, loggedInUsersAccount }, } = useContext(GlobalMetadataStateContext);
-    const { onFileSelect, onFileAttach, onFileDelete, isUploadingFile, isMarkdownFileUploadInProgress, cancelFileUpload, } = useMarkdownFileUploader({
-        caseNumber,
-        secureSupport: loggedInUsersAccount.data.secureSupport,
-        onAttachmentAdded: props.onAttachmentAdded,
-    });
-    const { selectedNotificationContacts, status, contactSSOName, selectedAccountDetails } = useCaseSelector((state) => ({
+    const { status, caseSalesforceId } = useCaseSelector((state) => ({
         status: state.caseDetails.status,
-        contactSSOName: state.caseDetails.contactSSOName,
-        selectedNotificationContacts: state.selectedNotificationContacts,
-        selectedAccountDetails: state.selectedAccountDetails,
+        caseSalesforceId: state.caseDetails.id,
     }), isEqual);
-    const isConfirmedStateSideSupport = ((_a = loggedInUsersAccount === null || loggedInUsersAccount === void 0 ? void 0 : loggedInUsersAccount.data) === null || _a === void 0 ? void 0 : _a.hasConfirmedStatesideSupport) ||
-        ((_b = selectedAccountDetails === null || selectedAccountDetails === void 0 ? void 0 : selectedAccountDetails.data) === null || _b === void 0 ? void 0 : _b.hasConfirmedStatesideSupport);
+    const isConfirmedStateSideSupport = (_a = loggedInUsersAccount === null || loggedInUsersAccount === void 0 ? void 0 : loggedInUsersAccount.data) === null || _a === void 0 ? void 0 : _a.hasConfirmedStatesideSupport;
     const caseDispatch = useCaseDispatch();
     const [isCommentTooLong, setIsCommentTooLong] = useState(false);
     const canEditCase = useCanEditCase();
     const componentRef = useRef(null);
     let passedReply = props.commentText;
-    const { getRootProps, getInputProps, open } = useDropzone({
-        onDrop: (files) => onFileAttach(files, isPublic),
-        multiple: false,
-    });
-    // Allows the isPublic default state to be changed by the parent component
     const resetIsPublic = useCallback(() => setIsPublic(props.defaultIsPublic === null ? true : props.defaultIsPublic), [props.defaultIsPublic]);
     const previousDefaultIsPublic = usePrevious(props.defaultIsPublic);
     useEffect(() => {
@@ -112,99 +100,107 @@ export function PostComment(props) {
             return;
         props.defaultIsPublic === null ? resetIsPublic() : setIsPublic(props.defaultIsPublic);
     }, [props.defaultIsPublic, resetIsPublic, previousDefaultIsPublic]);
-    // why usecallback instead of useRef?
-    // https://reactjs.org/docs/hooks-faq.html#how-can-i-measure-a-dom-node
     const textAreaRef = useCallback((node) => {
-        if (node !== null &&
+        const isReplyMatch = node !== null &&
             props.commentText &&
             props.commentCreator &&
             commentText &&
-            commentText === getReplyText(props.commentText, props.commentCreator)) {
-            node.scrollTop = node.scrollHeight;
-            node.focus();
-        }
+            commentText === getReplyText(props.commentText, props.commentCreator);
+        if (!isReplyMatch)
+            return;
+        node.scrollTop = node.scrollHeight;
+        node.focus();
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [commentText]);
+    const loggedInUserSSO = loggedInUserRights.data.getSSOUsername();
+    const { saveDraft, clearDraft } = useCommentDrafts({
+        caseNumber,
+        loggedInUserSSO,
+        commentSignature,
+        setCommentText,
+        setCommentType,
+        setIsPublic,
+        applySignature,
+    });
     const resetCommentSection = () => __awaiter(this, void 0, void 0, function* () {
+        var _a;
         setCommentText('');
         setIsTextAreaFocused(false);
         resetIsPublic();
-        const { value: prevDraftComments = {} } = (yield CaseDetailsCacheUtils.get(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserRights.data.getSSOUsername())) || {};
-        if (prevDraftComments[caseNumber]) {
-            delete prevDraftComments[caseNumber];
-        }
-        CaseDetailsCacheUtils.set(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserRights.data.getSSOUsername(), { value: prevDraftComments });
-        props.onCommentClear && props.onCommentClear();
-        setCommentText(`\n ${commentSignature}` || '');
+        yield clearDraft();
+        (_a = props.onCommentClear) === null || _a === void 0 ? void 0 : _a.call(props);
+        setCommentText(commentSignature ? `\n ${commentSignature}` : '');
     });
-    const resetAttachmentSection = () => {
-        resetAttachment(dispatchToAttachmentReducer);
-    };
     const onCancelClick = () => {
         resetCommentSection();
-        resetAttachmentSection();
-        cancelFileUpload();
     };
-    const loggedInUserSSO = loggedInUserRights.data.getSSOUsername();
-    // https://github.com/facebook/react/issues/19240
-    const debouncedCacheSave = useMemo(() => debounce(function (value, mode, publicFlag) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const { value: prevDraftComments = {} } = (yield CaseDetailsCacheUtils.get(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserSSO)) || {};
-            if (prevDraftComments[caseNumber]) {
-            }
-            prevDraftComments[caseNumber] = { text: value, privateFlag: !publicFlag, type: mode };
-            CaseDetailsCacheUtils.set(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserSSO, {
-                value: prevDraftComments,
-            });
-        });
-    }, 500), [caseNumber, loggedInUserSSO]);
     const onCommentTextChange = (value, mode) => __awaiter(this, void 0, void 0, function* () {
-        setCommentType(mode);
-        setCommentText(value);
-        debouncedCacheSave(value, mode, isPublic);
+        setCommentType(mode !== null && mode !== void 0 ? mode : commentType);
+        setCommentText(value !== null && value !== void 0 ? value : '');
+        saveDraft(value, mode, isPublic);
     });
-    const addUserToNotifyList = () => __awaiter(this, void 0, void 0, function* () {
-        const loggedInUserSSO = loggedInUserRights.data.getSSOUsername();
-        if (loggedInUserSSO !== contactSSOName &&
-            !(selectedNotificationContacts || []).map((item) => item.ssoUsername).includes(loggedInUserSSO)) {
-            yield addingNotifiedUsers(caseDispatch, caseNumber, [{ ssoUsername: loggedInUserSSO }]);
-            setNotifiedUser(caseDispatch, uniqBy([...selectedNotificationContacts, loggedInUser.data], 'ssoUsername'));
-        }
-    });
-    useEffect(() => {
-        isPublicRef.current = isPublic;
-    }, [isPublic]);
+    const onCancel = () => {
+        setIsModalOpen(false);
+    };
+    const isNotInternalConfirm = () => {
+        onPostComment();
+    };
+    const onConfirm = () => {
+        setIsModalOpen(false);
+        isNotInternalConfirm();
+    };
+    const onBtnClick = () => {
+        setIsModalOpen(true);
+    };
+    // TODO: Re-enable after GraphQL migration (REST notification)
+    // const addUserToNotifyList = async () => {
+    //     const sso = loggedInUserRights.data.getSSOUsername();
+    //     const alreadyNotified = (selectedNotificationContacts || []).some((item) => item.ssoUsername === sso);
+    //     if (sso === contactSSOName || alreadyNotified) return;
+    //     await addingNotifiedUsers(caseDispatch, caseNumber, [{ ssoUsername: sso }]);
+    //     setNotifiedUser(caseDispatch, uniqBy([...selectedNotificationContacts, loggedInUser.data], 'ssoUsername'));
+    // };
+    const checkCommentSignature = commentText.replace(commentSignature, '');
+    const isCommentEmpty = isEmpty(checkCommentSignature === null || checkCommentSignature === void 0 ? void 0 : checkCommentSignature.trim());
     useEffect(() => {
+        var _a;
         if (isCommentEmpty) {
-            props.onCommentClear && props.onCommentClear();
+            (_a = props.onCommentClear) === null || _a === void 0 ? void 0 : _a.call(props);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [commentText]);
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const onPostComment = () => __awaiter(this, void 0, void 0, function* () {
+        var _a;
         if (canEditCase.alert())
             return;
-        if (commentText) {
-            try {
-                setIsProcessing(true);
-                const newCommentText = commentText.replace(/(^|\n)(-\s.+)(\n(?![-\s]))/g, '$1$2\n\n');
-                yield request({ caseNumber, commentBody: newCommentText, isPublic, contentType: commentType });
-                checkForCaseStatusToggleOnAttachOrComment(caseDispatch, loggedInUserRights.data.isInternal(), status);
-                !isPublic && setIsPublic(true);
-                addUserToNotifyList();
-                // update state
-                yield props.onCommentAdded();
-                resetCommentSection();
-                ToastNotification.addSuccessMessage(t('Comment submitted'));
-                setCssCommentAgreed(false);
-            }
-            catch (e) {
-                caseUpdateError.showError(e, t('Could not submit comment'));
-            }
-            finally {
-                setIsProcessing(false);
-            }
+        if (!commentText)
+            return;
+        if (!caseSalesforceId)
+            return;
+        try {
+            setIsProcessing(true);
+            yield createComment({
+                caseId: caseSalesforceId,
+                body: commentText,
+                isPublic,
+                isAssociate: loggedInUserRights.data.isInternal(),
+            });
+            checkForCaseStatusToggleOnAttachOrComment(caseDispatch, loggedInUserRights.data.isInternal(), status);
+            if (!isPublic)
+                setIsPublic(true);
+            // TODO: Re-enable after GraphQL migration (REST notification)
+            // addUserToNotifyList();
+            yield ((_a = props.onCommentAdded) === null || _a === void 0 ? void 0 : _a.call(props));
+            resetCommentSection();
+            ToastNotification.addSuccessMessage(t('Comment submitted'));
+            setCssCommentAgreed(false);
+        }
+        catch (e) {
+            caseUpdateError.showError(e, t('Could not submit comment'));
+        }
+        finally {
+            setIsProcessing(false);
         }
     });
     const handleCheckboxToggle = () => {
@@ -214,10 +210,11 @@ export function PostComment(props) {
         return commentText.trim() === commentSignature;
     }
     const isPostCommentDisabled = isProcessing || !commentText || isCommentSignatureMatch();
-    const isFileUploadDisabled = isConfirmedStateSideSupport && !cssCommentAgreed;
-    const onFileUploadClick = () => {
-        ToastNotification.addInfoMessage(t('Uploading Attachment(s)'));
-    };
+    /**
+     * Formats a reply as a markdown blockquote. Truncates the original text
+     * to 1000 characters, prepends an attribution header, and prefixes each
+     * line with `> ` for blockquote rendering.
+     */
     const getReplyText = (replyText, commentCreator) => {
         const person = t(`(replying to {{commentCreator}}) \n`, { commentCreator });
         const reply = replyText
@@ -226,103 +223,29 @@ export function PostComment(props) {
             .reduce((acc, line) => (acc += '> ' + line + '\n'), person);
         return reply;
     };
-    const addCommentSignature = (preSigComment) => {
-        if (!isEmpty(commentSignature)) {
-            let signedComment = '';
-            // Checks if somment signature already exists and depending on that check, adds the signature
-            if (preSigComment.includes(commentSignature)) {
-                signedComment = preSigComment;
-            }
-            else {
-                signedComment = preSigComment + '\n' + commentSignature;
-            }
-            setCommentText(signedComment);
-        }
-    };
     useEffect(() => {
-        if (!props.commentText || !props.commentCreator) {
+        if (!props.commentText || !props.commentCreator)
             return;
-        }
         const reply = getReplyText(props.commentText, props.commentCreator);
         if (reply.includes(commentSignature)) {
             setCommentText(reply);
         }
         else {
-            addCommentSignature(reply);
+            applySignature(reply);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [props.commentText, props.commentCreator]);
-    useEffect(() => {
-        if (isUploadingAttachmentPrevious.current && !isUploadingAttachments && !hasSomeUnUploadedFiles) {
-            ToastNotification.addSuccessMessage(t('Attachment(s) uploaded successfully'));
-            checkForCaseStatusToggleOnAttachOrComment(caseDispatch, loggedInUserRights.data.isInternal(), status);
-            // update state
-            resetAttachmentSection();
-            props.onAttachmentAdded();
-            setCssCommentAgreed(false);
-        }
-        isUploadingAttachmentPrevious.current = isUploadingAttachments;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [isUploadingAttachments]);
-    useEffect(() => {
-        function getDraftComments() {
-            return __awaiter(this, void 0, void 0, function* () {
-                const { value: draftComments = {} } = (yield CaseDetailsCacheUtils.get(CaseDetailsCacheNamespaces.COMMENTS_DRAFT.name, loggedInUserRights.data.getSSOUsername())) || {};
-                if (draftComments[caseNumber]) {
-                    const { text, privateFlag, type } = draftComments[caseNumber];
-                    if (text.trim()) {
-                        addCommentSignature(text);
-                        privateFlag === true && setIsPublic(false);
-                        setCommentType(type);
-                    }
-                }
-            });
-        }
-        getDraftComments();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [commentSignature]);
     const onTextAreaBlur = () => {
-        !commentText && setIsTextAreaFocused(false);
+        if (!commentText)
+            setIsTextAreaFocused(false);
     };
     const onCommentExceedCharsLimit = (lengthExceededNew) => {
         if (isCommentTooLong !== lengthExceededNew)
             setIsCommentTooLong(lengthExceededNew);
     };
-    const showCaseIsNotEditableAlert = () => {
-        if (canEditCase.alert())
-            return;
-    };
-    const fileUploadButton = (React.createElement(React.Fragment, null, canEditCase.isCaseNotEditable ? (React.createElement(Button, { variant: ButtonVariant.secondary, onClick: showCaseIsNotEditableAlert, isDisabled: isFileUploadDisabled }, t(isPublic || !canPostPrivateComments ? 'Attach files' : 'Attach private files'))) : (React.createElement(FileSelectorButton, { buttonLabel: t(isPublic || !canPostPrivateComments ? 'Attach files' : 'Attach private files'), isSessionId: false, isPrivate: !isPublic, "data-tracking-id": "case-discussion-file-selector-button", isDisabled: isFileUploadDisabled }))));
-    const markdownToolbarFileSelectorBtn = (React.createElement(Button, { type: "button", onClick: open, "data-tracking-id": "inline-image-attach-file", isDisabled: isUploadingFile, variant: ButtonVariant.link, icon: React.createElement(PlusIcon, null) }, t(isPublic ? 'Attach files' : 'Attach private files')));
-    // This is where we get all attachments to show in dropdown
-    const getAllAttachments = () => {
-        return (props.allDiscussions || [])
-            .filter((item) => item.discussionType === DiscussionType.ATTACHMENT)
-            .map((elem) => elem.item);
-    };
-    const onClipboardPaste = (files) => {
-        pendoTrackEvent(markdownFilePasteEvent);
-        onFileAttach(files, isPublicRef.current);
-    };
-    const onCancel = () => {
-        setIsModalOpen(false);
-    };
-    const isNotInternalConfirm = () => {
-        onPostComment();
-    };
-    const onConfirm = (commentText) => {
-        setIsModalOpen(false);
-        isNotInternalConfirm();
-    };
-    const onBtnClick = () => {
-        setIsModalOpen(true);
-    };
-    // To check is commment is empty
-    const checkCommentSignature = commentText.replace(commentSignature, '');
-    const isCommentEmpty = isEmpty(checkCommentSignature === null || checkCommentSignature === void 0 ? void 0 : checkCommentSignature.trim());
-    // To check is comment reply is empty and disable if it is
     const isReplyDisabled = () => {
-        let parsedPassedReply = getReplyText(passedReply, props.commentCreator);
+        var _a;
+        let parsedPassedReply = getReplyText(passedReply !== null && passedReply !== void 0 ? passedReply : '', (_a = props.commentCreator) !== null && _a !== void 0 ? _a : '');
         return (parsedPassedReply === null || parsedPassedReply === void 0 ? void 0 : parsedPassedReply.trim()) === (commentText === null || commentText === void 0 ? void 0 : commentText.trim());
     };
     const isSubmitDisabled = isReplyDisabled() ||
@@ -330,20 +253,10 @@ export function PostComment(props) {
         isPostCommentDisabled ||
         (isConfirmedStateSideSupport && !cssCommentAgreed);
     return (React.createElement("div", { className: `pf-v6-u-mb-md ${isExportingPDF ? 'hide-in-pdf' : ''}`, ref: componentRef },
-        React.createElement(MarkdownEditor, { className: `${!isPublic && canPostPrivateComments ? 'is-private' : ''}`, disabled: isProcessing || canEditCase.isCaseNotEditable, "aria-label": "comment text area", showMarkdownPlainTextToggle: true, editorMode: commentType, onFocus: () => setIsTextAreaFocused(true), onBlur: onTextAreaBlur, onChange: onCommentTextChange, value: commentText, rows: isTextAreaFocused ? 12 : 4, bindTextArea: textAreaRef, onCommentExceedCharsLimit: onCommentExceedCharsLimit, mdPlaceholder: isPublic || !canPostPrivateComments
-                ? 'Add a comment using markdown'
-                : 'Add a comment or attach a file privately', plainTextPlaceholder: isPublic || !canPostPrivateComments
-                ? 'Add a comment to this case'
-                : 'Add a comment or attach a file privately', fileSelectorProps: {
-                showFileSelectorInToolbar: !loggedInUsersAccount.data.secureSupport,
-                filesList: getAllAttachments(),
-                onFileSelect: onFileSelect,
-                onFileDelete: onFileDelete,
-                isSupportedFile: (extension) => true,
-                attachFileBtn: markdownToolbarFileSelectorBtn,
-                isUploadingFile: isMarkdownFileUploadInProgress,
-                onClipboardPaste,
-            } }),
+        React.createElement(MarkdownEditor, { className: `${!isPublic && canPostPrivateComments ? 'is-private' : ''}`, disabled: isProcessing || canEditCase.isCaseNotEditable, "aria-label": "comment text area", editorMode: commentType, hideToolbars: true, onFocus: () => setIsTextAreaFocused(true), onBlur: onTextAreaBlur, onChange: onCommentTextChange, value: commentText, rows: isTextAreaFocused ? 12 : 4, bindTextArea: textAreaRef, onCommentExceedCharsLimit: onCommentExceedCharsLimit, 
+            // TODO: After GraphQL migration of attachments, restore private-comment placeholder to
+            // "Add a comment or attach a file privately" when !isPublic && canPostPrivateComments
+            mdPlaceholder: "Add a comment to this case", plainTextPlaceholder: "Add a comment to this case" }),
         isConfirmedStateSideSupport && (React.createElement("div", { className: "pf-v6-u-mt-md pf-v6-u-mb-lg" },
             React.createElement("input", { type: "checkbox", id: "css-case-comment-agreement", name: "css-case-comment-agreement", "data-tracking-id": "css-case-comment-agreement", checked: cssCommentAgreed, onChange: (e) => setCssCommentAgreed(e.target.checked) }),
             React.createElement("label", { htmlFor: "css-case-comment-agreement", className: "pf-v6-u-font-weight-normal pf-v6-u-font-size-sm" },
@@ -353,15 +266,8 @@ export function PostComment(props) {
             isModalOpen && loggedInUserRights.data.isInternal() && isPublic && (React.createElement(VerifyCaseStatusModal, { onClose: onCancel, onConfirm: onConfirm, isUpdating: isPostingComment, caseNumber: props.caseNumber })),
             React.createElement(Button, { "data-tracking-id": "postcomment-submit-button", type: "button", variant: ButtonVariant.primary, onClick: loggedInUser.data.isInternal && isPublic ? onBtnClick : isNotInternalConfirm, isDisabled: isSubmitDisabled, className: "postcomment-submit" },
                 React.createElement(Trans, null, "Submit")),
-            canAddAttachments &&
-                (isPublic && canPostPrivateComments ? (React.createElement(Tooltip, { content: t('You can attach files privately') }, fileUploadButton)) : (fileUploadButton)),
             React.createElement(Button, { className: "secondary-button-pill", "data-tracking-id": "postcomment-cancel-button", type: "button", variant: ButtonVariant.link, onClick: onCancelClick, isDisabled: isPostCommentDisabled },
                 React.createElement(Trans, null, "Cancel")),
             canPostPrivateComments && (React.createElement("span", { className: "post-comment-checkbox" },
-                React.createElement(Checkbox, { label: t('Private'), isChecked: !isPublic && canPostPrivateComments, onChange: handleCheckboxToggle, "aria-label": t('Private'), id: "private-comment", name: "private-comment", "data-tracking-id": "private-comment-checkbox" }))))),
-        React.createElement(FileUpload, { className: `file-upload-section ${hasSomeSelectedFilesLocal ? 'card card-white pf-v6-u-mt-lg pf-v6-u-p-lg' : ''}`, idToUploadTo: caseNumber, onUploadClick: onFileUploadClick, isSessionId: false, isSecureSupport: loggedInUsersAccount.data.secureSupport, isPrivate: !isPublic, autoUploadOnSelect: true, showDescriptionInfoMsg: true }),
-        React.createElement("span", Object.assign({}, getRootProps(), { tabIndex: -1 }),
-            React.createElement("input", Object.assign({ style: { display: 'none !important' } }, getInputProps()))),
-        !loggedInUsersAccount.data.secureSupport && (React.createElement(NewFeaturePopoverAnnouncement, { "aria-label": "Attach and embed images! You'll find all of your uploaded images here.", featureName: FeatureAnnouncementKeys.MARKDOWN_INLINE_IMAGES, sectionRef: componentRef, bodyContent: React.createElement("div", null,
-                React.createElement(Trans, null, "Attach and embed images! You'll find all of your uploaded images here.")), triggerRef: () => document.getElementById('md-editor-toolbar-file-selector') }))));
+                React.createElement(Checkbox, { label: t('Private'), isChecked: !isPublic && canPostPrivateComments, onChange: handleCheckboxToggle, "aria-label": t('Private'), id: "private-comment", name: "private-comment", "data-tracking-id": "private-comment-checkbox" })))))));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"CaseHistory.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseHistory/CaseHistory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,MAAM,sBAMjC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"CaseHistory.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseHistory/CaseHistory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,MAAM,sBAQjC,CAAC;AAEF,eAAe,WAAW,CAAC"}

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

@@ -1,7 +1,9 @@
 import React from 'react';
+import { useCaseSelector } from '../../../../context/CaseContext';
 import Timeline from './Timeline';
 const CaseHistory = (props) => {
+    const sfdcCaseId = useCaseSelector((state) => { var _a; return (_a = state.caseDetails) === null || _a === void 0 ? void 0 : _a.id; });
     return (React.createElement("div", { className: "pf-v6-u-p-sm" },
-        React.createElement(Timeline, { caseNumber: props.caseNumber })));
+        React.createElement(Timeline, { caseNumber: props.caseNumber, sfdcCaseId: sfdcCaseId !== null && sfdcCaseId !== void 0 ? sfdcCaseId : '' })));
 };
 export default CaseHistory;

package/lib/esm/components/CaseEditView/Tabs/CaseHistory/Timeline.css

@@ -121,8 +121,8 @@
 
 .timeline-avatar {
     position: absolute;
-    left: calc(20% + 15px);
-    transform: translateX(-91%);
+    left: calc(20% + 2.5px);
+    transform: translateX(-50%);
     top: 12px;
     z-index: 5;
 }
@@ -134,8 +134,8 @@
     width: 10px;
     height: 10px;
     z-index: 2;
-    left: calc(20% + 18px);
-    transform: translateX(-195%);
+    left: calc(20% + 2.5px);
+    transform: translateX(-50%);
     top: 25px;
 }
 

package/lib/esm/components/CaseEditView/Tabs/CaseHistory/Timeline.d.ts

@@ -1,7 +1,39 @@
 import './Timeline.css';
 import React from 'react';
-declare const Timeline: ({ caseNumber }: {
-    caseNumber: any;
-}) => React.JSX.Element;
+import type { ICaseHistoryItem } from '../../../../models/caseHistory';
+import { type IHistoryChangeItem } from '../../../../utils/TimelineUtils';
+export interface ITimelineEvent {
+    date: string;
+    text: string;
+    user?: string;
+    useAvatar?: boolean;
+}
+export interface ITimelineNodeData {
+    left: ITimelineEvent;
+    right: ITimelineEvent;
+    photoUrl?: string | null;
+    userName?: string;
+}
+/**
+ * Builds the display text for a "Change" history item by resolving values and
+ * delegating to field-specific formatters.
+ */
+export declare const applyReplacements: (item: IHistoryChangeItem | null | undefined) => string;
+/**
+ * Converts normalized history items into timeline node data for rendering.
+ *
+ * Applies a secondary filter (excludes `FolderId__c` and `OwnerId` whose resolved
+ * display names are unavailable), then maps each item to a left (date/time) and
+ * right (user action text) event pair. Avatar/date-header boundaries are computed
+ * sequentially: a new boundary is set on the first item, user change, or date change.
+ */
+export declare const transformApiResponseToTimelineData: (apiResponse: {
+    historyItems: ICaseHistoryItem[];
+}) => ITimelineNodeData[];
+interface ITimelineProps {
+    caseNumber: string;
+    sfdcCaseId: string | undefined;
+}
+declare const Timeline: ({ caseNumber, sfdcCaseId }: ITimelineProps) => React.JSX.Element;
 export default Timeline;
 //# sourceMappingURL=Timeline.d.ts.map

package/lib/esm/components/CaseEditView/Tabs/CaseHistory/Timeline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseHistory/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,CAAC;AAwBxB,OAAO,KAAsC,MAAM,OAAO,CAAC;AA8W3D,QAAA,MAAM,QAAQ,GAAI;;CAAc,sBAmV/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CaseEditView/Tabs/CaseHistory/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,CAAC;AAsBxB,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAE,KAAK,kBAAkB,EAA0C,MAAM,iCAAiC,CAAC;AAElH,MAAM,WAAW,cAAc;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AACD,MAAM,WAAW,iBAAiB;IAC9B,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,cAAc,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAmID;;;GAGG;AACH,eAAO,MAAM,iBAAiB,GAAI,MAAM,kBAAkB,GAAG,IAAI,GAAG,SAAS,KAAG,MAU/E,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,kCAAkC,GAAI,aAAa;IAC5D,YAAY,EAAE,gBAAgB,EAAE,CAAC;CACpC,KAAG,iBAAiB,EAoDpB,CAAC;AAEF,UAAU,cAAc;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AAED,QAAA,MAAM,QAAQ,GAAI,4BAA4B,cAAc,sBAyU3D,CAAC;AAEF,eAAe,QAAQ,CAAC"}