
import React,{useEffect,useCallback,useRef} from "react";
import { useSelector } from "react-redux";


const PrintData: React.FC = () => {
    const printData = useSelector((state: any) => state.printData);
    const printDataRef = useRef<HTMLDivElement>(null);

    useEffect(() => {
        scrollToBottom()
    },[printData]);

    const scrollToBottom = useCallback(() => {
        const container = printDataRef.current;
        if (container) {
            container.scrollTop = container.scrollHeight;
            console.log("scrollToBottom",container.scrollTop,container.scrollHeight);
        }
    }, []);
    return (
        <div ref={printDataRef} dangerouslySetInnerHTML={{ __html: printData }}  
        style={{ textAlign: "left",backgroundColor: "white", borderRadius: "10px",height:"100%",overflowY:"auto",padding:10 }}>
        </div>
    );
}

export default PrintData;