import { selectGeneralIsLoading } from 'store/slices/GeneralSlice';
import './styles.scss';

import HeroCrumbs from 'components/Sections/Hero/HeroCrumbs';
import { useSelector } from 'react-redux';
import { useRef } from 'react';
import { useAnimation } from 'hooks/useAnimation';

const BlogTitle = ({ title, desc }) => {
    const isLoading = useSelector(selectGeneralIsLoading);

    const container = useRef();
    useAnimation({
        items: ['.blog-title-section h1', '.blog-title-section .body1'],
        container,
        dependencies: [isLoading],
    })
    return (
        <section ref={container} className="inner-container blog-title-section">
            <HeroCrumbs page={'Blog'} />
            <h1>{title}</h1>
            <div className="body1">{desc}</div>
        </section>
    );
};

export default BlogTitle;

• [F] index.jsx
  Delete
• [F] styles.scss
  Delete