fix: linting issues (#472)

* fixed ChatBody linting error added scrollToBottom in EmbeddedChat * disabled eslint label explicit associated control changed message to msg to avoid conflict * fixed touch timer undeclared var * fixed linting issue in ModalBackDrop * fixed linting issue in Modal.js * temporary disabled linting error in UiKitModal
RocketChat · Feb 17, 2024 · 33c160d · 33c160d
1 parent cbec05e
commit 33c160d
Show file tree

Hide file tree

Showing 8 changed files with 42 additions and 35 deletions.
diff --git a/packages/react/src/components/ChatBody/ChatBody.js b/packages/react/src/components/ChatBody/ChatBody.js
@@ -49,6 +49,11 @@ const ChatBody = ({
     }
   `;
 
+  const [scrollPosition, setScrollPosition] = useState(0);
+  const [popupVisible, setPopupVisible] = useState(false);
+  const [, setIsUserScrolledUp] = useState(false);
+  const [otherUserMessage, setOtherUserMessage] = useState(false);
+
   const { RCInstance, ECOptions } = useContext(RCContext);
   const messages = useMessageStore((state) => state.messages);
   const threadMessages = useMessageStore((state) => state.threadMessages);
@@ -173,11 +178,6 @@ const ChatBody = ({
     anonymousMode,
   ]);
 
-  const [scrollPosition, setScrollPosition] = useState(0);
-  const [popupVisible, setPopupVisible] = useState(false);
-  const [isUserScrolledUp, setIsUserScrolledUp] = useState(false);
-  const [otherUserMessage, setOtherUserMessage] = useState(false);
-
   const handlePopupClick = () => {
     scrollToBottom();
     setIsUserScrolledUp(false);

diff --git a/packages/react/src/components/CheckBox/CheckBox.js b/packages/react/src/components/CheckBox/CheckBox.js
@@ -21,6 +21,7 @@ const CheckBox = ({ checked, ...props }) => {
     }
   `;
   return (
+    // eslint-disable-next-line jsx-a11y/label-has-associated-control
     <label
       css={CheckBoxCss}
       className={appendClassNames('ec-check-box', classNames)}

diff --git a/packages/react/src/components/EmbeddedChat.js b/packages/react/src/components/EmbeddedChat.js
@@ -251,6 +251,7 @@ const EmbeddedChat = ({
                       anonymousMode={anonymousMode}
                       showRoles={showRoles}
                       messageListRef={messageListRef}
+                      scrollToBottom={scrollToBottom}
                     />
                   ) : (
                     <Home height={!fullScreen ? height : '88vh'} />
@@ -266,6 +267,7 @@ const EmbeddedChat = ({
                     anonymousMode={anonymousMode}
                     showRoles={showRoles}
                     messageListRef={messageListRef}
+                    scrollToBottom={scrollToBottom}
                   />
                 ) : (
                   <Home height={!fullScreen ? height : '88vh'} />

diff --git a/packages/react/src/components/Message/Message.js b/packages/react/src/components/Message/Message.js
@@ -108,8 +108,8 @@ const Message = ({
     }
   };
 
-  const handleDeleteMessage = async (message) => {
-    const res = await RCInstance.deleteMessage(message._id);
+  const handleDeleteMessage = async (msg) => {
+    const res = await RCInstance.deleteMessage(msg._id);
 
     if (res.success) {
       dispatchToastMessage({

diff --git a/packages/react/src/components/Modal/Modal.js b/packages/react/src/components/Modal/Modal.js
@@ -33,9 +33,6 @@ export const Modal = forwardRef(
       background: ${theme?.palette?.background?.modal || '#fff'};
       border-radius: 0.25rem;
     `;
-    if (!open) {
-      return null;
-    }
 
     const handleClick = useCallback(
       (e) => {
@@ -63,6 +60,10 @@ export const Modal = forwardRef(
       };
     }, [handleEscKey]);
 
+    if (!open) {
+      return null;
+    }
+
     return (
       <ModalBackdrop ref={backDropRef} onClick={handleClick}>
         <Box

diff --git a/packages/react/src/components/Modal/ModalBackdrop.js b/packages/react/src/components/Modal/ModalBackdrop.js
@@ -1,26 +1,26 @@
 import React, { forwardRef } from 'react';
 import { Box } from '../Box';
 
-export const ModalBackdrop = forwardRef(
-  ({ children, onClick = () => {} }, ref) => (
-    <Box
-      ref={ref}
-      onClick={onClick}
-      style={{
-        position: 'fixed',
-        zIndex: 10000,
-        top: '50%',
-        left: '50%',
-        transform: 'translate(-50%, -50%)',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        background: '#333333B3',
-        width: '100%',
-        height: '100%',
-      }}
-    >
-      {children}
-    </Box>
-  )
-);
+const ModalBackdrop = forwardRef(({ children, onClick = () => {} }, ref) => (
+  <Box
+    ref={ref}
+    onClick={onClick}
+    style={{
+      position: 'fixed',
+      zIndex: 10000,
+      top: '50%',
+      left: '50%',
+      transform: 'translate(-50%, -50%)',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      background: '#333333B3',
+      width: '100%',
+      height: '100%',
+    }}
+  >
+    {children}
+  </Box>
+));
+ModalBackdrop.displayName = 'ModalBackdrop';
+export { ModalBackdrop };
diff --git a/packages/react/src/components/Tooltip/Tooltip.js b/packages/react/src/components/Tooltip/Tooltip.js
@@ -48,6 +48,8 @@ const Tooltip = ({ children, text, position }) => {
     setTooltipVisible(false);
   };
 
+  let touchTimer;
+
   const handleTouchStart = () => {
     touchTimer = setTimeout(() => {
       setTooltipVisible(true);
@@ -59,8 +61,6 @@ const Tooltip = ({ children, text, position }) => {
     setTooltipVisible(false);
   };
 
-  let touchTimer;
-
   return (
     <div
       onMouseEnter={handleMouseEnter}

diff --git a/packages/react/src/components/uiKit/blocks/UiKitModal.js b/packages/react/src/components/uiKit/blocks/UiKitModal.js
@@ -1,3 +1,6 @@
+/* eslint-disable react/jsx-no-undef */
+/* eslint-disable import/extensions */
+/* eslint-disable import/no-unresolved */
 /* eslint-disable no-shadow */
 /* eslint-disable react/jsx-no-constructed-context-values */
 import React from 'react';