"use strict";
/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module ToolSettings
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToolSettingsWidgetContent = exports.ToolSettingsContent = exports.useToolSettingsNode = exports.useHorizontalToolSettingEntries = exports.ToolSettingsDockedContent = exports.WidgetPanelsToolSettings = exports.useShouldRenderDockedToolSettings = void 0;
const core_frontend_1 = require("@itwin/core-frontend");
const React = require("react");
const UiFramework_1 = require("../UiFramework");
const InternalFrontstageManager_1 = require("../frontstage/InternalFrontstageManager");
const LayoutStore_1 = require("../layout/base/LayoutStore");
const Docked_1 = require("../layout/tool-settings/Docked");
const Setting_1 = require("../layout/tool-settings/Setting");
const Content_1 = require("../layout/widget/Content");
require("./ToolSettings.scss");
const useActiveToolId_1 = require("../hooks/useActiveToolId");
const useTranslation_1 = require("../hooks/useTranslation");
const itwinui_react_1 = require("@itwin/itwinui-react");
const DockedBar_1 = require("./DockedBar");
function EmptyToolSettingsLabel({ toolId }) {
    const { translate } = (0, useTranslation_1.useTranslation)();
    const tool = core_frontend_1.IModelApp.tools.find(toolId);
    const toolName = tool?.flyover;
    return (React.createElement(itwinui_react_1.Text, { as: "i", isMuted: true, className: "uifw-toolSettings-label-empty" },
        translate("tools.noToolSettingsStart"),
        toolName || translate("tools.noToolSettingsPlaceholderName"),
        translate("tools.noToolSettingsEnd")));
}
/**
 * Hook that returns true if the tool settings should be rendered docked.
 * @internal */
function useShouldRenderDockedToolSettings() {
    return (0, LayoutStore_1.useLayout)((state) => {
        const toolSettings = state.toolSettings;
        if (!toolSettings || toolSettings.type === "widget")
            return false;
        return !toolSettings.hidden;
    });
}
exports.useShouldRenderDockedToolSettings = useShouldRenderDockedToolSettings;
/** @internal */
function WidgetPanelsToolSettings() {
    if (!useShouldRenderDockedToolSettings())
        return null;
    return React.createElement(ToolSettingsDockedContent, null);
}
exports.WidgetPanelsToolSettings = WidgetPanelsToolSettings;
/** @internal */
function ToolSettingsDockedContent() {
    const activeToolId = (0, useActiveToolId_1.useActiveToolId)();
    const toolSettingEntries = useHorizontalToolSettingEntries();
    const forceRefreshKey = useRefreshKey(toolSettingEntries);
    const emptySettings = React.useMemo(() => [
        {
            editorNode: null,
            labelNode: React.createElement(EmptyToolSettingsLabel, { toolId: activeToolId }),
        },
    ], [activeToolId]);
    const entries = !toolSettingEntries || toolSettingEntries.length === 0
        ? emptySettings
        : toolSettingEntries;
    // for the overflow to work properly each setting in the DockedToolSettings should be wrapped by a DockedToolSetting component
    return (React.createElement(DockedBar_1.DockedBar, { placement: "top" },
        React.createElement(Docked_1.DockedToolSettings, { itemId: InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider?.uniqueId ??
                "none", key: forceRefreshKey }, entries.map((entry, index) => (React.createElement(Setting_1.DockedToolSetting, { key: index },
            entry.labelNode,
            entry.editorNode))))));
}
exports.ToolSettingsDockedContent = ToolSettingsDockedContent;
/** @internal */
function useHorizontalToolSettingEntries() {
    React.useEffect(() => {
        // eslint-disable-next-line deprecation/deprecation
        UiFramework_1.UiFramework.frontstages.activeToolInformation?.toolUiProvider?.reloadPropertiesFromTool();
    }, []);
    const [settings, setSettings] = React.useState(InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider
        ?.horizontalToolSettingNodes);
    React.useEffect(() => {
        return UiFramework_1.UiFramework.frontstages.onToolActivatedEvent.addListener(() => {
            const nodes = InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider
                ?.horizontalToolSettingNodes;
            setSettings(nodes);
        });
    }, []);
    React.useEffect(() => {
        return UiFramework_1.UiFramework.frontstages.onToolSettingsReloadEvent.addListener(() => {
            const nodes = InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider
                ?.horizontalToolSettingNodes;
            setSettings(nodes);
        });
    }, []);
    return settings;
}
exports.useHorizontalToolSettingEntries = useHorizontalToolSettingEntries;
/** @internal */
function useToolSettingsNode() {
    React.useEffect(() => {
        // eslint-disable-next-line deprecation/deprecation
        UiFramework_1.UiFramework.frontstages.activeToolInformation?.toolUiProvider?.reloadPropertiesFromTool();
    }, []);
    const [settings, setSettings] = React.useState(InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider?.toolSettingsNode);
    React.useEffect(() => {
        return UiFramework_1.UiFramework.frontstages.onToolActivatedEvent.addListener(() => {
            const nodes = InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider?.toolSettingsNode;
            setSettings(nodes);
        });
    }, [setSettings]);
    React.useEffect(() => {
        return UiFramework_1.UiFramework.frontstages.onToolSettingsReloadEvent.addListener(() => {
            const nodes = InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider?.toolSettingsNode;
            setSettings(nodes);
        });
    }, [setSettings]);
    return settings;
}
exports.useToolSettingsNode = useToolSettingsNode;
/** @internal */
function ToolSettingsContent() {
    const toolSettingsType = (0, LayoutStore_1.useLayout)((state) => state.toolSettings?.type);
    // This is needed to remount underlying components tree when going into widget state.
    if (!toolSettingsType || toolSettingsType === "docked")
        return null;
    return React.createElement(ToolSettingsWidgetContent, null);
}
exports.ToolSettingsContent = ToolSettingsContent;
/** @internal */
function ToolSettingsWidgetContent() {
    const floatingToolSettingsContainerRef = React.useRef(null);
    const node = useToolSettingsNode();
    const activeToolId = (0, useActiveToolId_1.useActiveToolId)();
    const forceRefreshKey = useRefreshKey(node);
    const providerId = InternalFrontstageManager_1.InternalFrontstageManager.activeToolSettingsProvider?.uniqueId ?? "none";
    return (React.createElement("div", { "data-toolsettings-provider": providerId, className: "uifw-floating-toolSettings-container", ref: floatingToolSettingsContainerRef, key: forceRefreshKey },
        React.createElement(Content_1.ScrollableWidgetContent, null, node ?? React.createElement(EmptyToolSettingsLabel, { toolId: activeToolId }))));
}
exports.ToolSettingsWidgetContent = ToolSettingsWidgetContent;
/**
 * Hook that returns a key that can be used to force refresh the tool settings.
 * @param toolSettingNodes Nodes that are used to determine if the tool settings should be refreshed.
 * @returns a new key if the dependency changes.
 */
function useRefreshKey(toolSettingNodes) {
    const [forceRefreshKey, setForceRefreshKey] = React.useState(Date.now());
    React.useEffect(() => {
        // We cant work with the content of the settings, but we can force refresh when
        // the array is different.
        setForceRefreshKey(Date.now());
    }, [toolSettingNodes]);
    return forceRefreshKey;
}
//# sourceMappingURL=ToolSettings.js.map