Minimal template for writing OpenShift console plugins

by React

OpenShift Console Plugin Template

This project is a minimal template for writing a new OpenShift Console dynamic
plugin. It requires OpenShift 4.10.

Dynamic plugins
allow you to extend the
OpenShift UI
at runtime, adding custom pages and other extensions. It is based on
webpack module federation.
Plugins are registered with console using the ConsolePlugin custom resource
and enabled in the console operator config by a cluster administrator.

Node.js and yarn are required
to build and run the example.

Getting started

After cloning this repo, you should update the plugin metadata such as the
plugin name in the consolePlugin declaration of package.json.

"consolePlugin": {
  "name": "my-plugin",
  "version": "0.0.1",
  "displayName": "My Plugin",
  "description": "Enjoy this siny, new console plugin!",
  "exposedModules": {
    "ExamplePage": "./components/ExamplePage"
  },
  "dependencies": {
    "@console/pluginAPI": "*"
  }
}

The template adds a single example page in the Home navigation section. The
extension is declared in the console-extensions.json
file and the React component is declared in
src/components/ExamplePage.tsx.

You can run the plugin using a local development environment or build an image
to deploy it to a cluster.

Local development

  1. yarn install
  2. yarn run start

The server runs on port 9001 with CORS enabled.

See the plugin development section in
Console Dynamic Plugins README
for details on how to run OpenShift console using local plugins.

When a local console server is running, visit http://localhost:9000/example
to see the example plugin page.

Docker image

Before you can deploy your plugin on a cluster, you must build an image and
push it to an image registry.

  1. Build the image: 
    docker build -t quay.io/my-repositroy/my-plugin:latest .
  2. Run the image: 
    docker run -it --rm -d -p 9001:80 quay.io/my-repository/my-plugin:latest
  3. Push the image: 
    docker push quay.io/my-repository/my-plugin:latest

Deployment on cluster

After pushing an image with your changes to a registry, you can deploy the
plugin to a cluster by instantiating the provided
OpenShift template. It will run a light-weight nginx HTTP
server to serve your plugin’s assets.

oc process -f template.yaml \
  -p PLUGIN_NAME=my-plugin \
  -p NAMESPACE=my-plugin-namespace \
  -p IMAGE=quay.io/my-repository/my-plugin:latest \
  | oc create -f -

PLUGIN_NAME must match the plugin name you used in the consolePlugin
declaration of package.json.

Once deployed, patch the
Console operator
config to enable the plugin.

oc patch consoles.operator.openshift.io cluster \
  --patch '{ "spec": { "plugins": ["my-plugin"] } }' --type=merge

References