'use client';

import React, { useState } from 'react';
import { Status } from '@theorchard/suite-components';

import RunTimerTooltip from 'src/components/shared/run-timer-tooltip';

type StatusVariant = 'loading' | 'warning' | 'error';

export interface RunTimerWithStatusProps {
    avgRunTime: number;
    p95RunningTime: number;
    displayText?: string;
    tooltipLocation?: 'top' | 'right' | 'bottom' | 'left';
    testId?: string;
}

export const RunTimerWithStatus: React.FC<RunTimerWithStatusProps> = ({
    avgRunTime,
    p95RunningTime,
    displayText = '',
    tooltipLocation = 'top',
    testId = 'RunTimerWithStatus',
}) => {
    const [variant, setVariant] = useState<StatusVariant>('loading');

    const handleTimerProgress = (progress: number) => {
        if (!p95RunningTime || !avgRunTime) {
            return;
        }

        if (progress >= p95RunningTime && variant !== 'error') {
            setVariant('error');
            return;
        }

        if (progress >= avgRunTime && variant !== 'warning') {
            setVariant('warning');
            return;
        }
    };

    return (
        <RunTimerTooltip
            avgRunTime={avgRunTime}
            p95RunningTime={p95RunningTime}
            tooltipLocation={tooltipLocation}
            testId={testId}
            onProgress={handleTimerProgress}
        >
            <Status text={displayText} filled variant={variant} />
        </RunTimerTooltip>
    );
};

export default RunTimerWithStatus;