24 lines
744 B
TypeScript
24 lines
744 B
TypeScript
import React from 'react';
|
|
|
|
import { randomIntFromInterval, generateText } from '../utils';
|
|
|
|
interface IPlaceholderDisplayName {
|
|
maxLength: number
|
|
minLength: number
|
|
withSuffix?: boolean
|
|
}
|
|
|
|
/** Fake display name to show when data is loading. */
|
|
const PlaceholderDisplayName: React.FC<IPlaceholderDisplayName> = ({ minLength, maxLength, withSuffix = true }) => {
|
|
const length = randomIntFromInterval(maxLength, minLength);
|
|
const acctLength = randomIntFromInterval(maxLength, minLength);
|
|
|
|
return (
|
|
<div className='flex flex-col text-primary-50 dark:text-primary-800'>
|
|
<p>{generateText(length)}</p>
|
|
{withSuffix && <p>{generateText(acctLength)}</p>}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default React.memo(PlaceholderDisplayName);
|