mirror of
https://github.com/kilyabin/psysonic.git
synced 2026-07-22 14:35:41 +00:00
fix(offline): replace blocking overlay with slim banner; add server settings link (#170)
When offline with no cached content, the full-screen OfflineOverlay blocked all navigation including Settings, making it impossible to fix a broken server config. Replace it with the same slim banner used in offline-cache mode. - OfflineBanner now handles both cases: cache (existing) and no-cache (new) - No-cache banner shows server name and a direct link to Settings → Server tab - OfflineOverlay component is no longer used (import removed from App.tsx) - All 8 locales: added offlineNoCacheBanner and serverSettings keys Fixes #170 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -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 (
|
||||
<div className="offline-banner">
|
||||
<WifiOff size={14} />
|
||||
<span>{t('connection.offlineModeBanner')}</span>
|
||||
<span>{message}</span>
|
||||
{showSettingsLink && (
|
||||
<button
|
||||
className="offline-banner-retry"
|
||||
onClick={() => navigate('/settings', { state: { tab: 'server' } })}
|
||||
>
|
||||
<Settings size={12} />
|
||||
{t('connection.serverSettings')}
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
className="offline-banner-retry"
|
||||
onClick={onRetry}
|
||||
|
||||
Reference in New Issue
Block a user