diff --git a/src/renderer/features/lyrics/lyrics-actions.tsx b/src/renderer/features/lyrics/lyrics-actions.tsx
index 2020917ec..3f8a77017 100644
--- a/src/renderer/features/lyrics/lyrics-actions.tsx
+++ b/src/renderer/features/lyrics/lyrics-actions.tsx
@@ -36,7 +36,6 @@ export const LyricsActions = ({
onTranslateLyric,
onUpdateOffset,
setIndex,
- settingsKey = 'default',
}: LyricsActionsProps) => {
const { t } = useTranslation();
const currentSong = usePlayerSong();
diff --git a/src/renderer/features/sidebar/components/collapsed-sidebar.module.css b/src/renderer/features/sidebar/components/collapsed-sidebar.module.css
index c123a396f..036a8db79 100644
--- a/src/renderer/features/sidebar/components/collapsed-sidebar.module.css
+++ b/src/renderer/features/sidebar/components/collapsed-sidebar.module.css
@@ -10,3 +10,28 @@
.sidebar-container.linux {
max-height: calc(100vh - 149px);
}
+
+.sidebar-container {
+ position: relative;
+}
+
+.server-selector-container {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: var(--theme-spacing-md);
+ cursor: pointer;
+ background: var(--theme-colors-sidebar-background);
+ border-top: 1px solid var(--theme-colors-sidebar-border);
+}
+
+.server-icon {
+ width: 2rem;
+ height: 2rem;
+ object-fit: cover;
+ border-radius: var(--theme-radius-md);
+}
diff --git a/src/renderer/features/sidebar/components/collapsed-sidebar.tsx b/src/renderer/features/sidebar/components/collapsed-sidebar.tsx
index 7c60adbbf..5d46a4caf 100644
--- a/src/renderer/features/sidebar/components/collapsed-sidebar.tsx
+++ b/src/renderer/features/sidebar/components/collapsed-sidebar.tsx
@@ -6,16 +6,26 @@ import { NavLink, useNavigate } from 'react-router';
import styles from './collapsed-sidebar.module.css';
+import JellyfinLogo from '/@/renderer/features/servers/assets/jellyfin.png';
+import NavidromeLogo from '/@/renderer/features/servers/assets/navidrome.png';
+import OpenSubsonicLogo from '/@/renderer/features/servers/assets/opensubsonic.png';
import { CollapsedSidebarButton } from '/@/renderer/features/sidebar/components/collapsed-sidebar-button';
import { CollapsedSidebarItem } from '/@/renderer/features/sidebar/components/collapsed-sidebar-item';
+import { ServerSelectorItems } from '/@/renderer/features/sidebar/components/server-selector-items';
import { SidebarIcon } from '/@/renderer/features/sidebar/components/sidebar-icon';
import { AppMenu } from '/@/renderer/features/titlebar/components/app-menu';
-import { SidebarItemType, useGeneralSettings, useWindowSettings } from '/@/renderer/store';
+import {
+ SidebarItemType,
+ useCurrentServer,
+ useGeneralSettings,
+ useWindowSettings,
+} from '/@/renderer/store';
import { DropdownMenu } from '/@/shared/components/dropdown-menu/dropdown-menu';
import { Flex } from '/@/shared/components/flex/flex';
import { Group } from '/@/shared/components/group/group';
import { Icon } from '/@/shared/components/icon/icon';
import { ScrollArea } from '/@/shared/components/scroll-area/scroll-area';
+import { ServerType } from '/@/shared/types/domain-types';
import { Platform } from '/@/shared/types/types';
export const CollapsedSidebar = () => {
@@ -23,6 +33,7 @@ export const CollapsedSidebar = () => {
const navigate = useNavigate();
const { windowBarStyle } = useWindowSettings();
const { sidebarCollapsedNavigation, sidebarItems } = useGeneralSettings();
+ const currentServer = useCurrentServer();
const translatedSidebarItemMap = useMemo(
() => ({
@@ -109,6 +120,27 @@ export const CollapsedSidebar = () => {
/>
))}
+ {currentServer && (
+
+
+
+

+
+
+
+
+
+
+ )}
);
};
diff --git a/src/renderer/router/app-router.tsx b/src/renderer/router/app-router.tsx
index f3518c6c5..d085f52a6 100644
--- a/src/renderer/router/app-router.tsx
+++ b/src/renderer/router/app-router.tsx
@@ -1,6 +1,7 @@
import { lazy, Suspense } from 'react';
import { HashRouter, Route, Routes } from 'react-router';
+import { LyricsSettingsContextModal } from '/@/renderer/features/lyrics/components/lyrics-settings-modal';
import { ShuffleAllContextModal } from '/@/renderer/features/player/components/shuffle-all-modal';
import { AddToPlaylistContextModal } from '/@/renderer/features/playlists/components/add-to-playlist-context-modal';
import { SaveAndReplaceContextModal } from '/@/renderer/features/playlists/components/save-and-replace-context-modal';
@@ -8,7 +9,6 @@ import { UpdatePlaylistContextModal } from '/@/renderer/features/playlists/compo
import { SettingsContextModal } from '/@/renderer/features/settings/components/settings-modal';
import { RouterErrorBoundary } from '/@/renderer/features/shared/components/router-error-boundary';
import { ShareItemContextModal } from '/@/renderer/features/sharing/components/share-item-context-modal';
-import { LyricsSettingsContextModal } from '/@/renderer/features/lyrics/components/lyrics-settings-modal';
import { VisualizerSettingsContextModal } from '/@/renderer/features/visualizer/components/audiomotionanalyzer/visualizer-settings-modal';
import { AuthenticationOutlet } from '/@/renderer/layouts/authentication-outlet';
import { ResponsiveLayout } from '/@/renderer/layouts/responsive-layout';
@@ -94,13 +94,13 @@ export const AppRouter = () => {
modals={{
addToPlaylist: AddToPlaylistContextModal,
base: BaseContextModal,
+ lyricsSettings: LyricsSettingsContextModal,
saveAndReplace: SaveAndReplaceContextModal,
settings: SettingsContextModal,
shareItem: ShareItemContextModal,
shuffleAll: ShuffleAllContextModal,
updatePlaylist: UpdatePlaylistContextModal,
visualizerSettings: VisualizerSettingsContextModal,
- lyricsSettings: LyricsSettingsContextModal,
}}
>