I have a react component in an electron app which is kind of like a status section at the bottom of the app. The functionality is to display the current connection status to a MySQL database.

function Connection() {
  return <small>Checking Status...</small>;
}

export default Connection;

Above is the basic version of the functional component. I was wondering if anyone knows if there is a way where I can make a normal js file where I connect to the database and display the connection status or should I use state for this section. Ideally, I want the status to be updated right when the app loads so I was wondering if that should be done using the preload file. If I go with this method, how would I go about modifying the functional component above with the status of the preload?

Thanks