Log Viewer

Displays structured application logs with filtering by level.

Preview · Log Viewer

Code

HTML · @primus/ui-core

<div class="table" style="font-size:0.8rem">
  <table>
    <thead><tr><th>Time</th><th>Level</th><th>Message</th></tr></thead>
    <tbody>
      <tr><td style="color:var(--muted-foreground)">14:23:01</td><td><span class="badge success">INFO</span></td><td>Tenant Acme Corp authenticated</td></tr>
      <tr><td style="color:var(--muted-foreground)">14:23:05</td><td><span class="badge warning">WARN</span></td><td>Rate limit approaching for Globex</td></tr>
      <tr><td style="color:var(--muted-foreground)">14:23:09</td><td><span class="badge danger">ERROR</span></td><td>DB connection timeout on shard 2</td></tr>
    </tbody>
  </table>
</div>

React

import { LogViewer } from 'primus-react-ui';

<LogViewer apiUrl="https://api.yourdomain.com" />

Angular

<primus-log-viewer [apiUrl]="'https://api.yourdomain.com'"></primus-log-viewer>

Props

Prop	Type	Default	Description
apiUrl	string	—	API base URL

Version history

See the Changelog for version history and breaking changes.