44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import { RefreshCw } from 'lucide-react'
|
|
|
|
export function UpdateBanner({ visible }: { visible: boolean }) {
|
|
if (!visible) return null
|
|
return (
|
|
<div style={{
|
|
position: 'fixed',
|
|
bottom: 0,
|
|
left: 0,
|
|
right: 0,
|
|
zIndex: 9999,
|
|
background: 'var(--sidebar)',
|
|
color: 'var(--text-light)',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
gap: '12px',
|
|
padding: '10px 16px',
|
|
fontSize: '14px',
|
|
boxShadow: '0 -2px 8px rgba(0,0,0,0.3)',
|
|
}}>
|
|
<span>A new version is available.</span>
|
|
<button
|
|
onClick={() => window.location.reload()}
|
|
style={{
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
gap: '6px',
|
|
background: 'var(--accent)',
|
|
color: 'var(--sidebar)',
|
|
border: 'none',
|
|
borderRadius: '4px',
|
|
padding: '6px 14px',
|
|
fontWeight: 600,
|
|
cursor: 'pointer',
|
|
fontSize: '13px',
|
|
}}
|
|
>
|
|
<RefreshCw size={14} strokeWidth={1.75} />
|
|
Reload
|
|
</button>
|
|
</div>
|
|
)
|
|
}
|