export function interpolate()

in packages/docusaurus/src/client/exports/Interpolate.tsx [31:87]
48 lines of code
5 McCabe index (conditional complexity)

export function interpolate<Str extends string, Value extends ReactNode>(
  text: Str,
  values?: InterpolateValues<Str, Value>,
): ReactNode;

export function interpolate<Str extends string, Value extends ReactNode>(
  text: Str,
  values?: InterpolateValues<Str, Value>,
): ReactNode {
  const elements: (Value | string)[] = [];

  const processedText = text.replace(ValueRegexp, (match: string) => {
    // remove {{ and }} around the placeholder
    const key = match.substring(
      1,
      match.length - 1,
    ) as ExtractInterpolatePlaceholders<Str>;

    const value = values?.[key];

    if (typeof value !== 'undefined') {
      const element = isValidElement(value)
        ? value
        : // For non-React elements: basic primitive->string conversion
          String(value);
      elements.push(element);
      return ValueFoundMarker;
    }
    return match; // no match? add warning?
  });

  // No interpolation to be done: just return the text
  if (elements.length === 0) {
    return text;
  }
  // Basic string interpolation: returns interpolated string
  if (elements.every((el) => typeof el === 'string')) {
    return processedText
      .split(ValueFoundMarker)
      .reduce<string>(
        (str, value, index) =>
          str.concat(value).concat((elements[index] as string) ?? ''),
        '',
      );
  }
  // JSX interpolation: returns ReactNode
  return processedText.split(ValueFoundMarker).reduce<ReactNode[]>(
    (array, value, index) => [
      ...array,
      <React.Fragment key={index}>
        {value}
        {elements[index]}
      </React.Fragment>,
    ],
    [],
  );
}