59 Zeilen
2.1 KiB
TypeScript
59 Zeilen
2.1 KiB
TypeScript
import { useState, useEffect } from 'react'
|
|
|
|
export default function WindowControls() {
|
|
const [isMaximized, setIsMaximized] = useState(false)
|
|
|
|
useEffect(() => {
|
|
if (window.electronAPI) {
|
|
window.electronAPI.onWindowMaximized(() => setIsMaximized(true))
|
|
window.electronAPI.onWindowUnmaximized(() => setIsMaximized(false))
|
|
|
|
return () => {
|
|
window.electronAPI?.removeAllListeners('window-maximized')
|
|
window.electronAPI?.removeAllListeners('window-unmaximized')
|
|
}
|
|
}
|
|
}, [])
|
|
|
|
if (!window.electronAPI || process.platform !== 'win32') {
|
|
return null
|
|
}
|
|
|
|
return (
|
|
<div className="absolute top-0 right-0 flex h-8 -webkit-app-region-no-drag">
|
|
<button
|
|
onClick={() => window.electronAPI?.minimize()}
|
|
className="px-4 hover:bg-border-default dark:hover:bg-dark-border transition-colors"
|
|
aria-label="Minimize"
|
|
>
|
|
<svg className="w-3 h-3" fill="currentColor" viewBox="0 0 12 12">
|
|
<rect y="5" width="12" height="2" />
|
|
</svg>
|
|
</button>
|
|
<button
|
|
onClick={() => window.electronAPI?.maximize()}
|
|
className="px-4 hover:bg-border-default dark:hover:bg-dark-border transition-colors"
|
|
aria-label={isMaximized ? 'Restore' : 'Maximize'}
|
|
>
|
|
{isMaximized ? (
|
|
<svg className="w-3 h-3" fill="currentColor" viewBox="0 0 12 12">
|
|
<path d="M2 0v2H0v10h10V10h2V0H2zm8 10H2V4h8v6zm0-8H4V2h6v6h0v-6z" />
|
|
</svg>
|
|
) : (
|
|
<svg className="w-3 h-3" fill="currentColor" viewBox="0 0 12 12">
|
|
<rect width="12" height="12" strokeWidth="2" fill="none" stroke="currentColor" />
|
|
</svg>
|
|
)}
|
|
</button>
|
|
<button
|
|
onClick={() => window.electronAPI?.close()}
|
|
className="px-4 hover:bg-error-bg hover:text-error dark:hover:bg-dark-error transition-colors"
|
|
aria-label="Close"
|
|
>
|
|
<svg className="w-3 h-3" fill="currentColor" viewBox="0 0 12 12">
|
|
<path d="M1.41 0L6 4.59 10.59 0 12 1.41 7.41 6 12 10.59 10.59 12 6 7.41 1.41 12 0 10.59 4.59 6 0 1.41 1.41 0z" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
)
|
|
} |