Merge pull request #515 from samvera-labs/content-search

Content search
samvera-labs · Jun 10, 2024 · fd2868a · fd2868a
2 parents cb052b5 + 007039e
commit fd2868a
Show file tree

Hide file tree

Showing 18 changed files with 948 additions and 120 deletions.
diff --git a/public/manifests/dev/search-response.js b/public/manifests/dev/search-response.js
diff --git a/src/components/Transcript/Transcript.js b/src/components/Transcript/Transcript.js
@@ -2,7 +2,6 @@ import React from 'react';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import throttle from 'lodash/throttle';
-import { timeToHHmmss } from '@Services/utility-helpers';
 import {
   readSupplementingAnnotations,
   parseTranscriptData,
@@ -11,7 +10,8 @@ import {
   TRANSCRIPT_CUE_TYPES,
 } from '@Services/transcript-parser';
 import TranscriptMenu from './TranscriptMenu/TranscriptMenu';
-import { useFilteredTranscripts, useFocusedMatch, useSearchOpts } from '../../services/search';
+import { useFilteredTranscripts, useFocusedMatch, useSearchOpts, useSearchCounts } from '@Services/search';
+import { timeToHHmmss } from '@Services/utility-helpers';
 import './Transcript.scss';
 
 const NO_TRANSCRIPTS_MSG = 'No valid Transcript(s) found, please check again.';
@@ -245,14 +245,26 @@ const Transcript = ({ playerID, manifestUrl, search = {}, transcripts = [] }) =>
   });
   const [searchQuery, setSearchQuery] = React.useState(initialSearchQuery);
 
+  const [_canvasIndex, _setCanvasIndex] = React.useState(-1);
+  const canvasIndexRef = React.useRef(_canvasIndex);
+  const setCanvasIndex = (c) => {
+    abortController.abort();
+    canvasIndexRef.current = c;
+    _setCanvasIndex(c); // force re-render
+  };
+
   const searchResults = useFilteredTranscripts({
     ...searchOpts,
     query: searchQuery,
-    transcripts: transcript
+    transcripts: transcript,
+    canvasIndex: canvasIndexRef.current,
+    selectedTranscript: transcriptInfo.tUrl,
   });
 
   const { focusedMatchId, setFocusedMatchId, focusedMatchIndex, setFocusedMatchIndex } = useFocusedMatch({ searchResults });
 
+  const { tanscriptHitCounts } = useSearchCounts({ searchResults, canvasTranscripts });
+
   const [isEmpty, setIsEmpty] = React.useState(true);
   const [_autoScrollEnabled, _setAutoScrollEnabled] = React.useState(true);
   const autoScrollEnabledRef = React.useRef(_autoScrollEnabled);
@@ -262,13 +274,6 @@ const Transcript = ({ playerID, manifestUrl, search = {}, transcripts = [] }) =>
   };
 
   const abortController = new AbortController();
-  const [_canvasIndex, _setCanvasIndex] = React.useState(-1);
-  const canvasIndexRef = React.useRef(_canvasIndex);
-  const setCanvasIndex = (c) => {
-    abortController.abort();
-    canvasIndexRef.current = c;
-    _setCanvasIndex(c); // force re-render
-  };
 
   const playerIntervalRef = React.useRef(null);
   const playerRef = React.useRef(null);
@@ -462,7 +467,7 @@ const Transcript = ({ playerID, manifestUrl, search = {}, transcripts = [] }) =>
           <TranscriptMenu
             showSearch={searchOpts.enabled}
             selectTranscript={selectTranscript}
-            transcriptData={canvasTranscripts}
+            transcriptData={tanscriptHitCounts}
             transcriptInfo={transcriptInfo}
             noTranscript={transcriptInfo.tError?.length > 0 && transcriptInfo.tError != NO_SUPPORT}
             setAutoScrollEnabled={setAutoScrollEnabled}

diff --git a/src/components/Transcript/Transcript.scss b/src/components/Transcript/Transcript.scss
@@ -6,7 +6,7 @@
 
 
   div.transcript_content {
-    height: 20em;
+    height: 19em;
     overflow-y: auto;
 
     p {
@@ -184,4 +184,4 @@ a.ramp--transcript_item {
   100% {
     opacity: 0;
   }
-}
+}