81 lines
2.3 KiB
TypeScript
81 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import { useEffect, useState } from 'react';
|
|
import { Minus, Square, X } from 'lucide-react';
|
|
|
|
// Import types from our electron.d.ts file
|
|
declare global {
|
|
interface Window {
|
|
electron?: {
|
|
windowControl: {
|
|
minimize: () => Promise<void>;
|
|
maximize: () => Promise<void>;
|
|
close: () => Promise<void>;
|
|
};
|
|
windowState: {
|
|
onMaximized: (callback: () => void) => void;
|
|
onUnmaximized: (callback: () => void) => void;
|
|
removeMaximizedListener: () => void;
|
|
removeUnmaximizedListener: () => void;
|
|
};
|
|
appInfo: {
|
|
isElectron: boolean;
|
|
version: string;
|
|
};
|
|
};
|
|
}
|
|
}
|
|
|
|
export function WindowControls() {
|
|
const [isElectron, setIsElectron] = useState(false);
|
|
const [isMaximized, setIsMaximized] = useState(false);
|
|
|
|
useEffect(() => {
|
|
// Check if running in Electron
|
|
if (typeof window !== 'undefined' && window.electron) {
|
|
setIsElectron(true);
|
|
|
|
// Set up event listeners for window state
|
|
const maximizedHandler = () => setIsMaximized(true);
|
|
const unmaximizedHandler = () => setIsMaximized(false);
|
|
|
|
window.electron.windowState.onMaximized(maximizedHandler);
|
|
window.electron.windowState.onUnmaximized(unmaximizedHandler);
|
|
|
|
return () => {
|
|
window.electron?.windowState.removeMaximizedListener();
|
|
window.electron?.windowState.removeUnmaximizedListener();
|
|
};
|
|
}
|
|
}, []);
|
|
|
|
if (!isElectron) return null;
|
|
|
|
return (
|
|
<div className="flex -mr-2 items-center">
|
|
<button
|
|
onClick={() => window.electron?.windowControl.minimize()}
|
|
className="px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-700"
|
|
aria-label="Minimize"
|
|
>
|
|
<Minus size={16} />
|
|
</button>
|
|
|
|
<button
|
|
onClick={() => window.electron?.windowControl.maximize()}
|
|
className="px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-700"
|
|
aria-label={isMaximized ? "Restore" : "Maximize"}
|
|
>
|
|
<Square size={16} />
|
|
</button>
|
|
|
|
<button
|
|
onClick={() => window.electron?.windowControl.close()}
|
|
className="px-4 py-2 hover:bg-red-500 dark:hover:bg-red-600"
|
|
aria-label="Close"
|
|
>
|
|
<X size={16} className="hover:text-white" />
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|