bigbuffet-rw/app/soapbox/features/placeholder/components/placeholder-display-name.tsx
marcin mikołajczak b8542c619d Improve chats styles and chat placeholder
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
2022-11-26 20:03:17 +01:00

24 lines
735 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 PlaceholderDisplayName;