How to use the @build-tracker/formatting.formatBytes function in @build-tracker/formatting

if (errorBudgets.length) {
    backgroundColor = scale(danger, 1);
  } else if (warningBudgets.length) {
    backgroundColor = scale(warning, 1);
  } else if (percentDelta > 0) {
    backgroundColor = scale(danger, percentDelta);
  } else if (sizeDelta === 0 && cell.hashChanged) {
    backgroundColor = scale(warning, 0.5);
  } else if (sizeDelta !== 0) {
    backgroundColor = scale(happy, percentDelta);
  }

  const stringChange = `${sizeDelta} bytes (${(percentDelta * 100).toFixed(3)}%)`;
  const title = cell.hashChanged && sizeDelta === 0 ? `Unexpected hash change! ${stringChange}` : stringChange;

  const text = sizeDelta === 0 ? cell.hashChanged ?  : '' : formatBytes(sizeDelta);
  const tooltipText = failingBudgets.length
    ? failingBudgets.map(budget => formatBudgetResult(budget, cell.name)).join(', ')
    : sizeDelta === 0 && cell.hashChanged
    ? `The hash for "${cell.name}" unexpectedly changed`
    : `"${cell.name}" changed by ${stringChange}`;

  return (
    
      {text ? (
        // @ts-ignore

const viewRef: React.RefObject

export const TotalCell = (props: Props): React.ReactElement => {
  const { cell, sizeKey, style } = props;
  const value = cell.sizes[sizeKey];
  const text = value === 0 ? '' : formatBytes(value);
  return {text ?  : null};
};

const tickFormat = (d): string =>
  formatBytes(d.valueOf(), { formatter: (bytes: number, units: number): number => Math.round(bytes / units) });

const defaultFormatTotal = (cell: TotalCell, sizeKey: string): string => formatBytes(cell.sizes[sizeKey] || 0);
const defaultFormatDelta = (cell: DeltaCell | TotalDeltaCell, sizeKey: string): string => {