log-viewer/frontend/src/components/app/App.js

30 lines
784 B
JavaScript

import React, { useState } from 'react';
import './App.css';
import EventList from '../eventList/EventList.js';
function App(props) {
const [events, setEvents] = useState(['EventLog']); // initialises Event state
const [sse, setSse] = useState(new EventSource('/events', { withCredentials: true })) // creates eventSource listener in state
sse.onerror = (e) => {
console.error();
sse.close();
}
sse.onmessage = (e) => {
// parses received data from string to JSON
const message = JSON.parse(e.data);
// initialises a new array with updated server-side event array
const newEvents = [...message, ...events];
// sets the updated event array as state
setEvents(newEvents);
};
return <EventList data={events} />
}
export default App;