Files
outline/app/hooks/useDesktopTitlebar.ts
Tom Moor cc333637dd Desktop support (#4484)
* Remove home link on desktop app

* Spellcheck, installation toasts, background styling, …

* Add email,slack, auth support

* More desktop style tweaks

* Move redirect to client

* cleanup

* Record desktop usage

* docs

* fix: Selection state in search input when double clicking header
2022-11-27 15:07:48 -08:00

47 lines
1.2 KiB
TypeScript

import * as React from "react";
import Desktop from "~/utils/Desktop";
export const useDesktopTitlebar = () => {
React.useEffect(() => {
if (!Desktop.isElectron()) {
return;
}
const handleDoubleClick = (event: MouseEvent) => {
// Ignore double clicks on interactive elements such as inputs and buttons
if (event.composedPath().some(elementIsInteractive)) {
return;
}
// Ignore if the mouse position is further down than the header height
if (event.clientY > 64) {
return;
}
event.preventDefault();
Desktop.bridge.onTitlebarDoubleClick();
};
window.addEventListener("dblclick", handleDoubleClick);
return () => window.removeEventListener("dblclick", handleDoubleClick);
}, []);
};
/**
* Check if an element is user interactive.
*
* @param target HTML element
* @returns boolean
*/
function elementIsInteractive(target: EventTarget) {
return (
target &&
target instanceof HTMLElement &&
(target instanceof HTMLSelectElement ||
target instanceof HTMLInputElement ||
target instanceof HTMLButtonElement ||
target.getAttribute("role") === "button" ||
target.getAttribute("role") === "textarea")
);
}