diff options
| author | lazydancer <jrpucula@gmail.com> | 2024-12-22 17:33:11 -0500 |
|---|---|---|
| committer | lazydancer <jrpucula@gmail.com> | 2024-12-22 17:33:11 -0500 |
| commit | 2c5b7da8165e3f8b90748e8ced1de0e3e8d52309 (patch) | |
| tree | 6d6e4e1d0cb0c7ec5e1dff83bfeda4b044258b81 /frontend/src/LogComponent.js | |
| download | haul-2c5b7da8165e3f8b90748e8ced1de0e3e8d52309.tar.gz | |
Initial
Diffstat (limited to 'frontend/src/LogComponent.js')
| -rw-r--r-- | frontend/src/LogComponent.js | 22 |
1 files changed, 22 insertions, 0 deletions
diff --git a/frontend/src/LogComponent.js b/frontend/src/LogComponent.js new file mode 100644 index 0000000..1c6900f --- /dev/null +++ b/frontend/src/LogComponent.js @@ -0,0 +1,22 @@ +import React, { useEffect, useRef } from 'react'; + +const LogComponent = ({ messages }) => { + const endOfMessagesRef = useRef(null); + + useEffect(() => { + endOfMessagesRef.current?.scrollIntoView({ behavior: "smooth" }); + }, [messages]); + + return ( + <div className="text-white p-4 font-mono h-full overflow-auto text-sm"> + {messages.map((message, index) => ( + <div key={index} className="text-left mb-1"> + {message} + </div> + ))} + <div ref={endOfMessagesRef} /> + </div> + ); +}; + +export default LogComponent; |
