Animation not showing up when interactivity is turned on

[rakshit087]

This is my code snippet:

import Lottie from "lottie-react";
import dashboardAnimation from "./dashboard.json";

export const Info = () => {
  return (
      <div className="px-8 overflow-hidden rounded-lg lg:px-0">
        <Lottie
          animationData={dashboardAnimation}
          autoplay={false}
          width={"100%"}
          ref = {ref}
          interactivity={{
            mode: "scroll",
            actions: [
              {
                visibility: [0.05, 0.35],
                type: "seek",
                frames: [0, 60],
              },
              {
                visibility: [0.35, 1],
                type: "seek",
                frames: [60, 500],
              },
            ],
          }}
        />
      </div>
  )
}

This works when interactivity is turned off and autoplay is on