smooth scroll not working on safari browser when using nextjs?

Question

what am trying to achieve is the scroll behaviour: smooth but on safari, when clicking a link in the menu, all browsers will smoothly go the the section that the link refer to except for safari it will jump to section immediately, I tried every single option to achieve this (react-scroll, smooth-scroll, smoothScroll polyfill) nothing works, everyone referring to smooth scroll polyfill but its not working, there is no error it just do nothing. I put it inside use effect and other options, I also tried to removed the "window.forceSmoothScrollPolyfill = true;" also not working.

am I doing something wrong here?

import smoothscroll from 'smoothscroll-polyfill';


if (typeof window !== undefined) {
  console.log('polyfilled');
  smoothscroll.polyfill();
  window.__forceSmoothScrollPolyfill__ = true;
}