2024-03-22 14:12:13 +01:00
|
|
|
import styles from './loading-ellipsis.module.css';
|
|
|
|
|
|
|
|
|
|
interface LoadingEllipsisProps {
|
|
|
|
|
string: string;
|
|
|
|
|
}
|
|
|
|
|
|
2026-04-29 16:41:56 +07:00
|
|
|
const TRAILING_ELLIPSIS_PATTERN = /\s*(?:\.\.\.|\u2026)\s*$/;
|
|
|
|
|
|
2024-03-22 14:12:13 +01:00
|
|
|
const LoadingEllipsis = ({ string }: LoadingEllipsisProps) => {
|
2026-04-29 16:41:56 +07:00
|
|
|
const normalizedString = string.replace(TRAILING_ELLIPSIS_PATTERN, '');
|
|
|
|
|
const words = normalizedString.split(' ');
|
2024-12-02 10:33:17 +01:00
|
|
|
const lastWord = words.pop();
|
|
|
|
|
const restOfString = words.join(' ');
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<span>
|
|
|
|
|
{restOfString}
|
|
|
|
|
{restOfString && ' '}
|
|
|
|
|
<span className={styles.nowrap}>
|
|
|
|
|
{lastWord}
|
|
|
|
|
<span className={styles.ellipsis} />
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
);
|
2024-03-22 14:12:13 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export default LoadingEllipsis;
|