diff --git a/src/renderer/app.tsx b/src/renderer/app.tsx
index 9ec15f85b..dfaf60e84 100644
--- a/src/renderer/app.tsx
+++ b/src/renderer/app.tsx
@@ -20,6 +20,8 @@ import { useAppTheme } from '/@/renderer/themes/use-app-theme';
 import { sanitizeCss } from '/@/renderer/utils/sanitize';
 import { WebAudio } from '/@/shared/types/types';
 import '/@/shared/styles/global.css';
+import { PlayerProvider } from '/@/renderer/features/player/context/player-context';
+import { AudioPlayers } from '/@/renderer/features/player/components/audio-players';
 
 const ipc = isElectron() ? window.api.ipc : null;
 
@@ -84,7 +86,10 @@ export const App = () => {
                 zIndex={50000}
             />
             <WebAudioContext.Provider value={webAudioProvider}>
-                <AppRouter />
+                <PlayerProvider>
+                    <AudioPlayers />
+                    <AppRouter />
+                </PlayerProvider>
             </WebAudioContext.Provider>
             <IsUpdatedDialog />
         </MantineProvider>
diff --git a/src/renderer/router/app-router.tsx b/src/renderer/router/app-router.tsx
index d4e81186a..60a44aebe 100644
--- a/src/renderer/router/app-router.tsx
+++ b/src/renderer/router/app-router.tsx
@@ -2,8 +2,6 @@ import { lazy, Suspense } from 'react';
 import { HashRouter, Route, Routes } from 'react-router';
 
 import { RouterErrorBoundary } from '/@/renderer/components/error-boundary/router-error-boundary';
-import { AudioPlayers } from '/@/renderer/features/player/components/audio-players';
-import { PlayerProvider } from '/@/renderer/features/player/context/player-context';
 import { AddToPlaylistContextModal } from '/@/renderer/features/playlists/components/add-to-playlist-context-modal';
 import { ShareItemContextModal } from '/@/renderer/features/sharing/components/share-item-context-modal';
 import { ResponsiveLayout } from '/@/renderer/layouts/responsive-layout';
@@ -76,155 +74,147 @@ export const AppRouter = () => {
     const router = (
         <HashRouter>
             <RouterErrorBoundary>
-                <PlayerProvider>
-                    <AudioPlayers />
-                    <ModalsProvider
-                        modals={{
-                            addToPlaylist: AddToPlaylistContextModal,
-                            base: BaseContextModal,
-                            shareItem: ShareItemContextModal,
-                        }}
-                    >
-                        <Routes>
-                            <Route element={<TitlebarOutlet />}>
-                                <Route
-                                    element={<AppOutlet />}
-                                    errorElement={<RouteErrorBoundary />}
-                                >
-                                    <Route element={<ResponsiveLayout />}>
+                <ModalsProvider
+                    modals={{
+                        addToPlaylist: AddToPlaylistContextModal,
+                        base: BaseContextModal,
+                        shareItem: ShareItemContextModal,
+                    }}
+                >
+                    <Routes>
+                        <Route element={<TitlebarOutlet />}>
+                            <Route element={<AppOutlet />} errorElement={<RouteErrorBoundary />}>
+                                <Route element={<ResponsiveLayout />}>
+                                    <Route
+                                        element={<HomeRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        index
+                                    />
+                                    <Route
+                                        element={<HomeRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.HOME}
+                                    />
+                                    <Route
+                                        element={<SearchRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.SEARCH}
+                                    />
+                                    <Route
+                                        element={<SettingsRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.SETTINGS}
+                                    />
+                                    <Route
+                                        element={<NowPlayingRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.NOW_PLAYING}
+                                    />
+                                    <Route path={AppRoute.LIBRARY_GENRES}>
                                         <Route
-                                            element={<HomeRoute />}
+                                            element={<GenreListRoute />}
                                             errorElement={<RouteErrorBoundary />}
                                             index
                                         />
-                                        <Route
-                                            element={<HomeRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.HOME}
-                                        />
-                                        <Route
-                                            element={<SearchRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.SEARCH}
-                                        />
-                                        <Route
-                                            element={<SettingsRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.SETTINGS}
-                                        />
-                                        <Route
-                                            element={<NowPlayingRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.NOW_PLAYING}
-                                        />
-                                        <Route path={AppRoute.LIBRARY_GENRES}>
-                                            <Route
-                                                element={<GenreListRoute />}
-                                                errorElement={<RouteErrorBoundary />}
-                                                index
-                                            />
-                                            <Route
-                                                element={<AlbumListRoute />}
-                                                path={AppRoute.LIBRARY_GENRES_ALBUMS}
-                                            />
-                                            <Route
-                                                element={<SongListRoute />}
-                                                path={AppRoute.LIBRARY_GENRES_SONGS}
-                                            />
-                                        </Route>
                                         <Route
                                             element={<AlbumListRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.LIBRARY_ALBUMS}
-                                        />
-                                        <Route
-                                            element={<AlbumDetailRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.LIBRARY_ALBUMS_DETAIL}
-                                        />
-                                        <Route
-                                            element={<ArtistListRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.LIBRARY_ARTISTS}
-                                        />
-                                        <Route path={AppRoute.LIBRARY_ARTISTS_DETAIL}>
-                                            <Route element={<AlbumArtistDetailRoute />} index />
-                                            <Route
-                                                element={<AlbumListRoute />}
-                                                path={AppRoute.LIBRARY_ARTISTS_DETAIL_DISCOGRAPHY}
-                                            />
-                                            <Route
-                                                element={<SongListRoute />}
-                                                path={AppRoute.LIBRARY_ARTISTS_DETAIL_SONGS}
-                                            />
-                                            <Route
-                                                element={<AlbumArtistDetailTopSongsListRoute />}
-                                                path={AppRoute.LIBRARY_ARTISTS_DETAIL_TOP_SONGS}
-                                            />
-                                        </Route>
-                                        <Route
-                                            element={<DummyAlbumDetailRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.FAKE_LIBRARY_ALBUM_DETAILS}
+                                            path={AppRoute.LIBRARY_GENRES_ALBUMS}
                                         />
                                         <Route
                                             element={<SongListRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.LIBRARY_SONGS}
+                                            path={AppRoute.LIBRARY_GENRES_SONGS}
                                         />
-                                        <Route
-                                            element={<PlaylistListRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.PLAYLISTS}
-                                        />
-                                        <Route
-                                            element={<PlaylistDetailSongListRoute />}
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.PLAYLISTS_DETAIL_SONGS}
-                                        />
-                                        <Route
-                                            errorElement={<RouteErrorBoundary />}
-                                            path={AppRoute.LIBRARY_ALBUM_ARTISTS}
-                                        >
-                                            <Route element={<AlbumArtistListRoute />} index />
-                                            <Route path={AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL}>
-                                                <Route element={<AlbumArtistDetailRoute />} index />
-                                                <Route
-                                                    element={<AlbumListRoute />}
-                                                    path={
-                                                        AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_DISCOGRAPHY
-                                                    }
-                                                />
-                                                <Route
-                                                    element={<SongListRoute />}
-                                                    path={
-                                                        AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_SONGS
-                                                    }
-                                                />
-                                                <Route
-                                                    element={<AlbumArtistDetailTopSongsListRoute />}
-                                                    path={
-                                                        AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_TOP_SONGS
-                                                    }
-                                                />
-                                            </Route>
-                                        </Route>
-                                        <Route element={<InvalidRoute />} path="*" />
                                     </Route>
-                                </Route>
-                            </Route>
-                            <Route element={<TitlebarOutlet />}>
-                                <Route element={<ResponsiveLayout shell />}>
                                     <Route
-                                        element={<ActionRequiredRoute />}
-                                        path={AppRoute.ACTION_REQUIRED}
+                                        element={<AlbumListRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.LIBRARY_ALBUMS}
                                     />
-                                    <Route element={<LoginRoute />} path={AppRoute.LOGIN} />
+                                    <Route
+                                        element={<AlbumDetailRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.LIBRARY_ALBUMS_DETAIL}
+                                    />
+                                    <Route
+                                        element={<ArtistListRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.LIBRARY_ARTISTS}
+                                    />
+                                    <Route path={AppRoute.LIBRARY_ARTISTS_DETAIL}>
+                                        <Route element={<AlbumArtistDetailRoute />} index />
+                                        <Route
+                                            element={<AlbumListRoute />}
+                                            path={AppRoute.LIBRARY_ARTISTS_DETAIL_DISCOGRAPHY}
+                                        />
+                                        <Route
+                                            element={<SongListRoute />}
+                                            path={AppRoute.LIBRARY_ARTISTS_DETAIL_SONGS}
+                                        />
+                                        <Route
+                                            element={<AlbumArtistDetailTopSongsListRoute />}
+                                            path={AppRoute.LIBRARY_ARTISTS_DETAIL_TOP_SONGS}
+                                        />
+                                    </Route>
+                                    <Route
+                                        element={<DummyAlbumDetailRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.FAKE_LIBRARY_ALBUM_DETAILS}
+                                    />
+                                    <Route
+                                        element={<SongListRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.LIBRARY_SONGS}
+                                    />
+                                    <Route
+                                        element={<PlaylistListRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.PLAYLISTS}
+                                    />
+                                    <Route
+                                        element={<PlaylistDetailSongListRoute />}
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.PLAYLISTS_DETAIL_SONGS}
+                                    />
+                                    <Route
+                                        errorElement={<RouteErrorBoundary />}
+                                        path={AppRoute.LIBRARY_ALBUM_ARTISTS}
+                                    >
+                                        <Route element={<AlbumArtistListRoute />} index />
+                                        <Route path={AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL}>
+                                            <Route element={<AlbumArtistDetailRoute />} index />
+                                            <Route
+                                                element={<AlbumListRoute />}
+                                                path={
+                                                    AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_DISCOGRAPHY
+                                                }
+                                            />
+                                            <Route
+                                                element={<SongListRoute />}
+                                                path={AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_SONGS}
+                                            />
+                                            <Route
+                                                element={<AlbumArtistDetailTopSongsListRoute />}
+                                                path={
+                                                    AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_TOP_SONGS
+                                                }
+                                            />
+                                        </Route>
+                                    </Route>
+                                    <Route element={<InvalidRoute />} path="*" />
                                 </Route>
                             </Route>
-                        </Routes>
-                    </ModalsProvider>
-                </PlayerProvider>
+                        </Route>
+                        <Route element={<TitlebarOutlet />}>
+                            <Route element={<ResponsiveLayout shell />}>
+                                <Route
+                                    element={<ActionRequiredRoute />}
+                                    path={AppRoute.ACTION_REQUIRED}
+                                />
+                                <Route element={<LoginRoute />} path={AppRoute.LOGIN} />
+                            </Route>
+                        </Route>
+                    </Routes>
+                </ModalsProvider>
             </RouterErrorBoundary>
         </HashRouter>
     );