godaddy / warehouse.ai-ui

UI for warehouse.ai

warehouse.ai-ui

UI for Warehouse.ai. Visual representation of your builds and status events. For convenience, a CLI also exists for Warehouse.ai.

Install

git clone [email protected]:godaddy/warehouse.ai-ui.git
cd warehouse.ai-ui && npm install

Usage

The module provides a bin/server script that starts the UI. Run the UI with npm.

npm start

The client-side bundle already comes packaged with this npm module, but if you need to re-build the assets, for whatever reason, you can do so as follows:

npm run build

API

GraphQL API

Warehouse UI is backed by a GraphQL API. This API transforms the data from the existing warehouse API to a model that is specific to this UI. The GraphQL models are based on warehouse-models and warehouse.ai-status-models. Refer to those schemas for a data reference and properties that are available.

Libraries used

The service mostly uses the reference JS implementation of GraphQL with some Apollo utilities.

• express-graphql (An express middleware for creating the GraphQL API, and exposes GraphiQL outside of production).
• graphql-tools (graphql-tools is used for makeExecutableSchema. This allows the schema to be defined in the GraphQL schema language and then easily combined with the resolver map).

For the client we use apollo-client. This enables SSR and client caching without needing any schema changes.

Configuration

At a minimum you, must provide that path where which warehouse.ai-ui can find your configuration. Because this is largely a wrapper around slay, the configuration directory must take the exact same form. Example config files can be found in /lib/config. Additionally, the configuration files should include configuration information for the warehouse.ai-api-client. This information should be under the wrhs key in the config.

const WrhsAiUI = require('warehouse.ai-ui');
const configPath = '/path/to/config/files';

WrhsAiUI({ configPath }, (err, app) => {
  if (err) { throw err; }
  app.log.info(`Listening on ${app.config.get('http')}`);
});

In addition, you can provide authorization and authentication configuration via the auth and routing parameters, which let you define anything else that you would need to secure your UI.

const WrhsAiUI = require('warehouse.ai-ui');

function isLoggedIn (req, res, next) => {
  if (req.secretIdentity !== 'Bruce Wayne') {
    res.redirect('/', 401);
  } else {
    next();
  }
}

function addAdditionalRoutes(app) {
  app.get('/faq', (res, res) => res.send('idk Google it'));
}

const options = {
  auth: isLoggedIn,
  routing: addAdditionalRoutes,
  configPath: '/path/to/config/files'
};

WrhsAiUI(options, err => {
  if (err) throw err;
  app.log.info(`Listening on ${wrhsUI.config.get('http')}`);
});

Test

npm test

warehouse.ai-ui's Issues

Verify accuracy of `README`

Acceptance Criteria:

• Ensure that the README is still accurate and covers all functionality
• Includes links back to warehouse docs/diagrams
• Includes links to relevant repos (e.g. carpenterd-worker should link to workers-factory, probably bffs, etc.)
• Readme is updated or new issues are created