docs/frontend-system: update existing usage of ApiBlueprint

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
2025-07-29 10:31:58 +02:00
parent 781716d247
commit d6764eed83
5 changed files with 12 additions and 23 deletions
@@ -154,19 +154,18 @@ export function ExamplePage() {
 ```

 ```tsx title="in src/plugin.ts - Registering a factory for our API"
-import { createApiFactory, ApiBlueprint } from '@backstage/frontend-plugin-api';
+import { ApiBlueprint } from '@backstage/frontend-plugin-api';
 import { exampleApiRef, DefaultExampleApi } from './api';

 // highlight-add-start
 const exampleApi = ApiBlueprint.make({
  name: 'example',
-  params: {
-    factory: createApiFactory({
+  params: define =>
+    define({
      api: exampleApiRef,
      deps: {},
      factory: () => new DefaultExampleApi(),
    }),
-  },
 });
 // highlight-add-end

@@ -205,22 +205,17 @@ The major changes we'll make are
 The end result, after simplifying imports and cleaning up a bit, might look like this:

 ```tsx title="in @internal/plugin-example"
-import {
-  storageApiRef,
-  createApiFactory,
-  ApiBlueprint,
-} from '@backstage/frontend-plugin-api';
+import { storageApiRef, ApiBlueprint } from '@backstage/frontend-plugin-api';
 import { workApiRef } from '@internal/plugin-example-react';
 import { WorkImpl } from './WorkImpl';

 const exampleWorkApi = ApiBlueprint.make({
-  params: {
-    factory: createApiFactory({
+  params: define =>
+    define({
      api: workApiRef,
      deps: { storageApi: storageApiRef },
      factory: ({ storageApi }) => new WorkImpl({ storageApi }),
    }),
-  },
 });
 ```