Fix the dev page and add a new example

Signed-off-by: Dominik Henneke <dominik.henneke@sda-se.com>

plugins/api-docs/dev/index.tsx

@@ -15,29 +15,34 @@
  */
 
 import { ApiEntity, Entity } from '@backstage/catalog-model';
+import { Content, Header, Page } from '@backstage/core-components';
 import { createDevApp } from '@backstage/dev-utils';
+import { CatalogEntityPage } from '@backstage/plugin-catalog';
 import { catalogApiRef, EntityProvider } from '@backstage/plugin-catalog-react';
 import React from 'react';
 import {
   apiDocsConfigRef,
+  apiDocsPlugin,
   ApiExplorerPage,
   defaultDefinitionWidgets,
   EntityApiDefinitionCard,
 } from '../src';
 import asyncapiApiEntity from './asyncapi-example-api.yaml';
 import graphqlApiEntity from './graphql-example-api.yaml';
+import invalidLanguageApiEntity from './invalid-language-example-api.yaml';
 import openapiApiEntity from './openapi-example-api.yaml';
 import otherApiEntity from './other-example-api.yaml';
-import { Content, Header, Page } from '@backstage/core-components';
 
 const mockEntities = [
   openapiApiEntity,
   asyncapiApiEntity,
   graphqlApiEntity,
+  invalidLanguageApiEntity,
   otherApiEntity,
 ] as unknown as Entity[];
 
 createDevApp()
+  .registerPlugin(apiDocsPlugin)
   .registerApi({
     api: catalogApiRef,
     deps: {},
@@ -65,6 +70,7 @@ createDevApp()
       };
     },
   })
+  .addPage({ element: <CatalogEntityPage /> })
   .addPage({ title: 'API Explorer', element: <ApiExplorerPage /> })
   .addPage({
     title: 'OpenAPI',
@@ -105,6 +111,19 @@ createDevApp()
       </Page>
     ),
   })
+  .addPage({
+    title: 'Invalid Language',
+    element: (
+      <Page themeId="home">
+        <Header title="Invalid Language" />
+        <Content>
+          <EntityProvider entity={invalidLanguageApiEntity as any as Entity}>
+            <EntityApiDefinitionCard />
+          </EntityProvider>
+        </Content>
+      </Page>
+    ),
+  })
   .addPage({
     title: 'Other',
     element: (

plugins/api-docs/dev/invalid-language-example-api.yaml

@@ -0,0 +1,48 @@
+apiVersion: backstage.io/v1alpha1
+kind: API
+metadata:
+  name: hello-world
+  description: Hello World example for gRPC
+spec:
+  type: my-invalid-language
+  lifecycle: deprecated
+  owner: team-c
+  definition: |
+    // Copyright 2015 gRPC authors.
+    //
+    // 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.
+
+    syntax = "proto3";
+
+    option java_multiple_files = true;
+    option java_package = "io.grpc.examples.helloworld";
+    option java_outer_classname = "HelloWorldProto";
+    option objc_class_prefix = "HLW";
+
+    package helloworld;
+
+    // The greeting service definition.
+    service Greeter {
+      // Sends a greeting
+      rpc SayHello (HelloRequest) returns (HelloReply) {}
+    }
+
+    // The request message containing the user's name.
+    message HelloRequest {
+      string name = 1;
+    }
+
+    // The response message containing the greetings
+    message HelloReply {
+      string message = 1;
+    }