diff --git a/src/renderer/features/sidebar/components/sidebar.tsx b/src/renderer/features/sidebar/components/sidebar.tsx
index 3a4c4f589..b85080ef2 100644
--- a/src/renderer/features/sidebar/components/sidebar.tsx
+++ b/src/renderer/features/sidebar/components/sidebar.tsx
@@ -59,6 +59,7 @@ export const Sidebar = () => {
const { sidebarItems } = useGeneralSettings();
const { windowBarStyle } = useWindowSettings();
+ const showImage = useAppStore((state) => state.sidebar.image);
const sidebarItemsWithRoute: SidebarItemType[] = useMemo(() => {
if (!sidebarItems) return [];
@@ -131,17 +132,18 @@ export const Sidebar = () => {
)}
-
-
-
-
+
+
+
+
+ {showImage && }
+
);
};
const SidebarImage = () => {
const { t } = useTranslation();
- const showImage = useAppStore((state) => state.sidebar.image);
const leftWidth = useAppStore((state) => state.sidebar.leftWidth);
const { setSideBar } = useAppStoreActions();
const currentSong = usePlayerSong();
@@ -176,66 +178,58 @@ const SidebarImage = () => {
};
return (
-
- {showImage && (
-
-
- {upsizedImageUrl ? (
-
- ) : (
-
- )}
-
- {
- e.stopPropagation();
- setSideBar({ image: false });
- }}
- opacity={0.8}
- radius="md"
- style={{
- cursor: 'default',
- position: 'absolute',
- right: '1rem',
- top: '1rem',
- }}
- tooltip={{
- label: t('common.collapse', {
- postProcess: 'titleCase',
- }),
- openDelay: 500,
- }}
- />
-
- )}
-
+
+
+ {upsizedImageUrl ? (
+
+ ) : (
+
+ )}
+
+ {
+ e.stopPropagation();
+ setSideBar({ image: false });
+ }}
+ opacity={0.8}
+ radius="md"
+ style={{
+ cursor: 'default',
+ position: 'absolute',
+ right: '1rem',
+ top: '1rem',
+ }}
+ tooltip={{
+ label: t('common.collapse', {
+ postProcess: 'titleCase',
+ }),
+ openDelay: 500,
+ }}
+ />
+
);
};