'Auto Scroll to section not working next.js

Hi so I've been trying to make the auto scroll to a section from this video to work unlike other sections, testimonal section doesn't seem to work for me and I can't figure out why, I've spent most of my time on this looking at each and every stuff but I still can't figure this out.

header.data.js

export default [
  {
    path: 'home',
    label: 'Home',
  },
  {
    path: 'feature',
    label: 'Features',
  },
  {
    path: 'pricing',
    label: 'Pricing',
  },
  {
    path: 'testimonial',
    label: 'Testimonial',
  },
];

header.js

import { jsx, Container, Flex, Button } from 'theme-ui';
import menuItems from './header.data';
import { Link } from 'react-scroll';
<Flex as="nav" sx={styles.nav}>
            {menuItems.map((item, i)=>(
              <Link
              activeClass="active"
              to={item.path}
              spy={true}
              smooth={true}
              offset={-70}
              duration={500}
              key={i}
            >
              {item.label}
            </Link>
            ))}
</Flex>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source