array of refs stored in state creates infinite loop

Question

import React, {
  Fragment,
  useEffect,
  useState,
  useCallback,
} from "react";
import "./Header.css";
import Link from "next/link"