import React from "react";
import InputWithDropDown from "../../../../../ui/inputs/InputWithDropDown";

interface TravelActionProps {
    loadCapacity: {
        value: string;
        min: number;
        max: number;
        defaultValue: string;
        onChange: (value: string) => void;
    };
    unloadDuration: {
        value: string;
        min: number;
        max: number;
        defaultValue: string;
        onChange: (value: string) => void;
    };
    clearPoints: () => void;
}

const TravelAction: React.FC<TravelActionProps> = ({
    loadCapacity,
    unloadDuration,
    clearPoints,
}) => {
    return (
        <>
            <InputWithDropDown
                label="Load Capacity"
                value={loadCapacity.value}
                min={loadCapacity.min}
                max={loadCapacity.max}
                defaultValue={loadCapacity.defaultValue}
                step={1}
                activeOption="unit"
                onClick={() => { }}
                onChange={loadCapacity.onChange}
            />
            <InputWithDropDown
                label="Unload Duration"
                value={unloadDuration.value}
                min={unloadDuration.min}
                max={unloadDuration.max}
                defaultValue={unloadDuration.defaultValue}
                step={0.1}
                activeOption="s"
                onClick={() => { }}
                onChange={unloadDuration.onChange}
            />
            <div className="selected-actions-list">
                <div className="value-field-container">
                    <div className="label">Reset</div>
                    <button
                        id="rest-button"
                        type="button"
                        className="regularDropdown-container"
                        onClick={() => {
                            clearPoints();
                        }}
                    >
                        Clear
                    </button>
                </div>
            </div>
        </>
    );
};

export default TravelAction;
