"use client";
import { useInView } from "react-intersection-observer";
import styles from "./footer.module.scss";
import { ToTop } from "./ToTop";

export const PigPattern = () => {
  const { ref, inView } = useInView({
    triggerOnce: true,
    rootMargin: "1000px",
  });

  return (
    <div
      ref={ref}
      className={`${styles.pigPattern} ${inView ? styles.loaded : ""}`}
    >
      <div className={styles.toTop}>
        <ToTop />
      </div>
    </div>
  );
};