From 079b3e025bbe0f98d5aa109825ef7768c3a974d8 Mon Sep 17 00:00:00 2001 From: Patrik Oldsberg Date: Mon, 5 Apr 2021 18:27:59 +0200 Subject: [PATCH] config-schema: switch schema type and separate out SchemaViewer Signed-off-by: Patrik Oldsberg --- plugins/config-schema/dev/index.tsx | 3 ++- plugins/config-schema/package.json | 1 + plugins/config-schema/src/api/types.ts | 4 +-- .../ConfigSchemaPage/ConfigSchemaPage.tsx | 13 +++------- .../components/SchemaViewer/SchemaViewer.tsx | 26 +++++++++++++++++++ .../src/components/SchemaViewer/index.ts | 17 ++++++++++++ 6 files changed, 51 insertions(+), 13 deletions(-) create mode 100644 plugins/config-schema/src/components/SchemaViewer/SchemaViewer.tsx create mode 100644 plugins/config-schema/src/components/SchemaViewer/index.ts diff --git a/plugins/config-schema/dev/index.tsx b/plugins/config-schema/dev/index.tsx index 03aa8e172a..412f0d283e 100644 --- a/plugins/config-schema/dev/index.tsx +++ b/plugins/config-schema/dev/index.tsx @@ -15,6 +15,7 @@ */ import { createDevApp } from '@backstage/dev-utils'; +import { Schema } from 'jsonschema'; import React from 'react'; import Observable from 'zen-observable'; import { configSchemaApiRef } from '../src/api'; @@ -30,7 +31,7 @@ createDevApp() factory: () => ({ schema$: () => new Observable(sub => - sub.next({ schema: exampleSchema }), + sub.next({ schema: (exampleSchema as unknown) as Schema }), ), }), }) diff --git a/plugins/config-schema/package.json b/plugins/config-schema/package.json index 3ca14a8162..67dcfa5976 100644 --- a/plugins/config-schema/package.json +++ b/plugins/config-schema/package.json @@ -26,6 +26,7 @@ "@material-ui/core": "^4.11.0", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.45", + "jsonschema": "^1.2.6", "zen-observable": "^0.8.15", "react": "^16.13.1", "react-dom": "^16.13.1", diff --git a/plugins/config-schema/src/api/types.ts b/plugins/config-schema/src/api/types.ts index 310817e68f..025ef76f0c 100644 --- a/plugins/config-schema/src/api/types.ts +++ b/plugins/config-schema/src/api/types.ts @@ -14,11 +14,11 @@ * limitations under the License. */ -import { JsonObject } from '@backstage/config'; import { createApiRef, Observable } from '@backstage/core'; +import { Schema } from 'jsonschema'; export interface ConfigSchemaResult { - schema?: JsonObject; + schema?: Schema; } export interface ConfigSchemaApi { diff --git a/plugins/config-schema/src/components/ConfigSchemaPage/ConfigSchemaPage.tsx b/plugins/config-schema/src/components/ConfigSchemaPage/ConfigSchemaPage.tsx index 67cff7a596..8811a3e0bd 100644 --- a/plugins/config-schema/src/components/ConfigSchemaPage/ConfigSchemaPage.tsx +++ b/plugins/config-schema/src/components/ConfigSchemaPage/ConfigSchemaPage.tsx @@ -22,17 +22,17 @@ import { ContentHeader, HeaderLabel, SupportButton, - CodeSnippet, useApi, } from '@backstage/core'; import { useObservable } from 'react-use'; import { configSchemaApiRef } from '../../api'; +import { SchemaViewer } from '../SchemaViewer'; export const ConfigSchemaPage = () => { const configSchemaApi = useApi(configSchemaApiRef); const schema = useObservable( useMemo(() => configSchemaApi.schema$(), [configSchemaApi]), - ); + )?.schema; return ( @@ -46,14 +46,7 @@ export const ConfigSchemaPage = () => { - {schema ? ( - - ) : ( - 'No schema available' - )} + {schema ? : 'No schema available'} diff --git a/plugins/config-schema/src/components/SchemaViewer/SchemaViewer.tsx b/plugins/config-schema/src/components/SchemaViewer/SchemaViewer.tsx new file mode 100644 index 0000000000..3f4c11fc31 --- /dev/null +++ b/plugins/config-schema/src/components/SchemaViewer/SchemaViewer.tsx @@ -0,0 +1,26 @@ +/* + * Copyright 2021 Spotify AB + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; +import { CodeSnippet } from '@backstage/core'; +import { Schema } from 'jsonschema'; + +export interface SchemaViewerProps { + schema: Schema; +} + +export const SchemaViewer = ({ schema }: SchemaViewerProps) => { + return ; +}; diff --git a/plugins/config-schema/src/components/SchemaViewer/index.ts b/plugins/config-schema/src/components/SchemaViewer/index.ts new file mode 100644 index 0000000000..4852c4e21d --- /dev/null +++ b/plugins/config-schema/src/components/SchemaViewer/index.ts @@ -0,0 +1,17 @@ +/* + * Copyright 2021 Spotify AB + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export { SchemaViewer } from './SchemaViewer';