components_stale_context_menu.js

import { ContextMenu } from "./context_menu.js"

/**
 * A context menu for stale-segment operations.
 *
 * "Retranscribe with changes" keeps the current edited text and re-aligns word
 * timestamps to it. "Revert and retranscribe" discards edits and runs a fresh
 * Whisper pass, replacing both text and timestamps.
 *
 * @example
 * new StaleContextMenu(event.clientX, event.clientY, {
 *   onRetranscribe:          () => transcriptPanel.retranscribeSegments([idx]),
 *   onRevertAndRetranscribe: () => transcriptPanel.revertAndRetranscribeSegments([idx]),
 *   onDismiss: () => {},
 * });
 */
export class StaleContextMenu extends ContextMenu {
    /**
     * @param {number} x - Preferred left position in viewport pixels.
     * @param {number} y - Preferred top position in viewport pixels.
     * @param {object} options - Options and callback functions for the menu.
     * @param {function(): void} options.onRetranscribe          - Called when "Retranscribe with changes" is clicked.
     * @param {function(): void} options.onRevertAndRetranscribe - Called when "Revert and retranscribe" is clicked.
     * @param {function(): void} [options.onDismiss]             - Called when the menu is dismissed via outside click.
     * @param {{message: string, href: (string|undefined)}|null} [options.info] - Info widget config passed to the base ContextMenu.
     */
    constructor(x, y, { onRetranscribe, onRevertAndRetranscribe, onDismiss, info = { message: 'This segment\'s word timestamps are out of sync with its edited text.', href: '/docs' } } = {}) {
        super('Stale segment', onDismiss, info);

        const controls = document.createElement('div');
        controls.className = 'ctx-controls';

        if (onRetranscribe) {
            controls.appendChild(this.makeItem(
                '⟳', 'Retranscribe with changes', null,
                () => { this.close(); this._onDismiss(); onRetranscribe(); },
            ));
        }

        if (onRevertAndRetranscribe) {
            controls.appendChild(this.makeItem(
                '↺', 'Revert and retranscribe', null,
                () => { this.close(); this._onDismiss(); onRevertAndRetranscribe(); },
            ));
        }

        this.root.appendChild(controls);
        this._mount(x, y);
    }
}