hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Hide "default" catalog entity detail items when extension describes so

Browse Source 
Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
This commit is contained in:
Janne Savolainen 2022-04-05 10:05:28 +03:00
parent ff1ab54e0f
commit 9ef5eb66e2
No known key found for this signature in database
GPG Key ID: 8C6CFB2FFFE8F68A
3 changed files with 88 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/extensions/lens-renderer-extension.ts
View File

@ -28,9 +28,7 @@ import extensionPageParametersInjectable from "../renderer/routes/extension-page
import { pipeline } from "@ogre-tools/fp"; import { pipeline } from "@ogre-tools/fp";
import { getExtensionRoutePath } from "../renderer/routes/get-extension-route-path"; import { getExtensionRoutePath } from "../renderer/routes/get-extension-route-path";
import { navigateToRouteInjectionToken } from "../common/front-end-routing/navigate-to-route-injection-token"; import { navigateToRouteInjectionToken } from "../common/front-end-routing/navigate-to-route-injection-token";
import type { import type { CatalogEntityDetailRegistration } from "../renderer/components/+catalog/catalog-entity-detail-items/extension-registration";
CatalogEntityDetailRegistration,
} from "../renderer/components/+catalog/catalog-entity-detail-items/extension-registration";
export class LensRendererExtension extends LensExtension { export class LensRendererExtension extends LensExtension {
globalPages: registries.PageRegistration[] = []; globalPages: registries.PageRegistration[] = [];

100
src/renderer/components/+catalog/catalog-entity-details.tsx
View File

@ -18,6 +18,7 @@ import catalogEntityDetailItemsInjectable from "./catalog-entity-detail-items/ca
import { withInjectables } from "@ogre-tools/injectable-react"; import { withInjectables } from "@ogre-tools/injectable-react";
import type { CatalogEntityDetailItem } from "./catalog-entity-detail-items/catalog-entity-detail-item-injection-token"; import type { CatalogEntityDetailItem } from "./catalog-entity-detail-items/catalog-entity-detail-item-injection-token";
import type { IComputedValue } from "mobx"; import type { IComputedValue } from "mobx";
import showDefaultCatalogEntityDetailItemsInjectable from "./show-default-catalog-entity-detail-items.injectable";
export interface CatalogEntityDetailsProps<T extends CatalogEntity> { export interface CatalogEntityDetailsProps<T extends CatalogEntity> {
entity: T; entity: T;
@ -26,59 +27,62 @@ export interface CatalogEntityDetailsProps<T extends CatalogEntity> {
} }
interface Dependencies { interface Dependencies {
detailItems: IComputedValue<CatalogEntityDetailItem<any>[]>; detailItems: IComputedValue<CatalogEntityDetailItem<CatalogEntity>[]>;
showDefaultCatalogEntityDetailItems: IComputedValue<boolean>;
} }
@observer @observer
class NonInjectedCatalogEntityDetails<T extends CatalogEntity> extends Component<CatalogEntityDetailsProps<T> & Dependencies> { class NonInjectedCatalogEntityDetails<T extends CatalogEntity> extends Component<CatalogEntityDetailsProps<T> & Dependencies> {
renderContent(entity: T) { renderContent(entity: T) {
const { onRun, hideDetails } = this.props; const { onRun, hideDetails, showDefaultCatalogEntityDetailItems } = this.props;
return ( return (
<> <>
<div className="flex"> {showDefaultCatalogEntityDetailItems.get() && (
<div className={styles.entityIcon}> <div className="flex">
<Avatar <div className={styles.entityIcon}>
title={entity.getName()} <Avatar
colorHash={`${entity.getName()}-${entity.getSource()}`} title={entity.getName()}
size={128} colorHash={`${entity.getName()}-${entity.getSource()}`}
src={entity.spec.icon?.src} size={128}
data-testid="detail-panel-hot-bar-icon" src={entity.spec.icon?.src}
background={entity.spec.icon?.background} data-testid="detail-panel-hot-bar-icon"
onClick={onRun} background={entity.spec.icon?.background}
className={styles.avatar} onClick={onRun}
> className={styles.avatar}
{entity.spec.icon?.material && <Icon material={entity.spec.icon?.material}/>} >
</Avatar> {entity.spec.icon?.material && <Icon material={entity.spec.icon?.material}/>}
{entity.isEnabled() && ( </Avatar>
<div className={styles.hint}> {entity.isEnabled() && (
Click to open <div className={styles.hint}>
</div> Click to open
)} </div>
</div> )}
<div className={cssNames("box grow", styles.metadata)}> </div>
<DrawerItem name="Name"> <div className={cssNames("box grow", styles.metadata)}>
{entity.getName()} <DrawerItem name="Name">
</DrawerItem> {entity.getName()}
<DrawerItem name="Kind">
{entity.kind}
</DrawerItem>
<DrawerItem name="Source">
{entity.getSource()}
</DrawerItem>
<DrawerItem name="Status">
{entity.status.phase}
</DrawerItem>
<DrawerItem name="Labels">
{getLabelBadges(entity, hideDetails)}
</DrawerItem>
{isDevelopment && (
<DrawerItem name="Id">
{entity.getId()}
</DrawerItem> </DrawerItem>
)} <DrawerItem name="Kind">
{entity.kind}
</DrawerItem>
<DrawerItem name="Source">
{entity.getSource()}
</DrawerItem>
<DrawerItem name="Status">
{entity.status.phase}
</DrawerItem>
<DrawerItem name="Labels">
{getLabelBadges(entity, hideDetails)}
</DrawerItem>
{isDevelopment && (
<DrawerItem name="Id">
{entity.getId()}
</DrawerItem>
)}
</div>
</div> </div>
</div> )}
<div className="box grow"> <div className="box grow">
{this.props.detailItems.get().map(({ components: { Details }}, index) => <Details entity={entity} key={index} />)} {this.props.detailItems.get().map(({ components: { Details }}, index) => <Details entity={entity} key={index} />)}
</div> </div>
@ -104,12 +108,20 @@ class NonInjectedCatalogEntityDetails<T extends CatalogEntity> extends Component
} }
} }
const InjectedCatalogEntityDetails = withInjectables<Dependencies, CatalogEntityDetailsProps<CatalogEntity>>( const InjectedCatalogEntityDetails = withInjectables<
Dependencies,
CatalogEntityDetailsProps<CatalogEntity>
>(
NonInjectedCatalogEntityDetails, NonInjectedCatalogEntityDetails,
{ {
getProps: (di, props) => ({ getProps: (di, props) => ({
detailItems: di.inject(catalogEntityDetailItemsInjectable, props.entity), detailItems: di.inject(catalogEntityDetailItemsInjectable, props.entity),
showDefaultCatalogEntityDetailItems: di.inject(
showDefaultCatalogEntityDetailItemsInjectable,
props.entity,
),
...props, ...props,
}), }),
}, },

31
src/renderer/components/+catalog/show-default-catalog-entity-detail-items.injectable.ts Normal file
View File

@ -0,0 +1,31 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
import { computed } from "mobx";
import type { CatalogEntity } from "../../../common/catalog";
import catalogEntityDetailItemsInjectable from "./catalog-entity-detail-items/catalog-entity-detail-items.injectable";
// TODO: Extract "default" entity detail items from components to same level than other items are
const showDefaultCatalogEntityDetailItemsInjectable = getInjectable({
id: "show-default-catalog-entity-detail-items",
instantiate: (di, catalogEntity: CatalogEntity) => {
const catalogEntityDetailItems = di.inject(
catalogEntityDetailItemsInjectable,
catalogEntity,
);
return computed(() =>
!catalogEntityDetailItems.get().find((item) => item.orderNumber < -999),
);
},
lifecycle: lifecycleEnum.keyedSingleton({
getInstanceKey: (di, catalogEntity: CatalogEntity) =>
`${catalogEntity.kind}/${catalogEntity.apiVersion}`,
}),
});
export default showDefaultCatalogEntityDetailItemsInjectable;