diff --git a/src/components/audio/audio.component.tsx b/src/components/audio/audio.component.tsx
index a7debb3f..d5e5cd5d 100644
--- a/src/components/audio/audio.component.tsx
+++ b/src/components/audio/audio.component.tsx
@@ -1,24 +1,24 @@
 import {NextSeo} from 'next-seo';
 import React, {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {useDynamicTitle} from 'src/hooks/use-dynamic-title';
 
 import {Invisible} from './audio.component.styles';
 import {useAudioModule} from './hooks/use-audio-component';
 
 interface Props {
+  url: string;
   defaultSpeed: string;
 }
 
-export function AudioComponent({defaultSpeed}: Props) {
-  const audioRef = useAudioRefContext();
+export function AudioComponent({url, defaultSpeed}: Props) {
+  const {ref, setUrl, setSpeed} = usePlayerContext();
   const {dynamicTitle} = useDynamicTitle();
-  const {setSpeed} = useAudioPlayerContext();
 
   useEffect(() => {
+    setUrl(url);
     setSpeed(defaultSpeed);
-  }, [defaultSpeed, setSpeed]);
+  }, [url, setUrl, defaultSpeed, setSpeed]);
 
   useAudioModule();
 
@@ -28,7 +28,7 @@ export function AudioComponent({defaultSpeed}: Props) {
 
       <Invisible>
         <audio
-          ref={audioRef}
+          ref={ref}
           aria-label="player"
           // controls
         >
diff --git a/src/components/audio/hooks/use-audio-buffered.ts b/src/components/audio/hooks/use-audio-buffered.ts
index 0815cfaf..599c7e65 100644
--- a/src/components/audio/hooks/use-audio-buffered.ts
+++ b/src/components/audio/hooks/use-audio-buffered.ts
@@ -1,6 +1,5 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 const getBufferedAmount = (audio: HTMLAudioElement) => {
   try {
@@ -11,8 +10,7 @@ const getBufferedAmount = (audio: HTMLAudioElement) => {
 };
 
 export function useAudioBuffered() {
-  const ref = useAudioRefContext();
-  const {setBuffered} = useAudioPlayerContext();
+  const {ref, setBuffered} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-load.ts b/src/components/audio/hooks/use-audio-load.ts
index 007b7cbb..53e3a6da 100644
--- a/src/components/audio/hooks/use-audio-load.ts
+++ b/src/components/audio/hooks/use-audio-load.ts
@@ -1,12 +1,8 @@
 import {useCallback, useEffect, useState} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
-import {useAudioUrlContext} from 'src/contexts/audio-url-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioLoad() {
-  const ref = useAudioRefContext();
-  const {url} = useAudioUrlContext();
-  const {setDuration, setReady} = useAudioPlayerContext();
+  const {ref, setDuration, setReady, url} = usePlayerContext();
   const [savedUrl, setSavedUrl] = useState<string>();
 
   const handleCanPlay = useCallback(() => {
diff --git a/src/components/audio/hooks/use-audio-loop.ts b/src/components/audio/hooks/use-audio-loop.ts
index a656c912..3e8129ca 100644
--- a/src/components/audio/hooks/use-audio-loop.ts
+++ b/src/components/audio/hooks/use-audio-loop.ts
@@ -1,10 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioLoop() {
-  const ref = useAudioRefContext();
-  const {isRepeating} = useAudioPlayerContext();
+  const {ref, isRepeating} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-pitch.ts b/src/components/audio/hooks/use-audio-pitch.ts
index 2c00e915..4e546d48 100644
--- a/src/components/audio/hooks/use-audio-pitch.ts
+++ b/src/components/audio/hooks/use-audio-pitch.ts
@@ -1,5 +1,5 @@
 import {useEffect} from 'react';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 declare global {
   interface HTMLAudioElement {
@@ -9,7 +9,7 @@ declare global {
 }
 
 export function useAudioPitch() {
-  const ref = useAudioRefContext();
+  const {ref} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-play-pause.ts b/src/components/audio/hooks/use-audio-play-pause.ts
index 89d0e86d..0805e8f4 100644
--- a/src/components/audio/hooks/use-audio-play-pause.ts
+++ b/src/components/audio/hooks/use-audio-play-pause.ts
@@ -1,10 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioPlayPause() {
-  const ref = useAudioRefContext();
-  const {isPlaying} = useAudioPlayerContext();
+  const {ref, isPlaying} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-playback-rate.ts b/src/components/audio/hooks/use-audio-playback-rate.ts
index ed7f9ad7..6423a241 100644
--- a/src/components/audio/hooks/use-audio-playback-rate.ts
+++ b/src/components/audio/hooks/use-audio-playback-rate.ts
@@ -1,10 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioPlaybackRate() {
-  const ref = useAudioRefContext();
-  const {speed} = useAudioPlayerContext();
+  const {ref, speed} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-progress.ts b/src/components/audio/hooks/use-audio-progress.ts
index 6fbb77f0..f1d8c621 100644
--- a/src/components/audio/hooks/use-audio-progress.ts
+++ b/src/components/audio/hooks/use-audio-progress.ts
@@ -1,11 +1,10 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
+
+const fps = 10;
 
 export function useAudioProgress() {
-  const ref = useAudioRefContext();
-  const {isPlaying, setProgress} = useAudioPlayerContext();
-  const fps = 10;
+  const {ref, isPlaying, setProgress} = usePlayerContext();
 
   useEffect(() => {
     let i1: NodeJS.Timeout | undefined = undefined;
diff --git a/src/components/audio/hooks/use-audio-seek.ts b/src/components/audio/hooks/use-audio-seek.ts
index 1a1a4c21..7131ff42 100644
--- a/src/components/audio/hooks/use-audio-seek.ts
+++ b/src/components/audio/hooks/use-audio-seek.ts
@@ -1,10 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioSeek() {
-  const ref = useAudioRefContext();
-  const {seek} = useAudioPlayerContext();
+  const {ref, seek} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-audio-volume.ts b/src/components/audio/hooks/use-audio-volume.ts
index 624f3fd4..fc5096c1 100644
--- a/src/components/audio/hooks/use-audio-volume.ts
+++ b/src/components/audio/hooks/use-audio-volume.ts
@@ -1,10 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
-import {useAudioRefContext} from 'src/contexts/audio-ref-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useAudioVolume() {
-  const ref = useAudioRefContext();
-  const {volume, setVolume} = useAudioPlayerContext();
+  const {ref, volume, setVolume} = usePlayerContext();
 
   useEffect(() => {
     if (ref.current === null) {
diff --git a/src/components/audio/hooks/use-keyboard-toggle.ts b/src/components/audio/hooks/use-keyboard-toggle.ts
index 5262bf4a..70f4c426 100644
--- a/src/components/audio/hooks/use-keyboard-toggle.ts
+++ b/src/components/audio/hooks/use-keyboard-toggle.ts
@@ -1,8 +1,8 @@
 import {useEffect} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function useKeyboardToggle(keyCode = 'Space'): void {
-  const {togglePlaying} = useAudioPlayerContext();
+  const {togglePlaying} = usePlayerContext();
 
   useEffect(() => {
     const handler = (e: KeyboardEvent) => {
diff --git a/src/components/indicators/hooks/use-indicators-component.ts b/src/components/indicators/hooks/use-indicators-component.ts
index 6eb4a133..8ca6c817 100644
--- a/src/components/indicators/hooks/use-indicators-component.ts
+++ b/src/components/indicators/hooks/use-indicators-component.ts
@@ -1,7 +1,7 @@
 import {useMemo} from 'react';
 import speedToPercentage from 'speed-to-percentage';
 import speedToSemitones from 'speed-to-semitones';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 interface UseIndicatorsComponent {
   percentage: string;
@@ -9,7 +9,7 @@ interface UseIndicatorsComponent {
 }
 
 export function useIndicatorsComponent(): UseIndicatorsComponent {
-  const {speed} = useAudioPlayerContext();
+  const {speed} = usePlayerContext();
 
   const percentage = useMemo(
     () => speedToPercentage(speed, 1).toString(),
diff --git a/src/contexts/audio-ref-context.tsx b/src/contexts/audio-ref-context.tsx
deleted file mode 100644
index 1debfa37..00000000
--- a/src/contexts/audio-ref-context.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React, {
-  createContext,
-  type MutableRefObject,
-  useContext,
-  useRef,
-} from 'react';
-
-type AudioRef = HTMLAudioElement | null;
-type Context = MutableRefObject<AudioRef>;
-
-const AudioRefContext = createContext<Context>({} as Context);
-
-export function AudioRefContextProvider({children}) {
-  const audioRef = useRef<AudioRef>(null);
-
-  return (
-    <AudioRefContext.Provider value={audioRef}>
-      {children}
-    </AudioRefContext.Provider>
-  );
-}
-
-export function useAudioRefContext() {
-  return useContext(AudioRefContext);
-}
diff --git a/src/contexts/audio-url-context.tsx b/src/contexts/audio-url-context.tsx
deleted file mode 100644
index 4582d7c6..00000000
--- a/src/contexts/audio-url-context.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React, {createContext, useContext, useMemo, useState} from 'react';
-
-type AudioUrl = string | null;
-
-type Context = {
-  url: AudioUrl;
-  setUrl: React.Dispatch<React.SetStateAction<AudioUrl>>;
-};
-
-const AudioUrlContext = createContext<Context>({} as Context);
-
-export function AudioUrlContextProvider({children}) {
-  const [url, setUrl] = useState<string | null>(null);
-  const context = useMemo(() => ({url, setUrl}), [url, setUrl]);
-
-  return (
-    <AudioUrlContext.Provider value={context}>
-      {children}
-    </AudioUrlContext.Provider>
-  );
-}
-
-export function useAudioUrlContext() {
-  return useContext(AudioUrlContext);
-}
diff --git a/src/contexts/audio-player-context.tsx b/src/contexts/player-context.tsx
similarity index 85%
rename from src/contexts/audio-player-context.tsx
rename to src/contexts/player-context.tsx
index 728d4343..39b2c231 100644
--- a/src/contexts/audio-player-context.tsx
+++ b/src/contexts/player-context.tsx
@@ -2,13 +2,16 @@ import React, {
   type ChangeEvent,
   createContext,
   type Dispatch,
+  type MutableRefObject,
   type SetStateAction,
   useCallback,
   useContext,
   useMemo,
+  useRef,
   useState,
 } from 'react';
 
+type Ref = HTMLAudioElement | null;
 type Speed = number;
 type Volume = number;
 type Buffered = number; // amount in time
@@ -20,8 +23,10 @@ type Seek = number; // amount in time (requested by the user)
 type Ready = boolean;
 type Title = string;
 type Artwork = string; // url
+type Url = string;
 
 type Context = {
+  ref: MutableRefObject<Ref>;
   speed: Speed;
   setSpeed: (speed: string) => void;
   volume: Volume;
@@ -45,11 +50,14 @@ type Context = {
   setTitle: Dispatch<SetStateAction<Title>>;
   artwork: Artwork;
   setArtwork: Dispatch<SetStateAction<Artwork>>;
+  url: Url;
+  setUrl: Dispatch<SetStateAction<Url>>;
 };
 
-const AudioPlayerContext = createContext<Context>({} as Context);
+const PlayerContext = createContext<Context>({} as Context);
 
-export function AudioPlayerContextProvider({children}) {
+export function PlayerContextProvider({children}) {
+  const ref = useRef<Ref>(null);
   const [speed, setSpeed] = useState<Speed>(1);
   const [volume, setVolume] = useState<Volume>(0.7);
   const [buffered, setBuffered] = useState<Buffered>(0);
@@ -61,6 +69,7 @@ export function AudioPlayerContextProvider({children}) {
   const [isReady, setReady] = useState<Ready>(false);
   const [title, setTitle] = useState<Title>('');
   const [artwork, setArtwork] = useState<Artwork>('');
+  const [url, setUrl] = useState<Url>('');
 
   const setSpeedSanitized = useCallback((newSpeed: string) => {
     let newSpeedFloat = parseFloat(newSpeed);
@@ -105,6 +114,7 @@ export function AudioPlayerContextProvider({children}) {
 
   const context = useMemo(
     () => ({
+      ref,
       speed,
       setSpeed: setSpeedSanitized,
       volume,
@@ -128,6 +138,8 @@ export function AudioPlayerContextProvider({children}) {
       setTitle,
       artwork,
       setArtwork,
+      url,
+      setUrl,
     }),
     [
       speed,
@@ -146,16 +158,15 @@ export function AudioPlayerContextProvider({children}) {
       isReady,
       title,
       artwork,
+      url,
     ],
   );
 
   return (
-    <AudioPlayerContext.Provider value={context}>
-      {children}
-    </AudioPlayerContext.Provider>
+    <PlayerContext.Provider value={context}>{children}</PlayerContext.Provider>
   );
 }
 
-export function useAudioPlayerContext() {
-  return useContext(AudioPlayerContext);
+export function usePlayerContext() {
+  return useContext(PlayerContext);
 }
diff --git a/src/hooks/use-dynamic-title.ts b/src/hooks/use-dynamic-title.ts
index 4f577884..05b6abbe 100644
--- a/src/hooks/use-dynamic-title.ts
+++ b/src/hooks/use-dynamic-title.ts
@@ -1,28 +1,16 @@
-import {useRouter} from 'next/router';
 import {useNextReplaceUrl} from 'next-replace-url';
-import {useMemo} from 'react';
-import speedToSemitones from 'speed-to-semitones';
-import {TITLE_SEPARATOR} from 'src/constants';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {useCache} from 'src/hooks/use-cache';
-import {getProviderFromRouter} from 'src/utils/get-provider/get-provider-from-router';
+import {usePlayerDocumentTitle} from 'src/hooks/use-player-document-title';
 
+// todo: rename me
 export function useDynamicTitle() {
-  const router = useRouter();
-  const {speed, title} = useAudioPlayerContext();
+  const {speed, title} = usePlayerContext();
   const cachedSpeed = useCache(speed, 350);
 
   useNextReplaceUrl('speed', cachedSpeed.toString());
 
-  const dynamicTitle = useMemo(() => {
-    if (!title) {
-      return '';
-    }
-
-    const semitones = `${speedToSemitones(cachedSpeed, 1)} st`;
-    const provider = getProviderFromRouter(router);
-    return `${title} ${TITLE_SEPARATOR} ${provider} ${TITLE_SEPARATOR} ${semitones}`;
-  }, [title, cachedSpeed, router]);
+  const dynamicTitle = usePlayerDocumentTitle(title, cachedSpeed);
 
   return {
     dynamicTitle,
diff --git a/src/hooks/use-player-document-title.ts b/src/hooks/use-player-document-title.ts
new file mode 100644
index 00000000..496168e2
--- /dev/null
+++ b/src/hooks/use-player-document-title.ts
@@ -0,0 +1,12 @@
+import {useRouter} from 'next/router';
+import speedToSemitones from 'speed-to-semitones';
+import {TITLE_SEPARATOR} from 'src/constants';
+import {getProviderFromRouter} from 'src/utils/get-provider/get-provider-from-router';
+
+export function usePlayerDocumentTitle(title: string, speed: number = 1) {
+  const router = useRouter();
+  const provider = getProviderFromRouter(router);
+  const semitones = `${speedToSemitones(speed, 1)} st`;
+
+  return `${title} ${TITLE_SEPARATOR} ${provider} ${TITLE_SEPARATOR} ${semitones}`;
+}
diff --git a/src/layouts/player/hooks/use-player-layout.ts b/src/layouts/player/hooks/use-player-layout.ts
index 6dc3a73f..72e1cb63 100644
--- a/src/layouts/player/hooks/use-player-layout.ts
+++ b/src/layouts/player/hooks/use-player-layout.ts
@@ -1,43 +1,10 @@
 import {useRouter} from 'next/router';
-import {useEffect} from 'react';
-import {useAudioUrlContext} from 'src/contexts/audio-url-context';
-import {type PlayerLayoutProps} from 'src/layouts/player/player.layout';
 
-interface UsePlayerLayout {
-  metaUrl: string;
-}
-
-export function usePlayerLayout({audio}: PlayerLayoutProps): UsePlayerLayout {
+export function usePlayerLayout() {
   const router = useRouter();
-
-  // const [isLoaded] = useAtom(isLoadedAtom);
-  // const [, setAudioTitle] = useAtom(setAudioTitleAtom);
-  // const [, setArtwork] = useAtom(setArtworkAtom);
-
-  const metaUrl = 'https://www.screwmycode.in/' + router.asPath;
-
-  const {setUrl} = useAudioUrlContext();
-
-  useEffect(() => {
-    setUrl(audio);
-  }, [audio, setUrl]);
-
-  // usePlayerLoading();
-
-  // useEffect(() => {
-  //   setAudioTitle(title);
-  // }, [setAudioTitle, title]);
-
-  // useEffect(() => {
-  //   setArtwork(image);
-  // }, [setArtwork, image]);
-
-  // todo: pause on url change
-  // useEffect(() => () => {
-  //   setPause();
-  // });
+  const canonical = 'https://www.screwmycode.in/' + router.asPath;
 
   return {
-    metaUrl,
+    canonical,
   };
 }
diff --git a/src/layouts/player/player.layout.tsx b/src/layouts/player/player.layout.tsx
index 27c38e83..f16405dc 100644
--- a/src/layouts/player/player.layout.tsx
+++ b/src/layouts/player/player.layout.tsx
@@ -1,8 +1,8 @@
 import {NextSeo} from 'next-seo';
 import React from 'react';
 import {AudioComponent} from 'src/components/audio/audio.component';
-import {AudioPlayerContextProvider} from 'src/contexts/audio-player-context';
-import {AudioRefContextProvider} from 'src/contexts/audio-ref-context';
+import {PlayerContextProvider} from 'src/contexts/player-context';
+import {usePlayerDocumentTitle} from 'src/hooks/use-player-document-title';
 import {DefaultLayout} from 'src/layouts/default/default.layout';
 import {PlayerModule} from 'src/modules/player/player.module';
 
@@ -16,25 +16,28 @@ export interface PlayerLayoutProps {
 }
 
 export function PlayerLayout({title, image, audio, speed}: PlayerLayoutProps) {
-  const {metaUrl} = usePlayerLayout({title, image, audio, speed});
+  const {canonical} = usePlayerLayout();
+  const dynamicTitle = usePlayerDocumentTitle(title);
 
   return (
     <>
       <NextSeo
+        title={dynamicTitle}
         openGraph={{images: [{url: image}]}}
-        canonical={metaUrl}
+        canonical={canonical}
       />
 
       <DefaultLayout>
-        <AudioRefContextProvider>
-          <AudioPlayerContextProvider>
-            <AudioComponent defaultSpeed={speed.toString()} />
-            <PlayerModule
-              title={title}
-              artwork={image}
-            />
-          </AudioPlayerContextProvider>
-        </AudioRefContextProvider>
+        <PlayerContextProvider>
+          <AudioComponent
+            url={audio}
+            defaultSpeed={speed.toString()}
+          />
+          <PlayerModule
+            title={title}
+            artwork={image}
+          />
+        </PlayerContextProvider>
       </DefaultLayout>
     </>
   );
diff --git a/src/modules/player/components/artwork/native.component.tsx b/src/modules/player/components/artwork/native.component.tsx
index 9f1193df..0e4d3a3d 100644
--- a/src/modules/player/components/artwork/native.component.tsx
+++ b/src/modules/player/components/artwork/native.component.tsx
@@ -1,6 +1,6 @@
 import Image from 'next/image';
 import React, {type ReactElement} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {Container} from 'src/modules/player/components/artwork/artwork.component.styles';
 
 interface Props {
@@ -8,7 +8,7 @@ interface Props {
 }
 
 export function NativeComponent({width}: Props): ReactElement {
-  const {speed, artwork} = useAudioPlayerContext();
+  const {speed, artwork} = usePlayerContext();
 
   return (
     <Container speed={speed.toString()}>
diff --git a/src/modules/player/components/artwork/web-gl.component.tsx b/src/modules/player/components/artwork/web-gl.component.tsx
index dea31afd..863e2fc7 100644
--- a/src/modules/player/components/artwork/web-gl.component.tsx
+++ b/src/modules/player/components/artwork/web-gl.component.tsx
@@ -1,6 +1,6 @@
 import React, {type ReactElement} from 'react';
 import {TextureComponent} from 'src/components/texture/texture.component';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {Container} from 'src/modules/player/components/artwork/artwork.component.styles';
 
 interface Props {
@@ -8,7 +8,7 @@ interface Props {
 }
 
 export function WebGlComponent({width}: Props): ReactElement {
-  const {speed, artwork} = useAudioPlayerContext();
+  const {speed, artwork} = usePlayerContext();
 
   return (
     <Container speed={speed.toString()}>
diff --git a/src/modules/player/components/play-pause-button/play-pause-button.component.tsx b/src/modules/player/components/play-pause-button/play-pause-button.component.tsx
index c5815586..65761fbd 100644
--- a/src/modules/player/components/play-pause-button/play-pause-button.component.tsx
+++ b/src/modules/player/components/play-pause-button/play-pause-button.component.tsx
@@ -2,11 +2,11 @@ import pause from '@iconify/icons-mdi/pause';
 import play from '@iconify/icons-mdi/play';
 import {Icon} from '@iconify/react';
 import React, {type ReactElement} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {PlayerButton} from 'src/modules/player/player.module.styles';
 
 export function PlayPauseButtonComponent(): ReactElement {
-  const {isPlaying, togglePlaying} = useAudioPlayerContext();
+  const {isPlaying, togglePlaying} = usePlayerContext();
 
   return (
     <PlayerButton
diff --git a/src/modules/player/components/repeat-button/repeat-button.component.tsx b/src/modules/player/components/repeat-button/repeat-button.component.tsx
index bb08d65f..92244efa 100644
--- a/src/modules/player/components/repeat-button/repeat-button.component.tsx
+++ b/src/modules/player/components/repeat-button/repeat-button.component.tsx
@@ -2,12 +2,12 @@ import repeat from '@iconify/icons-mdi/repeat';
 import repeatOff from '@iconify/icons-mdi/repeat-off';
 import {Icon} from '@iconify/react';
 import React, {type ReactElement} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 import {PlayerButton} from '../../player.module.styles';
 
 export function RepeatButtonComponent(): ReactElement {
-  const {isRepeating, toggleRepeating} = useAudioPlayerContext();
+  const {isRepeating, toggleRepeating} = usePlayerContext();
 
   return (
     <PlayerButton
diff --git a/src/modules/player/components/seek/seek.component.tsx b/src/modules/player/components/seek/seek.component.tsx
index 70869eaf..58e5c968 100644
--- a/src/modules/player/components/seek/seek.component.tsx
+++ b/src/modules/player/components/seek/seek.component.tsx
@@ -1,9 +1,9 @@
 import React, {type ReactElement} from 'react';
 import {SliderComponent} from 'src/components/slider/slider.component';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function SeekComponent(): ReactElement {
-  const {buffered, duration, progress, handleSeek} = useAudioPlayerContext();
+  const {buffered, duration, progress, handleSeek} = usePlayerContext();
 
   return (
     <SliderComponent
diff --git a/src/modules/player/components/speed/hooks/use-speed-component.ts b/src/modules/player/components/speed/hooks/use-speed-component.ts
index 4c3d253b..da04d6c4 100644
--- a/src/modules/player/components/speed/hooks/use-speed-component.ts
+++ b/src/modules/player/components/speed/hooks/use-speed-component.ts
@@ -1,5 +1,5 @@
 import {ChangeEvent, useCallback} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 interface UseSpeedComponent {
   value: number;
@@ -7,7 +7,7 @@ interface UseSpeedComponent {
 }
 
 export function useSpeedComponent(): UseSpeedComponent {
-  const {speed, setSpeed} = useAudioPlayerContext();
+  const {speed, setSpeed} = usePlayerContext();
 
   const onChange = useCallback(
     (e: ChangeEvent<HTMLInputElement>) => {
diff --git a/src/modules/player/components/time/time.component.tsx b/src/modules/player/components/time/time.component.tsx
index 95773e64..42ae2298 100644
--- a/src/modules/player/components/time/time.component.tsx
+++ b/src/modules/player/components/time/time.component.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {calculateMinutes} from 'src/utils/calculate-minutes/calculate-minutes';
 
 import {Container} from './time.component.styles';
 
 export function TimeComponent() {
-  const {duration, progress} = useAudioPlayerContext();
+  const {duration, progress} = usePlayerContext();
 
   return (
     <Container>
diff --git a/src/modules/player/components/title/title.component.tsx b/src/modules/player/components/title/title.component.tsx
index c250cd65..64cbcc38 100644
--- a/src/modules/player/components/title/title.component.tsx
+++ b/src/modules/player/components/title/title.component.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 import {H2} from './title.component.styles';
 
 export function TitleComponent() {
-  const {title} = useAudioPlayerContext();
+  const {title} = usePlayerContext();
   return <H2>{title}</H2>;
 }
diff --git a/src/modules/player/components/volume-button/volume-button.component.tsx b/src/modules/player/components/volume-button/volume-button.component.tsx
index 7a9d5623..818ad5ba 100644
--- a/src/modules/player/components/volume-button/volume-button.component.tsx
+++ b/src/modules/player/components/volume-button/volume-button.component.tsx
@@ -2,12 +2,12 @@ import volumeHigh from '@iconify/icons-mdi/volume-high';
 import volumeOff from '@iconify/icons-mdi/volume-off';
 import {Icon} from '@iconify/react';
 import React, {type ReactElement} from 'react';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 import {PlayerButton} from '../../player.module.styles';
 
 export function VolumeButtonComponent(): ReactElement {
-  const {volume} = useAudioPlayerContext();
+  const {volume} = usePlayerContext();
 
   return (
     <PlayerButton aria-label="volume">
diff --git a/src/modules/player/components/volume-slider/volume-slider.component.tsx b/src/modules/player/components/volume-slider/volume-slider.component.tsx
index 3284e329..dd67f083 100644
--- a/src/modules/player/components/volume-slider/volume-slider.component.tsx
+++ b/src/modules/player/components/volume-slider/volume-slider.component.tsx
@@ -1,9 +1,9 @@
 import React, {type ReactElement} from 'react';
 import {SliderComponent} from 'src/components/slider/slider.component';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 
 export function VolumeSliderComponent(): ReactElement {
-  const {volume, setVolume} = useAudioPlayerContext();
+  const {volume, setVolume} = usePlayerContext();
 
   return (
     <SliderComponent
diff --git a/src/modules/player/player.module.tsx b/src/modules/player/player.module.tsx
index ac47ca6c..a9a19647 100644
--- a/src/modules/player/player.module.tsx
+++ b/src/modules/player/player.module.tsx
@@ -4,7 +4,7 @@ import useMeasure from 'react-use-measure';
 import {p} from 'src/app/shared.styles';
 import {IndicatorsComponent} from 'src/components/indicators/indicators.component';
 import {LoadingComponent} from 'src/components/loading/loading.component';
-import {useAudioPlayerContext} from 'src/contexts/audio-player-context';
+import {usePlayerContext} from 'src/contexts/player-context';
 import {WebGlComponent} from 'src/modules/player/components/artwork/web-gl.component';
 
 import {PlayPauseButtonComponent} from './components/play-pause-button/play-pause-button.component';
@@ -37,7 +37,7 @@ export function PlayerModule({title, artwork}: Props) {
   const [ref, {width}] = useMeasure({polyfill: ResizeObserver});
   const imageWidth = useMemo(() => width - p * 4, [width]);
   const playerWidth = useMemo(() => width - p * 6, [width]);
-  const {isReady, setTitle, setArtwork} = useAudioPlayerContext();
+  const {isReady, setTitle, setArtwork} = usePlayerContext();
 
   useEffect(() => {
     setTitle(title);
diff --git a/src/pages/bandcamp/[artist]/[name]/[speed].tsx b/src/pages/bandcamp/[artist]/[name]/[speed].tsx
index 808b289f..cccfd1c7 100644
--- a/src/pages/bandcamp/[artist]/[name]/[speed].tsx
+++ b/src/pages/bandcamp/[artist]/[name]/[speed].tsx
@@ -1,6 +1,5 @@
 import {GetServerSidePropsContext, GetServerSidePropsResult} from 'next';
 import React from 'react';
-import {AudioUrlContextProvider} from 'src/contexts/audio-url-context';
 import {
   PlayerLayout,
   PlayerLayoutProps,
@@ -10,12 +9,8 @@ import {invokeRedirection} from 'src/utils/invoke-redirection/invoke-redirection
 import {validateBandcampId} from 'src/utils/validate-bandcamp-id/validate-bandcamp-id';
 
 export default function BandcampPage(props: PlayerLayoutProps) {
-  return (
-    <AudioUrlContextProvider>
-      {/* eslint-disable-next-line react/jsx-props-no-spreading */}
-      <PlayerLayout {...props} />
-    </AudioUrlContextProvider>
-  );
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return <PlayerLayout {...props} />;
 }
 
 export async function getServerSideProps(
diff --git a/src/pages/soundcloud/[username]/[trackName]/[speed].tsx b/src/pages/soundcloud/[username]/[trackName]/[speed].tsx
index b74b7362..e80498cd 100644
--- a/src/pages/soundcloud/[username]/[trackName]/[speed].tsx
+++ b/src/pages/soundcloud/[username]/[trackName]/[speed].tsx
@@ -1,6 +1,5 @@
 import {GetServerSidePropsContext, GetServerSidePropsResult} from 'next';
 import React from 'react';
-import {AudioUrlContextProvider} from 'src/contexts/audio-url-context';
 import {
   PlayerLayout,
   PlayerLayoutProps,
@@ -10,12 +9,8 @@ import {invokeRedirection} from 'src/utils/invoke-redirection/invoke-redirection
 import {validateSoundcloudId} from 'src/utils/validate-soundcloud-id/validate-soundcloud-id';
 
 export default function SoundcloudPage(props: PlayerLayoutProps) {
-  return (
-    <AudioUrlContextProvider>
-      {/* eslint-disable-next-line react/jsx-props-no-spreading */}
-      <PlayerLayout {...props} />
-    </AudioUrlContextProvider>
-  );
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return <PlayerLayout {...props} />;
 }
 
 export async function getServerSideProps(
diff --git a/src/pages/youtube/[id]/[speed].tsx b/src/pages/youtube/[id]/[speed].tsx
index 3de36352..a0f0fb3f 100644
--- a/src/pages/youtube/[id]/[speed].tsx
+++ b/src/pages/youtube/[id]/[speed].tsx
@@ -1,6 +1,5 @@
 import {GetServerSidePropsContext, GetServerSidePropsResult} from 'next';
 import React from 'react';
-import {AudioUrlContextProvider} from 'src/contexts/audio-url-context';
 import {
   PlayerLayout,
   PlayerLayoutProps,
@@ -10,12 +9,8 @@ import {invokeRedirection} from 'src/utils/invoke-redirection/invoke-redirection
 import {validateYoutubeId} from 'src/utils/validate-youtube-id/validate-youtube-id';
 
 export default function YoutubePage(props: PlayerLayoutProps) {
-  return (
-    <AudioUrlContextProvider>
-      {/* eslint-disable-next-line react/jsx-props-no-spreading */}
-      <PlayerLayout {...props} />
-    </AudioUrlContextProvider>
-  );
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return <PlayerLayout {...props} />;
 }
 
 export async function getServerSideProps(
diff --git a/src/utils/get-provider/get-provider-from-router.ts b/src/utils/get-provider/get-provider-from-router.ts
index 628e63c8..4d5d4171 100644
--- a/src/utils/get-provider/get-provider-from-router.ts
+++ b/src/utils/get-provider/get-provider-from-router.ts
@@ -3,12 +3,9 @@ import {NextRouter} from 'next/router';
 const providers = {
   youtube: 'YouTube',
   soundcloud: 'SoundCloud',
+  bandcamp: 'Bandcamp',
 };
 
-/**
- * Get the provider name from the URL
- * @param router
- */
 export function getProviderFromRouter(router: NextRouter): string {
   return providers[router.pathname.split('/')[1]];
 }