Davywentwortht2it/investigate failing tests

client/app/reader/SideBarCategories.jsx

@@ -57,7 +57,7 @@ class SideBarCategories extends PureComponent {
 
 SideBarCategories.propTypes = {
   doc: PropTypes.object,
-  documents: PropTypes.array,
+  documents: PropTypes.object,
   id: PropTypes.number,
   category_medical: PropTypes.bool,
   category_procedural: PropTypes.bool,

client/app/readerprototype/DocumentViewer.jsx

@@ -7,22 +7,23 @@ import ReaderSearchBar from './components/ReaderSearchBar';
 import ReaderSidebar from './components/ReaderSidebar';
 import ReaderToolbar from './components/ReaderToolbar';
 
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import { CATEGORIES } from '../reader/analytics';
 import { stopPlacingAnnotation } from '../reader/AnnotationLayer/AnnotationActions';
 import DeleteModal from './components/Comments/DeleteModal';
 import ShareModal from './components/Comments/ShareModal';
 import { getRotationDeg } from './util/documentUtil';
 import { ROTATION_DEGREES, ZOOM_INCREMENT, ZOOM_LEVEL_MAX, ZOOM_LEVEL_MIN } from './util/readerConstants';
+import { showSideBarSelector } from './selectors';
+import { togglePdfSidebar } from '../reader/PdfViewer/PdfViewerActions';
 
 const DocumentViewer = (props) => {
   const [currentPage, setCurrentPage] = useState(1);
   const [numPages, setNumPages] = useState(null);
   const [rotateDeg, setRotateDeg] = useState('0deg');
   const [showSearchBar, setShowSearchBar] = useState(false);
-  const [showSideBar, setShowSideBar] = useState(true);
   const [isDocumentLoadError, setIsDocumentLoadError] = useState(false);
-
+  const showSideBar = useSelector(showSideBarSelector);
   const dispatch = useDispatch();
 
   const currentDocumentId = Number(props.match.params.docId);
@@ -51,24 +52,16 @@ const DocumentViewer = (props) => {
         dispatch(stopPlacingAnnotation('from-back-to-documents'));
         props.history.push(props.documentPathBase);
       }
-    };
-
-    window.addEventListener('keydown', keyHandler);
-
-    return () => window.removeEventListener('keydown', keyHandler);
-  }, []);
 
-  useEffect(() => {
-    const keyHandler = (event) => {
       if (event.altKey && event.code === 'KeyM' && !event.shiftKey) {
-        setShowSideBar(!showSideBar);
+        dispatch(togglePdfSidebar());
       }
     };
 
     window.addEventListener('keydown', keyHandler);
 
     return () => window.removeEventListener('keydown', keyHandler);
-  }, [showSideBar]);
+  }, []);
 
   const getPageNumFromScrollTop = (event) => {
     const { clientHeight, scrollTop, scrollHeight } = event.target;
@@ -119,7 +112,7 @@ const DocumentViewer = (props) => {
           showSearchBar={showSearchBar}
           toggleSearchBar={setShowSearchBar}
           showSideBar={showSideBar}
-          toggleSideBar={() => setShowSideBar(true)}
+          toggleSideBar={() => dispatch(togglePdfSidebar())}
           zoomLevel={props.zoomLevel}
         />
         {showSearchBar && <ReaderSearchBar />}
@@ -147,7 +140,7 @@ const DocumentViewer = (props) => {
         <ReaderSidebar
           doc={doc}
           showSideBar={showSideBar}
-          toggleSideBar={() => setShowSideBar(false)}
+          toggleSideBar={() => dispatch(togglePdfSidebar())}
           vacolsId={props.match.params.vacolsId}
         />
       )}

client/app/readerprototype/components/Comments/List.jsx

@@ -48,7 +48,7 @@ const List = (props) => {
 };
 
 List.propTypes = {
-  annotations: PropTypes.object,
+  annotations: PropTypes.array,
   onSelect: PropTypes.func,
   selectedAnnotationId: PropTypes.number,
 };

client/app/readerprototype/components/ReaderFooter.jsx

@@ -54,7 +54,9 @@ const ReaderFooter = ({
   const filteredDocIds = useSelector(getFilteredDocIds);
   const currentDocIndex = filteredDocIds.indexOf(docId);
   const getPrevDocId = () => filteredDocIds?.[currentDocIndex - 1];
-  const getNextDocId = () => filteredDocIds?.[currentDocIndex + 1];
+  const getNextDocId = () => {
+    return filteredDocIds?.[currentDocIndex + 1];
+  };
 
   useEffect(() => {
     const keyHandler = (event) => {

client/app/readerprototype/components/ReaderToolbar.jsx

@@ -138,14 +138,14 @@ const ReaderToolbar = ({
           <SearchIcon />
         </Button>
         {!showSideBar &&
-          (<span>
+          <span>
             <Button
               name="open sidebar menu"
               classNames={['cf-pdf-button']}
-              onClick={() => toggleSideBar()}>
+              onClick={toggleSideBar}>
               <strong> Open menu </strong>
             </Button>
-          </span>)
+          </span>
         }
       </div>
     </div>

client/app/readerprototype/selectors/index.js

@@ -32,3 +32,5 @@ export const modalInfoSelector = (state) => ({
   deleteAnnotationModalIsOpenFor: state.annotationLayer.deleteAnnotationModalIsOpenFor,
   shareAnnotationModalIsOpenFor: state.annotationLayer.shareAnnotationModalIsOpenFor,
 });
+
+export const showSideBarSelector = (state) => !state.pdfViewer.hidePdfSidebar;