@keycloakify/keycloak-admin-ui/clients/authorization/policy/Time.js

Repackaged Keycloak Admin UI

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { DatePicker, Flex, FlexItem, FormGroup, NumberInput, Radio, Split, SplitItem, TimePicker, } from "@patternfly/react-core";
import { useState } from "react";
import { FormErrorText, HelpItem } from "../../../ui-shared";
import { useTranslation } from "react-i18next";
import { Controller, useFormContext } from "react-hook-form";
const DATE_TIME_FORMAT = /(\d\d\d\d-\d\d-\d\d)? (\d\d?):(\d\d?)/;
const padDateSegment = (value) => value.toString().padStart(2, "0");
const DateTime = ({ name }) => {
    const { control } = useFormContext();
    const parseDate = (value, date) => {
        if (!date) {
            return value;
        }
        const parts = DATE_TIME_FORMAT.exec(value);
        const parsedDate = [
            date.getFullYear(),
            padDateSegment(date.getMonth() + 1),
            padDateSegment(date.getDate()),
        ].join("-");
        return `${parsedDate} ${parts ? parts[2] : "00"}:${parts ? parts[3] : "00"}:00`;
    };
    const parseTime = (value, hour, minute) => {
        const parts = DATE_TIME_FORMAT.exec(value);
        if (minute !== undefined && minute !== null) {
            return `${parts ? parts[1] : ""} ${hour}:${minute < 10 ? `0${minute}` : minute}:00`;
        }
        return value;
    };
    return (_jsx(Controller, { name: name, defaultValue: "", control: control, rules: { required: true }, render: ({ field }) => {
            const dateTime = field.value.match(DATE_TIME_FORMAT) || [
                "",
                "",
                "0",
                "00",
            ];
            return (_jsxs(Split, { hasGutter: true, id: name, children: [_jsx(SplitItem, { children: _jsx(DatePicker, { value: dateTime[1], onChange: (event, value, date) => {
                                field.onChange(parseDate(field.value, date));
                            } }) }), _jsx(SplitItem, { children: _jsx(TimePicker, { time: `${dateTime[2]}:${dateTime[3]}`, onChange: (event, time, hour, minute) => field.onChange(parseTime(field.value, hour, minute)), is24Hour: true }) })] }));
        } }));
};
const NumberControl = ({ name, min, max }) => {
    const { control } = useFormContext();
    const setValue = (newValue) => Math.min(newValue, max);
    return (_jsx(Controller, { name: name, defaultValue: "", control: control, render: ({ field }) => (_jsx(NumberInput, { id: name, value: field.value, min: min, max: max, onPlus: () => field.onChange(Number(field.value) + 1), onMinus: () => field.onChange(Number(field.value) - 1), onChange: (event) => {
                const newValue = Number(event.currentTarget.value);
                field.onChange(setValue(!isNaN(newValue) ? newValue : 0));
            } })) }));
};
const FromTo = ({ name, ...rest }) => {
    const { t } = useTranslation();
    return (_jsx(FormGroup, { label: t(name), fieldId: name, labelIcon: _jsx(HelpItem, { helpText: t(`${name}Help`), fieldLabelId: name }), children: _jsxs(Split, { hasGutter: true, children: [_jsx(SplitItem, { children: _jsx(NumberControl, { name: name, ...rest }) }), _jsx(SplitItem, { children: t("to") }), _jsx(SplitItem, { children: _jsx(NumberControl, { name: `${name}End`, ...rest }) })] }) }));
};
export const Time = () => {
    const { t } = useTranslation();
    const { getValues, formState: { errors }, } = useFormContext();
    const [repeat, setRepeat] = useState(getValues("month"));
    return (_jsxs(_Fragment, { children: [_jsx(FormGroup, { label: t("repeat"), fieldId: "repeat", labelIcon: _jsx(HelpItem, { helpText: t("repeatHelp"), fieldLabelId: "repeat" }), children: _jsxs(Flex, { children: [_jsx(FlexItem, { children: _jsx(Radio, { id: "notRepeat", "data-testid": "notRepeat", isChecked: !repeat, name: "repeat", onChange: () => setRepeat(false), label: t("notRepeat"), className: "pf-v5-u-mb-md" }) }), _jsx(FlexItem, { children: _jsx(Radio, { id: "repeat", "data-testid": "repeat", isChecked: repeat, name: "repeat", onChange: () => setRepeat(true), label: t("repeat"), className: "pf-v5-u-mb-md" }) })] }) }), repeat && (_jsxs(_Fragment, { children: [_jsx(FromTo, { name: "month", min: 1, max: 12 }), _jsx(FromTo, { name: "dayMonth", min: 1, max: 31 }), _jsx(FromTo, { name: "hour", min: 0, max: 23 }), _jsx(FromTo, { name: "minute", min: 0, max: 59 })] })), _jsxs(FormGroup, { label: t("startTime"), fieldId: "notBefore", labelIcon: _jsx(HelpItem, { helpText: t("startTimeHelp"), fieldLabelId: "startTime" }), isRequired: true, children: [_jsx(DateTime, { name: "notBefore" }), errors.notBefore && _jsx(FormErrorText, { message: t("required") })] }), _jsxs(FormGroup, { label: t("expireTime"), fieldId: "notOnOrAfter", labelIcon: _jsx(HelpItem, { helpText: t("expireTimeHelp"), fieldLabelId: "expireTime" }), isRequired: true, children: [_jsx(DateTime, { name: "notOnOrAfter" }), errors.notOnOrAfter && _jsx(FormErrorText, { message: t("required") })] })] }));
};
//# sourceMappingURL=Time.js.map