editor: refactor set char count action

* refactor action
* disable submit button when it's < 1 char

invenio_requests/assets/semantic-ui/js/invenio_requests/request/Request.js

@@ -1,6 +1,5 @@
 // This file is part of InvenioRequests
 // Copyright (C) 2022 CERN.
-// Copyright (C) 2024 KTH Royal Institute of Technology.
 //
 // Invenio RDM Records is free software; you can redistribute it and/or modify it
 // under the terms of the MIT License; see LICENSE file for more details.
@@ -24,7 +23,6 @@ export class Request extends Component {
       request,
       userAvatar,
       permissions,
-      commentContentMaxLength,
       updateRequestAfterAction,
     } = this.props;
 
@@ -39,7 +37,6 @@ export class Request extends Component {
             request={request}
             userAvatar={userAvatar}
             permissions={permissions}
-            commentContentMaxLength={commentContentMaxLength}
           />
         </Loader>
       </Overridable>
@@ -52,13 +49,11 @@ Request.propTypes = {
   initRequest: PropTypes.func.isRequired,
   updateRequestAfterAction: PropTypes.func.isRequired,
   userAvatar: PropTypes.string,
-  commentContentMaxLength: PropTypes.number.isRequired,
   permissions: PropTypes.object.isRequired,
 };
 
 Request.defaultProps = {
   userAvatar: "",
-  commentContentMaxLength: 0,
 };
 
 export default Overridable.component("InvenioRequests.Request", Request);

invenio_requests/assets/semantic-ui/js/invenio_requests/timelineCommentEditor/TimelineCommentEditor.js

@@ -23,6 +23,7 @@ const TimelineCommentEditor = ({
   charCount,
   commentContentMaxLength,
 }) => {
+  const isSubmitDisabled = () => isLoading || (charCount === 0) || (charCount >= commentContentMaxLength)
   return (
     <div className="timeline-comment-editor-container">
       {error && <Message negative>{error}</Message>}
@@ -46,7 +47,7 @@ const TimelineCommentEditor = ({
           icon="send"
           size="medium"
           content={i18next.t("Comment")}
-          disabled={isLoading || charCount >= commentContentMaxLength}
+          disabled={isSubmitDisabled()}
           loading={isLoading}
           onClick={() => submitComment(commentContent, "html")}
         />
@@ -72,7 +73,7 @@ TimelineCommentEditor.defaultProps = {
   error: "",
   userAvatar: "",
   charCount: 0,
-  commentContentMaxLength: 25000,
+  commentContentMaxLength: 0,
 };
 
 export default TimelineCommentEditor;

invenio_requests/assets/semantic-ui/js/invenio_requests/timelineCommentEditor/state/actions.js

@@ -14,6 +14,7 @@ import {
 } from "../../timeline/state/actions";
 import _cloneDeep from "lodash/cloneDeep";
 import { i18next } from "@translations/invenio_requests/i18next";
+
 export const IS_LOADING = "eventEditor/IS_LOADING";
 export const HAS_ERROR = "eventEditor/HAS_ERROR";
 export const SUCCESS = "eventEditor/SUCCESS";
@@ -27,27 +28,22 @@ export const setEventContent = (content) => {
       type: SETTING_CONTENT,
       payload: content,
     });
-    const commentContentMaxLength = config.commentContentMaxLength || 25000;
+
+    const commentContentMaxLength = config.commentContentMaxLength;
     const charCount = content.length;
-    dispatch({
-      type: SET_CHAR_COUNT,
-      payload: charCount,
-    });
-    if (charCount >= commentContentMaxLength) {
-      dispatch({
-        type: HAS_ERROR,
-        payload: i18next.t("Character count exceeds the maximum allowed limit."),
-      });
-    } else {
-      dispatch({
-        type: HAS_ERROR,
-        payload: null,
-      });
-    }
+    const errorMessage = i18next.t("Character count exceeds the maximum allowed limit.");
+
+    const validateContentLength = (charCount, maxLength, errorMessage) => {
+      return charCount >= maxLength ? errorMessage : null;
+    };
+
+    const error = validateContentLength(charCount, commentContentMaxLength, errorMessage);
+
+    dispatch({ type: SET_CHAR_COUNT, payload: charCount });
+    dispatch({ type: HAS_ERROR, payload: error });
   };
 };
 
-
 export const submitComment = (content, format) => {
   return async (dispatch, getState, config) => {
     const { timeline: timelineState } = getState();