Connect funcionality

wax-prosemirror-components/src/components/findAndReplace/FindComponent.js

@@ -7,7 +7,6 @@ import React, {
   useCallback,
   useEffect,
 } from 'react';
-import { TextSelection } from 'prosemirror-state';
 import { debounce, each, eachRight } from 'lodash';
 import styled from 'styled-components';
 import { grid } from '@pubsweet/ui-toolkit';
@@ -169,118 +168,74 @@ const FindComponent = ({ close, expand, setPreviousSearcValue }) => {
     searchRef.current.focus();
   };
 
-  const getAllResultsByView = () => {
-    const allResults = {};
-
-    each(view, (singleView, viewId) => {
-      if (!allResults[viewId]) {
-        allResults[viewId] = helpers.findMatches(
-          singleView.state.doc,
-          searchValue,
-          matchCaseSearch,
-        );
-      }
-    });
-    return allResults;
-  };
-
-  const closest = (selectionFrom, results, greater = true) => {
-    return results.reduce((a, b) => {
-      const greaterSmaller = greater ? a > b : a < b;
-      const aDiff = Math.abs(a - selectionFrom);
-      const bDiff = Math.abs(b - selectionFrom);
-
-      if (aDiff === bDiff) {
-        return greaterSmaller ? a : b;
-      }
-      return bDiff < aDiff ? b : a;
-    });
-  };
-
   const findNext = () => {
     view[lastActiveViewId].focus();
-    const results = getAllResultsByView();
-    const resultsFrom = {};
-
-    each(results, (result, viewId) => {
-      result.forEach(res => {
-        if (!resultsFrom[viewId]) {
-          resultsFrom[viewId] = [res.from];
-        } else {
-          resultsFrom[viewId].push(res.from);
-        }
-      });
-    });
-
-    const found = closest(lastSelection.from, resultsFrom[lastActiveViewId]);
-    let position = resultsFrom[lastActiveViewId].indexOf(found);
-    if (lastSelection.from >= found) position += 1;
-    const selectionFrom = new TextSelection(
-      view[lastActiveViewId].state.doc.resolve(
-        results[lastActiveViewId][position].from,
-      ),
+    const results = helpers.getAllResultsByView(
+      view,
+      searchValue,
+      matchCaseSearch,
     );
+    const resultsFrom = helpers.getResultsFrom(results);
+    const notesIds = helpers.getNotesIds(view.main);
 
-    const selectionTo = new TextSelection(
-      view[lastActiveViewId].state.doc.resolve(
-        results[lastActiveViewId][position].to,
-      ),
+    const found = helpers.getClosestMatch(
+      lastSelection.from,
+      resultsFrom[lastActiveViewId],
     );
+    const position = resultsFrom[lastActiveViewId].indexOf(found);
 
-    view[lastActiveViewId].dispatch(
-      view[lastActiveViewId].state.tr.setSelection(
-        TextSelection.between(selectionFrom.$anchor, selectionTo.$head),
-      ),
-    );
+    /* User selection lesser than found */
+    if (lastSelection.from < found) {
+      helpers.moveToMatch(view, lastActiveViewId, results, position);
+    }
 
-    view[lastActiveViewId].dispatch(
-      view[lastActiveViewId].state.tr.scrollIntoView(),
-    );
+    /* User selection greater than found move to next if not already at the end of results for the view */
+    if (
+      lastSelection.from >= found &&
+      position < resultsFrom[lastActiveViewId].length - 1
+    ) {
+      helpers.moveToMatch(view, lastActiveViewId, results, position + 1);
+    }
+
+    /* Last result of the specific view. Move to next view */
+    if (
+      lastSelection.from === found &&
+      position === resultsFrom[lastActiveViewId].length - 1
+    ) {
+      /* End of results in notes move to main if results exist */
+      if (
+        notesIds.indexOf(lastActiveViewId) === notesIds.length - 1 &&
+        results.main.length > 0
+      )
+        helpers.moveToMatch(view, 'main', results, 0);
+    }
   };
 
   const findPrevious = () => {
     view[lastActiveViewId].focus();
-    const results = getAllResultsByView();
-    const resultsFrom = {};
-
-    each(results, (result, viewId) => {
-      result.forEach(res => {
-        if (!resultsFrom[viewId]) {
-          resultsFrom[viewId] = [res.from];
-        } else {
-          resultsFrom[viewId].push(res.from);
-        }
-      });
-    });
+    const results = helpers.getAllResultsByView(
+      view,
+      searchValue,
+      matchCaseSearch,
+    );
+    const resultsFrom = helpers.getResultsFrom(results);
+    const notesIds = helpers.getNotesIds(view.main);
 
-    const found = closest(
+    const found = helpers.getClosestMatch(
       lastSelection.from,
       resultsFrom[lastActiveViewId],
       false,
     );
     let position = resultsFrom[lastActiveViewId].indexOf(found);
-    if (lastSelection.from <= found) position -= 1;
-    const selectionFrom = new TextSelection(
-      view[lastActiveViewId].state.doc.resolve(
-        results[lastActiveViewId][position].from,
-      ),
-    );
 
-    const selectionTo = new TextSelection(
-      view[lastActiveViewId].state.doc.resolve(
-        results[lastActiveViewId][position].to,
-      ),
-    );
+    if (lastSelection.from <= found && position !== 0) position -= 1;
 
-    view[lastActiveViewId].dispatch(
-      view[lastActiveViewId].state.tr.setSelection(
-        TextSelection.between(selectionFrom.$anchor, selectionTo.$head),
-      ),
-    );
+    if (lastSelection.from === found && position === 0) {
+      view.main.focus();
+      console.log('first in view');
+    }
 
-    view[lastActiveViewId].dispatch(
-      view[lastActiveViewId].state.tr.scrollIntoView(),
-    );
+    helpers.moveToMatch(view, lastActiveViewId, results, position);
   };
 
   return (