EN · DE · RU · FR · ES

#2716: CalendarEventTooltip.jsx

projectforge-webapp/src/containers/panel/calendar/CalendarEventTooltip.jsx Type : JavaScript/React · Rôle : Calendrier · Source : projectforge-webapp/src/containers/panel/calendar/CalendarEventTooltip.jsx 49 lignes · 42 code · 3 commentaires · 4 vides
Composant React de calendrier affichant les événements avec des infobulles, la navigation et l'intégration avec le calendrier d'équipe.

Structure du code

Importations depuis : ../../../components/design, ./CalendarEventTooltip.module.scss, classnames, prop-types, react, reactstrap

Possède PropTypes pour : CalendarEventTooltip

Utilise les modules CSS pour le style.

Code source (abrégé)

import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { CardFooter } from 'reactstrap';
import styles from './CalendarEventTooltip.module.scss';
import { CardHeader, CardBody } from '../../../components/design';

function CalendarEventTooltip({ forwardRef, event = null }) {
    const extendedProps = event?.extendedProps;
    const tooltip = extendedProps?.tooltip;

    return (
        <div
            ref={forwardRef}
            className={classNames('card', styles.eventTooltip, !event && styles.hidden)}
        >
            {tooltip?.title && (
                <CardHeader>
                    <b>{tooltip?.title}</b>
                </CardHeader>
            ) }
            <CardBody>
                <div
                    /* eslint-disable-next-line react/no-danger */
                    dangerouslySetInnerHTML={{ __html: tooltip?.text }}
                />
            </CardBody>
            {extendedProps?.duration && (
                <CardFooter>
                    {extendedProps?.duration}
                </CardFooter>
            )}
        </div>
    );
}

CalendarEventTooltip.propTypes = {
    forwardRef: PropTypes.oneOfType([
        // Soit une fonction
        PropTypes.func,
        // Soit l'instance d'un élément DOM natif (voir la note sur SSR)
        PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
    ]).isRequired,
    event: PropTypes.shape({
        extendedProps: PropTypes.shape({}),
    }),
};

export default CalendarEventTooltip;

Historique Git

958c2f0ff jsx : corrections d'avertissements eslint.
3685edd6c migration vers React 18 wip
31d46c691 React : PropTypes
c47405865 Bouton : Marqué comme supprimé -> Supprimer.
3ea4ecb63 React : PropTypes corrigé, urlParams -> urlparams