import React, { Fragment } from "react";

export function highlight(
  text: React.ReactNode,
  keyword: string = ""
): React.ReactNode {
  // eslint-disable-next-line no-param-reassign
  keyword = (keyword || "").trim();
  if ((typeof text !== "string" && typeof text !== "number") || !keyword) {
    return text;
  }
  return String(text)
    .split(keyword)
    .map((text, index) => {
      const key = `${text}-${index}`;
      if (index >= 1) {
        return (
          <span key={key}>
            <strong>{keyword}</strong>
            {text}
          </span>
        );
      }
      return <span key={key}>{text}</span>;
    });
}