summaryrefslogtreecommitdiff
path: root/frontend/src/LogComponent.js
diff options
context:
space:
mode:
authorlazydancer <jrpucula@gmail.com>2024-12-22 17:33:11 -0500
committerlazydancer <jrpucula@gmail.com>2024-12-22 17:33:11 -0500
commit2c5b7da8165e3f8b90748e8ced1de0e3e8d52309 (patch)
tree6d6e4e1d0cb0c7ec5e1dff83bfeda4b044258b81 /frontend/src/LogComponent.js
downloadhaul-2c5b7da8165e3f8b90748e8ced1de0e3e8d52309.tar.gz
Initial
Diffstat (limited to 'frontend/src/LogComponent.js')
-rw-r--r--frontend/src/LogComponent.js22
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;