Improve Log by making time and log level visible without clicking.

[bmunkholm]

Describe the solution you'd like
When viewing the Log I would like to see the "level" and time without having to expand the "context".

In the above example I have many log entries from 01/02/2019 with no time. If I should see the time, I have to click each and every "context", which is cumbersome.
It would be fine if the time was just with h:m:s resolution, and that a hover popup could should the millisec if needed.

I would also like to see the "level" of the message so I can see what's important. E.g. errors.
It would also be nice to color the logs according to severity. Errors could be red, Warnings yellow, etc.

Describe alternatives you've considered
None.

Additional context
None.

[kraenhansen]

Regarding the resolution used on the timestamp

I agree that we could include the hour, minute and second in the timestamp badge when it's not recent. Did you notice that a hover on the time badge does in fact show the exact timestamp?

Regarding the log level

The level is indicated by the left-most icon: In this case a filled circle for "detail". The icons are introduced / explained when you select the log level. When you hover the icon on the message you get the level as text. Messages are in-fact being colored according to their levels. Light-gray in the case of a detailed message in this case.

What you are seeing is ROS logging a Realm JS client log leveled "error" on the "detail" log level of the logger in ROS: https://github.com/realm/realm-object-server-private/blob/master/src/Server.ts#L380-L389, since https://github.com/realm/realm-object-server-private/pull/612 ROS client errors are logged on the detail level when re-logged at the ROS level.

[bmunkholm]

Did you notice that a hover on the time badge does in fact show the exact timestamp?

Ha! I actually tried - but apparently, I gave up too quickly! Perhaps the hover time should be lower?

The level is indicated by the left-most icon

Hmm - I didn't notice :-) Dumb user test success!
What I did notice was that two logs was shown with "error" and "info" in the context object:

After "context", why do we write "Object"?
What is the "context"? Should it just be named "details:"

[kraenhansen]

We're using https://www.npmjs.com/package/react-object-inspector to show the context objects. I remember playing around with passing different things to the component, perhaps we can tweak it a bit more, but the "Object" comes from that.

[kraenhansen]

The time from hovering to the tooltip appears is not configurable when using the browsers builtin tooltips (via the title attribute). We could however change over to use Reactstrap tooltips instead.

[kraenhansen]

I suggest we change the timestamp to always include the hour, minute and second. I will also look into how the context: Object can be hidden.