How to use the i18n-calypso.numberFormat function in i18n-calypso

return renderCard( {
					status: '',
					content: __( 'Loading…' ),
				} );
			}

			if ( scanEnabled ) {
				// Check for threats
				const threats = this.props.scanThreats;
				if ( threats !== 0 ) {
					return renderCard( {
						content: [
							<h3>
								{ __( 'Uh oh, %(number)s threat found.', 'Uh oh, %(number)s threats found.', {
									count: threats,
									args: { number: numberFormat( threats ) },
								} ) }
							</h3>,
							<p>
								{ __( '{{a}}View details at VaultPress.com{{/a}}', {
									components: { a: <a href="https://dashboard.vaultpress.com/"> },
								} ) }
								<br>
								{ __( '{{a}}Contact Support{{/a}}', {
									components: { a: </a><a href="https://jetpack.com/support"> },
								} ) }
							</a></p><a href="https://jetpack.com/support">,
						],
					} );
				}

				// All good</a>

}

	const { decimal, grouping, symbol, unitValue = 1000 } = THOUSANDS[ code ];

	const sign = number < 0 ? '-' : '';
	const absNumber = Math.abs( number );

	// no-op if we have a small number
	if ( absNumber < unitValue ) {
		return `${ sign }${ absNumber }`;
	}

	//show 2 sig figs, otherwise take leading sig figs.
	const decimals = absNumber < unitValue * 10 ? 1 : 0;

	const value = numberFormat( absNumber / unitValue, {
		decimals,
		thousandsSep: grouping,
		decPoint: decimal,
	} );

	return `${ sign }${ value }${ symbol }`;
}

} );
			break;

		case 'likes':
			tooltipData.push( {
				label: translate( 'Likes' ),
				value: numberFormat( item.value ),
				className: 'is-likes',
				icon: 'star',
			} );
			break;

		default:
			tooltipData.push( {
				label: translate( 'Views' ),
				value: numberFormat( item.data.views ),
				className: 'is-views',
				icon: 'visible',
			} );
			tooltipData.push( {
				label: translate( 'Visitors' ),
				value: numberFormat( item.data.visitors ),
				className: 'is-visitors',
				icon: 'user',
			} );
			tooltipData.push( {
				label: translate( 'Views Per Visitor' ),
				value: numberFormat( item.data.views / item.data.visitors, { decimals: 2 } ),
				className: 'is-views-per-visitor',
				icon: 'chevron-right',
			} );

},
		{
			name: 'code',
			content: getCode( row ),
		},
		{
			name: 'group',
			content: ,
		},
		{
			name: 'position',
			content: numberFormat( position, 0 ),
		},
		{
			name: 'last_count',
			content: numberFormat( hits, 0 ),
		},
		{
			name: 'last_access',
			content: last_access,
		},
	];
}

const currencyDefaults = getCurrencyDefaults( code );
	if ( ! currencyDefaults || isNaN( number ) ) {
		return null;
	}
	const { decimal, grouping, precision, symbol } = { ...currencyDefaults, ...options };
	const sign = number < 0 ? '-' : '';
	const absNumber = Math.abs( number );
	const rawInteger = Math.floor( absNumber );
	const integer = numberFormat( rawInteger, {
		decimals: 0,
		thousandsSep: grouping,
		decPoint: decimal,
	} );
	const fraction =
		precision > 0
			? numberFormat( absNumber - rawInteger, {
					decimals: precision,
					thousandsSep: grouping,
					decPoint: decimal,
			  } ).slice( 1 )
			: '';
	return {
		sign,
		symbol,
		integer,
		fraction,
	};
}

export function getCurrencyObject( number, code, options = {} ) {
	const currencyDefaults = getCurrencyDefaults( code );
	if ( ! currencyDefaults || isNaN( number ) ) {
		return null;
	}
	const { decimal, grouping, precision, symbol } = { ...currencyDefaults, ...options };
	const sign = number < 0 ? '-' : '';
	const absNumber = Math.abs( number );
	const rawInteger = Math.floor( absNumber );
	const integer = numberFormat( rawInteger, {
		decimals: 0,
		thousandsSep: grouping,
		decPoint: decimal,
	} );
	const fraction =
		precision > 0
			? numberFormat( absNumber - rawInteger, {
					decimals: precision,
					thousandsSep: grouping,
					decPoint: decimal,
			  } ).slice( 1 )
			: '';
	return {
		sign,
		symbol,
		integer,

<div>
				<div>
					<p>{ __( 'Views today', { comment: 'Referring to a number of page views' } ) }</p>
					<h3>{ s.viewsToday }</h3>
				</div>
				<div>
					<p>{ __( 'Best overall day', { comment: 'Referring to a number of page views' } ) }</p>
					<h3>
						{
							'-' === s.bestDay.count
							? '-'
							: __( '%(number)s View', '%(number)s Views',
								{
									count: s.bestDay.count,
									args: {
										number: numberFormat( s.bestDay.count )
									}
								}
							)
						}
					</h3>
					<p>
						{
							'-' === s.bestDay.day ? '-' : moment( s.bestDay.day ).format( 'MMMM Do, YYYY' )
						}
					</p>
				</div>
				<div>
					<div>
						<p>{ __( 'All-time views', { comment: 'Referring to a number of page views' } ) }</p>
						<h3>
							{</h3></div></div></div>

const StartCardFooter = ( { site } ) => {
	const subscribersCount = numberFormat( site.subscribers_count );
	return (
		<footer>
			<div>{ subscribersCount } followers</div>
			
		</footer>
	);
};

className="jp-dash-item__recently-activated"
					>
						<div>
							
							<p>
								{ __(
									'Jetpack is actively blocking malicious login attempts. Data will display here soon!'
								) }
							</p>
						</div>
					
				);
			}
			return (
				
					<h2>{ numberFormat( protectCount ) }</h2>
					<p>
						{ __( 'Total malicious attacks blocked on your site.' ) }
					</p>
				
			);
		}

		return (
			
				<p>
					{ this.props.isDevMode</p>

),
		},
		{
			name: 'agent',
			content: (
				
			),
		},
		{
			name: 'ip',
			content: ,
		},
		{
			name: 'count',
			content: numberFormat( row.count, 0 ),
		},
	];
}