@backstage/plugin-catalog-react 1.0.1-next.1 → 1.0.1-next.2

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @backstage/plugin-catalog-react
 
+## 1.0.1-next.2
+
+### Patch Changes
+
+- 4be0d1e777: Changed catalog filter components to only pay attention to query parameters relevant to the component.
+- 5d5fdbe541: Columns in CatalogTable now change depending on the entity kind, ensuring only relevant columns are displayed.
+- 99063c39ae: Minor API report cleanup
+- Updated dependencies
+  - @backstage/core-components@0.9.3-next.1
+  - @backstage/catalog-model@1.0.1-next.1
+
 ## 1.0.1-next.1
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-catalog-react",
-  "version": "1.0.1-next.1",
+  "version": "1.0.1-next.2",
   "main": "../dist/index.esm.js",
   "types": "../dist/index.alpha.d.ts"
 }

package/dist/index.alpha.d.ts

@@ -259,7 +259,7 @@ export declare const EntityOwnerPicker: () => JSX.Element | null;
  *
  * @public
  */
-export declare const EntityProvider: ({ entity, children }: EntityProviderProps) => JSX.Element;
+export declare const EntityProvider: (props: EntityProviderProps) => JSX.Element;
 
 /**
  * Properties for the EntityProvider component.

package/dist/index.beta.d.ts

@@ -259,7 +259,7 @@ export declare const EntityOwnerPicker: () => JSX.Element | null;
  *
  * @public
  */
-export declare const EntityProvider: ({ entity, children }: EntityProviderProps) => JSX.Element;
+export declare const EntityProvider: (props: EntityProviderProps) => JSX.Element;
 
 /**
  * Properties for the EntityProvider component.

package/dist/index.d.ts

@@ -259,7 +259,7 @@ export declare const EntityOwnerPicker: () => JSX.Element | null;
  *
  * @public
  */
-export declare const EntityProvider: ({ entity, children }: EntityProviderProps) => JSX.Element;
+export declare const EntityProvider: (props: EntityProviderProps) => JSX.Element;
 
 /**
  * Properties for the EntityProvider component.

package/dist/index.esm.js

@@ -125,12 +125,12 @@ const AsyncEntityProvider = ({
     value: createVersionedValueMap({ 1: value })
   }, children);
 };
-const EntityProvider = ({ entity, children }) => /* @__PURE__ */ React.createElement(AsyncEntityProvider, {
-  entity,
-  loading: !Boolean(entity),
+const EntityProvider = (props) => /* @__PURE__ */ React.createElement(AsyncEntityProvider, {
+  entity: props.entity,
+  loading: !Boolean(props.entity),
   error: void 0,
   refresh: void 0,
-  children
+  children: props.children
 });
 function useEntity() {
   const versionedHolder = useVersionedContext("entity-context");
@@ -479,16 +479,16 @@ function useEntityTypeFilter() {
   const catalogApi = useApi(catalogApiRef);
   const {
     filters: { kind: kindFilter, type: typeFilter },
-    queryParameters,
+    queryParameters: { type: typeParameter },
     updateFilters
   } = useEntityList();
-  const queryParamTypes = useMemo(() => [queryParameters.type].flat().filter(Boolean), [queryParameters]);
-  const [selectedTypes, setSelectedTypes] = useState(queryParamTypes.length ? queryParamTypes : (_a = typeFilter == null ? void 0 : typeFilter.getTypes()) != null ? _a : []);
+  const flattenedQueryTypes = useMemo(() => [typeParameter].flat().filter(Boolean), [typeParameter]);
+  const [selectedTypes, setSelectedTypes] = useState(flattenedQueryTypes.length ? flattenedQueryTypes : (_a = typeFilter == null ? void 0 : typeFilter.getTypes()) != null ? _a : []);
   useEffect(() => {
-    if (queryParamTypes.length) {
-      setSelectedTypes(queryParamTypes);
+    if (flattenedQueryTypes.length) {
+      setSelectedTypes(flattenedQueryTypes);
     }
-  }, [queryParamTypes]);
+  }, [flattenedQueryTypes]);
   const [availableTypes, setAvailableTypes] = useState([]);
   const kind = useMemo(() => kindFilter == null ? void 0 : kindFilter.value, [kindFilter]);
   const {
@@ -665,8 +665,11 @@ function useEntityPermission(permission) {
 const EntityKindPicker = (props) => {
   var _a;
   const { initialFilter, hidden } = props;
-  const { updateFilters, queryParameters } = useEntityList();
-  const [selectedKind] = useState((_a = [queryParameters.kind].flat()[0]) != null ? _a : initialFilter);
+  const {
+    updateFilters,
+    queryParameters: { kind: kindParameter }
+  } = useEntityList();
+  const [selectedKind] = useState((_a = [kindParameter].flat()[0]) != null ? _a : initialFilter);
   useEffect(() => {
     updateFilters({
       kind: selectedKind ? new EntityKindFilter(selectedKind) : void 0
@@ -693,8 +696,13 @@ const checkedIcon$2 = /* @__PURE__ */ React.createElement(CheckBoxIcon, {
 const EntityLifecyclePicker = () => {
   var _a, _b;
   const classes = useStyles$b();
-  const { updateFilters, backendEntities, filters, queryParameters } = useEntityList();
-  const queryParamLifecycles = useMemo(() => [queryParameters.lifecycles].flat().filter(Boolean), [queryParameters]);
+  const {
+    updateFilters,
+    backendEntities,
+    filters,
+    queryParameters: { lifecycles: lifecyclesParameter }
+  } = useEntityList();
+  const queryParamLifecycles = useMemo(() => [lifecyclesParameter].flat().filter(Boolean), [lifecyclesParameter]);
   const [selectedLifecycles, setSelectedLifecycles] = useState(queryParamLifecycles.length ? queryParamLifecycles : (_b = (_a = filters.lifecycles) == null ? void 0 : _a.values) != null ? _b : []);
   useEffect(() => {
     if (queryParamLifecycles.length) {
@@ -759,8 +767,13 @@ const checkedIcon$1 = /* @__PURE__ */ React.createElement(CheckBoxIcon, {
 const EntityOwnerPicker = () => {
   var _a, _b;
   const classes = useStyles$a();
-  const { updateFilters, backendEntities, filters, queryParameters } = useEntityList();
-  const queryParamOwners = useMemo(() => [queryParameters.owners].flat().filter(Boolean), [queryParameters]);
+  const {
+    updateFilters,
+    backendEntities,
+    filters,
+    queryParameters: { owners: ownersParameter }
+  } = useEntityList();
+  const queryParamOwners = useMemo(() => [ownersParameter].flat().filter(Boolean), [ownersParameter]);
   const [selectedOwners, setSelectedOwners] = useState(queryParamOwners.length ? queryParamOwners : (_b = (_a = filters.owners) == null ? void 0 : _a.values) != null ? _b : []);
   useEffect(() => {
     if (queryParamOwners.length) {
@@ -1032,7 +1045,11 @@ const checkedIcon = /* @__PURE__ */ React.createElement(CheckBoxIcon, {
 const EntityTagPicker = () => {
   var _a, _b;
   const classes = useStyles$7();
-  const { updateFilters, filters, queryParameters } = useEntityList();
+  const {
+    updateFilters,
+    filters,
+    queryParameters: { tags: tagsParameter }
+  } = useEntityList();
   const catalogApi = useApi(catalogApiRef);
   const { value: availableTags } = useAsync(async () => {
     var _a2;
@@ -1043,7 +1060,7 @@ const EntityTagPicker = () => {
     });
     return facets[facet].map(({ value }) => value);
   }, [filters.kind]);
-  const queryParamTags = useMemo(() => [queryParameters.tags].flat().filter(Boolean), [queryParameters]);
+  const queryParamTags = useMemo(() => [tagsParameter].flat().filter(Boolean), [tagsParameter]);
   const [selectedTags, setSelectedTags] = useState(queryParamTags.length ? queryParamTags : (_b = (_a = filters.tags) == null ? void 0 : _a.values) != null ? _b : []);
   useEffect(() => {
     if (queryParamTags.length) {
@@ -1962,20 +1979,20 @@ const UserListPicker = (props) => {
     filters,
     updateFilters,
     backendEntities,
-    queryParameters,
+    queryParameters: { kind: kindParameter, user: userParameter },
     loading: loadingBackendEntities
   } = useEntityList();
   const userAndGroupFilterIds = ["starred", "all"];
   const filterGroups = getFilterGroups(orgName).map((filterGroup) => ({
     ...filterGroup,
-    items: filterGroup.items.filter(({ id }) => ["group", "user"].some((kind) => kind === queryParameters.kind) ? userAndGroupFilterIds.includes(id) : !availableFilters || availableFilters.includes(id))
+    items: filterGroup.items.filter(({ id }) => ["group", "user"].some((kind) => kind === kindParameter) ? userAndGroupFilterIds.includes(id) : !availableFilters || availableFilters.includes(id))
   })).filter(({ items }) => !!items.length);
   const { isStarredEntity } = useStarredEntities();
   const { isOwnedEntity, loading: loadingEntityOwnership } = useEntityOwnership();
   const loading = loadingBackendEntities || loadingEntityOwnership;
   const ownedFilter = useMemo(() => new UserListFilter("owned", isOwnedEntity, isStarredEntity), [isOwnedEntity, isStarredEntity]);
   const starredFilter = useMemo(() => new UserListFilter("starred", isOwnedEntity, isStarredEntity), [isOwnedEntity, isStarredEntity]);
-  const queryParamUserFilter = useMemo(() => [queryParameters.user].flat()[0], [queryParameters]);
+  const queryParamUserFilter = useMemo(() => [userParameter].flat()[0], [userParameter]);
   const [selectedUserFilter, setSelectedUserFilter] = useState(queryParamUserFilter != null ? queryParamUserFilter : initialFilter);
   const entitiesWithoutUserFilter = useMemo(() => backendEntities.filter(reduceEntityFilters(compact(Object.values({ ...filters, user: void 0 })))), [filters, backendEntities]);
   const filterCounts = useMemo(() => ({