@backstage/plugin-catalog 1.22.1-next.1 → 1.23.0-next.2

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @backstage/plugin-catalog
 
+## 1.23.0-next.2
+
+### Minor Changes
+
+- 78475c3: Allow offset mode paging in entity list provider
+
+### Patch Changes
+
+- c891b69: Add `FavoriteToggle` in `core-components` to standardise favorite marking
+- 836127c: Updated dependency `@testing-library/react` to `^16.0.0`.
+- Updated dependencies
+  - @backstage/core-components@0.14.11-next.1
+  - @backstage/plugin-catalog-react@1.13.0-next.2
+  - @backstage/integration-react@1.1.31-next.0
+  - @backstage/catalog-client@1.7.0-next.1
+  - @backstage/plugin-search-react@1.8.0-next.2
+  - @backstage/core-compat-api@0.3.0-next.2
+  - @backstage/core-plugin-api@1.9.4-next.0
+  - @backstage/frontend-plugin-api@0.8.0-next.2
+  - @backstage/plugin-permission-react@0.4.26-next.0
+  - @backstage/catalog-model@1.6.0
+  - @backstage/errors@1.2.4
+  - @backstage/types@1.1.1
+  - @backstage/plugin-catalog-common@1.0.26
+  - @backstage/plugin-scaffolder-common@1.5.5
+  - @backstage/plugin-search-common@1.2.14
+
 ## 1.22.1-next.1
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-catalog__alpha",
-  "version": "1.22.1-next.1",
+  "version": "1.23.0-next.2",
   "main": "../dist/alpha.esm.js",
   "module": "../dist/alpha.esm.js",
   "types": "../dist/alpha.d.ts"

package/dist/components/CatalogPage/DefaultCatalogPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultCatalogPage.esm.js","sources":["../../../src/components/CatalogPage/DefaultCatalogPage.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 {\n  Content,\n  ContentHeader,\n  CreateButton,\n  PageWithHeader,\n  SupportButton,\n  TableColumn,\n  TableProps,\n} from '@backstage/core-components';\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n  CatalogFilterLayout,\n  EntityListProvider,\n  UserListFilterKind,\n  EntityOwnerPickerProps,\n} from '@backstage/plugin-catalog-react';\nimport React, { ReactNode } from 'react';\nimport { createComponentRouteRef } from '../../routes';\nimport { CatalogTable, CatalogTableRow } from '../CatalogTable';\nimport { catalogTranslationRef } from '../../alpha/translation';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nimport { CatalogTableColumnsFunc } from '../CatalogTable/types';\nimport { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';\nimport { usePermission } from '@backstage/plugin-permission-react';\nimport { DefaultFilters } from '@backstage/plugin-catalog-react';\n\n/** @internal */\nexport type BaseCatalogPageProps = {\n  filters: ReactNode;\n  content?: ReactNode;\n  pagination?: boolean | { limit?: number };\n};\n\n/** @internal */\nexport function BaseCatalogPage(props: BaseCatalogPageProps) {\n  const { filters, content = <CatalogTable />, pagination } = props;\n  const orgName =\n    useApi(configApiRef).getOptionalString('organization.name') ?? 'Backstage';\n  const createComponentLink = useRouteRef(createComponentRouteRef);\n  const { t } = useTranslationRef(catalogTranslationRef);\n  const { allowed } = usePermission({\n    permission: catalogEntityCreatePermission,\n  });\n\n  return (\n    <PageWithHeader title={t('indexPage.title', { orgName })} themeId=\"home\">\n      <Content>\n        <ContentHeader title=\"\">\n          {allowed && (\n            <CreateButton\n              title={t('indexPage.createButtonTitle')}\n              to={createComponentLink && createComponentLink()}\n            />\n          )}\n          <SupportButton>{t('indexPage.supportButtonContent')}</SupportButton>\n        </ContentHeader>\n        <EntityListProvider pagination={pagination}>\n          <CatalogFilterLayout>\n            <CatalogFilterLayout.Filters>{filters}</CatalogFilterLayout.Filters>\n            <CatalogFilterLayout.Content>{content}</CatalogFilterLayout.Content>\n          </CatalogFilterLayout>\n        </EntityListProvider>\n      </Content>\n    </PageWithHeader>\n  );\n}\n\n/**\n * Props for root catalog pages.\n *\n * @public\n */\nexport interface DefaultCatalogPageProps {\n  initiallySelectedFilter?: UserListFilterKind;\n  columns?: TableColumn<CatalogTableRow>[] | CatalogTableColumnsFunc;\n  actions?: TableProps<CatalogTableRow>['actions'];\n  initialKind?: string;\n  tableOptions?: TableProps<CatalogTableRow>['options'];\n  emptyContent?: ReactNode;\n  ownerPickerMode?: EntityOwnerPickerProps['mode'];\n  pagination?: boolean | { limit?: number };\n  filters?: ReactNode;\n  initiallySelectedNamespaces?: string[];\n}\n\nexport function DefaultCatalogPage(props: DefaultCatalogPageProps) {\n  const {\n    columns,\n    actions,\n    initiallySelectedFilter = 'owned',\n    initialKind = 'component',\n    tableOptions = {},\n    emptyContent,\n    pagination,\n    ownerPickerMode,\n    filters,\n    initiallySelectedNamespaces,\n  } = props;\n\n  return (\n    <BaseCatalogPage\n      filters={\n        filters ?? (\n          <DefaultFilters\n            initialKind={initialKind}\n            initiallySelectedFilter={initiallySelectedFilter}\n            ownerPickerMode={ownerPickerMode}\n            initiallySelectedNamespaces={initiallySelectedNamespaces}\n          />\n        )\n      }\n      content={\n        <CatalogTable\n          columns={columns}\n          actions={actions}\n          tableOptions={tableOptions}\n          emptyContent={emptyContent}\n        />\n      }\n      pagination={pagination}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAmDO,SAAS,gBAAgB,KAA6B,EAAA;AAC3D,EAAA,MAAM,EAAE,OAAS,EAAA,OAAA,uCAAW,YAAa,EAAA,IAAA,CAAA,EAAI,YAAe,GAAA,KAAA,CAAA;AAC5D,EAAA,MAAM,UACJ,MAAO,CAAA,YAAY,CAAE,CAAA,iBAAA,CAAkB,mBAAmB,CAAK,IAAA,WAAA,CAAA;AACjE,EAAM,MAAA,mBAAA,GAAsB,YAAY,uBAAuB,CAAA,CAAA;AAC/D,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,qBAAqB,CAAA,CAAA;AACrD,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,aAAc,CAAA;AAAA,IAChC,UAAY,EAAA,6BAAA;AAAA,GACb,CAAA,CAAA;AAED,EAAA,2CACG,cAAe,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,iBAAA,EAAmB,EAAE,OAAQ,EAAC,CAAG,EAAA,OAAA,EAAQ,0BAC/D,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,sCACE,aAAc,EAAA,EAAA,KAAA,EAAM,MAClB,OACC,oBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,EAAE,6BAA6B,CAAA;AAAA,MACtC,EAAA,EAAI,uBAAuB,mBAAoB,EAAA;AAAA,KAAA;AAAA,GACjD,kBAED,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,IAAA,EAAe,CAAE,CAAA,gCAAgC,CAAE,CACtD,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,kBAAmB,EAAA,EAAA,UAAA,EAAA,kBACjB,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,mBAAA,CAAoB,OAApB,EAAA,IAAA,EAA6B,OAAQ,CAAA,kBACrC,KAAA,CAAA,aAAA,CAAA,mBAAA,CAAoB,OAApB,EAAA,IAAA,EAA6B,OAAQ,CACxC,CACF,CACF,CACF,CAAA,CAAA;AAEJ,CAAA;AAoBO,SAAS,mBAAmB,KAAgC,EAAA;AACjE,EAAM,MAAA;AAAA,IACJ,OAAA;AAAA,IACA,OAAA;AAAA,IACA,uBAA0B,GAAA,OAAA;AAAA,IAC1B,WAAc,GAAA,WAAA;AAAA,IACd,eAAe,EAAC;AAAA,IAChB,YAAA;AAAA,IACA,UAAA;AAAA,IACA,eAAA;AAAA,IACA,OAAA;AAAA,IACA,2BAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,SACE,OACE,oBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,WAAA;AAAA,UACA,uBAAA;AAAA,UACA,eAAA;AAAA,UACA,2BAAA;AAAA,SAAA;AAAA,OACF;AAAA,MAGJ,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,OAAA;AAAA,UACA,OAAA;AAAA,UACA,YAAA;AAAA,UACA,YAAA;AAAA,SAAA;AAAA,OACF;AAAA,MAEF,UAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DefaultCatalogPage.esm.js","sources":["../../../src/components/CatalogPage/DefaultCatalogPage.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 {\n  Content,\n  ContentHeader,\n  CreateButton,\n  PageWithHeader,\n  SupportButton,\n  TableColumn,\n  TableProps,\n} from '@backstage/core-components';\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n  CatalogFilterLayout,\n  DefaultFilters,\n  EntityListPagination,\n  EntityListProvider,\n  EntityOwnerPickerProps,\n  UserListFilterKind,\n} from '@backstage/plugin-catalog-react';\nimport React, { ReactNode } from 'react';\nimport { createComponentRouteRef } from '../../routes';\nimport { CatalogTable, CatalogTableRow } from '../CatalogTable';\nimport { catalogTranslationRef } from '../../alpha/translation';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { CatalogTableColumnsFunc } from '../CatalogTable/types';\nimport { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';\nimport { usePermission } from '@backstage/plugin-permission-react';\n\n/** @internal */\nexport type BaseCatalogPageProps = {\n  filters: ReactNode;\n  content?: ReactNode;\n  pagination?: EntityListPagination;\n};\n\n/** @internal */\nexport function BaseCatalogPage(props: BaseCatalogPageProps) {\n  const { filters, content = <CatalogTable />, pagination } = props;\n  const orgName =\n    useApi(configApiRef).getOptionalString('organization.name') ?? 'Backstage';\n  const createComponentLink = useRouteRef(createComponentRouteRef);\n  const { t } = useTranslationRef(catalogTranslationRef);\n  const { allowed } = usePermission({\n    permission: catalogEntityCreatePermission,\n  });\n\n  return (\n    <PageWithHeader title={t('indexPage.title', { orgName })} themeId=\"home\">\n      <Content>\n        <ContentHeader title=\"\">\n          {allowed && (\n            <CreateButton\n              title={t('indexPage.createButtonTitle')}\n              to={createComponentLink && createComponentLink()}\n            />\n          )}\n          <SupportButton>{t('indexPage.supportButtonContent')}</SupportButton>\n        </ContentHeader>\n        <EntityListProvider pagination={pagination}>\n          <CatalogFilterLayout>\n            <CatalogFilterLayout.Filters>{filters}</CatalogFilterLayout.Filters>\n            <CatalogFilterLayout.Content>{content}</CatalogFilterLayout.Content>\n          </CatalogFilterLayout>\n        </EntityListProvider>\n      </Content>\n    </PageWithHeader>\n  );\n}\n\n/**\n * Props for root catalog pages.\n *\n * @public\n */\nexport interface DefaultCatalogPageProps {\n  initiallySelectedFilter?: UserListFilterKind;\n  columns?: TableColumn<CatalogTableRow>[] | CatalogTableColumnsFunc;\n  actions?: TableProps<CatalogTableRow>['actions'];\n  initialKind?: string;\n  tableOptions?: TableProps<CatalogTableRow>['options'];\n  emptyContent?: ReactNode;\n  ownerPickerMode?: EntityOwnerPickerProps['mode'];\n  filters?: ReactNode;\n  initiallySelectedNamespaces?: string[];\n  pagination?: EntityListPagination;\n}\n\nexport function DefaultCatalogPage(props: DefaultCatalogPageProps) {\n  const {\n    columns,\n    actions,\n    initiallySelectedFilter = 'owned',\n    initialKind = 'component',\n    tableOptions = {},\n    emptyContent,\n    pagination,\n    ownerPickerMode,\n    filters,\n    initiallySelectedNamespaces,\n  } = props;\n\n  return (\n    <BaseCatalogPage\n      filters={\n        filters ?? (\n          <DefaultFilters\n            initialKind={initialKind}\n            initiallySelectedFilter={initiallySelectedFilter}\n            ownerPickerMode={ownerPickerMode}\n            initiallySelectedNamespaces={initiallySelectedNamespaces}\n          />\n        )\n      }\n      content={\n        <CatalogTable\n          columns={columns}\n          actions={actions}\n          tableOptions={tableOptions}\n          emptyContent={emptyContent}\n        />\n      }\n      pagination={pagination}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAmDO,SAAS,gBAAgB,KAA6B,EAAA;AAC3D,EAAA,MAAM,EAAE,OAAS,EAAA,OAAA,uCAAW,YAAa,EAAA,IAAA,CAAA,EAAI,YAAe,GAAA,KAAA,CAAA;AAC5D,EAAA,MAAM,UACJ,MAAO,CAAA,YAAY,CAAE,CAAA,iBAAA,CAAkB,mBAAmB,CAAK,IAAA,WAAA,CAAA;AACjE,EAAM,MAAA,mBAAA,GAAsB,YAAY,uBAAuB,CAAA,CAAA;AAC/D,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,qBAAqB,CAAA,CAAA;AACrD,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,aAAc,CAAA;AAAA,IAChC,UAAY,EAAA,6BAAA;AAAA,GACb,CAAA,CAAA;AAED,EAAA,2CACG,cAAe,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,iBAAA,EAAmB,EAAE,OAAQ,EAAC,CAAG,EAAA,OAAA,EAAQ,0BAC/D,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,sCACE,aAAc,EAAA,EAAA,KAAA,EAAM,MAClB,OACC,oBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,EAAE,6BAA6B,CAAA;AAAA,MACtC,EAAA,EAAI,uBAAuB,mBAAoB,EAAA;AAAA,KAAA;AAAA,GACjD,kBAED,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,IAAA,EAAe,CAAE,CAAA,gCAAgC,CAAE,CACtD,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,kBAAmB,EAAA,EAAA,UAAA,EAAA,kBACjB,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,mBAAA,CAAoB,OAApB,EAAA,IAAA,EAA6B,OAAQ,CAAA,kBACrC,KAAA,CAAA,aAAA,CAAA,mBAAA,CAAoB,OAApB,EAAA,IAAA,EAA6B,OAAQ,CACxC,CACF,CACF,CACF,CAAA,CAAA;AAEJ,CAAA;AAoBO,SAAS,mBAAmB,KAAgC,EAAA;AACjE,EAAM,MAAA;AAAA,IACJ,OAAA;AAAA,IACA,OAAA;AAAA,IACA,uBAA0B,GAAA,OAAA;AAAA,IAC1B,WAAc,GAAA,WAAA;AAAA,IACd,eAAe,EAAC;AAAA,IAChB,YAAA;AAAA,IACA,UAAA;AAAA,IACA,eAAA;AAAA,IACA,OAAA;AAAA,IACA,2BAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,SACE,OACE,oBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,WAAA;AAAA,UACA,uBAAA;AAAA,UACA,eAAA;AAAA,UACA,2BAAA;AAAA,SAAA;AAAA,OACF;AAAA,MAGJ,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,OAAA;AAAA,UACA,OAAA;AAAA,UACA,YAAA;AAAA,UACA,YAAA;AAAA,SAAA;AAAA,OACF;AAAA,MAEF,UAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}

package/dist/components/CatalogTable/CatalogTable.esm.js

@@ -1,27 +1,20 @@
 import { RELATION_PART_OF, RELATION_OWNED_BY, stringifyEntityRef, ANNOTATION_VIEW_URL, ANNOTATION_EDIT_URL } from '@backstage/catalog-model';
-import { WarningPanel, CodeSnippet, Table } from '@backstage/core-components';
+import { WarningPanel, CodeSnippet, Table, FavoriteToggleIcon } from '@backstage/core-components';
 import { useStarredEntities, useEntityList, getEntityRelations, humanizeEntityRef } from '@backstage/plugin-catalog-react';
 import Typography from '@material-ui/core/Typography';
-import { withStyles } from '@material-ui/core/styles';
 import { visuallyHidden } from '@mui/utils';
 import EditIcon from '@material-ui/icons/Edit';
 import OpenInNew from '@material-ui/icons/OpenInNew';
-import Star from '@material-ui/icons/Star';
-import StarBorder from '@material-ui/icons/StarBorder';
 import { capitalize } from 'lodash';
 import pluralize from 'pluralize';
 import React, { useMemo } from 'react';
 import { columnFactories } from './columns.esm.js';
-import { PaginatedCatalogTable } from './PaginatedCatalogTable.esm.js';
+import { OffsetPaginatedCatalogTable } from './OffsetPaginatedCatalogTable.esm.js';
+import { CursorPaginatedCatalogTable } from './CursorPaginatedCatalogTable.esm.js';
 import { defaultCatalogTableColumnsFunc } from './defaultCatalogTableColumnsFunc.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { catalogTranslationRef } from '../../alpha/translation.esm.js';
 
-const YellowStar = withStyles({
-  root: {
-    color: "#f3ba37"
-  }
-})(Star);
 const refCompare = (a, b) => {
   const toRef = (entity) => entity.metadata.title || humanizeEntityRef(entity, {
     defaultKind: "Component"
@@ -37,8 +30,15 @@ const CatalogTable = (props) => {
   } = props;
   const { isStarredEntity, toggleStarredEntity } = useStarredEntities();
   const entityListContext = useEntityList();
-  const { loading, error, entities, filters, pageInfo, totalItems } = entityListContext;
-  const enablePagination = !!pageInfo;
+  const {
+    loading,
+    error,
+    entities,
+    filters,
+    pageInfo,
+    totalItems,
+    paginationMode
+  } = entityListContext;
   const tableColumns = useMemo(
     () => typeof columns === "function" ? columns(entityListContext) : columns,
     [columns, entityListContext]
@@ -86,7 +86,7 @@ const CatalogTable = (props) => {
       const title2 = isStarred ? t("catalogTable.unStarActionTitle") : t("catalogTable.starActionTitle");
       return {
         cellStyle: { paddingLeft: "1em" },
-        icon: () => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Typography, { style: visuallyHidden }, title2), isStarred ? /* @__PURE__ */ React.createElement(YellowStar, null) : /* @__PURE__ */ React.createElement(StarBorder, null)),
+        icon: () => /* @__PURE__ */ React.createElement(FavoriteToggleIcon, { isFavorite: isStarred }),
         tooltip: title2,
         onClick: () => toggleStarredEntity(entity)
       };
@@ -110,9 +110,9 @@ const CatalogTable = (props) => {
     padding: "dense",
     ...tableOptions
   };
-  if (enablePagination) {
+  if (paginationMode === "cursor") {
     return /* @__PURE__ */ React.createElement(
-      PaginatedCatalogTable,
+      CursorPaginatedCatalogTable,
       {
         columns: tableColumns,
         emptyContent,
@@ -122,8 +122,22 @@ const CatalogTable = (props) => {
         subtitle,
         options,
         data: entities.map(toEntityRow),
-        next: pageInfo.next,
-        prev: pageInfo.prev
+        next: pageInfo?.next,
+        prev: pageInfo?.prev
+      }
+    );
+  } else if (paginationMode === "offset") {
+    return /* @__PURE__ */ React.createElement(
+      OffsetPaginatedCatalogTable,
+      {
+        columns: tableColumns,
+        emptyContent,
+        isLoading: loading,
+        title,
+        actions,
+        subtitle,
+        options,
+        data: entities.map(toEntityRow)
       }
     );
   }

package/dist/components/CatalogTable/CatalogTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CatalogTable.esm.js","sources":["../../../src/components/CatalogTable/CatalogTable.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {\n  ANNOTATION_EDIT_URL,\n  ANNOTATION_VIEW_URL,\n  Entity,\n  RELATION_OWNED_BY,\n  RELATION_PART_OF,\n  stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport {\n  CodeSnippet,\n  Table,\n  TableColumn,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport { visuallyHidden } from '@mui/utils';\nimport Edit from '@material-ui/icons/Edit';\nimport OpenInNew from '@material-ui/icons/OpenInNew';\nimport Star from '@material-ui/icons/Star';\nimport StarBorder from '@material-ui/icons/StarBorder';\nimport { capitalize } from 'lodash';\nimport pluralize from 'pluralize';\nimport React, { ReactNode, useMemo } from 'react';\nimport { columnFactories } from './columns';\nimport { CatalogTableColumnsFunc, CatalogTableRow } from './types';\nimport { PaginatedCatalogTable } from './PaginatedCatalogTable';\nimport { defaultCatalogTableColumnsFunc } from './defaultCatalogTableColumnsFunc';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { catalogTranslationRef } from '../../alpha/translation';\n\n/**\n * Props for {@link CatalogTable}.\n *\n * @public\n */\nexport interface CatalogTableProps {\n  columns?: TableColumn<CatalogTableRow>[] | CatalogTableColumnsFunc;\n  actions?: TableProps<CatalogTableRow>['actions'];\n  tableOptions?: TableProps<CatalogTableRow>['options'];\n  emptyContent?: ReactNode;\n  subtitle?: string;\n}\n\nconst YellowStar = withStyles({\n  root: {\n    color: '#f3ba37',\n  },\n})(Star);\n\nconst refCompare = (a: Entity, b: Entity) => {\n  const toRef = (entity: Entity) =>\n    entity.metadata.title ||\n    humanizeEntityRef(entity, {\n      defaultKind: 'Component',\n    });\n\n  return toRef(a).localeCompare(toRef(b));\n};\n\n/** @public */\nexport const CatalogTable = (props: CatalogTableProps) => {\n  const {\n    columns = defaultCatalogTableColumnsFunc,\n    tableOptions,\n    subtitle,\n    emptyContent,\n  } = props;\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const entityListContext = useEntityList();\n  const { loading, error, entities, filters, pageInfo, totalItems } =\n    entityListContext;\n  const enablePagination = !!pageInfo;\n  const tableColumns = useMemo(\n    () =>\n      typeof columns === 'function' ? columns(entityListContext) : columns,\n    [columns, entityListContext],\n  );\n  const { t } = useTranslationRef(catalogTranslationRef);\n\n  if (error) {\n    return (\n      <div>\n        <WarningPanel\n          severity=\"error\"\n          title={t('catalogTable.warningPanelTitle')}\n        >\n          <CodeSnippet language=\"text\" text={error.toString()} />\n        </WarningPanel>\n      </div>\n    );\n  }\n\n  const defaultActions: TableProps<CatalogTableRow>['actions'] = [\n    ({ entity }) => {\n      const url = entity.metadata.annotations?.[ANNOTATION_VIEW_URL];\n      const title = t('catalogTable.viewActionTitle');\n\n      return {\n        icon: () => (\n          <>\n            <Typography style={visuallyHidden}>{title}</Typography>\n            <OpenInNew fontSize=\"small\" />\n          </>\n        ),\n        tooltip: title,\n        disabled: !url,\n        onClick: () => {\n          if (!url) return;\n          window.open(url, '_blank');\n        },\n      };\n    },\n    ({ entity }) => {\n      const url = entity.metadata.annotations?.[ANNOTATION_EDIT_URL];\n      const title = t('catalogTable.editActionTitle');\n\n      return {\n        icon: () => (\n          <>\n            <Typography style={visuallyHidden}>{title}</Typography>\n            <Edit fontSize=\"small\" />\n          </>\n        ),\n        tooltip: title,\n        disabled: !url,\n        onClick: () => {\n          if (!url) return;\n          window.open(url, '_blank');\n        },\n      };\n    },\n    ({ entity }) => {\n      const isStarred = isStarredEntity(entity);\n      const title = isStarred\n        ? t('catalogTable.unStarActionTitle')\n        : t('catalogTable.starActionTitle');\n\n      return {\n        cellStyle: { paddingLeft: '1em' },\n        icon: () => (\n          <>\n            <Typography style={visuallyHidden}>{title}</Typography>\n            {isStarred ? <YellowStar /> : <StarBorder />}\n          </>\n        ),\n        tooltip: title,\n        onClick: () => toggleStarredEntity(entity),\n      };\n    },\n  ];\n\n  const currentKind = filters.kind?.value || '';\n  const currentType = filters.type?.value || '';\n  const currentCount = typeof totalItems === 'number' ? `(${totalItems})` : '';\n  // TODO(timbonicus): remove the title from the CatalogTable once using EntitySearchBar\n  const titlePreamble = capitalize(filters.user?.value ?? 'all');\n  const title = [\n    titlePreamble,\n    currentType,\n    pluralize(currentKind),\n    currentCount,\n  ]\n    .filter(s => s)\n    .join(' ');\n\n  const actions = props.actions || defaultActions;\n  const options = {\n    actionsColumnIndex: -1,\n    loadingType: 'linear' as const,\n    showEmptyDataSourceMessage: !loading,\n    padding: 'dense' as const,\n    ...tableOptions,\n  };\n\n  if (enablePagination) {\n    return (\n      <PaginatedCatalogTable\n        columns={tableColumns}\n        emptyContent={emptyContent}\n        isLoading={loading}\n        title={title}\n        actions={actions}\n        subtitle={subtitle}\n        options={options}\n        data={entities.map(toEntityRow)}\n        next={pageInfo.next}\n        prev={pageInfo.prev}\n      />\n    );\n  }\n\n  const rows = entities.sort(refCompare).map(toEntityRow);\n  const pageSize = 20;\n  const showPagination = rows.length > pageSize;\n\n  return (\n    <Table<CatalogTableRow>\n      isLoading={loading}\n      columns={tableColumns}\n      options={{\n        paging: showPagination,\n        pageSize: pageSize,\n        pageSizeOptions: [20, 50, 100],\n        ...options,\n      }}\n      title={title}\n      data={rows}\n      actions={actions}\n      subtitle={subtitle}\n      emptyContent={emptyContent}\n    />\n  );\n};\n\nCatalogTable.columns = columnFactories;\nCatalogTable.defaultColumnsFunc = defaultCatalogTableColumnsFunc;\n\nfunction toEntityRow(entity: Entity) {\n  const partOfSystemRelations = getEntityRelations(entity, RELATION_PART_OF, {\n    kind: 'system',\n  });\n  const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n\n  return {\n    entity,\n    resolved: {\n      // This name is here for backwards compatibility mostly; the\n      // presentation of refs in the table should in general be handled with\n      // EntityRefLink / EntityName components\n      name: humanizeEntityRef(entity, {\n        defaultKind: 'Component',\n      }),\n      entityRef: stringifyEntityRef(entity),\n      ownedByRelationsTitle: ownedByRelations\n        .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n        .join(', '),\n      ownedByRelations,\n      partOfSystemRelationTitle: partOfSystemRelations\n        .map(r =>\n          humanizeEntityRef(r, {\n            defaultKind: 'system',\n          }),\n        )\n        .join(', '),\n      partOfSystemRelations,\n    },\n  };\n}\n"],"names":["title","Edit"],"mappings":"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"}
+{"version":3,"file":"CatalogTable.esm.js","sources":["../../../src/components/CatalogTable/CatalogTable.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {\n  ANNOTATION_EDIT_URL,\n  ANNOTATION_VIEW_URL,\n  Entity,\n  RELATION_OWNED_BY,\n  RELATION_PART_OF,\n  stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport {\n  CodeSnippet,\n  Table,\n  TableColumn,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport Typography from '@material-ui/core/Typography';\nimport { visuallyHidden } from '@mui/utils';\nimport Edit from '@material-ui/icons/Edit';\nimport OpenInNew from '@material-ui/icons/OpenInNew';\nimport { capitalize } from 'lodash';\nimport pluralize from 'pluralize';\nimport React, { ReactNode, useMemo } from 'react';\nimport { columnFactories } from './columns';\nimport { CatalogTableColumnsFunc, CatalogTableRow } from './types';\nimport { OffsetPaginatedCatalogTable } from './OffsetPaginatedCatalogTable';\nimport { CursorPaginatedCatalogTable } from './CursorPaginatedCatalogTable';\nimport { defaultCatalogTableColumnsFunc } from './defaultCatalogTableColumnsFunc';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { catalogTranslationRef } from '../../alpha/translation';\nimport { FavoriteToggleIcon } from '@backstage/core-components';\n\n/**\n * Props for {@link CatalogTable}.\n *\n * @public\n */\nexport interface CatalogTableProps {\n  columns?: TableColumn<CatalogTableRow>[] | CatalogTableColumnsFunc;\n  actions?: TableProps<CatalogTableRow>['actions'];\n  tableOptions?: TableProps<CatalogTableRow>['options'];\n  emptyContent?: ReactNode;\n  subtitle?: string;\n}\n\nconst refCompare = (a: Entity, b: Entity) => {\n  const toRef = (entity: Entity) =>\n    entity.metadata.title ||\n    humanizeEntityRef(entity, {\n      defaultKind: 'Component',\n    });\n\n  return toRef(a).localeCompare(toRef(b));\n};\n\n/** @public */\nexport const CatalogTable = (props: CatalogTableProps) => {\n  const {\n    columns = defaultCatalogTableColumnsFunc,\n    tableOptions,\n    subtitle,\n    emptyContent,\n  } = props;\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const entityListContext = useEntityList();\n\n  const {\n    loading,\n    error,\n    entities,\n    filters,\n    pageInfo,\n    totalItems,\n    paginationMode,\n  } = entityListContext;\n\n  const tableColumns = useMemo(\n    () =>\n      typeof columns === 'function' ? columns(entityListContext) : columns,\n    [columns, entityListContext],\n  );\n  const { t } = useTranslationRef(catalogTranslationRef);\n\n  if (error) {\n    return (\n      <div>\n        <WarningPanel\n          severity=\"error\"\n          title={t('catalogTable.warningPanelTitle')}\n        >\n          <CodeSnippet language=\"text\" text={error.toString()} />\n        </WarningPanel>\n      </div>\n    );\n  }\n\n  const defaultActions: TableProps<CatalogTableRow>['actions'] = [\n    ({ entity }) => {\n      const url = entity.metadata.annotations?.[ANNOTATION_VIEW_URL];\n      const title = t('catalogTable.viewActionTitle');\n\n      return {\n        icon: () => (\n          <>\n            <Typography style={visuallyHidden}>{title}</Typography>\n            <OpenInNew fontSize=\"small\" />\n          </>\n        ),\n        tooltip: title,\n        disabled: !url,\n        onClick: () => {\n          if (!url) return;\n          window.open(url, '_blank');\n        },\n      };\n    },\n    ({ entity }) => {\n      const url = entity.metadata.annotations?.[ANNOTATION_EDIT_URL];\n      const title = t('catalogTable.editActionTitle');\n\n      return {\n        icon: () => (\n          <>\n            <Typography style={visuallyHidden}>{title}</Typography>\n            <Edit fontSize=\"small\" />\n          </>\n        ),\n        tooltip: title,\n        disabled: !url,\n        onClick: () => {\n          if (!url) return;\n          window.open(url, '_blank');\n        },\n      };\n    },\n    ({ entity }) => {\n      const isStarred = isStarredEntity(entity);\n      const title = isStarred\n        ? t('catalogTable.unStarActionTitle')\n        : t('catalogTable.starActionTitle');\n\n      return {\n        cellStyle: { paddingLeft: '1em' },\n        icon: () => <FavoriteToggleIcon isFavorite={isStarred} />,\n        tooltip: title,\n        onClick: () => toggleStarredEntity(entity),\n      };\n    },\n  ];\n\n  const currentKind = filters.kind?.value || '';\n  const currentType = filters.type?.value || '';\n  const currentCount = typeof totalItems === 'number' ? `(${totalItems})` : '';\n  // TODO(timbonicus): remove the title from the CatalogTable once using EntitySearchBar\n  const titlePreamble = capitalize(filters.user?.value ?? 'all');\n  const title = [\n    titlePreamble,\n    currentType,\n    pluralize(currentKind),\n    currentCount,\n  ]\n    .filter(s => s)\n    .join(' ');\n\n  const actions = props.actions || defaultActions;\n  const options = {\n    actionsColumnIndex: -1,\n    loadingType: 'linear' as const,\n    showEmptyDataSourceMessage: !loading,\n    padding: 'dense' as const,\n    ...tableOptions,\n  };\n\n  if (paginationMode === 'cursor') {\n    return (\n      <CursorPaginatedCatalogTable\n        columns={tableColumns}\n        emptyContent={emptyContent}\n        isLoading={loading}\n        title={title}\n        actions={actions}\n        subtitle={subtitle}\n        options={options}\n        data={entities.map(toEntityRow)}\n        next={pageInfo?.next}\n        prev={pageInfo?.prev}\n      />\n    );\n  } else if (paginationMode === 'offset') {\n    return (\n      <OffsetPaginatedCatalogTable\n        columns={tableColumns}\n        emptyContent={emptyContent}\n        isLoading={loading}\n        title={title}\n        actions={actions}\n        subtitle={subtitle}\n        options={options}\n        data={entities.map(toEntityRow)}\n      />\n    );\n  }\n\n  const rows = entities.sort(refCompare).map(toEntityRow);\n  const pageSize = 20;\n  const showPagination = rows.length > pageSize;\n\n  return (\n    <Table<CatalogTableRow>\n      isLoading={loading}\n      columns={tableColumns}\n      options={{\n        paging: showPagination,\n        pageSize: pageSize,\n        pageSizeOptions: [20, 50, 100],\n        ...options,\n      }}\n      title={title}\n      data={rows}\n      actions={actions}\n      subtitle={subtitle}\n      emptyContent={emptyContent}\n    />\n  );\n};\n\nCatalogTable.columns = columnFactories;\nCatalogTable.defaultColumnsFunc = defaultCatalogTableColumnsFunc;\n\nfunction toEntityRow(entity: Entity) {\n  const partOfSystemRelations = getEntityRelations(entity, RELATION_PART_OF, {\n    kind: 'system',\n  });\n  const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n\n  return {\n    entity,\n    resolved: {\n      // This name is here for backwards compatibility mostly; the\n      // presentation of refs in the table should in general be handled with\n      // EntityRefLink / EntityName components\n      name: humanizeEntityRef(entity, {\n        defaultKind: 'Component',\n      }),\n      entityRef: stringifyEntityRef(entity),\n      ownedByRelationsTitle: ownedByRelations\n        .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n        .join(', '),\n      ownedByRelations,\n      partOfSystemRelationTitle: partOfSystemRelations\n        .map(r =>\n          humanizeEntityRef(r, {\n            defaultKind: 'system',\n          }),\n        )\n        .join(', '),\n      partOfSystemRelations,\n    },\n  };\n}\n"],"names":["title","Edit"],"mappings":"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"}

package/dist/components/CatalogTable/{PaginatedCatalogTable.esm.js → CursorPaginatedCatalogTable.esm.js}

@@ -2,7 +2,7 @@ import React from 'react';
 import { Table } from '@backstage/core-components';
 import { CatalogTableToolbar } from './CatalogTableToolbar.esm.js';
 
-function PaginatedCatalogTable(props) {
+function CursorPaginatedCatalogTable(props) {
   const { columns, data, next, prev, title, isLoading, options, ...restProps } = props;
   return /* @__PURE__ */ React.createElement(
     Table,
@@ -37,5 +37,5 @@ function PaginatedCatalogTable(props) {
   );
 }
 
-export { PaginatedCatalogTable };
-//# sourceMappingURL=PaginatedCatalogTable.esm.js.map
+export { CursorPaginatedCatalogTable };
+//# sourceMappingURL=CursorPaginatedCatalogTable.esm.js.map

package/dist/components/CatalogTable/CursorPaginatedCatalogTable.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CursorPaginatedCatalogTable.esm.js","sources":["../../../src/components/CatalogTable/CursorPaginatedCatalogTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 React from 'react';\n\nimport { Table, TableProps } from '@backstage/core-components';\nimport { CatalogTableRow } from './types';\nimport { CatalogTableToolbar } from './CatalogTableToolbar';\n\ntype PaginatedCatalogTableProps = {\n  prev?(): void;\n  next?(): void;\n} & TableProps<CatalogTableRow>;\n\n/**\n * @internal\n */\n\nexport function CursorPaginatedCatalogTable(props: PaginatedCatalogTableProps) {\n  const { columns, data, next, prev, title, isLoading, options, ...restProps } =\n    props;\n\n  return (\n    <Table\n      title={isLoading ? '' : title}\n      columns={columns}\n      data={data}\n      options={{\n        ...options,\n        // These settings are configured to force server side pagination\n        paginationPosition: 'both',\n        pageSizeOptions: [],\n        showFirstLastPageButtons: false,\n        pageSize: Number.MAX_SAFE_INTEGER,\n        emptyRowsWhenPaging: false,\n      }}\n      onPageChange={page => {\n        if (page > 0) {\n          next?.();\n        } else {\n          prev?.();\n        }\n      }}\n      components={{\n        Toolbar: CatalogTableToolbar,\n      }}\n      /* this will enable the prev button accordingly */\n      page={prev ? 1 : 0}\n      /* this will enable the next button accordingly */\n      totalCount={next ? Number.MAX_VALUE : Number.MAX_SAFE_INTEGER}\n      localization={{ pagination: { labelDisplayedRows: '' } }}\n      {...restProps}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AA+BO,SAAS,4BAA4B,KAAmC,EAAA;AAC7E,EAAM,MAAA,EAAE,OAAS,EAAA,IAAA,EAAM,IAAM,EAAA,IAAA,EAAM,OAAO,SAAW,EAAA,OAAA,EAAS,GAAG,SAAA,EAC/D,GAAA,KAAA,CAAA;AAEF,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,YAAY,EAAK,GAAA,KAAA;AAAA,MACxB,OAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAS,EAAA;AAAA,QACP,GAAG,OAAA;AAAA;AAAA,QAEH,kBAAoB,EAAA,MAAA;AAAA,QACpB,iBAAiB,EAAC;AAAA,QAClB,wBAA0B,EAAA,KAAA;AAAA,QAC1B,UAAU,MAAO,CAAA,gBAAA;AAAA,QACjB,mBAAqB,EAAA,KAAA;AAAA,OACvB;AAAA,MACA,cAAc,CAAQ,IAAA,KAAA;AACpB,QAAA,IAAI,OAAO,CAAG,EAAA;AACZ,UAAO,IAAA,IAAA,CAAA;AAAA,SACF,MAAA;AACL,UAAO,IAAA,IAAA,CAAA;AAAA,SACT;AAAA,OACF;AAAA,MACA,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,mBAAA;AAAA,OACX;AAAA,MAEA,IAAA,EAAM,OAAO,CAAI,GAAA,CAAA;AAAA,MAEjB,UAAY,EAAA,IAAA,GAAO,MAAO,CAAA,SAAA,GAAY,MAAO,CAAA,gBAAA;AAAA,MAC7C,cAAc,EAAE,UAAA,EAAY,EAAE,kBAAA,EAAoB,IAAK,EAAA;AAAA,MACtD,GAAG,SAAA;AAAA,KAAA;AAAA,GACN,CAAA;AAEJ;;;;"}

package/dist/components/CatalogTable/OffsetPaginatedCatalogTable.esm.js

@@ -0,0 +1,46 @@
+import React, { useEffect } from 'react';
+import { Table } from '@backstage/core-components';
+import { useEntityList, EntityTextFilter } from '@backstage/plugin-catalog-react';
+
+function OffsetPaginatedCatalogTable(props) {
+  const { columns, data } = props;
+  const { updateFilters, setLimit, setOffset, limit, totalItems, offset } = useEntityList();
+  const [page, setPage] = React.useState(
+    offset && limit ? Math.floor(offset / limit) : 0
+  );
+  useEffect(() => {
+    if (totalItems && page * limit >= totalItems) {
+      setOffset(Math.max(0, totalItems - limit));
+    } else {
+      setOffset(Math.max(0, page * limit));
+    }
+  }, [setOffset, page, limit, totalItems]);
+  return /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      columns,
+      data,
+      options: {
+        paginationPosition: "both",
+        pageSizeOptions: [5, 10, 20, 50, 100],
+        pageSize: limit,
+        emptyRowsWhenPaging: false
+      },
+      onSearchChange: (searchText) => updateFilters({
+        text: searchText ? new EntityTextFilter(searchText) : void 0
+      }),
+      page,
+      onPageChange: (newPage) => {
+        setPage(newPage);
+      },
+      onRowsPerPageChange: (pageSize) => {
+        setLimit(pageSize);
+      },
+      totalCount: totalItems,
+      localization: { pagination: { labelDisplayedRows: "" } }
+    }
+  );
+}
+
+export { OffsetPaginatedCatalogTable };
+//# sourceMappingURL=OffsetPaginatedCatalogTable.esm.js.map

package/dist/components/CatalogTable/OffsetPaginatedCatalogTable.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OffsetPaginatedCatalogTable.esm.js","sources":["../../../src/components/CatalogTable/OffsetPaginatedCatalogTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 React, { useEffect } from 'react';\n\nimport { Table, TableProps } from '@backstage/core-components';\nimport { CatalogTableRow } from './types';\nimport {\n  EntityTextFilter,\n  useEntityList,\n} from '@backstage/plugin-catalog-react';\n\n/**\n * @internal\n */\nexport function OffsetPaginatedCatalogTable(\n  props: TableProps<CatalogTableRow>,\n) {\n  const { columns, data } = props;\n  const { updateFilters, setLimit, setOffset, limit, totalItems, offset } =\n    useEntityList();\n  const [page, setPage] = React.useState(\n    offset && limit ? Math.floor(offset / limit) : 0,\n  );\n\n  useEffect(() => {\n    if (totalItems && page * limit >= totalItems) {\n      setOffset!(Math.max(0, totalItems - limit));\n    } else {\n      setOffset!(Math.max(0, page * limit));\n    }\n  }, [setOffset, page, limit, totalItems]);\n\n  return (\n    <Table\n      columns={columns}\n      data={data}\n      options={{\n        paginationPosition: 'both',\n        pageSizeOptions: [5, 10, 20, 50, 100],\n        pageSize: limit,\n        emptyRowsWhenPaging: false,\n      }}\n      onSearchChange={(searchText: string) =>\n        updateFilters({\n          text: searchText ? new EntityTextFilter(searchText) : undefined,\n        })\n      }\n      page={page}\n      onPageChange={newPage => {\n        setPage(newPage);\n      }}\n      onRowsPerPageChange={pageSize => {\n        setLimit(pageSize);\n      }}\n      totalCount={totalItems}\n      localization={{ pagination: { labelDisplayedRows: '' } }}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AA4BO,SAAS,4BACd,KACA,EAAA;AACA,EAAM,MAAA,EAAE,OAAS,EAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1B,EAAM,MAAA,EAAE,eAAe,QAAU,EAAA,SAAA,EAAW,OAAO,UAAY,EAAA,MAAA,KAC7D,aAAc,EAAA,CAAA;AAChB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,KAAM,CAAA,QAAA;AAAA,IAC5B,UAAU,KAAQ,GAAA,IAAA,CAAK,KAAM,CAAA,MAAA,GAAS,KAAK,CAAI,GAAA,CAAA;AAAA,GACjD,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,UAAA,IAAc,IAAO,GAAA,KAAA,IAAS,UAAY,EAAA;AAC5C,MAAA,SAAA,CAAW,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,UAAA,GAAa,KAAK,CAAC,CAAA,CAAA;AAAA,KACrC,MAAA;AACL,MAAA,SAAA,CAAW,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,KAAK,CAAC,CAAA,CAAA;AAAA,KACtC;AAAA,KACC,CAAC,SAAA,EAAW,IAAM,EAAA,KAAA,EAAO,UAAU,CAAC,CAAA,CAAA;AAEvC,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAS,EAAA;AAAA,QACP,kBAAoB,EAAA,MAAA;AAAA,QACpB,iBAAiB,CAAC,CAAA,EAAG,EAAI,EAAA,EAAA,EAAI,IAAI,GAAG,CAAA;AAAA,QACpC,QAAU,EAAA,KAAA;AAAA,QACV,mBAAqB,EAAA,KAAA;AAAA,OACvB;AAAA,MACA,cAAA,EAAgB,CAAC,UAAA,KACf,aAAc,CAAA;AAAA,QACZ,IAAM,EAAA,UAAA,GAAa,IAAI,gBAAA,CAAiB,UAAU,CAAI,GAAA,KAAA,CAAA;AAAA,OACvD,CAAA;AAAA,MAEH,IAAA;AAAA,MACA,cAAc,CAAW,OAAA,KAAA;AACvB,QAAA,OAAA,CAAQ,OAAO,CAAA,CAAA;AAAA,OACjB;AAAA,MACA,qBAAqB,CAAY,QAAA,KAAA;AAC/B,QAAA,QAAA,CAAS,QAAQ,CAAA,CAAA;AAAA,OACnB;AAAA,MACA,UAAY,EAAA,UAAA;AAAA,MACZ,cAAc,EAAE,UAAA,EAAY,EAAE,kBAAA,EAAoB,IAAK,EAAA;AAAA,KAAA;AAAA,GACzD,CAAA;AAEJ;;;;"}

package/dist/index.d.ts

@@ -2,7 +2,7 @@
 import { Entity, CompoundEntityRef, ComponentEntity, ResourceEntity, SystemEntity } from '@backstage/catalog-model';
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
 import { IconComponent, StorageApi, ApiHolder } from '@backstage/core-plugin-api';
-import { EntityRefPresentationSnapshot, CatalogApi, EntityPresentationApi, EntityRefPresentation, StarredEntitiesApi, EntityListContextProps, UserListFilterKind, EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
+import { EntityRefPresentationSnapshot, CatalogApi, EntityPresentationApi, EntityRefPresentation, StarredEntitiesApi, EntityListContextProps, UserListFilterKind, EntityOwnerPickerProps, EntityListPagination } from '@backstage/plugin-catalog-react';
 import { HumanDuration, Observable } from '@backstage/types';
 import { InfoCardVariants, TableColumn, TableProps, TableOptions } from '@backstage/core-components';
 import * as React$1 from 'react';
@@ -511,11 +511,9 @@ interface DefaultCatalogPageProps {
     tableOptions?: TableProps<CatalogTableRow>['options'];
     emptyContent?: ReactNode;
     ownerPickerMode?: EntityOwnerPickerProps['mode'];
-    pagination?: boolean | {
-        limit?: number;
-    };
     filters?: ReactNode;
     initiallySelectedNamespaces?: string[];
+    pagination?: EntityListPagination;
 }
 
 /** @public */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-catalog",
-  "version": "1.22.1-next.1",
+  "version": "1.23.0-next.2",
   "description": "The Backstage plugin for browsing the Backstage catalog",
   "backstage": {
     "role": "frontend-plugin",
@@ -57,20 +57,20 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/catalog-client": "^1.6.7-next.0",
+    "@backstage/catalog-client": "^1.7.0-next.1",
     "@backstage/catalog-model": "^1.6.0",
-    "@backstage/core-compat-api": "^0.3.0-next.1",
-    "@backstage/core-components": "^0.14.11-next.0",
-    "@backstage/core-plugin-api": "^1.9.3",
+    "@backstage/core-compat-api": "^0.3.0-next.2",
+    "@backstage/core-components": "^0.14.11-next.1",
+    "@backstage/core-plugin-api": "^1.9.4-next.0",
     "@backstage/errors": "^1.2.4",
-    "@backstage/frontend-plugin-api": "^0.8.0-next.1",
-    "@backstage/integration-react": "^1.1.30",
+    "@backstage/frontend-plugin-api": "^0.8.0-next.2",
+    "@backstage/integration-react": "^1.1.31-next.0",
     "@backstage/plugin-catalog-common": "^1.0.26",
-    "@backstage/plugin-catalog-react": "^1.12.4-next.1",
-    "@backstage/plugin-permission-react": "^0.4.25",
+    "@backstage/plugin-catalog-react": "^1.13.0-next.2",
+    "@backstage/plugin-permission-react": "^0.4.26-next.0",
     "@backstage/plugin-scaffolder-common": "^1.5.5",
     "@backstage/plugin-search-common": "^1.2.14",
-    "@backstage/plugin-search-react": "^1.8.0-next.1",
+    "@backstage/plugin-search-react": "^1.8.0-next.2",
     "@backstage/types": "^1.1.1",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
@@ -86,15 +86,15 @@
     "zen-observable": "^0.10.0"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.27.1-next.1",
-    "@backstage/core-app-api": "^1.14.2",
-    "@backstage/dev-utils": "^1.0.38-next.1",
-    "@backstage/frontend-test-utils": "^0.2.0-next.1",
+    "@backstage/cli": "^0.27.1-next.2",
+    "@backstage/core-app-api": "^1.14.3-next.0",
+    "@backstage/dev-utils": "^1.1.0-next.2",
+    "@backstage/frontend-test-utils": "^0.2.0-next.2",
     "@backstage/plugin-permission-common": "^0.8.1",
-    "@backstage/test-utils": "^1.6.0-next.0",
+    "@backstage/test-utils": "^1.6.0-next.1",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
-    "@testing-library/react": "^15.0.0",
+    "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.0.0",
     "@types/pluralize": "^0.0.33",
     "swr": "^2.2.5"

package/dist/components/CatalogTable/PaginatedCatalogTable.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PaginatedCatalogTable.esm.js","sources":["../../../src/components/CatalogTable/PaginatedCatalogTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 React from 'react';\n\nimport { Table, TableProps } from '@backstage/core-components';\nimport { CatalogTableRow } from './types';\nimport { CatalogTableToolbar } from './CatalogTableToolbar';\n\ntype PaginatedCatalogTableProps = {\n  prev?(): void;\n  next?(): void;\n} & TableProps<CatalogTableRow>;\n\n/**\n * @internal\n */\nexport function PaginatedCatalogTable(props: PaginatedCatalogTableProps) {\n  const { columns, data, next, prev, title, isLoading, options, ...restProps } =\n    props;\n\n  return (\n    <Table\n      title={isLoading ? '' : title}\n      columns={columns}\n      data={data}\n      options={{\n        ...options,\n        // These settings are configured to force server side pagination\n        paginationPosition: 'both',\n        pageSizeOptions: [],\n        showFirstLastPageButtons: false,\n        pageSize: Number.MAX_SAFE_INTEGER,\n        emptyRowsWhenPaging: false,\n      }}\n      onPageChange={page => {\n        if (page > 0) {\n          next?.();\n        } else {\n          prev?.();\n        }\n      }}\n      components={{\n        Toolbar: CatalogTableToolbar,\n      }}\n      /* this will enable the prev button accordingly */\n      page={prev ? 1 : 0}\n      /* this will enable the next button accordingly */\n      totalCount={next ? Number.MAX_VALUE : Number.MAX_SAFE_INTEGER}\n      localization={{ pagination: { labelDisplayedRows: '' } }}\n      {...restProps}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AA8BO,SAAS,sBAAsB,KAAmC,EAAA;AACvE,EAAM,MAAA,EAAE,OAAS,EAAA,IAAA,EAAM,IAAM,EAAA,IAAA,EAAM,OAAO,SAAW,EAAA,OAAA,EAAS,GAAG,SAAA,EAC/D,GAAA,KAAA,CAAA;AAEF,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,YAAY,EAAK,GAAA,KAAA;AAAA,MACxB,OAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAS,EAAA;AAAA,QACP,GAAG,OAAA;AAAA;AAAA,QAEH,kBAAoB,EAAA,MAAA;AAAA,QACpB,iBAAiB,EAAC;AAAA,QAClB,wBAA0B,EAAA,KAAA;AAAA,QAC1B,UAAU,MAAO,CAAA,gBAAA;AAAA,QACjB,mBAAqB,EAAA,KAAA;AAAA,OACvB;AAAA,MACA,cAAc,CAAQ,IAAA,KAAA;AACpB,QAAA,IAAI,OAAO,CAAG,EAAA;AACZ,UAAO,IAAA,IAAA,CAAA;AAAA,SACF,MAAA;AACL,UAAO,IAAA,IAAA,CAAA;AAAA,SACT;AAAA,OACF;AAAA,MACA,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,mBAAA;AAAA,OACX;AAAA,MAEA,IAAA,EAAM,OAAO,CAAI,GAAA,CAAA;AAAA,MAEjB,UAAY,EAAA,IAAA,GAAO,MAAO,CAAA,SAAA,GAAY,MAAO,CAAA,gBAAA;AAAA,MAC7C,cAAc,EAAE,UAAA,EAAY,EAAE,kBAAA,EAAoB,IAAK,EAAA;AAAA,MACtD,GAAG,SAAA;AAAA,KAAA;AAAA,GACN,CAAA;AAEJ;;;;"}