refactor(api-docs): apply review suggestions

Signed-off-by: Camila Belo <camilaibs@gmail.com>

plugins/api-docs/README-alpha.md

@@ -406,9 +406,9 @@ For more information about where to place extension overrides, see the official
 
 An Entity Card extension that renders an entity api definition widget.
 
-| kind          | Namespace  | Name             | Id                                    |
-| ------------- | ---------- | ---------------- | ------------------------------------- |
-| `entity-card` | `api-docs` | `api-definition` | `entity-card:api-docs/api-definition` |
+| kind          | Namespace  | Name         | Id                                |
+| ------------- | ---------- | ------------ | --------------------------------- |
+| `entity-card` | `api-docs` | `definition` | `entity-card:api-docs/definition` |
 
 ###### Disable
 
@@ -416,15 +416,15 @@ This card is disabled by default when you install the `api-docs` plugin, but to
 
 ```yaml
 # app-config.yaml
-# example disabling the api definition entity card extension
+# example disabling the definition entity card extension
 app:
   extensions:
     # this is the extension id and it follows the naming pattern bellow:
     # <extension-kind>/<plugin-namespace>:<extension-name>
     # use false as value for disabling the extension and true for enabling
-    - entity-card:api-docs/api-definition: false
+    - entity-card:api-docs/definition: false
     # or
-    # - entity-card:api-docs/api-definition:
+    # - entity-card:api-docs/definition:
     #   - config:
     #       # set 'true' for enabling it again
     #       disabled: true
@@ -433,7 +433,7 @@ app:
 ###### Config
 
 For now there is only one configuration available for this entity cards extension, which is setting an entity filter that determines when the cards should be displayed on the entity page.
-Here is an example showing the `api-definition` overview cards only for entities of kind component:
+Here is an example showing the `definition` overview cards only for entities of kind component:
 
 ```yaml
 # app-config.yaml
@@ -442,7 +442,7 @@ app:
   extensions:
     # this is the extension id and it follows the naming pattern bellow:
     # <extension-kind>/<plugin-namespace>:<extension-name>
-    - entity-card:api-docs/api-definition:
+    - entity-card:api-docs/definition:
         config:
           # For more information about entity cards filters, check out this pull request
           # https://github.com/backstage/backstage/pull/21480
@@ -460,9 +460,9 @@ import { createEntityCardExtension } from '@backstage/plugin-catalog-react/alpha
 export default createExtensionOverrides({
   extensions: [
     createEntityCardExtension({
-      // These namespace and name necessary so the system knows that this extension will override the default 'api-definition' entity card extension provided by the 'api-docs' plugin
+      // These namespace and name necessary so the system knows that this extension will override the default 'definition' entity card extension provided by the 'api-docs' plugin
       namespace: 'api-docs',
-      name: 'api-definition',
+      name: 'definition',
       // Returing a custom card component
       loader: () =>
         import('./components').then(m => <m.MyCustomApiDefinitionEntityCard />),

plugins/api-docs/src/alpha.tsx

@@ -46,13 +46,13 @@ function ApiIcon() {
   return <KindApiSystemIcon />;
 }
 
-const ApiDocsNavItem = createNavItemExtension({
+const apiDocsNavItem = createNavItemExtension({
   title: 'APIs',
   routeRef: convertLegacyRouteRef(rootRoute),
   icon: () => compatWrapper(<ApiIcon />),
 });
 
-const ApiDocsConfigApi = createApiExtension({
+const apiDocsConfigApi = createApiExtension({
   factory: createApiFactory({
     api: apiDocsConfigRef,
     deps: {},
@@ -67,7 +67,7 @@ const ApiDocsConfigApi = createApiExtension({
   }),
 });
 
-const ApiDocsExplorerPage = createPageExtension({
+const apiDocsExplorerPage = createPageExtension({
   defaultPath: '/api-docs',
   routeRef: convertLegacyRouteRef(rootRoute),
   // Mapping DefaultApiExplorerPageProps to config
@@ -88,22 +88,25 @@ const ApiDocsExplorerPage = createPageExtension({
     ),
 });
 
-const ApiDocsHasApisEntityCard = createEntityCardExtension({
+const apiDocsHasApisEntityCard = createEntityCardExtension({
   name: 'has-apis',
   // we are skipping variants, see: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
   // and columns are too complex to map to zod
-  loader: () => import('./components/ApisCards').then(m => <m.HasApisCard />),
+  loader: () =>
+    import('./components/ApisCards').then(m =>
+      compatWrapper(<m.HasApisCard />),
+    ),
 });
 
-const ApiDocsDefinitionEntityCard = createEntityCardExtension({
-  name: 'api-definition',
+const apiDocsDefinitionEntityCard = createEntityCardExtension({
+  name: 'definition',
   loader: () =>
     import('./components/ApiDefinitionCard').then(m =>
       compatWrapper(<m.ApiDefinitionCard />),
     ),
 });
 
-const ApiDocsConsumedApisEntityCard = createEntityCardExtension({
+const apiDocsConsumedApisEntityCard = createEntityCardExtension({
   name: 'consumed-apis',
   // Ommiting configSchema for now
   // we are skipping variants, see: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
@@ -114,7 +117,7 @@ const ApiDocsConsumedApisEntityCard = createEntityCardExtension({
     ),
 });
 
-const ApiDocsProvidedApisEntityCard = createEntityCardExtension({
+const apiDocsProvidedApisEntityCard = createEntityCardExtension({
   name: 'provided-apis',
   // we are skipping variants, see: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
   // and columns are too complex to map to zod
@@ -124,7 +127,7 @@ const ApiDocsProvidedApisEntityCard = createEntityCardExtension({
     ),
 });
 
-const ApiDocsConsumingComponentsEntityCard = createEntityCardExtension({
+const apiDocsConsumingComponentsEntityCard = createEntityCardExtension({
   name: 'consuming-components',
   // Ommiting configSchema for now
   // we are skipping variants, see: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
@@ -134,7 +137,7 @@ const ApiDocsConsumingComponentsEntityCard = createEntityCardExtension({
     ),
 });
 
-const ApiDocsProvidingComponentsEntityCard = createEntityCardExtension({
+const apiDocsProvidingComponentsEntityCard = createEntityCardExtension({
   name: 'providing-components',
   // Ommiting configSchema for now
   // we are skipping variants, see: https://github.com/backstage/backstage/pull/22619#discussion_r1477333252
@@ -144,7 +147,7 @@ const ApiDocsProvidingComponentsEntityCard = createEntityCardExtension({
     ),
 });
 
-const ApiDocsDefinitionEntityContent = createEntityContentExtension({
+const apiDocsDefinitionEntityContent = createEntityContentExtension({
   name: 'definition',
   defaultPath: '/defintion',
   defaultTitle: 'Definition',
@@ -161,7 +164,7 @@ const ApiDocsDefinitionEntityContent = createEntityContentExtension({
     ),
 });
 
-const ApiDocsApisEntityContent = createEntityContentExtension({
+const apiDocsApisEntityContent = createEntityContentExtension({
   name: 'apis',
   defaultPath: '/apis',
   defaultTitle: 'APIs',
@@ -190,16 +193,16 @@ export default createPlugin({
     registerApi: convertLegacyRouteRef(registerComponentRouteRef),
   },
   extensions: [
-    ApiDocsNavItem,
-    ApiDocsConfigApi,
-    ApiDocsExplorerPage,
-    ApiDocsHasApisEntityCard,
-    ApiDocsDefinitionEntityCard,
-    ApiDocsProvidedApisEntityCard,
-    ApiDocsConsumedApisEntityCard,
-    ApiDocsConsumingComponentsEntityCard,
-    ApiDocsProvidingComponentsEntityCard,
-    ApiDocsDefinitionEntityContent,
-    ApiDocsApisEntityContent,
+    apiDocsNavItem,
+    apiDocsConfigApi,
+    apiDocsExplorerPage,
+    apiDocsHasApisEntityCard,
+    apiDocsDefinitionEntityCard,
+    apiDocsProvidedApisEntityCard,
+    apiDocsConsumedApisEntityCard,
+    apiDocsConsumingComponentsEntityCard,
+    apiDocsProvidingComponentsEntityCard,
+    apiDocsDefinitionEntityContent,
+    apiDocsApisEntityContent,
   ],
 });