import React, { useContext } from "react";
import { actions } from "../../../platform/services/window/modules/actions";
import { WindowNameContext } from "./WindowTitleBarContext";
import { useDispatch, useSelector } from "react-redux";
/**
 * Note: The AOT icon will flash briefly when dragging tabs into a window that the icon enabled. This is because
 * FEA's bringToFront action is actually implemented as alwaysOnTop(true);alwaysOnTop(false);. Dragging the tab
 * causes the window to be brought to front, which causes aot to be momentarily enabled, which causes the icon
 * to briefly reflect that state by being highlighted. See FEA for the reasons why bringToFront is implemented that way.
 */
export const AlwaysOnTopButton = () => {
    var _a, _b;
    const dispatch = useDispatch();
    const state = useSelector((currentState) => currentState);
    const windowName = useContext(WindowNameContext);
    const showAlwaysOnTopButton = !!(windowName ? (_a = state.windows[windowName]) === null || _a === void 0 ? void 0 : _a.showAlwaysOnTopButton : true);
    const isAlwaysOnTop = !!(windowName ? (_b = state.windows[windowName]) === null || _b === void 0 ? void 0 : _b.alwaysOnTop : false);
    if (!showAlwaysOnTopButton)
        return React.createElement(React.Fragment, null);
    const setAlwaysOnTop = () => {
        dispatch(actions.setAlwaysOnTop({
            toggleState: !isAlwaysOnTop,
        }));
    };
    const classes = `fsbl-icon fsbl-always-on-top${isAlwaysOnTop ? " fsbl-icon-highlighted" : ""}`;
    return (React.createElement("div", { className: classes, id: "fsbl-always-on-top", title: "Always On Top", onClick: setAlwaysOnTop },
        React.createElement("i", { className: "ff-always-on-top" })));
};
//# sourceMappingURL=AlwaysOnTopButton.js.map