"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SequenceInspectorHeaderWithDivider = exports.SequenceInspectorHeader = exports.useSequenceInspectorSourceLocation = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const client_id_1 = require("../../helpers/client-id");
const InlineEditableTitle_1 = require("../InlineEditableTitle");
const InspectorLocationCopy_1 = require("../InspectorLocationCopy");
const InspectorSourceLocation_1 = require("../InspectorSourceLocation");
const use_open_sequence_in_editor_1 = require("../Timeline/use-open-sequence-in-editor");
const use_rename_sequence_1 = require("../Timeline/use-rename-sequence");
const styles_1 = require("./styles");
const useSequenceInspectorSourceLocation = (sequence) => {
    const { canOpenInEditor, openInEditor, originalLocation } = (0, use_open_sequence_in_editor_1.useOpenSequenceInEditor)(sequence);
    const validatedLocation = (0, react_1.useMemo)(() => {
        var _a;
        if (!originalLocation ||
            !originalLocation.source ||
            !originalLocation.line) {
            return null;
        }
        return {
            source: originalLocation.source,
            line: originalLocation.line,
            column: (_a = originalLocation.column) !== null && _a !== void 0 ? _a : 0,
        };
    }, [originalLocation]);
    const openFileLocation = (0, react_1.useCallback)(() => {
        if (!canOpenInEditor) {
            return;
        }
        openInEditor();
    }, [canOpenInEditor, openInEditor]);
    return {
        canOpenInEditor,
        openFileLocation,
        validatedLocation,
    };
};
exports.useSequenceInspectorSourceLocation = useSequenceInspectorSourceLocation;
const SequenceInspectorHeader = ({ sourceLocation, track }) => {
    var _a;
    const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
    const { canRename, displayName, fallbackDisplayName, saveName } = (0, use_rename_sequence_1.useRenameSequence)({
        clientId: previewServerState.type === 'connected'
            ? previewServerState.clientId
            : null,
        nodePathInfo: track.nodePathInfo,
        sequence: track.sequence,
        validatedLocation: sourceLocation.validatedLocation,
    });
    const sequenceDisplayName = displayName || fallbackDisplayName;
    const { documentationLink } = track.sequence;
    const openDocumentationLink = (0, react_1.useCallback)(() => {
        if (!documentationLink) {
            return;
        }
        window.open(documentationLink, '_blank', 'noopener,noreferrer');
    }, [documentationLink]);
    const subtitleStyle = (0, react_1.useMemo)(() => {
        return {
            ...styles_1.sequenceHeaderSubtitle,
            cursor: documentationLink ? 'pointer' : 'default',
        };
    }, [documentationLink]);
    const componentName = (_a = track.sequence.controls) === null || _a === void 0 ? void 0 : _a.componentName;
    const onRename = (0, react_1.useCallback)((newName) => {
        saveName(newName).catch(() => undefined);
    }, [saveName]);
    return (jsx_runtime_1.jsx("div", { style: styles_1.sequenceHeader, children: jsx_runtime_1.jsxs(InspectorLocationCopy_1.InspectorLocationCopy, { location: sourceLocation.validatedLocation, name: componentName !== null && componentName !== void 0 ? componentName : null, children: [
                jsx_runtime_1.jsx("div", { style: styles_1.sequenceHeaderTitle, children: jsx_runtime_1.jsx(InlineEditableTitle_1.InlineEditableTitle, { value: sequenceDisplayName, canRename: canRename, onCommit: onRename }) }), documentationLink ? (jsx_runtime_1.jsx("button", { type: "button", style: subtitleStyle, title: "Open component docs", onClick: openDocumentationLink, children: componentName })) : (jsx_runtime_1.jsx("div", { style: subtitleStyle, children: componentName })), jsx_runtime_1.jsx(InspectorSourceLocation_1.InspectorSourceLocation, { location: sourceLocation.validatedLocation, canOpen: sourceLocation.canOpenInEditor, onOpen: sourceLocation.openFileLocation })
            ] }) }));
};
exports.SequenceInspectorHeader = SequenceInspectorHeader;
const SequenceInspectorHeaderWithDivider = ({ track }) => {
    const sourceLocation = (0, exports.useSequenceInspectorSourceLocation)(track.sequence);
    return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
            jsx_runtime_1.jsx(exports.SequenceInspectorHeader, { sourceLocation: sourceLocation, track: track }), jsx_runtime_1.jsx("div", { style: styles_1.sequenceHeaderDivider })
        ] }));
};
exports.SequenceInspectorHeaderWithDivider = SequenceInspectorHeaderWithDivider;
