useActivePerspectivePerspectiveContextGreenCheckCircleIconRedExclamationCircleIconYellowExclamationTriangleIconBlueInfoCircleIconErrorStatusInfoStatusProgressStatusSuccessStatuscheckAccessuseAccessReviewuseAccessReviewAlloweduseSafetyFirstuseResolvedExtensionsHorizontalNavVirtualizedTableTableDatauseActiveColumnsListPageHeaderListPageCreateListPageCreateLinkListPageCreateButtonListPageCreateDropdownListPageFilteruseListPageFilterResourceLinkuseK8sModeluseK8sModelsuseK8sWatchResourceuseK8sWatchResourcesconsoleFetchconsoleFetchJSONconsoleFetchTextgetConsoleRequestHeadersk8sGetResourcek8sCreateResourcek8sUpdateResourcek8sPatchResourcek8sDeleteResourcek8sListResourcek8sListResourceItemsgetAPIVersionForModelgetGroupVersionKindForResourcegetGroupVersionKindForModelStatusPopupSectionStatusPopupItemOverviewOverviewGridInventoryItemInventoryItemTitleInventoryItemBodyInventoryItemStatusInventoryItemLoadinguseFlagResourceYAMLEditorResourceEventStreamusePrometheusPollTimestamp
Hook that provides the currently active perspective and a callback for setting the active perspective
const Component: React.FC = (props) => {
const [activePerspective, setActivePerspective] = useActivePerspective();
return <select
value={activePerspective}
onChange={(e) => setActivePerspective(e.target.value)}
>
{
// ...perspective options
}
</select>
}A tuple containing the current active perspective and setter callback.
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
Provides information about user access to a given resource.
| Parameter Name | Description |
|---|---|
resourceAttributes |
resource attributes for access review |
impersonate |
impersonation details |
Object with resource access information.
Hook that provides information about user access to a given resource.
| Parameter Name | Description |
|---|---|
resourceAttributes |
resource attributes for access review |
impersonate |
impersonation details |
Array with isAllowed and loading values.
Hook that provides allowed status about user access to a given resource.
| Parameter Name | Description |
|---|---|
resourceAttributes |
resource attributes for access review |
impersonate |
impersonation details |
The isAllowed boolean value.
Hook that ensures a safe asynchronnous setting of React state in case a given component could be unmounted.
(facebook/react#14113)
| Parameter Name | Description |
|---|---|
initialState |
initial state value |
An array with a pair of state value and it's set function.
React hook for consuming Console extensions with resolved CodeRef properties.
This hook accepts the same argument(s) as useExtensions hook and returns an adapted list of extension instances, resolving all code references within each extension's properties.
Initially, the hook returns an empty array. Once the resolution is complete, the React component is re-rendered with the hook returning an adapted list of extensions.
When the list of matching extensions changes, the resolution is restarted. The hook will continue to return the previous result until the resolution completes.
The hook's result elements are guaranteed to be referentially stable across re-renders.
const [navItemExtensions, navItemsResolved] = useResolvedExtensions<NavItem>(isNavItem);
// process adapted extensions and render your component| Parameter Name | Description |
|---|---|
typeGuards |
A list of callbacks that each accept a dynamic plugin extension as an argument and return a boolean flag indicating whether or not the extension meets desired type constraints |
Tuple containing a list of adapted extension instances with resolved code references, a boolean flag indicating whether the resolution is complete, and a list of errors detected during the resolution.
A component that creates a Navigation bar. It takes array of NavPage objects and renderes a NavBar.
Routing is handled as part of the component.
const HomePage: React.FC = (props) => {
const page = {
href: '/home',
name: 'Home',
component: () => <>Home</>
}
return <HorizontalNav match={props.match} pages={[page]} />
}| Parameter Name | Description |
|---|---|
resource |
The resource associated with this Navigation, an object of K8sResourceCommon type |
pages |
An array of page objects |
match |
match object provided by React Router |
For more details please refer the implementation
For more details please refer the implementation
A hook that provides a list of user-selected active TableColumns.
// See implementation for more details on TableColumn type
const [activeColumns, userSettingsLoaded] = useActiveColumns({
columns,
showNamespaceOverride: false,
columnManagementID,
});
return userSettingsAreLoaded ? <VirtualizedTable columns={activeColumns} {...otherProps} /> : null| Parameter Name | Description |
|---|---|
options |
Which are passed as a key-value map |
| `` | options.columns - An array of all available TableColumns |
| `` | options.showNamespaceOverride - (optional) If true, a namespace column will be included, regardless of column management selections |
| `` | options.columnManagementID - (optional) A unique id used to persist and retrieve column management selections to and from user settings. Usually a 'group |
A tuple containing the current user selected active columns (a subset of options.columns), and a boolean flag indicating whether user settings have been loaded.
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
A hook that manages filter state for the ListPageFilter component.
// See implementation for more details on RowFilter and FilterValue types
const [staticData, filteredData, onFilterChange] = useListPageFilter(
data,
rowFilters,
staticFilters,
);
// ListPageFilter updates filter state based on user interaction and resulting filtered data can be rendered in an independent component.
return (
<>
<ListPageHeader .../>
<ListPagBody>
<ListPageFilter data={staticData} onFilterChange={onFilterChange} />
<List data={filteredData} />
</ListPageBody>
</>
)| Parameter Name | Description |
|---|---|
data |
An array of data points |
rowFilters |
(optional) An array of RowFilter elements that define the available filter options |
staticFilters |
(optional) An array of FilterValue elements that are statically applied to the data |
A tuple containing the data filtered by all static filteres, the data filtered by all static and row filters, and a callback that updates rowFilters
Component that creates a link to a specific resource type with an icon badge
<ResourceLink
kind="Pod"
name="testPod"
title={metadata.uid}
/>| Parameter Name | Description |
|---|---|
kind |
(optional) the kind of resource i.e. Pod, Deployment, Namespace |
groupVersionKind |
(optional) object with groupd, version, and kind |
className |
(optional) class style for component |
displayName |
(optional) display name for component, overwrites the resource name if set |
inline |
(optional) flag to create icon badge and name inline with children |
linkTo |
(optional) flag to create a Link object - defaults to true |
name |
(optional) name of resource |
namesapce |
(optional) specific namespace for the kind resource to link to |
hideIcon |
(optional) flag to hide the icon badge |
title |
(optional) title for the link object (not displayed) |
dataTest |
(optional) identifier for testing |
onClick |
(optional) callback function for when component is clicked |
truncate |
(optional) flag to truncate the link if too long |
Hook that retrieves the k8s model for provided K8sGroupVersionKind from redux.
const Component: React.FC = () => {
const [model, inFlight] = useK8sModel({ group: 'app'; version: 'v1'; kind: 'Deployment' });
return ...
}| Parameter Name | Description |
|---|---|
groupVersionKind |
group, version, kind of k8s resource {@link K8sGroupVersionKind} is preferred alternatively can pass reference for group, version, kind which is deprecated i.e group~version~kind {@link K8sResourceKindReference}. |
An array with the first item as k8s model and second item as inFlight status
Hook that retrieves all current k8s models from redux.
const Component: React.FC = () => {
const [models, inFlight] = UseK8sModels();
return ...
}An array with the first item as the list of k8s model and second item as inFlight status
Hook that retrieves the k8s resource along with status for loaded and error.
const Component: React.FC = () => {
const watchRes = {
...
}
const [data, loaded, error] = UseK8sWatchResource(watchRes)
return ...
}| Parameter Name | Description |
|---|---|
initResource |
options needed to watch for resource. |
An array with first item as resource(s), second item as loaded status and third item as error state if any.
Hook that retrieves the k8s resources along with their respective status for loaded and error.
const Component: React.FC = () => {
const watchResources = {
'deployment': {...},
'pod': {...}
...
}
const {deployment, pod} = UseK8sWatchResources(watchResources)
return ...
}| Parameter Name | Description |
|---|---|
initResources |
resources need to be watched as key-value pair, wherein key will be unique to resource and value will be options needed to watch for the respective resource. |
A map where keys are as provided in initResouces and value has three properties data, loaded and error.
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts.
It also validates the response status code and throws appropriate error or logs out the user if required.
| Parameter Name | Description |
|---|---|
url |
The URL to fetch |
options |
The options to pass to fetch |
timeout |
The timeout in milliseconds |
A promise that resolves to the response
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts.
It also validates the response status code and throws appropriate error or logs out the user if required.
It returns the response as a JSON object.
Uses consoleFetch internally.
| Parameter Name | Description |
|---|---|
url |
The URL to fetch |
method |
The HTTP method to use. Defaults to GET |
options |
The options to pass to fetch |
timeout |
The timeout in milliseconds |
cluster |
The name of the cluster to make the request to. Defaults to the active cluster the user has selected |
A promise that resolves to the response as JSON object.
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts.
It also validates the response status code and throws appropriate error or logs out the user if required.
It returns the response as a text.
Uses consoleFetch internally.
| Parameter Name | Description |
|---|---|
url |
The URL to fetch |
options |
The options to pass to fetch |
timeout |
The timeout in milliseconds |
cluster |
The name of the cluster to make the request to. Defaults to the active cluster the user has selected |
A promise that resolves to the response as text.
A function that creates impersonation and multicluster related headers for API requests using current redux state.
| Parameter Name | Description |
|---|---|
targetCluster |
override the current active cluster with the provided targetCluster |
an object containing the appropriate impersonation and clustr requst headers, based on redux state
It fetches a resource from the cluster, based on the provided options.
If the name is provided it returns one resource else it returns all the resources matching the model.
| Parameter Name | Description |
|---|---|
options |
Which are passed as key-value pairs in the map |
| `` | options.model - k8s model |
| `` | options.name - The name of the resource, if not provided then it'll look for all the resources matching the model. |
| `` | options.ns - The namespace to look into, should not be specified for cluster-scoped resources. |
| `` | options.path - Appends as subpath if provided |
| `` | options.queryParams - The query parameters to be included in the URL. |
| `` | options.requestInit - The fetch init object to use. This can have request headers, method, redirect, etc.See more https://microsoft.github.io/PowerBI-JavaScript/interfaces/_node_modules_typedoc_node_modules_typescript_lib_lib_dom_d_.requestinit.html |
|
A promise that resolves to the response as JSON object with a resource if the name is provided
else it returns all the resources matching the model. In case of failure, the promise gets rejected with HTTP error response.
It creates a resource in the cluster, based on the provided options.
| Parameter Name | Description |
|---|---|
options |
Which are passed as key-value pairs in the map |
| `` | options.model - k8s model |
| `` | options.data - payload for the resource to be created |
| `` | options.path - Appends as subpath if provided |
| `` | options.queryParams - The query parameters to be included in the URL. |
A promise that resolves to the response of the resource created.
In case of failure promise gets rejected with HTTP error response.
It updates the entire resource in the cluster, based on provided options.
When a client needs to replace an existing resource entirely, they can use k8sUpdate.
Alternatively can use k8sPatch to perform the partial update.
| Parameter Name | Description |
|---|---|
options |
which are passed as key-value pair in the map |
| `` | options.model - k8s model |
| `` | options.data - payload for the k8s resource to be updated |
| `` | options.ns - namespace to look into, it should not be specified for cluster-scoped resources. |
| `` | options.name - resource name to be updated. |
| `` | options.path - Appends as subpath if provided |
| `` | options.queryParams - The query parameters to be included in the URL. |
A promise that resolves to the response of the resource updated.
In case of failure promise gets rejected with HTTP error response.
It patches any resource in the cluster, based on provided options.
When a client needs to perform the partial update, they can use k8sPatch.
Alternatively can use k8sUpdate to replace an existing resource entirely.
See more https://datatracker.ietf.org/doc/html/rfc6902
| Parameter Name | Description |
|---|---|
options |
Which are passed as key-value pairs in the map. |
| `` | options.model - k8s model |
| `` | options.resource - The resource to be patched. |
| `` | options.data - Only the data to be patched on existing resource with the operation, path, and value. |
| `` | options.path - Appends as subpath if provided. |
| `` | options.queryParams - The query parameters to be included in the URL. |
A promise that resolves to the response of the resource patched.
In case of failure promise gets rejected with HTTP error response.
It deletes resources from the cluster, based on the provided model, resource.
The garbage collection works based on 'Foreground' | 'Background', can be configured with propagationPolicy property in provided model or passed in json.
{ kind: 'DeleteOptions', apiVersion: 'v1', propagationPolicy }
| Parameter Name | Description |
|---|---|
options |
which are passed as key-value pair in the map. |
| `` | options.model - k8s model |
| `` | options.resource - The resource to be deleted. |
| `` | options.path - Appends as subpath if provided |
| `` | options.queryParams - The query parameters to be included in the URL. |
| `` | options.requestInit - The fetch init object to use. This can have request headers, method, redirect, etc.See more https://microsoft.github.io/PowerBI-JavaScript/interfaces/_node_modules_typedoc_node_modules_typescript_lib_lib_dom_d_.requestinit.html |
| | `` | options.json - Can control garbage collection of resources explicitly if provided else will default to model's "propagationPolicy". |
A promise that resolves to the response of kind Status.
In case of failure promise gets rejected with HTTP error response.
It lists the resources as an array in the cluster, based on provided options.
| Parameter Name | Description |
|---|---|
options |
Which are passed as key-value pairs in the map |
| `` | options.model - k8s model |
| `` | options.queryParams - The query parameters to be included in the URL and can pass label selector's as well with key "labelSelector". |
| `` | options.requestInit - The fetch init object to use. This can have request headers, method, redirect, etc.See more https://microsoft.github.io/PowerBI-JavaScript/interfaces/_node_modules_typedoc_node_modules_typescript_lib_lib_dom_d_.requestinit.html |
|
A promise that resolves to the response
Same interface as {@link k8sListResource} but returns the sub items.
Provides apiVersion for a k8s model.
| Parameter Name | Description |
|---|---|
model |
k8s model |
The apiVersion for the model i.e group/version.
Provides a group, version, and kind for a resource.
| Parameter Name | Description |
|---|---|
resource |
k8s resource |
The group, version, kind for the provided resource.
If the resource does not have an API group, group "core" will be returned.
If the resource has an invalid apiVersion then it'll throw Error.
Provides a group, version, and kind for a k8s model.
| Parameter Name | Description |
|---|---|
model |
k8s model |
The group, version, kind for the provided model.
If the model does not have an apiGroup, group "core" will be returned.
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
For more details please refer the implementation
Hook that returns the given feature flag from FLAGS redux state.
| Parameter Name | Description |
|---|---|
flag |
The feature flag to return |
the boolean value of the requested feature flag or undefined
A lazy loaded YAML editor for Kubernetes resources with hover help and completion.
The editor will handle updating the resource when the user clicks save unless an onSave handler is provided.
It should be wrapped in a React.Suspense component.
<React.Suspense fallback={<LoadingBox />}>
<ResourceYAMLEditor
initialResource={resource}
header="Create resource"
onSave={(content) => updateResource(content)}
/>
</React.Suspense>| Parameter Name | Description |
|---|---|
initialResource |
YAML/Object representing a resource to be shown by the editor.This prop is used only during the inital render |
|
| header | Add a header on top of the YAML editor |
| onSave | Callback for the Save button.Passing it will override the default update performed on the resource by the editor
|
A component to show events related to a particular resource.
const [resource, loaded, loadError] = useK8sWatchResource(clusterResource);
return <ResourceEventStream resource={resource} />| Parameter Name | Description |
|---|---|
| `` | {ResourceEventStreamProps['resource']} - An object whose related events should be shown. |
React hook to poll Prometheus for a single query.
| Parameter Name | Description |
|---|---|
options |
Which is passed as a key-value map |
| `` | options.query - Prometheus query string. If empty or undefined, polling is not started. |
| `` | options.delay - polling delay interval (ms) |
| `` | options.endpoint - one of the PrometheusEndpoint (label, query, range, rules, targets) |
| `` | options.endTime - for QUERY_RANGE enpoint, end of the query range |
| `` | options.samples - for QUERY_RANGE enpoint |
| `` | options.timespan - for QUERY_RANGE enpoint |
| `` | options.namespace - a search param to append |
| `` | options.timeout - a search param to append |
A tuple containing the query response, a boolean flag indicating whether the response has completed, and any errors encountered during the request or post-processing of the request
A component to render timestamp.
The timestamps are synchronized between invidual instances of the Timestamp component.
The provided timestamp is formatted according to user locale.
| Parameter Name | Description |
|---|---|
timestamp |
the timestamp to render. Format is expected to be ISO 8601 (used by Kubernetes), epoch timestamp, or an instance of a Date. |
simple |
render simple version of the component omitting icon and tooltip. |
omitSuffix |
formats the date ommiting the suffix. |
className |
additional class name for the component. |