Module: plugin/registry
Classes
Interfaces
Type aliases
AppBarActionType
Ƭ AppBarActionType: HeaderActionType
Defined in
AppLogoType
Ƭ AppLogoType: React.ComponentType
<
AppLogoProps
> | ReactElement
| null
Defined in
components/Sidebar/AppLogo.tsx:16
ClusterChooserType
Ƭ ClusterChooserType: React.ComponentType
<
ClusterChooserProps
> | ReactElement
| null
Defined in
components/cluster/ClusterChooser.tsx:10
DetailsViewHeaderActionType
Ƭ DetailsViewHeaderActionType: HeaderActionType
Defined in
DetailsViewSectionType
Ƭ DetailsViewSectionType: ComponentType
<
DetailsViewSectionProps
> | ReactElement
| null
Defined in
components/DetailsViewSection/DetailsViewSection.tsx:9
sectionFunc
Ƭ sectionFunc: (resource
:
KubeObject
) =>
SectionFuncProps
| null
| undefined
Type declaration
▸ (resource
):
SectionFuncProps
| null
| undefined
deprecated
please used DetailsViewSectionType and registerDetailViewSection
Parameters
Name | Type |
---|---|
resource |
KubeObject
|
Returns
SectionFuncProps
| null
| undefined
Defined in
Functions
registerAppBarAction
▸ registerAppBarAction(headerAction
): void
Add a component into the app bar (at the top of the app).
example
import { registerAppBarAction } from '@kinvolk/headlamp-plugin/lib';
import { Button } from '@material-ui/core';
function ConsoleLogger() {
return (
<Button
onClick={() => {
console.log('Hello from ConsoleLogger!')
}}
>
Print Log
</Button>
);
}
registerAppBarAction(ConsoleLogger);
Parameters
Name | Type | Description |
---|---|---|
headerAction |
HeaderActionType |
The action (link) to put in the app bar. |
Returns
void
Defined in
registerAppLogo
▸ registerAppLogo(logo
): void
Add a logo for Headlamp to use instead of the default one.
example
import { registerAppLogo } from '@kinvolk/headlamp-plugin/lib';
registerAppLogo(<p>my logo</p>)
More complete logo example in plugins/examples/change-logo:
Parameters
Name | Type | Description |
---|---|---|
logo |
AppLogoType
|
is a React Component that takes two required props logoType which is a constant string literal that accepts either of the two values small or large depending on whether the sidebar is in shrink or expanded state so that you can change your logo from small to large and the other optional prop is the themeName which is a string with two values ‘light’ and ‘dark’ base on which theme is selected. |
Returns
void
Defined in
registerClusterChooser
▸ registerClusterChooser(chooser
): void
Use a custom cluster chooser button
example
import { ClusterChooserProps, registerClusterChooser } from '@kinvolk/headlamp-plugin/lib';
registerClusterChooser(({ clickHandler, cluster }: ClusterChooserProps) => {
return <button onClick={clickHandler}>my chooser Current cluster: {cluster}</button>;
})
Parameters
Name | Type | Description |
---|---|---|
chooser |
ClusterChooserType
|
is a React Component that takes one required props clickHandler which is the action handler that happens when the custom chooser button component click event occurs |
Returns
void
Defined in
registerDetailsViewHeaderAction
▸ registerDetailsViewHeaderAction(headerAction
): void
Add a component into the details view header.
example
import { ActionButton } from '@kinvolk/headlamp-plugin/lib/CommonComponents';
import { registerDetailsViewHeaderAction } from '@kinvolk/headlamp-plugin/lib';
function IconAction() {
return (
<ActionButton
description="Launch"
icon="mdi:comment-quote"
onClick={() => console.log('Hello from IconAction!')}
/>
)
}
registerDetailsViewHeaderAction(IconAction);
Parameters
Name | Type | Description |
---|---|---|
headerAction |
HeaderActionType |
The action (link) to put in the app bar. |
Returns
void
Defined in
registerDetailsViewSection
▸ registerDetailsViewSection(viewSection
): void
Append a component to the details view for a given resource.
example
import {
registerDetailsViewSection,
DetailsViewSectionProps
} from '@kinvolk/headlamp-plugin/lib';
registerDetailsViewSection(({ resource }: DetailsViewSectionProps) => {
if (resource.kind === 'Pod') {
return (
<SectionBox title="A very fine section title">
The body of our Section for {resource.kind}
</SectionBox>
);
}
return null;
});
Parameters
Name | Type | Description |
---|---|---|
viewSection |
DetailsViewSectionType
|
The section to add on different view screens. |
Returns
void
Defined in
registerRoute
▸ registerRoute(routeSpec
): void
Add a Route for a component.
example
import { registerRoute } from '@kinvolk/headlamp-plugin/lib';
// Add a route that will display the given component and select
// the "traces" sidebar item.
registerRoute({
path: '/traces',
sidebar: 'traces',
component: () => <TraceList />
});
see
Route examples
see
Sidebar Example
Parameters
Name | Type | Description |
---|---|---|
routeSpec |
Route
|
details of URL, highlighted sidebar and component to use. |
Returns
void
Defined in
registerRouteFilter
▸ registerRouteFilter(filterFunc
): void
Remove routes.
example
import { registerRouteFilter } from '@kinvolk/headlamp-plugin/lib';
registerRouteFilter(route => (route.path === '/workloads' ? null : route));
Parameters
Name | Type | Description |
---|---|---|
filterFunc |
(entry :
Route
) => null |
Route
|
a function for filtering routes. |
Returns
void
Defined in
registerSidebarEntry
▸ registerSidebarEntry(__namedParameters
): void
Add a Sidebar Entry to the menu (on the left side of Headlamp).
example
import { registerSidebarEntry } from '@kinvolk/headlamp-plugin/lib';
registerSidebarEntry({ parent: 'cluster', name: 'traces', label: 'Traces', url: '/traces' });
see
Sidebar Example
Parameters
Name | Type |
---|---|
__namedParameters |
SidebarEntryProps
|
Returns
void
Defined in
registerSidebarEntryFilter
▸ registerSidebarEntryFilter(filterFunc
): void
Remove sidebar menu items.
example
import { registerSidebarEntryFilter } from '@kinvolk/headlamp-plugin/lib';
registerSidebarEntryFilter(entry => (entry.name === 'workloads' ? null : entry));
Parameters
Name | Type | Description |
---|---|---|
filterFunc |
(entry :
SidebarEntryProps
) => null |
SidebarEntryProps
|
a function for filtering sidebar entries. |
Returns
void