EN · DE · RU · FR · ES

#2724 : FavoriteNameInput.jsx

projectforge-webapp/src/containers/panel/favorite/FavoriteNameInput.jsx Type : JavaScript/React · Rôle : Panneau · Source : projectforge-webapp/src/containers/panel/favorite/FavoriteNameInput.jsx 61 lignes · 54 code · 0 commentaires · 7 vides
Composant React de gestion des favoris pour le marquage d'entités et la navigation rapide.

Structure du code

Hooks utilisés : State

Importations depuis : ../../../components/design, @fortawesome/free-solid-svg-icons, prop-types, react

Possède PropTypes pour : FavoriteNameInput

Code source (abrégé)

import { faFolderPlus, faCheckSquare } from '@fortawesome/free-solid-svg-icons';
import PropTypes from 'prop-types';
import React from 'react';
import { Input } from '../../../components/design';

function FavoriteNameInput(
    {
        defaultValue = '',
        id,
        label,
        onSave,
        tooltip,
        rename = false,
        ...props
    },
) {
    const [filterName, setFilterName] = React.useState(defaultValue);

    const handleInputChange = ({ target }) => setFilterName(target.value);

    const handleCreateClick = () => onSave(filterName);

    const handleKeyDown = ({ key }) => {
        if (key === 'Enter') {
            onSave(filterName);
        }
    };
    let icon = faFolderPlus;
    if (rename === true) {
        icon = faCheckSquare;
    }

    return (
        <Input
            label={label}
            icon={icon}
            iconProps={{
                size: 'lg',
                onClick: handleCreateClick,
            }}
            id={id}
            onChange={handleInputChange}
            onKeyDown={handleKeyDown}
            value={filterName}
            tooltip={tooltip}
            {...props}
        />
    );
}

FavoriteNameInput.propTypes = {
    id: PropTypes.string.isRequired,
    label: PropTypes.string.isRequired,
    onSave: PropTypes.func.isRequired,
    rename: PropTypes.bool,
    className: PropTypes.string,
    defaultValue: PropTypes.string,
    tooltip: PropTypes.string,
};

export default FavoriteNameInput;

Historique Git

3685edd6c mise à niveau vers react 18 wip
312b6f07f FavoriteNameInput/Entry : icône modifiée pour le mode édition.
38329872e Favoris améliorés (infobulles ajoutées, icônes améliorées, ...)
253b9f38b mise à jour de certaines dépendances et correction des erreurs eslint
d321a9dcb correction de la grande liste de modèles