Searchable Searchable.tsx

33.33% Statements 3/9

0% Branches 0/4

0% Functions 0/2

37.5% Lines 3/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28 19x
 
19x
19x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import React, { Children, PropsWithChildren, ReactElement } from "react";
 
import TextHighlighter from "components/TextHighlighter";
import { extractTextFromChildren } from "utils";
 
export default function Searchable({
  searchTerm,
  children,
}: PropsWithChildren<{ searchTerm: string }>): ReactElement {
  return (
    <>
      {Children.map(children, (child) => {
        const text = extractTextFromChildren(child);
        Iif (!searchTerm) return child;
 
        Iif (
          searchTerm &&
          text?.toLowerCase().includes(searchTerm.toLowerCase())
        ) {
          return <TextHighlighter text={searchTerm}>{child}</TextHighlighter>;
        }
 
        return null;
      })}
    </>
  );
}