Wagner UI

This module contains React components and a standalone application to explore metrics recorded by Wagner.

Launching the standalone application

docker run -d --name wagner-ui \
    -p 3000:3000 \
    -e WAGNER_URL=http://localhost:7000/wagner
    quay.io/deix/wagner-ui

If you need to set a custom base path for the web application you can set the env variable WAGNER_UI_BASE_PATH. This variable defaults to /wagner-ui and should contain a leading slash and no trailing slashes. E.g. is WAGNER_UI_BASE_PATH=/wagner-ui, the application will be available at localhost:3000/wagner-ui.

Using the react components

npm install @deix/wagner-ui

To display default page view events:

import { PageViewsPlot } from '@deix/wagner-ui';

export default function MyComponent() {
  return (
    <div>
      <PageViewsPlot
        wagnerUrl={WAGNER_URL}
        groupBy='page' // 'page' or 'user'
        stripHostFromLabels
        ></PageViewsPlot>
    </div>
  );
}

import { ControllablePlot } from '@deix/wagner-ui';

export default function MyComponent() {
  return (
    <div>
      <ControllablePlot
        wagnerUrl={WAGNER_URL}
        groupBy='event_type' // 'event_type' | 'event_value' | 'user'
        // eventValue='' // filter by event value
        // eventType='' // filter by event type
        // user='' // filter by event user
        stripHostFromLabels
        ></ControllablePlot>
    </div>
  );
}