#2658: FormattedTimeRange.jsx

Estructura del código

Hooks utilizados: State, State, Ref, Ref, ClickOutsideHandler, ClickOutsideHandler

Importaciones de: ../../../../utilities/hooks, ./FormattedDateTime, prop-types, react

Tiene PropTypes para: FormattedTimeRange

Código fuente (resumido)

import PropTypes from 'prop-types';
import React from 'react';
import { useClickOutsideHandler } from '../../../../utilities/hooks';
import FormattedDateTime from './FormattedDateTime';

function FormattedTimeRange(
    {
        children,
        from,
        setFrom,
        setTo,
        to,
    },
) {
    const [fromInEditMode, setFromInEditMode] = React.useState(false);
    const [toInEditMode, setToInEditMode] = React.useState(false);

    const fromEditRef = React.useRef(null);
    const toEditRef = React.useRef(null);

    const handleFromClick = () => {
        if (setFrom) {
            setFromInEditMode(true);
        }
    };
    const handleToClick = () => {
        if (setTo) {
            setToInEditMode(true);
        }
    };

    useClickOutsideHandler(fromEditRef, () => setFromInEditMode(false), fromInEditMode);
    useClickOutsideHandler(toEditRef, () => setToInEditMode(false), toInEditMode);

    return (
        <>
            {children}
            <FormattedDateTime
                slot="DESDE"
                date={from}
                onClick={handleFromClick}
            />
            -
            <FormattedDateTime
                slot="HASTA"
                date={to}
                onClick={handleToClick}
            />
        </>
    );
}

FormattedTimeRange.propTypes = {
    from: PropTypes.instanceOf(Date).isRequired,
    to: PropTypes.instanceOf(Date).isRequired,
    children: PropTypes.node,
    setFrom: PropTypes.func,
    setTo: PropTypes.func,
};

export default FormattedTimeRange;

Historial de Git

3685edd6c actualización a react 18 wip
bbd81edc3 es-lint, nuevas versiones de js.
fe961d7e3 #101 implementar filtro mágico de fechas
e87a066b1 eliminar tarea realizada
1a139a08c wip: refactorizar formattedtimerange