Project: Headlamp (Observability and Analysis / Observability)
File: functionality.md

title: Plugins Functionality linktitle: Functionality Headlamp's plugins exist for changing or adding functionality related to the user interface and experience. The `@kinvolk/headlamp-plugin` module ships a library (`@kinvolk/headlamp-plugin/lib`) where all the Headlamp-related development modules can be found. The main ones are: K8s: Kubernetes related functionality Headlamp: To register plugins CommonComponents: React components commonly used in the Headlamp UI Notification: This module contains two exported members one is Notification, a class which can be used to prepare notifications that are accepted by headlamp and the other one is setNotificationsInStore it is a dispatcher function which accepts a notification object prepared from the Notification class and when called it brings the notifications from plugin land to headlamp ecosystem so that headlamp can parse the notification and display it. Router: To get or generate routes Headlamp ships many of the common npm modules that should be shared by both the plugins and Headlamp itself, and includes the config files for editors like VS Code to find them. These are: react @iconify-react react-redux @material-ui/core @material-ui/styles lodash notistack recharts Thus, plugins only need to install dependencies that are not yet provided by Headlamp. Yet, if any dependencies already covered by Headlamp are installed by the plugins, you just need to make sure they are the same version that Headlamp supports, as these will not be bundled when . Particularly, the mentioned modules will be replaced by their version that's included in a global objects called `pluginLib`. Older plugin development guides still asked developers to use e.g. React in the following way `const React = window.pluginLib.React`, but this is no longer needed. The plugin registers makes functionality available to plugins in an easy way. The idea is to make more and more functionality available to

Here is what we have so far: Show a component in the app bar (in the top right) with . Example plugin shows API reference for Change the logo (at the top left) with . Example plugin shows API reference for Add menus when Headlamp is running as an app. Example plugin shows API reference for Change the Cluster Chooser button (in the middle top of the Headlamp app bar) with . Example plugin shows API reference for Show a component to the top right area of a detail view (in the area of the screenshot below that's highlighted as yellow) . Example plugin shows API reference for Change sections in cluster resources' details views with . This allows you to remove, add, update, or shuffle sections within details views, including the back link. Or simply append a component at the bottom of different details views with . Example plugin shows API reference for Set a cluster dynamically, rather than have the backend read it from configuration files. . Example plugin shows API reference for Show a component (in Headlamps main area) at a given URL with . Example plugin shows , and how to remove a route. API reference for API reference for Add sidebar items (menu on the left) with . Remove sidebar items with . Example plugin shows , and also how to remove sidebar items. API reference for API reference for Change what tables across Headlamp show with . This allows you to remove, add, update, or shuffle table columns. Example plugin shows . API reference for Headlamp has the concept of "Headlamp events". Those are fired when something relevant happens in Headlamp. React to Headlamp events with . Example plugin shows . API reference for The plugins can have user configurable settings that can be used to change the behavior of the plugin. The plugin settings can be created using . Example plugin shows