plop/templates/layers/features/editUi/editUi.hbs

import { classNames } from '@/shared/lib/classNames/classNames';
import { Button, ButtonSize, ButtonTheme } from '@/shared/ui/Button';
import { use{{sliceName}}Store } from '../../model/store/use{{sliceName}}Store';
import cls from './Edit{{sliceName}}.module.scss';

interface Edit{{sliceName}}Props {
    className?: string;
    {{sliceName}}Id: number;
}

export const Edit{{sliceName}} = (props: Edit{{sliceName}}Props) => {
    const { className, {{sliceName}}Id } = props;
    const toggleModal = use{{sliceName}}Store((state) => state.toggleModal);
    const changingEditable{{sliceName}} = use{{sliceName}}Store((state) => state.changingEditable{{sliceName}});

    const openEdit{{sliceName}}Form = (id: number) => {
        changingEditable{{sliceName}}(id);
        toggleModal();
    };

    return (
        <Button
            className={classNames(cls.Edit{{sliceName}}, {}, [className])}
            theme={ButtonTheme.PRIMARY}
            size={ButtonSize.S}
            onClick={() => openEdit{{sliceName}}Form({{sliceName}}Id)}
        >
            Изменить
        </Button>
    );
};