2022-05-01 10:53:53 -07:00
|
|
|
import React from 'react';
|
|
|
|
|
2022-11-15 11:00:40 -08:00
|
|
|
import PlaceholderAvatar from './placeholder-avatar';
|
|
|
|
import PlaceholderDisplayName from './placeholder-display-name';
|
2022-05-01 10:53:53 -07:00
|
|
|
|
|
|
|
/** Fake account to display while data is loading. */
|
|
|
|
const PlaceholderAccount: React.FC = () => {
|
|
|
|
return (
|
|
|
|
<div className='account'>
|
|
|
|
<div className='account__wrapper'>
|
|
|
|
<span className='account__display-name'>
|
|
|
|
<div className='account__avatar-wrapper'>
|
|
|
|
<PlaceholderAvatar size={36} />
|
|
|
|
</div>
|
|
|
|
<PlaceholderDisplayName minLength={3} maxLength={25} />
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default PlaceholderAccount;
|