chore: converts SearchResults to typescript

src/js/components/SearchResults/HighlightedResult.tsx

@@ -4,7 +4,7 @@ import { useSelector } from 'react-redux';
 import { getMahankoshTooltipAttributes } from '../MahankoshTooltip/util';
 import { getVisraamClass } from '../../util';
 
-interface IHighlightedSearchResultProps {
+interface Props {
   children: React.ReactChildren;
   darkMode: boolean;
   highlightIndex: string[];
@@ -14,16 +14,16 @@ interface IHighlightedSearchResultProps {
   mahankoshIndex?: number;
   onMouseOver?: (word: string, index: number) => void;
   isShowMahankoshTooltip: boolean;
-};
+}
 
-const HighlightedSearchResult: React.FC<IHighlightedSearchResultProps> = ({
+const HighlightedSearchResult = ({
   children,
   highlightIndex,
   visraams,
   mahankoshIndex = -1,
   onMouseOver,
   isShowMahankoshTooltip,
-}) => {
+}: Props) => {
   const darkMode = useSelector(state => state.darkMode);
   const mahankoshTooltipAttributes = useMemo(() => {
     if (isShowMahankoshTooltip) {

src/js/components/SearchResults/SearchResults.tsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import cx from 'classnames';
+
+import SearchResult from './Result';
+import { SEARCH_TYPES, SOURCES } from '@/constants';
+import { getVerseId } from '@/util/api/shabad';
+import { IShabad } from '@/types';
+
+type Source = keyof typeof SOURCES;
+
+interface Props {
+  shabads: IShabad[],
+  q: string,
+  type: number,
+  source: Source,
+  translationLanguages: string[],
+  transliterationLanguages: string[],
+  larivaarAssist: boolean,
+  larivaar: boolean,
+  unicode: boolean,
+  fontSize: number,
+  fontFamily: string,
+}
+
+export const SearchResults = (props: Props) => {
+
+    const { shabads, type, ...rest } = props;
+
+    const searchResultsClassName = cx({
+      'search-results-display': true,
+      'english-translation-search': type === SEARCH_TYPES.ENGLISH_WORD,
+      'main-letter-search': type === SEARCH_TYPES.MAIN_LETTERS
+    });
+
+    return (
+      <ul className={searchResultsClassName}>
+        {
+          shabads.map(shabad => {
+            return (
+              <SearchResult
+                key={getVerseId(shabad)}
+                type={type}
+                shabad={shabad}
+                {...rest} />
+            );  
+          })
+        }
+      </ul>
+    );
+  }
+

src/js/pages/Search/Layout.js

@@ -1,6 +1,7 @@
+/* eslint-disable react/prop-types */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Link, Redirect, withRouter } from 'react-router-dom';
+import {  Redirect, withRouter } from 'react-router-dom';
 import { connect } from 'react-redux';
 
 import Pagination from '../../components/Pagination';
@@ -25,7 +26,6 @@ class Layout extends React.PureComponent {
   static propTypes = {
     pages: PropTypes.array,
     offset: PropTypes.number,
-    ...SearchResults.propTypes,
   };
 
   render() {