React Loading Skeleton

Question

I'd like to implement React Loading Skeleton and I want the text to load after the state is loaded

<CardSubtitle tag="h6" className="text-muted">
Viewing time entries logged in the last 3 weeks
</CardSubtitle>

I tried this...

import React, { useState, useEffect } from 'react';
import { CardSubtitle } from 'reactstrap';
import Skeleton from 'react-loading-skeleton';

const MyComponent = () => {
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    const timer = setTimeout(() => {
      setIsLoading(false);
    }, 1000);
    return () => clearTimeout(timer);
  }, []);

  return (
    <div>
      <CardSubtitle tag="h6" className="text-muted">
        {isLoading ? <Skeleton width={200} /> : 'Viewing time entries logged in the last 3 weeks'}
      </CardSubtitle>
    </div>
  );
}

export default MyComponent;

... but no success. The whole page go blank.