@backstage/plugin-techdocs/dist/home/components/Grids/DocsCardGrid.esm.js

The Backstage plugin that renders technical documentation for your components

import { jsx, jsxs } from 'react/jsx-runtime';
import { rootDocsRouteRef } from '../../../routes.esm.js';
import { toLowerMaybe } from '../../../helpers.esm.js';
import { useRouteRef, useApi, configApiRef } from '@backstage/core-plugin-api';
import { ItemCardGrid, ItemCardHeader, LinkButton } from '@backstage/core-components';
import Card from '@material-ui/core/Card';
import CardActions from '@material-ui/core/CardActions';
import CardContent from '@material-ui/core/CardContent';
import CardMedia from '@material-ui/core/CardMedia';

const DocsCardGrid = (props) => {
  const { entities } = props;
  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);
  const config = useApi(configApiRef);
  if (!entities) return null;
  return /* @__PURE__ */ jsx(ItemCardGrid, { "data-testid": "docs-explore", children: !entities?.length ? null : entities.map((entity, index) => /* @__PURE__ */ jsxs(Card, { children: [
    /* @__PURE__ */ jsx(CardMedia, { children: /* @__PURE__ */ jsx(
      ItemCardHeader,
      {
        title: entity.metadata.title ?? entity.metadata.name
      }
    ) }),
    /* @__PURE__ */ jsx(CardContent, { children: entity.metadata.description }),
    /* @__PURE__ */ jsx(CardActions, { children: /* @__PURE__ */ jsx(
      LinkButton,
      {
        to: getRouteToReaderPageFor({
          namespace: toLowerMaybe(
            entity.metadata.namespace ?? "default",
            config
          ),
          kind: toLowerMaybe(entity.kind, config),
          name: toLowerMaybe(entity.metadata.name, config)
        }),
        color: "primary",
        "data-testid": "read_docs",
        children: "Read Docs"
      }
    ) })
  ] }, index)) });
};

export { DocsCardGrid };
//# sourceMappingURL=DocsCardGrid.esm.js.map