2022-01-10 14:17:52 -08:00
|
|
|
import React from 'react';
|
2022-01-10 14:25:06 -08:00
|
|
|
|
2021-10-11 12:00:59 -07:00
|
|
|
import { randomIntFromInterval, generateText } from '../utils';
|
|
|
|
|
2022-05-01 10:45:37 -07:00
|
|
|
interface IPlaceholderStatusContent {
|
|
|
|
maxLength: number,
|
|
|
|
minLength: number,
|
|
|
|
}
|
|
|
|
|
|
|
|
/** Fake status content while data is loading. */
|
|
|
|
const PlaceholderStatusContent: React.FC<IPlaceholderStatusContent> = ({ minLength, maxLength }) => {
|
2022-03-21 11:09:01 -07:00
|
|
|
const length = randomIntFromInterval(maxLength, minLength);
|
2021-10-11 12:00:59 -07:00
|
|
|
|
2022-03-21 11:09:01 -07:00
|
|
|
return (
|
2022-07-22 10:30:16 -07:00
|
|
|
<div className='flex flex-col text-primary-50 dark:text-primary-800'>
|
2022-03-21 11:09:01 -07:00
|
|
|
<p className='break-words'>{generateText(length)}</p>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
2021-10-11 12:00:59 -07:00
|
|
|
|
2022-03-21 11:09:01 -07:00
|
|
|
export default PlaceholderStatusContent;
|