Merge pull request #119 from bible-technology/lint-test-fixes

Fixed lint and build issues
bible-technology · Aug 11, 2023 · ceba4a5 · ceba4a5
2 parents 9231365 + e10019e
commit ceba4a5
Show file tree

Hide file tree

Showing 12 changed files with 88 additions and 89 deletions.
diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
     "clean": "rimraf dist renderer/.next renderer/out",
     "start": "electron .",
     "dev": "next dev",
-    "prod": "npm run build && next start",
+    "prod": "yarn build && next start",
     "test": "jest",
     "e2e": "npx playwright test",
     "report": "npx playwright test --reporter=html && npx playwright show-report",
@@ -25,9 +25,9 @@
     "maxmemory-allocation": "NODE_OPTIONS=--max_old_space_size=4096",
     "eslint:github-action": "node ./node_modules/eslint/bin/eslint . --ignore-path .gitignore --max-warnings 0",
     "build": "next build renderer && next export renderer",
-    "pack-app": "npm run build && electron-builder --dir",
-    "dist": "npm run build && electron-builder -p never",
-    "deploy": "npm run build && electron-builder -p always"
+    "pack-app": "yarn build && electron-builder --dir",
+    "dist": "yarn build && electron-builder -p never",
+    "deploy": "yarn build && electron-builder -p always"
   },
   "eslintIgnore": [
     "*.test.js"

diff --git a/renderer/pages/home.js b/renderer/pages/home.js
@@ -14,9 +14,9 @@ export default function ReferenceSelector() {
         <ProjectContextProvider>
           <ReferenceContextProvider>
             <EditorLayout>
-                <ScribexContextProvider>
-                  <SectionContainer />
-                </ScribexContextProvider>
+              <ScribexContextProvider>
+                <SectionContainer />
+              </ScribexContextProvider>
             </EditorLayout>
           </ReferenceContextProvider>
         </ProjectContextProvider>

diff --git a/renderer/src/components/EditorPage/Scribex/Buttons.jsx b/renderer/src/components/EditorPage/Scribex/Buttons.jsx
@@ -10,7 +10,6 @@ import ArrowUturnRightIcon from '@/icons/Xelah/ArrowUturnRight.svg';
 import PencilIcon from '@/icons/Common/Pencil.svg';
 import Copy from '@/icons/Xelah/Copy.svg';
 import Paste from '@/icons/Xelah/Paste.svg';
-import { copyText, pasteText } from '@/util/cursorUtils';
 
 export const classNames = (...classes) => classes.filter(Boolean).join(' ');
 

diff --git a/renderer/src/components/EditorPage/Scribex/Editor.jsx b/renderer/src/components/EditorPage/Scribex/Editor.jsx
@@ -8,10 +8,11 @@ import SaveIndicator from '@/components/Loading/SaveIndicator';
 import { ReferenceContext } from '@/components/context/ReferenceContext';
 import { ProjectContext } from '@/components/context/ProjectContext';
 import EmptyScreen from '@/components/Loading/EmptySrceen';
-import { insertVerseNumber, insertChapterNumber, insertFootnote, insertXRef } from '@/util/cursorUtils';
+import {
+ insertVerseNumber, insertChapterNumber, insertFootnote, insertXRef,
+} from '@/util/cursorUtils';
 import RecursiveBlock from './RecursiveBlock';
 
-
 export default function Editor(props) {
   const {
     chapterNumber,
@@ -109,19 +110,17 @@ export default function Editor(props) {
   function getSelectedText() {
     let selectedText = '';
     if (window.getSelection) {
-      let selection = window.getSelection();
+      const selection = window.getSelection();
 
       selectedText = selection.toString();
       setSelectedText(selectedText);
-    } else if (document.selection && document.selection.type != 'Control') {
+    } else if (document.selection && document.selection.type !== 'Control') {
       selectedText = document.selection.createRange().text;
       setSelectedText(selectedText);
     }
-    console.log(selectedText);
   }
 
   useEffect(() => {
-
     if (insertVerseRChapter === 'Verse') {
       insertVerseNumber(caretPosition, newVerChapNumber);
     }
@@ -135,6 +134,7 @@ export default function Editor(props) {
     if (insertVerseRChapter === 'Cross Reference') {
       insertXRef(caretPosition, newVerChapNumber, selectedText);
     }
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [triggerVerseInsert]);
 
   // useEffect(() => {
@@ -185,6 +185,7 @@ export default function Editor(props) {
   };
 
   const onIntersection = (entries) => {
+    // eslint-disable-next-line no-restricted-syntax
     for (const entry of entries) {
       if (entry.isIntersecting) {
         setChapterNumber(entry.target.dataset.attsNumber);
@@ -230,7 +231,7 @@ export default function Editor(props) {
   };
 
   return (
-    <div className="editor" id="editor" style={style} >
+    <div className="editor" id="editor" style={style}>
       {!bookAvailable && <EmptyScreen />}
       {bookAvailable && (!sequenceId || bookChange) && <LoadingScreen />}
       {bookAvailable && sequenceId && !bookChange && (

diff --git a/renderer/src/components/EditorPage/Scribex/InsertMenu.jsx b/renderer/src/components/EditorPage/Scribex/InsertMenu.jsx
@@ -1,5 +1,5 @@
-import { Fragment, useState } from 'react'
-import { Menu, Transition } from '@headlessui/react'
+import { Fragment, useState } from 'react';
+import { Menu, Transition } from '@headlessui/react';
 import PopupButton from './PopupButton';
 import PlusIcon from '@/icons/Xelah/Plus.svg';
 
@@ -8,7 +8,7 @@ export default function InsertMenu({ handleClick: handleButtonClick, selectedTex
   const handleClick = (number, title) => {
     handleButtonClick(number, title);
     setIsOpen(false);
-  }
+  };
   return (
     <div>
       <Menu as="div" className="relative inline-block text-left">
@@ -53,5 +53,5 @@ export default function InsertMenu({ handleClick: handleButtonClick, selectedTex
         </Transition>
       </Menu>
     </div>
-  )
+  );
 }
diff --git a/renderer/src/components/EditorPage/Scribex/Popup.jsx b/renderer/src/components/EditorPage/Scribex/Popup.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { Dialog, Transition } from '@headlessui/react';
 
 const Popup = ({
-  handleClose, handleButtonClick, title, isPopupOpen, selectedText
+  handleClose, handleButtonClick, title, isPopupOpen, selectedText,
 }) => {
   const [number, setNumber] = useState('');
   // console.log({ title }, "title");
@@ -12,8 +12,8 @@ const Popup = ({
   };
 
   const handleNumberInputChange = (e) => {
-    setNumber(e.target.value.replace(/[^0-9]/g, ""))
-  }
+    setNumber(e.target.value.replace(/[^0-9]/g, ''));
+  };
   const handleSubmit = () => {
     handleButtonClick(number, title);
     handleClose();
@@ -64,9 +64,14 @@ const Popup = ({
               </Dialog.Title>
               <div className="mt-2">
                 {selectedText && selectedText.length > 0
-                  ? (
-                    <div><span className="font-medium text-gray-600">Selected Text :</span> <span className='text-primary'>{selectedText}</span> </div>
-                  ) : <></>}
+                  && (
+                    <div>
+                      <span className="font-medium text-gray-600">Selected Text :</span>
+                      {' '}
+                      <span className="text-primary">{selectedText}</span>
+                      {' '}
+                    </div>
+                  )}
 
               </div>
               <div className="mt-2">

diff --git a/renderer/src/components/EditorPage/Scribex/PopupButton.jsx b/renderer/src/components/EditorPage/Scribex/PopupButton.jsx
@@ -1,7 +1,9 @@
 import React, { useState } from 'react';
 import Popup from './Popup';
 
-const PopupButton = ({ handleClick, title, roundedHover, selectedText }) => {
+const PopupButton = ({
+ handleClick, title, roundedHover, selectedText,
+}) => {
   const [isPopupOpen, setIsPopupOpen] = useState(false);
 
   const handlePopupOpen = () => {
@@ -18,10 +20,13 @@ const PopupButton = ({ handleClick, title, roundedHover, selectedText }) => {
 
   return (
     <div
-      onKeyDown={e => e.stopPropagation()}
-      onClick={e => e.stopPropagation()}
-      onFocus={e => e.stopPropagation()}
-      onMouseOver={e => e.stopPropagation()}>
+      role="button"
+      tabIndex={-1}
+      onKeyDown={(e) => e.stopPropagation()}
+      onClick={(e) => e.stopPropagation()}
+      onFocus={(e) => e.stopPropagation()}
+      onMouseOver={(e) => e.stopPropagation()}
+    >
       <button
         type="button"
         className={`flex w-full border py-2 px-3 border-transparent text-sm font-medium text-black hover:bg-primary hover:text-white ${roundedHover}`}

diff --git a/renderer/src/components/EditorPage/Scribex/RecursiveBlock.jsx b/renderer/src/components/EditorPage/Scribex/RecursiveBlock.jsx
@@ -1,12 +1,12 @@
 /* eslint-disable react/prop-types */
 /* eslint-disable no-unused-vars */
-import React, { useEffect, useState } from 'react'
-import { HtmlPerfEditor } from '@xelah/type-perf-html'
-import { getCurrentVerse, getCurrentChapter } from './getReferences'
+import React, { useEffect, useState } from 'react';
+import { HtmlPerfEditor } from '@xelah/type-perf-html';
 import { getCurrentCursorPosition } from '@/util/cursorUtils';
+import { getCurrentVerse, getCurrentChapter } from './getReferences';
 
 const getTarget = ({ content }) => {
-  const div = document.createElement("div");
+  const div = document.createElement('div');
   div.innerHTML = content;
 
   const { target } = div.firstChild?.dataset || {};
@@ -32,28 +32,25 @@ export default function RecursiveBlock({
   setSelectedText,
   ...props
 }) {
-  const [currentVerse, setCurrentVerse] = useState(null)
-  useEffect(() => {
-    if (verbose) console.log("Block: Mount/First Render", index);
-    return () => {
+  const [currentVerse, setCurrentVerse] = useState(null);
 
-      if (verbose) console.log("Block: UnMount/Destroyed", index);
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  const updateCursorPosition = () => {
+    const cursorPosition = getCurrentCursorPosition('editor');
+    setCaretPosition(cursorPosition);
+  };
 
   const checkReturnKeyPress = (event) => {
-    let activeTextArea = document.activeElement;
-    if (event.key === "Enter") {
+    const activeTextArea = document.activeElement;
+    if (event.key === 'Enter') {
       if (activeTextArea.children.length > 1) {
         const lineBreak = activeTextArea.children[1]?.outerHTML;
-        activeTextArea.children[1].outerHTML = lineBreak.replace(/<br\s*\/?>/gi, "&nbsp");
+        activeTextArea.children[1].outerHTML = lineBreak.replace(/<br\s*\/?>/gi, '&nbsp');
       }
     }
-    //BACKSPACE DISABLE
-    if (event.keyCode == 8) {
-      const range = document.getSelection().getRangeAt(0)
-      const selectedNode = range.startContainer
+    // BACKSPACE DISABLE
+    if (event.keyCode === 8) {
+      const range = document.getSelection().getRangeAt(0);
+      const selectedNode = range.startContainer;
       const prevNode = selectedNode.previousSibling;
       if (prevNode && prevNode.dataset.attsNumber !== currentVerse) {
         event.preventDefault();
@@ -64,10 +61,10 @@ export default function RecursiveBlock({
   };
 
   function handleSelection() {
-    let selectedText = "";
+    let selectedText = '';
     if (window.getSelection) {
       selectedText = window.getSelection().toString();
-    } else if (document.selection && document.selection.type != "Control") {
+    } else if (document.selection && document.selection.type !== 'Control') {
       selectedText = document.selection.createRange().text;
     }
     if (selectedText) {
@@ -77,32 +74,29 @@ export default function RecursiveBlock({
 
   const checkCurrentVerse = () => {
     if (document.getSelection().rangeCount >= 1 && onReferenceSelected) {
-      const range = document.getSelection().getRangeAt(0)
+      const range = document.getSelection().getRangeAt(0);
       // console.log({ range })
-      const selectedNode = range.startContainer
+      const selectedNode = range.startContainer;
       // console.log({ selectedNode })
-      const verse = getCurrentVerse(selectedNode)
-      const chapter = getCurrentChapter(selectedNode)
+      const verse = getCurrentVerse(selectedNode);
+      const chapter = getCurrentChapter(selectedNode);
       // if (onReferenceSelected) {
-      onReferenceSelected({ bookId, chapter, verse })
+      onReferenceSelected({ bookId, chapter, verse });
       // }
     }
-    updateCursorPosition()
+    updateCursorPosition();
     handleSelection();
-  }
+  };
 
-  const updateCursorPosition = () => {
-    let cursorPosition = getCurrentCursorPosition('editor');
-    setCaretPosition(cursorPosition)
-  }
   let component;
 
-  let editable = !!content.match(/data-type="paragraph"/);
+  const editable = !!content.match(/data-type="paragraph"/);
 
   if (editable) {
     component = (
+      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
       <div
-        className='editor-paragraph'
+        className="editor-paragraph"
         contentEditable={contentEditable}
         onKeyDown={checkReturnKeyPress}
         onMouseUp={checkCurrentVerse}
@@ -127,5 +121,6 @@ export default function RecursiveBlock({
     component ||= <div {...props} contentEditable={false} />;
   }
 
+  // eslint-disable-next-line react/jsx-no-useless-fragment
   return <>{component}</>;
 }
diff --git a/renderer/src/components/EditorPage/Scribex/ReferenceScribex.jsx b/renderer/src/components/EditorPage/Scribex/ReferenceScribex.jsx
@@ -8,10 +8,11 @@ import { ScribexContext } from '@/components/context/ScribexContext';
 import ReferenceEditor from './ReferenceEditor';
 
 export default function ReferenceScribex(props) {
-
   const { state, actions } = useContext(ScribexContext);
   const { verbose } = state;
-  const { usfmData, bookAvailable, refName, bookId, scrollLock, font } = props;
+  const {
+    usfmData, bookAvailable, refName, bookId, scrollLock, font,
+  } = props;
   const [selectedBook, setSelectedBook] = useState();
   const [bookChange, setBookChange] = useState(false);
   let selectedDocument;
@@ -25,8 +26,6 @@ export default function ReferenceScribex(props) {
   });
   const {
     state: {
-      // bookId,
-      selectedFont,
       fontSize,
       projectScriptureDir,
     },
@@ -60,7 +59,8 @@ export default function ReferenceScribex(props) {
 
   useEffect(() => {
     actions.setSequenceIds([]);
-  }, [refName, bookId, scrollLock])
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [refName, bookId, scrollLock]);
 
   const { htmlPerf } = perfState;
   useDeepCompareEffect(() => {
@@ -80,17 +80,15 @@ export default function ReferenceScribex(props) {
     setBookChange,
   };
   return (
-    <>
-      <div
-        style={{
+    <div
+      style={{
           fontFamily: font || 'sans-serif',
           fontSize: `${fontSize}rem`,
           lineHeight: (fontSize > 1.3) ? 1.5 : '',
           direction: `${projectScriptureDir === 'RTL' ? 'rtl' : 'auto'}`,
         }}
-      >
-        <ReferenceEditor {..._props} />
-      </div>
-    </>
+    >
+      <ReferenceEditor {..._props} />
+    </div>
   );
 }