@backstage-community/plugin-badges 0.2.59

package/README.md

@@ -0,0 +1,204 @@
+# @backstage-community/plugin-badges
+
+The badges plugin offers a set of badges that can be used outside of
+your backstage deployment, showing information related to data from
+the catalog, such as entity owner and lifecycle data for instance.
+
+The available badges are setup in the `badges-backend` plugin, see
+link below for more details.
+
+## Entity badges
+
+To get markdown code for the entity badges, access the `Badges` context menu
+(three dots in the upper right corner) of an entity page like this:
+
+![Badges Context Menu](./doc/badges-context-menu.png)
+
+This will popup a badges dialog showing all available badges for that entity like this:
+
+![Badges Dialog](./doc/badges-dialog.png)
+
+##  Badge obfuscation
+
+The badges plugin supports obfuscating the badge URL to prevent it from being enumerated if the badges are used in a public context (like in Github repositories).
+
+To enable obfuscation, set the `obfuscate` option to `true` in the `app.badges` section of your `app-config.yaml`:
+
+```yaml
+app:
+  badges:
+    obfuscate: true
+```
+
+Please note that if you have already set badges in your repositories and you activate the obfuscation you will need to update the badges in your repositories to use the new obfuscated URLs.
+
+Please note that the backend part needs to be configured to support obfuscation. See the [backend plugin documentation](../badges-backend/README.md) for more details.
+
+Also, you need to allow your frontend to access the configuration see <https://backstage.io/docs/conf/defining/#visibility> :
+
+Example implementation would be in : `packages/app/src/config.d.ts`
+
+```typescript
+export interface Config {
+  app: {
+    ... some code
+    badges: {
+      /**
+       * badges obfuscate
+       * @visibility frontend
+       */
+      obfuscate?: string;
+    };
+  };
+}
+```
+
+then include in the `packages/app/package.json` :
+
+```json
+"files": [
+    "dist",
+    "config.d.ts"
+  ],
+"configSchema": "config.d.ts",
+```
+
+## Sample Badges
+
+Here are some samples of badges for the `artists-lookup` service in the Demo Backstage site:
+
+- Component: [![Link to artist-lookup in Backstage Demo, Component: artist-lookup](https://demo.backstage.io/api/badges/entity/default/component/artist-lookup/badge/pingback 'Link to artist-lookup in Backstage Demo')](https://demo.backstage.io/catalog/default/component/artist-lookup)
+- Lifecycle: [![Entity lifecycle badge, lifecycle: experimental](https://demo.backstage.io/api/badges/entity/default/component/artist-lookup/badge/lifecycle 'Entity lifecycle badge')](https://demo.backstage.io/catalog/default/component/artist-lookup)
+- Owner: [![Entity owner badge, owner: team-a](https://demo.backstage.io/api/badges/entity/default/component/artist-lookup/badge/owner 'Entity owner badge')](https://demo.backstage.io/catalog/default/component/artist-lookup)
+- Docs: [![Entity docs badge, docs: artist-lookup](https://demo.backstage.io/api/badges/entity/default/component/artist-lookup/badge/docs 'Entity docs badge')](https://demo.backstage.io/catalog/default/component/artist-lookup/docs)
+
+## Usage
+
+### Install the package
+
+Install the `@backstage-community/plugin-badges` package in your frontend app package:
+
+```bash
+# From your Backstage root directory
+yarn --cwd packages/app add @backstage-community/plugin-badges
+```
+
+### Register plugin
+
+This plugin requires explicit registration, so you will need to add it to your App's `plugins.ts` file:
+
+```ts
+import { badgesPlugin } from '@backstage-community/plugin-badges';
+```
+
+If you don't have a `plugins.ts` file see: [troubleshooting](#troubleshooting)
+
+### Update your EntityPage
+
+In your `EntityPage.tsx` file located in `packages\app\src\components\catalog` we'll need to make a few changes to get the Badges context menu added to the UI.
+
+First we need to add the following imports:
+
+```ts
+import { EntityBadgesDialog } from '@backstage-community/plugin-badges';
+import BadgeIcon from '@material-ui/icons/CallToAction';
+```
+
+Next we'll update the React import that looks like this:
+
+```ts
+import React from 'react';
+```
+
+To look like this:
+
+```ts
+import React, { ReactNode, useMemo, useState } from 'react';
+```
+
+Then we have to add this chunk of code after all the imports but before any of the other code:
+
+```ts
+const EntityLayoutWrapper = (props: { children?: ReactNode }) => {
+  const [badgesDialogOpen, setBadgesDialogOpen] = useState(false);
+
+  const extraMenuItems = useMemo(() => {
+    return [
+      {
+        title: 'Badges',
+        Icon: BadgeIcon,
+        onClick: () => setBadgesDialogOpen(true),
+      },
+    ];
+  }, []);
+
+  return (
+    <>
+      <EntityLayout UNSTABLE_extraContextMenuItems={extraMenuItems}>
+        {props.children}
+      </EntityLayout>
+      <EntityBadgesDialog
+        open={badgesDialogOpen}
+        onClose={() => setBadgesDialogOpen(false)}
+      />
+    </>
+  );
+};
+```
+
+The last step is to wrap all the entity pages in the `EntityLayoutWrapper` like this:
+
+```diff
+const defaultEntityPage = (
++  <EntityLayoutWrapper>
+    <EntityLayout.Route path="/" title="Overview">
+      {overviewContent}
+    </EntityLayout.Route>
+
+    <EntityLayout.Route path="/docs" title="Docs">
+      <EntityTechdocsContent />
+    </EntityLayout.Route>
+
+    <EntityLayout.Route path="/todos" title="TODOs">
+      <EntityTodoContent />
+    </EntityLayout.Route>
++  </EntityLayoutWrapper>
+);
+```
+
+Note: the above only shows an example for the `defaultEntityPage` for a full example of this you can look at [this EntityPage](https://github.com/backstage/backstage/blob/1fd9e6f601cabe42af8eb20b5d200ad1988ba309/packages/app/src/components/catalog/EntityPage.tsx#L318)
+
+## Troubleshooting
+
+If you don't have a `plugins.ts` file, you can create it with the path `packages/app/src/plugins.ts` and then import it into your `App.tsx`:
+
+```diff
++ import * as plugins from './plugins';
+
+const app = createApp({
+  apis,
++   plugins: Object.values(plugins),
+  bindRoutes({ bind }) {
+    /* ... */
+  },
+});
+```
+
+Or simply edit `App.tsx` with:
+
+```diff
++ import { badgesPlugin } from '@backstage-community/plugin-badges'
+
+const app = createApp({
+  apis,
++   plugins: [badgesPlugin],
+  bindRoutes({ bind }) {
+    /* ... */
+  },
+});
+```
+
+## Links
+
+- [Backend part of the plugin](https://github.com/backstage/backstage/tree/master/plugins/badges-backend)
+- [The Backstage homepage](https://backstage.io)

package/dist/esm/EntityBadgesDialog-DwRwuts8.esm.js

@@ -0,0 +1,43 @@
+import { useAsyncEntity } from '@backstage/plugin-catalog-react';
+import Box from '@material-ui/core/Box';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogContentText from '@material-ui/core/DialogContentText';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import { useTheme } from '@material-ui/core/styles';
+import React from 'react';
+import useAsync from 'react-use/esm/useAsync';
+import 'react-router-dom';
+import '@backstage/errors';
+import '@backstage/catalog-model';
+import { b as badgesApiRef } from './index-R_9uVcjC.esm.js';
+import { CodeSnippet, Progress, ResponseErrorPanel } from '@backstage/core-components';
+import { useApi } from '@backstage/core-plugin-api';
+
+const EntityBadgesDialog = (props) => {
+  const { open, onClose } = props;
+  const theme = useTheme();
+  const { entity } = useAsyncEntity();
+  const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
+  const badgesApi = useApi(badgesApiRef);
+  const {
+    value: badges,
+    loading,
+    error
+  } = useAsync(async () => {
+    if (open && entity) {
+      return await badgesApi.getEntityBadgeSpecs(entity);
+    }
+    return [];
+  }, [badgesApi, entity, open]);
+  const content = (badges || []).map(
+    ({ badge: { description }, id, url, markdown }) => /* @__PURE__ */ React.createElement(Box, { marginTop: 4, key: id }, /* @__PURE__ */ React.createElement(DialogContentText, { component: "div" }, /* @__PURE__ */ React.createElement("img", { alt: description || id, src: url }), /* @__PURE__ */ React.createElement(CodeSnippet, { language: "markdown", text: markdown, showCopyCodeButton: true })))
+  );
+  return /* @__PURE__ */ React.createElement(Dialog, { fullScreen, open, onClose }, /* @__PURE__ */ React.createElement(DialogTitle, null, "Entity Badges"), /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(DialogContentText, null, "Embed badges in other web sites that link back to this entity. Copy the relevant snippet of Markdown code to use the badge."), loading && /* @__PURE__ */ React.createElement(Progress, null), error && /* @__PURE__ */ React.createElement(ResponseErrorPanel, { error }), content), /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { onClick: onClose, color: "primary" }, "Close")));
+};
+
+export { EntityBadgesDialog };
+//# sourceMappingURL=EntityBadgesDialog-DwRwuts8.esm.js.map

package/dist/esm/EntityBadgesDialog-DwRwuts8.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntityBadgesDialog-DwRwuts8.esm.js","sources":["../../src/components/EntityBadgesDialog.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useAsyncEntity } from '@backstage/plugin-catalog-react';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport DialogContentText from '@material-ui/core/DialogContentText';\nimport DialogTitle from '@material-ui/core/DialogTitle';\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\nimport { useTheme } from '@material-ui/core/styles';\nimport React from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport { badgesApiRef } from '../api';\n\nimport {\n  CodeSnippet,\n  Progress,\n  ResponseErrorPanel,\n} from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\n\nexport const EntityBadgesDialog = (props: {\n  open: boolean;\n  onClose?: () => any;\n}) => {\n  const { open, onClose } = props;\n  const theme = useTheme();\n  const { entity } = useAsyncEntity();\n  const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));\n  const badgesApi = useApi(badgesApiRef);\n\n  const {\n    value: badges,\n    loading,\n    error,\n  } = useAsync(async () => {\n    if (open && entity) {\n      return await badgesApi.getEntityBadgeSpecs(entity);\n    }\n    return [];\n  }, [badgesApi, entity, open]);\n\n  const content = (badges || []).map(\n    ({ badge: { description }, id, url, markdown }) => (\n      <Box marginTop={4} key={id}>\n        <DialogContentText component=\"div\">\n          <img alt={description || id} src={url} />\n          <CodeSnippet language=\"markdown\" text={markdown} showCopyCodeButton />\n        </DialogContentText>\n      </Box>\n    ),\n  );\n\n  return (\n    <Dialog fullScreen={fullScreen} open={open} onClose={onClose}>\n      <DialogTitle>Entity Badges</DialogTitle>\n      <DialogContent>\n        <DialogContentText>\n          Embed badges in other web sites that link back to this entity. Copy\n          the relevant snippet of Markdown code to use the badge.\n        </DialogContentText>\n\n        {loading && <Progress />}\n        {error && <ResponseErrorPanel error={error} />}\n\n        {content}\n      </DialogContent>\n\n      <DialogActions>\n        <Button onClick={onClose} color=\"primary\">\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAqCa,MAAA,kBAAA,GAAqB,CAAC,KAG7B,KAAA;AACJ,EAAM,MAAA,EAAE,IAAM,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AAC1B,EAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AACvB,EAAM,MAAA,EAAE,MAAO,EAAA,GAAI,cAAe,EAAA,CAAA;AAClC,EAAA,MAAM,aAAa,aAAc,CAAA,KAAA,CAAM,WAAY,CAAA,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA;AAC7D,EAAM,MAAA,SAAA,GAAY,OAAO,YAAY,CAAA,CAAA;AAErC,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,MAAA;AAAA,IACP,OAAA;AAAA,IACA,KAAA;AAAA,GACF,GAAI,SAAS,YAAY;AACvB,IAAA,IAAI,QAAQ,MAAQ,EAAA;AAClB,MAAO,OAAA,MAAM,SAAU,CAAA,mBAAA,CAAoB,MAAM,CAAA,CAAA;AAAA,KACnD;AACA,IAAA,OAAO,EAAC,CAAA;AAAA,GACP,EAAA,CAAC,SAAW,EAAA,MAAA,EAAQ,IAAI,CAAC,CAAA,CAAA;AAE5B,EAAM,MAAA,OAAA,GAAA,CAAW,MAAU,IAAA,EAAI,EAAA,GAAA;AAAA,IAC7B,CAAC,EAAE,KAAA,EAAO,EAAE,WAAA,IAAe,EAAI,EAAA,GAAA,EAAK,QAAS,EAAA,yCAC1C,GAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,GAAA,EAAK,sBACrB,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAkB,SAAU,EAAA,KAAA,EAAA,sCAC1B,KAAI,EAAA,EAAA,GAAA,EAAK,WAAe,IAAA,EAAA,EAAI,KAAK,GAAK,EAAA,CAAA,kBACtC,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,EAAY,UAAS,UAAW,EAAA,IAAA,EAAM,UAAU,kBAAkB,EAAA,IAAA,EAAC,CACtE,CACF,CAAA;AAAA,GAEJ,CAAA;AAEA,EAAA,2CACG,MAAO,EAAA,EAAA,UAAA,EAAwB,IAAY,EAAA,OAAA,EAAA,sCACzC,WAAY,EAAA,IAAA,EAAA,eAAa,CAC1B,kBAAA,KAAA,CAAA,aAAA,CAAC,qCACE,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,IAAA,EAAkB,6HAGnB,CAAA,EAEC,2BAAY,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAS,CACrB,EAAA,KAAA,wCAAU,kBAAmB,EAAA,EAAA,KAAA,EAAc,CAE3C,EAAA,OACH,mBAEC,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,SAAS,OAAS,EAAA,KAAA,EAAM,SAAU,EAAA,EAAA,OAE1C,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/esm/index-R_9uVcjC.esm.js

@@ -0,0 +1,116 @@
+import { generatePath } from 'react-router-dom';
+import { ResponseError } from '@backstage/errors';
+import { DEFAULT_NAMESPACE } from '@backstage/catalog-model';
+import { createApiRef, createPlugin, createApiFactory, fetchApiRef, discoveryApiRef, configApiRef, createComponentExtension } from '@backstage/core-plugin-api';
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class BadgesClient {
+  constructor(options) {
+    __publicField(this, "discoveryApi");
+    __publicField(this, "fetchApi");
+    __publicField(this, "configApi");
+    this.discoveryApi = options.discoveryApi;
+    this.fetchApi = options.fetchApi;
+    this.configApi = options.configApi;
+  }
+  static fromConfig(options) {
+    return new BadgesClient(options);
+  }
+  async getEntityBadgeSpecs(entity) {
+    const obfuscate = this.configApi.getOptionalBoolean("app.badges.obfuscate");
+    if (obfuscate) {
+      const entityUuidUrl = await this.getEntityUuidUrl(entity);
+      const entityUuid = await this.getEntityUuid(entityUuidUrl).then((data) => {
+        return data.uuid;
+      });
+      const entityUuidBadgeSpecsUrl = await this.getEntityUuidBadgeSpecsUrl(
+        entityUuid
+      );
+      const response2 = await this.fetchApi.fetch(entityUuidBadgeSpecsUrl);
+      if (!response2.ok) {
+        throw await ResponseError.fromResponse(response2);
+      }
+      return await response2.json();
+    }
+    const entityBadgeSpecsUrl = await this.getEntityBadgeSpecsUrl(entity);
+    const response = await this.fetchApi.fetch(entityBadgeSpecsUrl);
+    if (!response.ok) {
+      throw await ResponseError.fromResponse(response);
+    }
+    return await response.json();
+  }
+  async getEntityUuidUrl(entity) {
+    const routeParams = this.getEntityRouteParams(entity);
+    const path = generatePath(`:namespace/:kind/:name`, routeParams);
+    const baseUrl = await this.discoveryApi.getBaseUrl("badges");
+    const obfuscatedEntityUrl = `${baseUrl}/entity/${path}/obfuscated`;
+    return obfuscatedEntityUrl;
+  }
+  async getEntityUuid(entityUuidUrl) {
+    const responseEntityUuid = await this.fetchApi.fetch(entityUuidUrl);
+    if (!responseEntityUuid.ok) {
+      throw await ResponseError.fromResponse(responseEntityUuid);
+    }
+    return await responseEntityUuid.json();
+  }
+  async getEntityUuidBadgeSpecsUrl(entityUuid) {
+    const baseUrl = await this.discoveryApi.getBaseUrl("badges");
+    return `${baseUrl}/entity/${entityUuid}/badge-specs`;
+  }
+  async getEntityBadgeSpecsUrl(entity) {
+    const routeParams = this.getEntityRouteParams(entity);
+    const path = generatePath(`:namespace/:kind/:name`, routeParams);
+    const baseUrl = await this.discoveryApi.getBaseUrl("badges");
+    return `${baseUrl}/entity/${path}/badge-specs`;
+  }
+  // This function is used to generate the route parameters using the entity kind, namespace and name
+  getEntityRouteParams(entity) {
+    var _a, _b;
+    return {
+      kind: entity.kind.toLocaleLowerCase("en-US"),
+      namespace: (_b = (_a = entity.metadata.namespace) == null ? void 0 : _a.toLocaleLowerCase("en-US")) != null ? _b : DEFAULT_NAMESPACE,
+      name: entity.metadata.name
+    };
+  }
+}
+
+const badgesApiRef = createApiRef({
+  id: "plugin.badges.client"
+});
+
+const badgesPlugin = createPlugin({
+  id: "badges",
+  apis: [
+    createApiFactory({
+      api: badgesApiRef,
+      deps: {
+        fetchApi: fetchApiRef,
+        discoveryApi: discoveryApiRef,
+        configApi: configApiRef
+      },
+      factory: ({ fetchApi, discoveryApi, configApi }) => new BadgesClient({
+        fetchApi,
+        discoveryApi,
+        configApi
+      })
+    })
+  ]
+});
+const EntityBadgesDialog = badgesPlugin.provide(
+  createComponentExtension({
+    name: "EntityBadgesDialog",
+    component: {
+      lazy: () => import('./EntityBadgesDialog-DwRwuts8.esm.js').then(
+        (m) => m.EntityBadgesDialog
+      )
+    }
+  })
+);
+
+export { EntityBadgesDialog as E, badgesPlugin as a, badgesApiRef as b };
+//# sourceMappingURL=index-R_9uVcjC.esm.js.map

package/dist/esm/index-R_9uVcjC.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-R_9uVcjC.esm.js","sources":["../../src/api/BadgesClient.ts","../../src/api/types.ts","../../src/plugin.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { generatePath } from 'react-router-dom';\nimport { ResponseError } from '@backstage/errors';\nimport { Entity, DEFAULT_NAMESPACE } from '@backstage/catalog-model';\nimport { BadgesApi, BadgeSpec } from './types';\nimport { ConfigApi, DiscoveryApi, FetchApi } from '@backstage/core-plugin-api';\n\nexport class BadgesClient implements BadgesApi {\n  private readonly discoveryApi: DiscoveryApi;\n  private readonly fetchApi: FetchApi;\n  private readonly configApi: ConfigApi;\n\n  constructor(options: {\n    discoveryApi: DiscoveryApi;\n    fetchApi: FetchApi;\n    configApi: ConfigApi;\n  }) {\n    this.discoveryApi = options.discoveryApi;\n    this.fetchApi = options.fetchApi;\n    this.configApi = options.configApi;\n  }\n\n  static fromConfig(options: {\n    fetchApi: FetchApi;\n    discoveryApi: DiscoveryApi;\n    configApi: ConfigApi;\n  }) {\n    return new BadgesClient(options);\n  }\n\n  public async getEntityBadgeSpecs(entity: Entity): Promise<BadgeSpec[]> {\n    // Check if obfuscation is enabled in the configuration\n    const obfuscate = this.configApi.getOptionalBoolean('app.badges.obfuscate');\n\n    if (obfuscate) {\n      const entityUuidUrl = await this.getEntityUuidUrl(entity);\n      const entityUuid = await this.getEntityUuid(entityUuidUrl).then(data => {\n        return data.uuid;\n      });\n      const entityUuidBadgeSpecsUrl = await this.getEntityUuidBadgeSpecsUrl(\n        entityUuid,\n      );\n\n      const response = await this.fetchApi.fetch(entityUuidBadgeSpecsUrl);\n      if (!response.ok) {\n        throw await ResponseError.fromResponse(response);\n      }\n\n      return await response.json();\n    }\n\n    // If obfuscation is disabled, get the badge specs directly as the previous implementation\n    const entityBadgeSpecsUrl = await this.getEntityBadgeSpecsUrl(entity);\n    const response = await this.fetchApi.fetch(entityBadgeSpecsUrl);\n    if (!response.ok) {\n      throw await ResponseError.fromResponse(response);\n    }\n\n    return await response.json();\n  }\n\n  private async getEntityUuidUrl(entity: Entity): Promise<string> {\n    const routeParams = this.getEntityRouteParams(entity);\n    const path = generatePath(`:namespace/:kind/:name`, routeParams);\n    const baseUrl = await this.discoveryApi.getBaseUrl('badges');\n    const obfuscatedEntityUrl = `${baseUrl}/entity/${path}/obfuscated`;\n\n    return obfuscatedEntityUrl;\n  }\n\n  private async getEntityUuid(entityUuidUrl: string): Promise<any> {\n    const responseEntityUuid = await this.fetchApi.fetch(entityUuidUrl);\n\n    if (!responseEntityUuid.ok) {\n      throw await ResponseError.fromResponse(responseEntityUuid);\n    }\n    return await responseEntityUuid.json();\n  }\n\n  private async getEntityUuidBadgeSpecsUrl(entityUuid: {\n    uuid: string;\n  }): Promise<string> {\n    const baseUrl = await this.discoveryApi.getBaseUrl('badges');\n    return `${baseUrl}/entity/${entityUuid}/badge-specs`;\n  }\n\n  private async getEntityBadgeSpecsUrl(entity: Entity): Promise<string> {\n    const routeParams = this.getEntityRouteParams(entity);\n    const path = generatePath(`:namespace/:kind/:name`, routeParams);\n    const baseUrl = await this.discoveryApi.getBaseUrl('badges');\n    return `${baseUrl}/entity/${path}/badge-specs`;\n  }\n\n  // This function is used to generate the route parameters using the entity kind, namespace and name\n  private getEntityRouteParams(entity: Entity) {\n    return {\n      kind: entity.kind.toLocaleLowerCase('en-US'),\n      namespace:\n        entity.metadata.namespace?.toLocaleLowerCase('en-US') ??\n        DEFAULT_NAMESPACE,\n      name: entity.metadata.name,\n    };\n  }\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Entity } from '@backstage/catalog-model';\nimport { createApiRef } from '@backstage/core-plugin-api';\n\nexport const badgesApiRef = createApiRef<BadgesApi>({\n  id: 'plugin.badges.client',\n});\n\nexport type BadgeStyle =\n  | 'plastic'\n  | 'flat'\n  | 'flat-square'\n  | 'for-the-badge'\n  | 'social';\n\ninterface Badge {\n  color?: string;\n  description?: string;\n  kind?: 'entity';\n  label: string;\n  labelColor?: string;\n  link?: string;\n  message: string;\n  style?: BadgeStyle;\n}\n\nexport interface BadgeSpec {\n  /** Badge id */\n  id: string;\n\n  /** Badge data */\n  badge: Badge;\n\n  /** The URL to the badge image */\n  url: string;\n\n  /** The markdown code to use the badge */\n  markdown: string;\n}\n\nexport interface BadgesApi {\n  getEntityBadgeSpecs(entity: Entity): Promise<BadgeSpec[]>;\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { badgesApiRef, BadgesClient } from './api';\nimport {\n  configApiRef,\n  createApiFactory,\n  createComponentExtension,\n  createPlugin,\n  fetchApiRef,\n  discoveryApiRef,\n} from '@backstage/core-plugin-api';\n\n/** @public */\nexport const badgesPlugin = createPlugin({\n  id: 'badges',\n  apis: [\n    createApiFactory({\n      api: badgesApiRef,\n      deps: {\n        fetchApi: fetchApiRef,\n        discoveryApi: discoveryApiRef,\n        configApi: configApiRef,\n      },\n      factory: ({ fetchApi, discoveryApi, configApi }) =>\n        new BadgesClient({\n          fetchApi,\n          discoveryApi,\n          configApi,\n        }),\n    }),\n  ],\n});\n\n/** @public */\nexport const EntityBadgesDialog = badgesPlugin.provide(\n  createComponentExtension({\n    name: 'EntityBadgesDialog',\n    component: {\n      lazy: () =>\n        import('./components/EntityBadgesDialog').then(\n          m => m.EntityBadgesDialog,\n        ),\n    },\n  }),\n);\n"],"names":["response"],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import * as react from 'react';
+import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
+
+/** @public */
+declare const badgesPlugin: _backstage_core_plugin_api.BackstagePlugin<{}, {}, {}>;
+/** @public */
+declare const EntityBadgesDialog: (props: {
+    open: boolean;
+    onClose?: (() => any) | undefined;
+}) => react.JSX.Element;
+
+export { EntityBadgesDialog, badgesPlugin };

package/dist/index.esm.js

@@ -0,0 +1,6 @@
+export { E as EntityBadgesDialog, a as badgesPlugin } from './esm/index-R_9uVcjC.esm.js';
+import 'react-router-dom';
+import '@backstage/errors';
+import '@backstage/catalog-model';
+import '@backstage/core-plugin-api';
+//# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@backstage-community/plugin-badges",
+  "version": "0.2.59",
+  "description": "A Backstage plugin that generates README badges for your entities",
+  "backstage": {
+    "role": "frontend-plugin"
+  },
+  "publishConfig": {
+    "access": "public",
+    "main": "dist/index.esm.js",
+    "types": "dist/index.d.ts"
+  },
+  "homepage": "https://backstage.io",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/backstage/community-plugins",
+    "directory": "workspaces/badges/plugins/badges"
+  },
+  "license": "Apache-2.0",
+  "sideEffects": false,
+  "main": "dist/index.esm.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "backstage-cli package build",
+    "clean": "backstage-cli package clean",
+    "lint": "backstage-cli package lint",
+    "prepack": "backstage-cli package prepack",
+    "postpack": "backstage-cli package postpack",
+    "start": "backstage-cli package start",
+    "test": "backstage-cli package test"
+  },
+  "dependencies": {
+    "@backstage/catalog-model": "^1.4.5",
+    "@backstage/core-components": "^0.14.4",
+    "@backstage/core-plugin-api": "^1.9.2",
+    "@backstage/errors": "^1.2.4",
+    "@backstage/plugin-catalog-react": "^1.11.3",
+    "@material-ui/core": "^4.12.2",
+    "@types/react": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-use": "^17.2.4"
+  },
+  "devDependencies": {
+    "@backstage/cli": "^0.26.3",
+    "@backstage/dev-utils": "^1.0.31",
+    "@backstage/test-utils": "^1.5.4",
+    "@testing-library/dom": "^10.0.0",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^15.0.0",
+    "@types/react-dom": "^18.2.19",
+    "canvas": "^2.11.2",
+    "react": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
+  },
+  "module": "./dist/index.esm.js"
+}