Function formatDataForPreview

packages/react-devtools-shared/src/utils.js:949–1220

(
  data: any,
  showFormattedValue: boolean,
)

// Would show a preview of...
//   [123, "abc", Array(2), {…}]
export function formatDataForPreview(
  data: any,
  showFormattedValue: boolean,
): string {
  if (data != null && hasOwnProperty.call(data, meta.type)) {
    return showFormattedValue
      ? data[meta.preview_long]
      : data[meta.preview_short];
  }

  const type = getDataType(data);

  switch (type) {
    case 'html_element':
      return `<${truncateForDisplay(data.tagName.toLowerCase())} />`;
    case 'function':
      if (typeof data.name === 'function' || data.name === '') {
        return '() => {}';
      }
      return `${truncateForDisplay(data.name)}() {}`;
    case 'string':
      return `"${data}"`;
    case 'bigint':
      return truncateForDisplay(data.toString() + 'n');
    case 'regexp':
      return truncateForDisplay(data.toString());
    case 'symbol':
      return truncateForDisplay(data.toString());
    case 'react_element':
      return `<${truncateForDisplay(
        getDisplayNameForReactElement(data) || 'Unknown',
      )} />`;
    case 'react_lazy':
      // To avoid actually initialize a lazy to cause a side-effect we make some assumptions
      // about the structure of the payload even though that's not really part of the contract.
      // In practice, this is really just coming from React.lazy helper or Flight.
      const payload = data._payload;
      if (payload !== null && typeof payload === 'object') {
        if (payload._status === 0) {
          // React.lazy constructor pending
          return `pending lazy()`;
        }
        if (payload._status === 1 && payload._result != null) {
          // React.lazy constructor fulfilled
          if (showFormattedValue) {
            const formatted = formatDataForPreview(
              payload._result.default,
              false,
            );
            return `fulfilled lazy() {${truncateForDisplay(formatted)}}`;
          } else {
            return `fulfilled lazy() {…}`;
          }
        }
        if (payload._status === 2) {
          // React.lazy constructor rejected
          if (showFormattedValue) {
            const formatted = formatDataForPreview(payload._result, false);