mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Dynamic dashboard UI based on RBAC rules (#366)
Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
This commit is contained in:
parent
65900e728d
commit
a7cb8d2d04
@ -105,8 +105,9 @@ export class JsonApi<D = JsonApiData, P extends JsonApiParams = JsonApiParams> {
|
|||||||
this.onData.emit(data, res);
|
this.onData.emit(data, res);
|
||||||
this.writeLog({ ...log, data });
|
this.writeLog({ ...log, data });
|
||||||
return data;
|
return data;
|
||||||
}
|
} else if (log.method === "GET" && res.status === 403) {
|
||||||
else {
|
this.writeLog({ ...log, data });
|
||||||
|
} else {
|
||||||
const error = new JsonApiErrorParsed(data, this.parseError(data, res));
|
const error = new JsonApiErrorParsed(data, this.parseError(data, res));
|
||||||
this.onError.emit(error, res);
|
this.onError.emit(error, res);
|
||||||
this.writeLog({ ...log, error })
|
this.writeLog({ ...log, error })
|
||||||
|
|||||||
@ -107,8 +107,12 @@ export class KubeWatchApi {
|
|||||||
const { apiBase, namespace } = KubeApi.parseApi(url);
|
const { apiBase, namespace } = KubeApi.parseApi(url);
|
||||||
const api = apiManager.getApi(apiBase);
|
const api = apiManager.getApi(apiBase);
|
||||||
if (api) {
|
if (api) {
|
||||||
await api.refreshResourceVersion({ namespace });
|
try {
|
||||||
this.reconnect();
|
await api.refreshResourceVersion({ namespace });
|
||||||
|
this.reconnect();
|
||||||
|
} catch(error) {
|
||||||
|
console.debug("failed to refresh resource version", error)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
15
dashboard/client/api/rbac.ts
Normal file
15
dashboard/client/api/rbac.ts
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
import { configStore } from "../config.store";
|
||||||
|
import { isArray } from "util";
|
||||||
|
|
||||||
|
export function isAllowedResource(resources: string|string[]) {
|
||||||
|
if (!isArray(resources)) {
|
||||||
|
resources = [resources];
|
||||||
|
}
|
||||||
|
const { allowedResources } = configStore;
|
||||||
|
for (const resource of resources) {
|
||||||
|
if (!allowedResources.includes(resource)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
@ -13,6 +13,7 @@ import { nodesStore } from "../+nodes/nodes.store";
|
|||||||
import { podsStore } from "../+workloads-pods/pods.store";
|
import { podsStore } from "../+workloads-pods/pods.store";
|
||||||
import { clusterStore } from "./cluster.store";
|
import { clusterStore } from "./cluster.store";
|
||||||
import { eventStore } from "../+events/event.store";
|
import { eventStore } from "../+events/event.store";
|
||||||
|
import { isAllowedResource } from "../../api/rbac";
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
export class Cluster extends React.Component {
|
export class Cluster extends React.Component {
|
||||||
@ -25,6 +26,9 @@ export class Cluster extends React.Component {
|
|||||||
|
|
||||||
async componentDidMount() {
|
async componentDidMount() {
|
||||||
const { dependentStores } = this;
|
const { dependentStores } = this;
|
||||||
|
if (!isAllowedResource("nodes")) {
|
||||||
|
dependentStores.splice(dependentStores.indexOf(nodesStore), 1)
|
||||||
|
}
|
||||||
this.watchers.forEach(watcher => watcher.start(true));
|
this.watchers.forEach(watcher => watcher.start(true));
|
||||||
|
|
||||||
await Promise.all([
|
await Promise.all([
|
||||||
|
|||||||
@ -9,8 +9,8 @@ import { namespaceStore } from "../+namespaces/namespace.store";
|
|||||||
import { resourceQuotaRoute, ResourceQuotas, resourceQuotaURL } from "../+config-resource-quotas";
|
import { resourceQuotaRoute, ResourceQuotas, resourceQuotaURL } from "../+config-resource-quotas";
|
||||||
import { configURL } from "./config.route";
|
import { configURL } from "./config.route";
|
||||||
import { HorizontalPodAutoscalers, hpaRoute, hpaURL } from "../+config-autoscalers";
|
import { HorizontalPodAutoscalers, hpaRoute, hpaURL } from "../+config-autoscalers";
|
||||||
import { Certificates, ClusterIssuers, Issuers } from "../+custom-resources/certmanager.k8s.io";
|
|
||||||
import { buildURL } from "../../navigation";
|
import { buildURL } from "../../navigation";
|
||||||
|
import { isAllowedResource } from "../../api/rbac"
|
||||||
|
|
||||||
export const certificatesURL = buildURL("/certificates");
|
export const certificatesURL = buildURL("/certificates");
|
||||||
export const issuersURL = buildURL("/issuers");
|
export const issuersURL = buildURL("/issuers");
|
||||||
@ -20,32 +20,40 @@ export const clusterIssuersURL = buildURL("/clusterissuers");
|
|||||||
export class Config extends React.Component {
|
export class Config extends React.Component {
|
||||||
static get tabRoutes(): TabRoute[] {
|
static get tabRoutes(): TabRoute[] {
|
||||||
const query = namespaceStore.getContextParams()
|
const query = namespaceStore.getContextParams()
|
||||||
return [
|
const routes: TabRoute[] = []
|
||||||
{
|
if (isAllowedResource("configmaps")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>ConfigMaps</Trans>,
|
title: <Trans>ConfigMaps</Trans>,
|
||||||
component: ConfigMaps,
|
component: ConfigMaps,
|
||||||
url: configMapsURL({ query }),
|
url: configMapsURL({ query }),
|
||||||
path: configMapsRoute.path,
|
path: configMapsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("secrets")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Secrets</Trans>,
|
title: <Trans>Secrets</Trans>,
|
||||||
component: Secrets,
|
component: Secrets,
|
||||||
url: secretsURL({ query }),
|
url: secretsURL({ query }),
|
||||||
path: secretsRoute.path,
|
path: secretsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("resourcequotas")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Resource Quotas</Trans>,
|
title: <Trans>Resource Quotas</Trans>,
|
||||||
component: ResourceQuotas,
|
component: ResourceQuotas,
|
||||||
url: resourceQuotaURL({ query }),
|
url: resourceQuotaURL({ query }),
|
||||||
path: resourceQuotaRoute.path,
|
path: resourceQuotaRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("horizontalpodautoscalers")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>HPA</Trans>,
|
title: <Trans>HPA</Trans>,
|
||||||
component: HorizontalPodAutoscalers,
|
component: HorizontalPodAutoscalers,
|
||||||
url: hpaURL({ query }),
|
url: hpaURL({ query }),
|
||||||
path: hpaRoute.path,
|
path: hpaRoute.path,
|
||||||
},
|
})
|
||||||
]
|
}
|
||||||
|
return routes;
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|||||||
@ -11,6 +11,7 @@ import { namespaceStore } from "./namespace.store";
|
|||||||
import { _i18n } from "../../i18n";
|
import { _i18n } from "../../i18n";
|
||||||
import { FilterIcon } from "../item-object-list/filter-icon";
|
import { FilterIcon } from "../item-object-list/filter-icon";
|
||||||
import { FilterType } from "../item-object-list/page-filters.store";
|
import { FilterType } from "../item-object-list/page-filters.store";
|
||||||
|
import { isAllowedResource } from "../../api/rbac"
|
||||||
|
|
||||||
interface Props extends SelectProps {
|
interface Props extends SelectProps {
|
||||||
showIcons?: boolean;
|
showIcons?: boolean;
|
||||||
@ -33,7 +34,9 @@ export class NamespaceSelect extends React.Component<Props> {
|
|||||||
private unsubscribe = noop;
|
private unsubscribe = noop;
|
||||||
|
|
||||||
async componentDidMount() {
|
async componentDidMount() {
|
||||||
if (!namespaceStore.isLoaded) await namespaceStore.loadAll();
|
if (isAllowedResource("namespaces") && !namespaceStore.isLoaded) {
|
||||||
|
await namespaceStore.loadAll();
|
||||||
|
}
|
||||||
this.unsubscribe = namespaceStore.subscribe();
|
this.unsubscribe = namespaceStore.subscribe();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -12,6 +12,7 @@ import { Ingresses, ingressRoute, ingressURL } from "../+network-ingresses";
|
|||||||
import { NetworkPolicies, networkPoliciesRoute, networkPoliciesURL } from "../+network-policies";
|
import { NetworkPolicies, networkPoliciesRoute, networkPoliciesURL } from "../+network-policies";
|
||||||
import { namespaceStore } from "../+namespaces/namespace.store";
|
import { namespaceStore } from "../+namespaces/namespace.store";
|
||||||
import { networkURL } from "./network.route";
|
import { networkURL } from "./network.route";
|
||||||
|
import { isAllowedResource } from "../../api/rbac";
|
||||||
|
|
||||||
interface Props extends RouteComponentProps<{}> {
|
interface Props extends RouteComponentProps<{}> {
|
||||||
}
|
}
|
||||||
@ -20,32 +21,40 @@ interface Props extends RouteComponentProps<{}> {
|
|||||||
export class Network extends React.Component<Props> {
|
export class Network extends React.Component<Props> {
|
||||||
static get tabRoutes(): TabRoute[] {
|
static get tabRoutes(): TabRoute[] {
|
||||||
const query = namespaceStore.getContextParams()
|
const query = namespaceStore.getContextParams()
|
||||||
return [
|
const routes: TabRoute[] = [];
|
||||||
{
|
if (isAllowedResource("services")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Services</Trans>,
|
title: <Trans>Services</Trans>,
|
||||||
component: Services,
|
component: Services,
|
||||||
url: servicesURL({ query }),
|
url: servicesURL({ query }),
|
||||||
path: servicesRoute.path,
|
path: servicesRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("endpoints")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Endpoints</Trans>,
|
title: <Trans>Endpoints</Trans>,
|
||||||
component: Endpoints,
|
component: Endpoints,
|
||||||
url: endpointURL({ query }),
|
url: endpointURL({ query }),
|
||||||
path: endpointRoute.path,
|
path: endpointRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("ingresses")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Ingresses</Trans>,
|
title: <Trans>Ingresses</Trans>,
|
||||||
component: Ingresses,
|
component: Ingresses,
|
||||||
url: ingressURL({ query }),
|
url: ingressURL({ query }),
|
||||||
path: ingressRoute.path,
|
path: ingressRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("networkpolicies")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Network Policies</Trans>,
|
title: <Trans>Network Policies</Trans>,
|
||||||
component: NetworkPolicies,
|
component: NetworkPolicies,
|
||||||
url: networkPoliciesURL({ query }),
|
url: networkPoliciesURL({ query }),
|
||||||
path: networkPoliciesRoute.path,
|
path: networkPoliciesRoute.path,
|
||||||
},
|
})
|
||||||
]
|
}
|
||||||
|
return routes
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@ -59,4 +68,4 @@ export class Network extends React.Component<Props> {
|
|||||||
</MainLayout>
|
</MainLayout>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -16,10 +16,11 @@
|
|||||||
.workloads {
|
.workloads {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fit, 155px);
|
grid-template-columns: repeat(auto-fit, 155px);
|
||||||
justify-content: space-between;
|
justify-content: space-evenly;
|
||||||
grid-gap: $margin;
|
grid-gap: $margin;
|
||||||
padding: $padding * 2;
|
padding: $padding * 2;
|
||||||
|
|
||||||
|
|
||||||
.workload {
|
.workload {
|
||||||
margin-bottom: $margin * 2;
|
margin-bottom: $margin * 2;
|
||||||
|
|
||||||
@ -32,4 +33,4 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -15,17 +15,20 @@ import { cronJobStore } from "../+workloads-cronjobs/cronjob.store";
|
|||||||
import { namespaceStore } from "../+namespaces/namespace.store";
|
import { namespaceStore } from "../+namespaces/namespace.store";
|
||||||
import { PageFiltersList } from "../item-object-list/page-filters-list";
|
import { PageFiltersList } from "../item-object-list/page-filters-list";
|
||||||
import { NamespaceSelectFilter } from "../+namespaces/namespace-select";
|
import { NamespaceSelectFilter } from "../+namespaces/namespace-select";
|
||||||
|
import { configStore } from "../../config.store";
|
||||||
|
import { isAllowedResource } from "../../api/rbac";
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
export class OverviewStatuses extends React.Component {
|
export class OverviewStatuses extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
|
const { allowedResources } = configStore;
|
||||||
const { contextNs } = namespaceStore;
|
const { contextNs } = namespaceStore;
|
||||||
const pods = podsStore.getAllByNs(contextNs);
|
const pods = isAllowedResource("pods") ? podsStore.getAllByNs(contextNs) : [];
|
||||||
const deployments = deploymentStore.getAllByNs(contextNs);
|
const deployments = isAllowedResource("deployments") ? deploymentStore.getAllByNs(contextNs) : [];
|
||||||
const statefulSets = statefulSetStore.getAllByNs(contextNs);
|
const statefulSets = isAllowedResource("statefulsets") ? statefulSetStore.getAllByNs(contextNs) : [];
|
||||||
const daemonSets = daemonSetStore.getAllByNs(contextNs);
|
const daemonSets = isAllowedResource("daemonsets") ? daemonSetStore.getAllByNs(contextNs) : [];
|
||||||
const jobs = jobStore.getAllByNs(contextNs);
|
const jobs = isAllowedResource("jobs") ? jobStore.getAllByNs(contextNs) : [];
|
||||||
const cronJobs = cronJobStore.getAllByNs(contextNs);
|
const cronJobs = isAllowedResource("cronjobs") ? cronJobStore.getAllByNs(contextNs) : [];
|
||||||
return (
|
return (
|
||||||
<div className="OverviewStatuses">
|
<div className="OverviewStatuses">
|
||||||
<div className="header flex gaps align-center">
|
<div className="header flex gaps align-center">
|
||||||
@ -34,30 +37,42 @@ export class OverviewStatuses extends React.Component {
|
|||||||
</div>
|
</div>
|
||||||
<PageFiltersList/>
|
<PageFiltersList/>
|
||||||
<div className="workloads">
|
<div className="workloads">
|
||||||
|
{ isAllowedResource("pods") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={podsURL()}><Trans>Pods</Trans> ({pods.length})</Link></div>
|
<div className="title"><Link to={podsURL()}><Trans>Pods</Trans> ({pods.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={podsStore.getStatuses(pods)}/>
|
<OverviewWorkloadStatus status={podsStore.getStatuses(pods)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
{ isAllowedResource("deployments") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={deploymentsURL()}><Trans>Deployments</Trans> ({deployments.length})</Link></div>
|
<div className="title"><Link to={deploymentsURL()}><Trans>Deployments</Trans> ({deployments.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={deploymentStore.getStatuses(deployments)}/>
|
<OverviewWorkloadStatus status={deploymentStore.getStatuses(deployments)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
{ isAllowedResource("statefulsets") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={statefulSetsURL()}><Trans>StatefulSets</Trans> ({statefulSets.length})</Link></div>
|
<div className="title"><Link to={statefulSetsURL()}><Trans>StatefulSets</Trans> ({statefulSets.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={statefulSetStore.getStatuses(statefulSets)}/>
|
<OverviewWorkloadStatus status={statefulSetStore.getStatuses(statefulSets)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
{ isAllowedResource("daemonsets") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={daemonSetsURL()}><Trans>DaemonSets</Trans> ({daemonSets.length})</Link></div>
|
<div className="title"><Link to={daemonSetsURL()}><Trans>DaemonSets</Trans> ({daemonSets.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={daemonSetStore.getStatuses(daemonSets)}/>
|
<OverviewWorkloadStatus status={daemonSetStore.getStatuses(daemonSets)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
{ isAllowedResource("jobs") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={jobsURL()}><Trans>Jobs</Trans> ({jobs.length})</Link></div>
|
<div className="title"><Link to={jobsURL()}><Trans>Jobs</Trans> ({jobs.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={jobStore.getStatuses(jobs)}/>
|
<OverviewWorkloadStatus status={jobStore.getStatuses(jobs)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
{ isAllowedResource("cronjobs") &&
|
||||||
<div className="workload">
|
<div className="workload">
|
||||||
<div className="title"><Link to={cronJobsURL()}><Trans>CronJobs</Trans> ({cronJobs.length})</Link></div>
|
<div className="title"><Link to={cronJobsURL()}><Trans>CronJobs</Trans> ({cronJobs.length})</Link></div>
|
||||||
<OverviewWorkloadStatus status={cronJobStore.getStatuses(cronJobs)}/>
|
<OverviewWorkloadStatus status={cronJobStore.getStatuses(cronJobs)}/>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|||||||
@ -16,6 +16,8 @@ import { jobStore } from "../+workloads-jobs/job.store";
|
|||||||
import { cronJobStore } from "../+workloads-cronjobs/cronjob.store";
|
import { cronJobStore } from "../+workloads-cronjobs/cronjob.store";
|
||||||
import { Spinner } from "../spinner";
|
import { Spinner } from "../spinner";
|
||||||
import { Events } from "../+events";
|
import { Events } from "../+events";
|
||||||
|
import { KubeObjectStore } from "../../kube-object.store";
|
||||||
|
import { isAllowedResource } from "../../api/rbac"
|
||||||
|
|
||||||
interface Props extends RouteComponentProps<IWorkloadsOverviewRouteParams> {
|
interface Props extends RouteComponentProps<IWorkloadsOverviewRouteParams> {
|
||||||
}
|
}
|
||||||
@ -26,16 +28,31 @@ export class WorkloadsOverview extends React.Component<Props> {
|
|||||||
@observable isUnmounting = false;
|
@observable isUnmounting = false;
|
||||||
|
|
||||||
async componentDidMount() {
|
async componentDidMount() {
|
||||||
const stores = [
|
const stores: KubeObjectStore[] = [];
|
||||||
podsStore,
|
if (isAllowedResource("pods")) {
|
||||||
deploymentStore,
|
stores.push(podsStore);
|
||||||
daemonSetStore,
|
}
|
||||||
statefulSetStore,
|
if (isAllowedResource("deployments")) {
|
||||||
replicaSetStore,
|
stores.push(deploymentStore);
|
||||||
jobStore,
|
}
|
||||||
cronJobStore,
|
if (isAllowedResource("daemonsets")) {
|
||||||
eventStore,
|
stores.push(daemonSetStore);
|
||||||
];
|
}
|
||||||
|
if (isAllowedResource("statefulsets")) {
|
||||||
|
stores.push(statefulSetStore);
|
||||||
|
}
|
||||||
|
if (isAllowedResource("replicasets")) {
|
||||||
|
stores.push(replicaSetStore);
|
||||||
|
}
|
||||||
|
if (isAllowedResource("jobs")) {
|
||||||
|
stores.push(jobStore);
|
||||||
|
}
|
||||||
|
if (isAllowedResource("cronjobs")) {
|
||||||
|
stores.push(cronJobStore);
|
||||||
|
}
|
||||||
|
if (isAllowedResource("events")) {
|
||||||
|
stores.push(eventStore);
|
||||||
|
}
|
||||||
this.isReady = stores.every(store => store.isLoaded);
|
this.isReady = stores.every(store => store.isLoaded);
|
||||||
await Promise.all(stores.map(store => store.loadAll()));
|
await Promise.all(stores.map(store => store.loadAll()));
|
||||||
this.isReady = true;
|
this.isReady = true;
|
||||||
@ -55,11 +72,11 @@ export class WorkloadsOverview extends React.Component<Props> {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<OverviewStatuses/>
|
<OverviewStatuses/>
|
||||||
<Events
|
{ isAllowedResource("events") && <Events
|
||||||
compact
|
compact
|
||||||
hideFilters
|
hideFilters
|
||||||
className="box grow"
|
className="box grow"
|
||||||
/>
|
/> }
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@ -71,4 +88,4 @@ export class WorkloadsOverview extends React.Component<Props> {
|
|||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -15,6 +15,7 @@ import { DaemonSets } from "../+workloads-daemonsets";
|
|||||||
import { StatefulSets } from "../+workloads-statefulsets";
|
import { StatefulSets } from "../+workloads-statefulsets";
|
||||||
import { Jobs } from "../+workloads-jobs";
|
import { Jobs } from "../+workloads-jobs";
|
||||||
import { CronJobs } from "../+workloads-cronjobs";
|
import { CronJobs } from "../+workloads-cronjobs";
|
||||||
|
import { isAllowedResource } from "../../api/rbac"
|
||||||
|
|
||||||
interface Props extends RouteComponentProps {
|
interface Props extends RouteComponentProps {
|
||||||
}
|
}
|
||||||
@ -23,50 +24,63 @@ interface Props extends RouteComponentProps {
|
|||||||
export class Workloads extends React.Component<Props> {
|
export class Workloads extends React.Component<Props> {
|
||||||
static get tabRoutes(): TabRoute[] {
|
static get tabRoutes(): TabRoute[] {
|
||||||
const query = namespaceStore.getContextParams();
|
const query = namespaceStore.getContextParams();
|
||||||
return [
|
const routes: TabRoute[] = [
|
||||||
{
|
{
|
||||||
title: <Trans>Overview</Trans>,
|
title: <Trans>Overview</Trans>,
|
||||||
component: WorkloadsOverview,
|
component: WorkloadsOverview,
|
||||||
url: overviewURL({ query }),
|
url: overviewURL({ query }),
|
||||||
path: overviewRoute.path
|
path: overviewRoute.path
|
||||||
},
|
}
|
||||||
{
|
]
|
||||||
|
if (isAllowedResource("pods")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Pods</Trans>,
|
title: <Trans>Pods</Trans>,
|
||||||
component: Pods,
|
component: Pods,
|
||||||
url: podsURL({ query }),
|
url: podsURL({ query }),
|
||||||
path: podsRoute.path
|
path: podsRoute.path
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("deployments")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Deployments</Trans>,
|
title: <Trans>Deployments</Trans>,
|
||||||
component: Deployments,
|
component: Deployments,
|
||||||
url: deploymentsURL({ query }),
|
url: deploymentsURL({ query }),
|
||||||
path: deploymentsRoute.path,
|
path: deploymentsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("daemonsets")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>DaemonSets</Trans>,
|
title: <Trans>DaemonSets</Trans>,
|
||||||
component: DaemonSets,
|
component: DaemonSets,
|
||||||
url: daemonSetsURL({ query }),
|
url: daemonSetsURL({ query }),
|
||||||
path: daemonSetsRoute.path,
|
path: daemonSetsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("statefulsets")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>StatefulSets</Trans>,
|
title: <Trans>StatefulSets</Trans>,
|
||||||
component: StatefulSets,
|
component: StatefulSets,
|
||||||
url: statefulSetsURL({ query }),
|
url: statefulSetsURL({ query }),
|
||||||
path: statefulSetsRoute.path,
|
path: statefulSetsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("jobs")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>Jobs</Trans>,
|
title: <Trans>Jobs</Trans>,
|
||||||
component: Jobs,
|
component: Jobs,
|
||||||
url: jobsURL({ query }),
|
url: jobsURL({ query }),
|
||||||
path: jobsRoute.path,
|
path: jobsRoute.path,
|
||||||
},
|
})
|
||||||
{
|
}
|
||||||
|
if (isAllowedResource("cronjobs")) {
|
||||||
|
routes.push({
|
||||||
title: <Trans>CronJobs</Trans>,
|
title: <Trans>CronJobs</Trans>,
|
||||||
component: CronJobs,
|
component: CronJobs,
|
||||||
url: cronJobsURL({ query }),
|
url: cronJobsURL({ query }),
|
||||||
path: cronJobsRoute.path,
|
path: cronJobsRoute.path,
|
||||||
},
|
})
|
||||||
]
|
}
|
||||||
|
return routes;
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@ -80,4 +94,4 @@ export class Workloads extends React.Component<Props> {
|
|||||||
</MainLayout>
|
</MainLayout>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -32,6 +32,7 @@ import { PodLogsDialog } from "./+workloads-pods/pod-logs-dialog";
|
|||||||
import { DeploymentScaleDialog } from "./+workloads-deployments/deployment-scale-dialog";
|
import { DeploymentScaleDialog } from "./+workloads-deployments/deployment-scale-dialog";
|
||||||
import { CustomResources } from "./+custom-resources/custom-resources";
|
import { CustomResources } from "./+custom-resources/custom-resources";
|
||||||
import { crdRoute } from "./+custom-resources";
|
import { crdRoute } from "./+custom-resources";
|
||||||
|
import { isAllowedResource } from "../api/rbac";
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
class App extends React.Component {
|
class App extends React.Component {
|
||||||
@ -46,7 +47,7 @@ class App extends React.Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const homeUrl = clusterURL();
|
const homeUrl = (isAllowedResource(["events", "nodes", "pods"])) ? clusterURL() : workloadsURL();
|
||||||
return (
|
return (
|
||||||
<I18nProvider i18n={_i18n}>
|
<I18nProvider i18n={_i18n}>
|
||||||
<Router history={browserHistory}>
|
<Router history={browserHistory}>
|
||||||
|
|||||||
@ -114,10 +114,15 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
|
|||||||
const { store, dependentStores, isClusterScoped } = this.props;
|
const { store, dependentStores, isClusterScoped } = this.props;
|
||||||
const stores = [store, ...dependentStores];
|
const stores = [store, ...dependentStores];
|
||||||
if (!isClusterScoped) stores.push(namespaceStore);
|
if (!isClusterScoped) stores.push(namespaceStore);
|
||||||
await Promise.all(stores.map(store => store.loadAll()));
|
try {
|
||||||
const subscriptions = stores.map(store => store.subscribe());
|
await Promise.all(stores.map(store => store.loadAll()));
|
||||||
|
const subscriptions = stores.map(store => store.subscribe());
|
||||||
|
|
||||||
|
subscriptions.forEach(dispose => dispose()); // unsubscribe all
|
||||||
|
} catch(error) {
|
||||||
|
console.log("catched", error)
|
||||||
|
}
|
||||||
await when(() => this.isUnmounting);
|
await when(() => this.isUnmounting);
|
||||||
subscriptions.forEach(dispose => dispose()); // unsubscribe all
|
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
|
|||||||
@ -28,6 +28,7 @@ import { crdStore } from "../+custom-resources/crd.store";
|
|||||||
import { CrdList, crdResourcesRoute, crdRoute, crdURL } from "../+custom-resources";
|
import { CrdList, crdResourcesRoute, crdRoute, crdURL } from "../+custom-resources";
|
||||||
import { CustomResources } from "../+custom-resources/custom-resources";
|
import { CustomResources } from "../+custom-resources/custom-resources";
|
||||||
import { navigation } from "../../navigation";
|
import { navigation } from "../../navigation";
|
||||||
|
import { isAllowedResource } from "../../api/rbac"
|
||||||
|
|
||||||
const SidebarContext = React.createContext<SidebarContextValue>({ pinned: false });
|
const SidebarContext = React.createContext<SidebarContextValue>({ pinned: false });
|
||||||
type SidebarContextValue = {
|
type SidebarContextValue = {
|
||||||
@ -43,7 +44,7 @@ interface Props {
|
|||||||
@observer
|
@observer
|
||||||
export class Sidebar extends React.Component<Props> {
|
export class Sidebar extends React.Component<Props> {
|
||||||
async componentDidMount() {
|
async componentDidMount() {
|
||||||
if (!crdStore.isLoaded) crdStore.loadAll()
|
if (!crdStore.isLoaded && isAllowedResource('customresourcedefinitions')) crdStore.loadAll()
|
||||||
}
|
}
|
||||||
|
|
||||||
renderCustomResources() {
|
renderCustomResources() {
|
||||||
@ -71,7 +72,7 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { toggle, isPinned, className } = this.props;
|
const { toggle, isPinned, className } = this.props;
|
||||||
const { isClusterAdmin, allowedResources } = configStore;
|
const { allowedResources } = configStore;
|
||||||
const query = namespaceStore.getContextParams();
|
const query = namespaceStore.getContextParams();
|
||||||
return (
|
return (
|
||||||
<SidebarContext.Provider value={{ pinned: isPinned }}>
|
<SidebarContext.Provider value={{ pinned: isPinned }}>
|
||||||
@ -91,19 +92,21 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
<div className="sidebar-nav flex column box grow-fixed">
|
<div className="sidebar-nav flex column box grow-fixed">
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="cluster"
|
id="cluster"
|
||||||
|
isHidden={!isAllowedResource('nodes')}
|
||||||
url={clusterURL()}
|
url={clusterURL()}
|
||||||
text={<Trans>Cluster</Trans>}
|
text={<Trans>Cluster</Trans>}
|
||||||
icon={<Icon svg="kube"/>}
|
icon={<Icon svg="kube"/>}
|
||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="nodes"
|
id="nodes"
|
||||||
isHidden={!allowedResources.includes('nodes')}
|
isHidden={!isAllowedResource('nodes')}
|
||||||
url={nodesURL()}
|
url={nodesURL()}
|
||||||
text={<Trans>Nodes</Trans>}
|
text={<Trans>Nodes</Trans>}
|
||||||
icon={<Icon svg="nodes"/>}
|
icon={<Icon svg="nodes"/>}
|
||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="workloads"
|
id="workloads"
|
||||||
|
isHidden={Workloads.tabRoutes.length == 0}
|
||||||
url={workloadsURL({ query })}
|
url={workloadsURL({ query })}
|
||||||
routePath={workloadsRoute.path}
|
routePath={workloadsRoute.path}
|
||||||
subMenus={Workloads.tabRoutes}
|
subMenus={Workloads.tabRoutes}
|
||||||
@ -112,6 +115,7 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="config"
|
id="config"
|
||||||
|
isHidden={Config.tabRoutes.length == 0}
|
||||||
url={configURL({ query })}
|
url={configURL({ query })}
|
||||||
routePath={configRoute.path}
|
routePath={configRoute.path}
|
||||||
subMenus={Config.tabRoutes}
|
subMenus={Config.tabRoutes}
|
||||||
@ -120,6 +124,7 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="networks"
|
id="networks"
|
||||||
|
isHidden={Network.tabRoutes.length == 0}
|
||||||
url={networkURL({ query })}
|
url={networkURL({ query })}
|
||||||
routePath={networkRoute.path}
|
routePath={networkRoute.path}
|
||||||
subMenus={Network.tabRoutes}
|
subMenus={Network.tabRoutes}
|
||||||
@ -128,6 +133,7 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="storage"
|
id="storage"
|
||||||
|
isHidden={Storage.tabRoutes.length == 0}
|
||||||
url={storageURL({ query })}
|
url={storageURL({ query })}
|
||||||
routePath={storageRoute.path}
|
routePath={storageRoute.path}
|
||||||
subMenus={Storage.tabRoutes}
|
subMenus={Storage.tabRoutes}
|
||||||
@ -136,12 +142,14 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="namespaces"
|
id="namespaces"
|
||||||
|
isHidden={!isAllowedResource('namespaces')}
|
||||||
url={namespacesURL()}
|
url={namespacesURL()}
|
||||||
icon={<Icon material="layers"/>}
|
icon={<Icon material="layers"/>}
|
||||||
text={<Trans>Namespaces</Trans>}
|
text={<Trans>Namespaces</Trans>}
|
||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="events"
|
id="events"
|
||||||
|
isHidden={!isAllowedResource('events')}
|
||||||
url={eventsURL({ query })}
|
url={eventsURL({ query })}
|
||||||
routePath={eventRoute.path}
|
routePath={eventRoute.path}
|
||||||
icon={<Icon material="access_time"/>}
|
icon={<Icon material="access_time"/>}
|
||||||
@ -165,7 +173,7 @@ export class Sidebar extends React.Component<Props> {
|
|||||||
/>
|
/>
|
||||||
<SidebarNavItem
|
<SidebarNavItem
|
||||||
id="custom-resources"
|
id="custom-resources"
|
||||||
isHidden={!allowedResources.includes('customresourcedefinitions')}
|
isHidden={!isAllowedResource('customresourcedefinitions')}
|
||||||
url={crdURL()}
|
url={crdURL()}
|
||||||
subMenus={CustomResources.tabRoutes}
|
subMenus={CustomResources.tabRoutes}
|
||||||
routePath={crdRoute.path}
|
routePath={crdRoute.path}
|
||||||
|
|||||||
@ -1,12 +0,0 @@
|
|||||||
export interface ILicense {
|
|
||||||
name?: string;
|
|
||||||
maxNodes?: number;
|
|
||||||
owner?: {
|
|
||||||
company?: string;
|
|
||||||
firstName?: string;
|
|
||||||
lastName?: string;
|
|
||||||
username?: string;
|
|
||||||
};
|
|
||||||
validUntil?: string;
|
|
||||||
recurring?: boolean;
|
|
||||||
}
|
|
||||||
@ -5,6 +5,31 @@ import { getAppVersion } from "../../common/app-utils"
|
|||||||
import { CoreV1Api, AuthorizationV1Api } from "@kubernetes/client-node"
|
import { CoreV1Api, AuthorizationV1Api } from "@kubernetes/client-node"
|
||||||
import { Cluster } from "../cluster"
|
import { Cluster } from "../cluster"
|
||||||
|
|
||||||
|
// TODO: auto-populate all resources dynamically
|
||||||
|
const apiResources = [
|
||||||
|
{ resource: "configmaps" },
|
||||||
|
{ resource: "cronjobs", group: "batch" },
|
||||||
|
{ resource: "customresourcedefinitions", group: "apiextensions.k8s.io" },
|
||||||
|
{ resource: "daemonsets", group: "apps" },
|
||||||
|
{ resource: "deployments", group: "apps" },
|
||||||
|
{ resource: "endpoints" },
|
||||||
|
{ resource: "events" },
|
||||||
|
{ resource: "horizontalpodautoscalers" },
|
||||||
|
{ resource: "ingresses", group: "networking.k8s.io" },
|
||||||
|
{ resource: "jobs", group: "batch" },
|
||||||
|
{ resource: "namespaces" },
|
||||||
|
{ resource: "networkpolicies", group: "networking.k8s.io" },
|
||||||
|
{ resource: "nodes" },
|
||||||
|
{ resource: "persistentvolumes" },
|
||||||
|
{ resource: "pods" },
|
||||||
|
{ resource: "podsecuritypolicies" },
|
||||||
|
{ resource: "resourcequotas" },
|
||||||
|
{ resource: "secrets" },
|
||||||
|
{ resource: "services" },
|
||||||
|
{ resource: "statefulsets", group: "apps" },
|
||||||
|
{ resource: "storageclasses", group: "storage.k8s.io" },
|
||||||
|
]
|
||||||
|
|
||||||
async function getAllowedNamespaces(cluster: Cluster) {
|
async function getAllowedNamespaces(cluster: Cluster) {
|
||||||
const api = cluster.contextHandler.kc.makeApiClient(CoreV1Api)
|
const api = cluster.contextHandler.kc.makeApiClient(CoreV1Api)
|
||||||
try {
|
try {
|
||||||
@ -30,21 +55,18 @@ async function getAllowedNamespaces(cluster: Cluster) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function getAllowedResources(cluster: Cluster) {
|
async function getAllowedResources(cluster: Cluster, namespaces: string[]) {
|
||||||
// TODO: auto-populate all resources dynamically
|
|
||||||
const resources = [
|
|
||||||
"nodes", "persistentvolumes", "storageclasses", "customresourcedefinitions",
|
|
||||||
"podsecuritypolicies"
|
|
||||||
]
|
|
||||||
try {
|
try {
|
||||||
const resourceAccessStatuses = await Promise.all(
|
const resourceAccessStatuses = await Promise.all(
|
||||||
resources.map(resource => cluster.canI({
|
apiResources.map(apiResource => cluster.canI({
|
||||||
resource: resource,
|
resource: apiResource.resource,
|
||||||
verb: "list"
|
group: apiResource.group,
|
||||||
|
verb: "list",
|
||||||
|
namespace: namespaces[0]
|
||||||
}))
|
}))
|
||||||
)
|
)
|
||||||
return resources
|
return apiResources
|
||||||
.filter((resource, i) => resourceAccessStatuses[i])
|
.filter((resource, i) => resourceAccessStatuses[i]).map(apiResource => apiResource.resource)
|
||||||
} catch(error) {
|
} catch(error) {
|
||||||
return []
|
return []
|
||||||
}
|
}
|
||||||
@ -55,6 +77,7 @@ class ConfigRoute extends LensApi {
|
|||||||
public async routeConfig(request: LensApiRequest) {
|
public async routeConfig(request: LensApiRequest) {
|
||||||
const { params, response, cluster} = request
|
const { params, response, cluster} = request
|
||||||
|
|
||||||
|
const namespaces = await getAllowedNamespaces(cluster)
|
||||||
const data = {
|
const data = {
|
||||||
clusterName: cluster.contextName,
|
clusterName: cluster.contextName,
|
||||||
lensVersion: getAppVersion(),
|
lensVersion: getAppVersion(),
|
||||||
@ -62,8 +85,8 @@ class ConfigRoute extends LensApi {
|
|||||||
kubeVersion: cluster.version,
|
kubeVersion: cluster.version,
|
||||||
chartsEnabled: true,
|
chartsEnabled: true,
|
||||||
isClusterAdmin: cluster.isAdmin,
|
isClusterAdmin: cluster.isAdmin,
|
||||||
allowedResources: await getAllowedResources(cluster),
|
allowedResources: await getAllowedResources(cluster, namespaces),
|
||||||
allowedNamespaces: await getAllowedNamespaces(cluster)
|
allowedNamespaces: namespaces
|
||||||
};
|
};
|
||||||
|
|
||||||
this.respondJson(response, data)
|
this.respondJson(response, data)
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user