import React from "react";
import { ShortPick, ShortPickElement, HeaderSvg, ShortPickHeader, } from "./styled";
// @ts-ignore
import Clock from "./assets/header-clock.svg";
const AlarmClock = () => (React.createElement(HeaderSvg, null,
    React.createElement("use", { xlinkHref: `#${Clock.id}` })));
const MINUTE = 60;
const HOUR = MINUTE * 60;
const PRESET_RANGES = [
    ["Last 5 minutes", -5 * MINUTE],
    ["Last 15 minutes", -15 * MINUTE],
    ["Last 30 minutes", -30 * MINUTE],
    ["Last 2 hours", -2 * HOUR],
    ["Last 6 hours", -6 * HOUR],
    ["Last 12 hours", -12 * HOUR],
];
export const ShortPickArea = (props) => {
    const { handleDatesChange, selectedStart, tagging } = props;
    function applyChanges(alias, timeCorrection) {
        return () => {
            handleDatesChange({
                startDate: timeCorrection,
                endDate: 0,
            });
        };
    }
    return (React.createElement(ShortPick, null,
        React.createElement(ShortPickHeader, null,
            React.createElement(AlarmClock, null),
            "\u00A0 Quick Selector"),
        PRESET_RANGES.map(([text, time]) => (React.createElement(ShortPickElement, { key: time, onClick: applyChanges(text, time), isSelected: time === selectedStart, "data-testid": `date-picker::click-quick-selector::${tagging}::${-time}` }, text)))));
};
//# sourceMappingURL=short-pick.js.map