diff --git a/src/App.tsx b/src/App.tsx
index 780ca57e..4e20cb79 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -45,7 +45,6 @@ import { DragDropProvider } from './contexts/DragDropContext';
import TooltipPortal from './components/TooltipPortal';
import ConnectionIndicator from './components/ConnectionIndicator';
import LastfmIndicator from './components/LastfmIndicator';
-import OfflineOverlay from './components/OfflineOverlay';
import OfflineBanner from './components/OfflineBanner';
import OfflineLibrary from './pages/OfflineLibrary';
import Genres from './pages/Genres';
@@ -341,17 +340,10 @@ function AppShell() {
{isQueueVisible ? : }
- {connStatus === 'disconnected' && hasOfflineContent && (
-
+ {connStatus === 'disconnected' && (
+
)}
- {connStatus === 'disconnected' && !hasOfflineContent && (
-
- )}
} />
} />
diff --git a/src/components/OfflineBanner.tsx b/src/components/OfflineBanner.tsx
index 225d98ce..6f08f559 100644
--- a/src/components/OfflineBanner.tsx
+++ b/src/components/OfflineBanner.tsx
@@ -1,18 +1,34 @@
import React from 'react';
-import { WifiOff, RefreshCw } from 'lucide-react';
+import { WifiOff, RefreshCw, Settings } from 'lucide-react';
import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
interface Props {
onRetry: () => void;
isChecking: boolean;
+ showSettingsLink?: boolean;
+ serverName?: string;
}
-export default function OfflineBanner({ onRetry, isChecking }: Props) {
+export default function OfflineBanner({ onRetry, isChecking, showSettingsLink, serverName }: Props) {
const { t } = useTranslation();
+ const navigate = useNavigate();
+ const message = showSettingsLink
+ ? t('connection.offlineNoCacheBanner', { server: serverName })
+ : t('connection.offlineModeBanner');
return (
- {t('connection.offlineModeBanner')}
+ {message}
+ {showSettingsLink && (
+
+ )}