Support SSR

[E-Kuerschner]

It isn't clear how this hook will work with SSR frameworks like Next, Gatsby or Remix. Some users in the past have reported issues, likely due to the fact that this library has pretty explicit dependency on the global window object of the browser. It will help a lot of developers if this lib were to support these frameworks since the ecosystem is really shifting in that direction and away from large SPAs

[E-Kuerschner]

fork with some work in this direction from @joeyiny

https://github.com/joeyiny/useAudioPlayer/commits/main

[joeyiny]

Making progress!

[E-Kuerschner]

@joeyiny nice! feel free to open up a PR if you'd like to contribute your enhancements. Also FYI v2 dropped today. You'll def want to rebase your fork off of the latest main. Let me know if you have any questions about the migration, but it shouldn't be too too different. The README has been updated with the latest information

[joeyiny]

@E-Kuerschner Oh nice, was actually planning on messaging you about v2! Definitely going to hop in first thing tomorrow hopefully.

[codejunkienick]

Currently working approach is to exclude it from SSR with window presence check (using useAudioPlayer@v2)

  const [hasWindow, setHasWindow] = useState(false);
  useEffect(() => {
    if (typeof window !== 'undefined') {
      setHasWindow(true);
    }
  }, []);
  ................
  
        {hasWindow && (
        <TrackPlayer url={url}  />
      )}
................

const TrackPlayer = ({
  audioUrl,
}: {
  audioUrl: string;
}) => {
  const {
    load,
    setVolume,
    togglePlayPause,
    playing,
    getPosition,
    duration,
    seek,
  } = useAudioPlayer();

[YusufcanY]

any example with useGlobalAudioPlayer? Also window presence check didn't work on me. I have issues with first load i guess. autoplay, initialVolume ex. don't work in my Next.js 14 project.

[E-Kuerschner]

Will likely be adding the 'use client' directive for general support
https://react.dev/reference/rsc/use-client#using-third-party-libraries