src/components/buttons/LockToggle.tsx - develop - GEOSHEV/StudLab

src/components/buttons/LockToggle.tsx

63 строки2 KB

George

Обновил: Линтер по всем файлам

21 мар 2025, 14:25

21 мар 2025, 14:252b503d4

import { useState } from 'react';
import { useReservoirs } from '../../context/useReservoirs';
import ConfirmModal from '../modals/ConfirmModal';
import './LockToggle.css';

interface LockToggleProps {
    isLocked: boolean;
    reservoirId: number;
}

function LockToggle({ isLocked, reservoirId }: LockToggleProps) {
    const { toggleLock } = useReservoirs();
    const [isModalOpen, setIsModalOpen] = useState(false);

    const handleToggle = () => {
        if (!isLocked) {
            setIsModalOpen(true);
        } else {
            toggleLock(reservoirId);
        }
    };

    const handleConfirm = () => {
        toggleLock(reservoirId);
        setIsModalOpen(false);
    };

    return (
        <>
            <div className="switch-lock-container">
                <div className="icon-box">
                    <img
                        className="icon"
                        src="./src/assets/lock-icon.svg"
                        alt="Lock Icon"
                    />
                </div>
                <span className="lock-status">
                    {isLocked
                        ? 'Резервуар заблокирован'
                        : 'Резервуар не заблокирован'}
                </span>
                <label className="switch">
                    <input
                        type="checkbox"
                        checked={isLocked}
                        onChange={handleToggle}
                    />
                    <span className="slider round"></span>
                </label>
            </div>

            <ConfirmModal
                isOpen={isModalOpen}
                onClose={() => setIsModalOpen(false)}
                onConfirm={handleConfirm}
                message="Вы действительно хотите заблокировать резервуар?"
            />
        </>
    );
}

export default LockToggle;