Revert adding BOOLEAN_CHECK_RESPONSE_TYPE
Signed-off-by: kielosz <kielosz@gmail.com>
This commit is contained in:
@@ -93,7 +93,7 @@ If you follow the [Backend Example](https://github.com/backstage/backstage/tree/
|
||||
|
||||
## Adding custom rendering components
|
||||
|
||||
Default scorecard implementation displays only boolean check results. If you would like to support different types, you need to inject custom rendering components to the `TechInsightsClient` constructor.
|
||||
Default scorecard implementation displays only `json-rules-engine` check results. If you would like to support different types, you need to inject custom rendering components to the `TechInsightsClient` constructor.
|
||||
|
||||
```ts
|
||||
// packages/app/src/apis.ts
|
||||
@@ -108,8 +108,8 @@ export const apis: AnyApiFactory[] = [
|
||||
discoveryApi,
|
||||
identityApi,
|
||||
renderers: [
|
||||
booleanCheckResultRenderer, // default boolean renderer
|
||||
myCustomNumberRenderer, // custom renderer
|
||||
jsonRulesEngineCheckResultRenderer, // default json-rules-engine renderer
|
||||
myCustomBooleanRenderer, // custom renderer
|
||||
],
|
||||
}),
|
||||
}),
|
||||
@@ -118,12 +118,12 @@ export const apis: AnyApiFactory[] = [
|
||||
```
|
||||
|
||||
```tsx
|
||||
// packages/app/src/components/myCustomNumberRenderer.tsx
|
||||
// packages/app/src/components/myCustomBooleanRenderer.tsx
|
||||
|
||||
export const myCustomNumberRenderer: CheckResultRenderer = {
|
||||
type: 'number',
|
||||
export const myCustomBooleanRenderer: CheckResultRenderer = {
|
||||
type: 'boolean',
|
||||
component: (checkResult: CheckResult) => (
|
||||
<Typography>{checkResult.result}</Typography>
|
||||
<BooleanCheck checkResult={checkResult} />
|
||||
),
|
||||
};
|
||||
```
|
||||
|
||||
@@ -15,8 +15,12 @@ import { IdentityApi } from '@backstage/core-plugin-api';
|
||||
import { default as React_2 } from 'react';
|
||||
import { RouteRef } from '@backstage/core-plugin-api';
|
||||
|
||||
// @public
|
||||
export const booleanCheckResultRenderer: CheckResultRenderer;
|
||||
// @public (undocumented)
|
||||
export const BooleanCheck: ({
|
||||
checkResult,
|
||||
}: {
|
||||
checkResult: CheckResult;
|
||||
}) => JSX.Element;
|
||||
|
||||
// @public
|
||||
export type Check = {
|
||||
@@ -34,27 +38,22 @@ export type CheckResultRenderer = {
|
||||
};
|
||||
|
||||
// @public (undocumented)
|
||||
export const EntityTechInsightsScorecardCard: ({
|
||||
title,
|
||||
description,
|
||||
checksId,
|
||||
}: {
|
||||
export const EntityTechInsightsScorecardCard: (props: {
|
||||
title: string;
|
||||
description?: string | undefined;
|
||||
checksId?: string[] | undefined;
|
||||
}) => JSX.Element;
|
||||
|
||||
// @public (undocumented)
|
||||
export const EntityTechInsightsScorecardContent: ({
|
||||
title,
|
||||
description,
|
||||
checksId,
|
||||
}: {
|
||||
export const EntityTechInsightsScorecardContent: (props: {
|
||||
title: string;
|
||||
description?: string | undefined;
|
||||
checksId?: string[] | undefined;
|
||||
}) => JSX.Element;
|
||||
|
||||
// @public
|
||||
export const jsonRulesEngineCheckResultRenderer: CheckResultRenderer;
|
||||
|
||||
// @public
|
||||
export interface TechInsightsApi {
|
||||
// (undocumented)
|
||||
|
||||
@@ -26,7 +26,7 @@ import { CompoundEntityRef } from '@backstage/catalog-model';
|
||||
|
||||
import {
|
||||
CheckResultRenderer,
|
||||
booleanCheckResultRenderer,
|
||||
jsonRulesEngineCheckResultRenderer,
|
||||
} from '../components/CheckResultRenderer';
|
||||
|
||||
/** @public */
|
||||
@@ -46,7 +46,7 @@ export class TechInsightsClient implements TechInsightsApi {
|
||||
}
|
||||
|
||||
getCheckResultRenderers(types: string[]): CheckResultRenderer[] {
|
||||
const renderers = this.renderers ?? [booleanCheckResultRenderer];
|
||||
const renderers = this.renderers ?? [jsonRulesEngineCheckResultRenderer];
|
||||
return renderers.filter(d => types.includes(d.type));
|
||||
}
|
||||
|
||||
|
||||
@@ -19,11 +19,10 @@ import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline';
|
||||
import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline';
|
||||
import { CheckResult } from '@backstage/plugin-tech-insights-common';
|
||||
|
||||
type Prop = {
|
||||
checkResult: CheckResult;
|
||||
};
|
||||
|
||||
export const BooleanCheck = ({ checkResult }: Prop) => {
|
||||
/**
|
||||
* @public
|
||||
*/
|
||||
export const BooleanCheck = ({ checkResult }: { checkResult: CheckResult }) => {
|
||||
return !!checkResult.result ? (
|
||||
<CheckCircleOutline color="primary" />
|
||||
) : (
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/*
|
||||
* Copyright 2020 The Backstage Authors
|
||||
* Copyright 2022 The Backstage Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
@@ -14,10 +14,7 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import {
|
||||
BOOLEAN_CHECK_RESPONSE_TYPE,
|
||||
CheckResult,
|
||||
} from '@backstage/plugin-tech-insights-common';
|
||||
import { CheckResult } from '@backstage/plugin-tech-insights-common';
|
||||
import React from 'react';
|
||||
import { BooleanCheck } from './BooleanCheck';
|
||||
|
||||
@@ -32,12 +29,12 @@ export type CheckResultRenderer = {
|
||||
};
|
||||
|
||||
/**
|
||||
* Default renderer for boolean check results.
|
||||
* Default renderer for json-rules-engine check results.
|
||||
*
|
||||
* @public
|
||||
*/
|
||||
export const booleanCheckResultRenderer: CheckResultRenderer = {
|
||||
type: BOOLEAN_CHECK_RESPONSE_TYPE,
|
||||
export const jsonRulesEngineCheckResultRenderer: CheckResultRenderer = {
|
||||
type: 'json-rules-engine',
|
||||
component: (checkResult: CheckResult) => (
|
||||
<BooleanCheck checkResult={checkResult} />
|
||||
),
|
||||
|
||||
@@ -23,11 +23,7 @@ import { ScorecardInfo } from '../ScorecardsInfo';
|
||||
import Alert from '@material-ui/lab/Alert';
|
||||
import { techInsightsApiRef } from '../../api/TechInsightsApi';
|
||||
|
||||
export const ScorecardsCard = ({
|
||||
title,
|
||||
description,
|
||||
checksId,
|
||||
}: {
|
||||
export const ScorecardsCard = (props: {
|
||||
title: string;
|
||||
description?: string;
|
||||
checksId?: string[];
|
||||
|
||||
@@ -31,11 +31,7 @@ const useStyles = makeStyles(() => ({
|
||||
},
|
||||
}));
|
||||
|
||||
export const ScorecardsContent = ({
|
||||
title,
|
||||
description,
|
||||
checksId,
|
||||
}: {
|
||||
export const ScorecardsContent = (props: {
|
||||
title: string;
|
||||
description?: string;
|
||||
checksId?: string[];
|
||||
|
||||
@@ -29,14 +29,8 @@ const useStyles = makeStyles((theme: BackstageTheme) => ({
|
||||
},
|
||||
}));
|
||||
|
||||
type Checks = {
|
||||
checkResults: CheckResult[];
|
||||
title: string;
|
||||
description?: string;
|
||||
};
|
||||
|
||||
const infoCard = (
|
||||
title: string | undefined,
|
||||
title: string,
|
||||
description: string | undefined,
|
||||
className: string,
|
||||
element: JSX.Element,
|
||||
@@ -55,7 +49,12 @@ const infoCard = (
|
||||
</Grid>
|
||||
);
|
||||
|
||||
export const ScorecardInfo = ({ checkResults, title, description }: Checks) => {
|
||||
export const ScorecardInfo = (props: {
|
||||
checkResults: CheckResult[];
|
||||
title: string;
|
||||
description?: string;
|
||||
}) => {
|
||||
const { checkResults, title, description } = props;
|
||||
const classes = useStyles();
|
||||
|
||||
if (!checkResults.length) {
|
||||
|
||||
@@ -28,11 +28,8 @@ const useStyles = makeStyles((theme: BackstageTheme) => ({
|
||||
},
|
||||
}));
|
||||
|
||||
type Prop = {
|
||||
checkResults: CheckResult[];
|
||||
};
|
||||
|
||||
export const ScorecardsList = ({ checkResults }: Prop) => {
|
||||
export const ScorecardsList = (props: { checkResults: CheckResult[] }) => {
|
||||
const { checkResults } = props;
|
||||
const classes = useStyles();
|
||||
const api = useApi(techInsightsApiRef);
|
||||
|
||||
|
||||
@@ -21,5 +21,6 @@ export {
|
||||
|
||||
export { techInsightsApiRef, TechInsightsClient } from './api';
|
||||
export type { TechInsightsApi, Check } from './api';
|
||||
export { booleanCheckResultRenderer } from './components/CheckResultRenderer';
|
||||
export { BooleanCheck } from './components/BooleanCheck';
|
||||
export { jsonRulesEngineCheckResultRenderer } from './components/CheckResultRenderer';
|
||||
export type { CheckResultRenderer } from './components/CheckResultRenderer';
|
||||
|
||||
Reference in New Issue
Block a user