Filter for `DependenciesList` and `DependentsList` by thomasdax98 · Pull Request #5267 · vivid-planet/comet

thomasdax98 · 2026-03-02T16:19:47Z

Add filter to DependenciesList and DependentsList:

filter.mp4

Jira: https://vivid-planet.atlassian.net/browse/PHSB2C-6541

…ependentsList and DependenciesList

thomasdax98 · 2026-03-17T23:33:05Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

+        return qb;
+    }
+
+    private applyFilter(qb: Knex.QueryBuilder, filter?: DependencyFilter | DependentFilter): void {


I could not use the helpers from https://github.com/vivid-planet/comet/blob/99950fa9d1a1b62e48722808f89483006f824046/packages/api/cms-api/src/common/filter/mikro-orm.ts because block_index_dependencies isn't an actual entity and we need to join it on EntityInfo. Thus, the filter and sort logic is basically duplicated

if you create a entity class for block_index_dependencies (similar to EntityInfoObject) and query that instead of using query builder, we could use the helpers.

I just noticed here we join EntityInfo (on block_index_dependencies), but block_index_dependencies (the view) does already join EntityInfo for entityVisible: we could add name & secondaryInformation to block_index_dependencies and would not have to join again. Or is there a reason, like it updates faster as it is not materialized?

thomasdax98 · 2026-03-17T23:34:03Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

+    private getBaseQueryBuilder(
+        internalFilter: { targetEntityName?: string; rootEntityName?: string; targetId?: string; rootId?: string },


I'm not 100% certain if this split into internalFilter and other filters (in L316) is a good idea. We could maybe combine this. What do you think?

IMO getBaseQueryBuilder, applyFilter, and applySort could be implemented in a single getQueryBuilderWithFilters (or getQueryBuilderWithFiltersAndSort) as before.

thomasdax98 · 2026-03-17T23:37:41Z

packages/admin/cms-admin/src/dependencies/DependentsList.tsx

+function getDisplayNameString(displayName: ReactNode, fallback: string): string {
+    if (typeof displayName === "string") return displayName;
+    if (isValidElement(displayName)) {
+        const { defaultMessage } = displayName.props as { defaultMessage?: string };
+        if (typeof defaultMessage === "string") return defaultMessage;
+    }
+    return fallback;
+}


This is a bit of a workaround because displayName is a ReactNode. I thought about changing it to a string, but the displayName field is shared with DocumentInterface so I didn't want to touch it. Also this is defined in Page.tsx outside a react component, so intl.formatMessage() isn't a suitable alternative either.

The implementation isn't correct because it would always use the default message, not the translated one. Instead I'd implement it like we do here:

comet/packages/admin/cms-admin/src/blocks/common/AddBlockDrawer.tsx

Lines 50 to 56 in 71ce212

if (typeof block.displayName === "string") {

blockName = block.displayName;

} else if (isFormattedMessage(block.displayName)) {

blockName = intl.formatMessage(block.displayName.props);

} else {

throw new TypeError("Block displayName must be either a string or a FormattedMessage");

}

displayName will always be either string or <FormattedMessage>.

thomasdax98 · 2026-03-17T23:48:08Z

.changeset/deps-list-filter-sort.md

+
+Users can now filter dependencies/dependents by name, type, secondary information, and visibility, and sort by all columns. A default filter shows only visible items. The `GqlFilter` type is now exported from `@comet/admin`.
+
+**Breaking changes:**


I deliberately didn't add these changes to the migration guide since I'm 99% sure these apis aren't used in any real project so it would just unnecessarily prolong the guide. But maybe it doesn't matter since the primary target are AI agents.
What do you think, should I add it?

…-filter

Copilot

Pull request overview

This PR adds server-side filtering and sorting support to the Dependencies/Dependents lists end-to-end (GraphQL schema + API query handling + admin UI grids), including updated docs and demo queries.

Changes:

Extend the CMS API GraphQL inputs/args to support filter (with nested StringFilter/BooleanFilter) and sort (DependencySort).
Implement filter/sort application in DependenciesService and pass sort through the resolvers.
Update admin DependenciesList/DependentsList to enable DataGrid filtering/sorting and forward $filter/$sort variables; update docs/demo queries accordingly.

Reviewed changes

Copilot reviewed 15 out of 15 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
packages/api/cms-api/src/dependencies/dto/dependency-sort.ts	Introduces GraphQL input + enum for dependency sorting.
packages/api/cms-api/src/dependencies/dto/dependencies.filter.ts	Expands dependency/dependent filters to nested string/boolean filters plus `and`/`or`.
packages/api/cms-api/src/dependencies/dto/dependencies.args.ts	Adds `sort` argument to dependencies/dependents GraphQL args.
packages/api/cms-api/src/dependencies/dependents.resolver.factory.ts	Passes `sort` through to service for dependents.
packages/api/cms-api/src/dependencies/dependencies.service.ts	Implements Knex-based filter/sort application and ensures count query clears ordering.
packages/api/cms-api/src/dependencies/dependencies.resolver.factory.ts	Passes `sort` through to service for dependencies.
packages/api/cms-api/schema.gql	Updates public schema for new filter/sort inputs and args; rehomes shared filter/sort types.
packages/admin/cms-admin/src/dependencies/DependentsList.tsx	Enables grid filter/sort UI and forwards `filter`/`sort` vars to GraphQL query.
packages/admin/cms-admin/src/dependencies/DependenciesList.tsx	Enables grid filter/sort UI and forwards `filter`/`sort` vars to GraphQL query.
packages/admin/cms-admin/src/dam/FileForm/EditFile.gql.ts	Updates dependents query to accept/forward `$filter`/`$sort` and request `visible`.
packages/admin/admin/src/index.ts	Exports `GqlFilter` type from `muiGridFilterToGql`.
docs/docs/2-core-concepts/7-dependencies/index.md	Updates documentation example queries for new filter/sort variables and `visible`.
demo/api/schema.gql	Updates demo schema to include new filter/sort capabilities.
demo/admin/src/documents/pages/EditPage.tsx	Updates demo page queries to accept/forward `$filter`/`$sort` and request `visible`.
.changeset/deps-list-filter-sort.md	Declares version bumps and documents breaking changes + required query updates.

thomasdax98 · 2026-03-18T11:50:54Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

+            this.applyStringFilterToKnex(qb, '"EntityInfo"."secondaryInformation"', filter.secondaryInformation);
        }
+        if (filter.visible) {
+            if (filter.visible.equal !== undefined) {


thomasdax98 · 2026-03-18T11:51:01Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

+        if (filter.contains !== undefined) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`%${filter.contains}%`]));
+        }
+        if (filter.notContains !== undefined) {
+            qb.andWhere(knex.raw(`${column} NOT ILIKE ?`, [`%${filter.notContains}%`]));
+        }
+        if (filter.startsWith !== undefined) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`${filter.startsWith}%`]));
+        }
+        if (filter.endsWith !== undefined) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`%${filter.endsWith}`]));
        }
+        if (filter.equal !== undefined) {
+            qb.andWhere(knex.raw(`${column} = ?`, [filter.equal]));
+        }
+        if (filter.notEqual !== undefined) {
+            qb.andWhere(knex.raw(`${column} != ?`, [filter.notEqual]));
+        }
+        if (filter.isAnyOf !== undefined && filter.isAnyOf.length > 0) {


thomasdax98 · 2026-03-18T11:50:46Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

+        if (filter.and) {
+            for (const subFilter of filter.and) {
+                qb.andWhere((sub) => {
+                    this.applyFilter(sub, subFilter);
+                });
+            }
+        }
+        if (filter.or) {
+            const orFilters = filter.or;
+            qb.andWhere((outer) => {
+                for (const subFilter of orFilters) {
+                    outer.orWhere((sub) => {
+                        this.applyFilter(sub, subFilter);
+                    });
+                }
+            });
+        }


Copilot

Pull request overview

Adds server- and client-side filtering/sorting for the Dependencies/Dependents lists, updating the CMS GraphQL API inputs and the admin UI data grids accordingly.

Changes:

Extend GraphQL API for dependencies / dependents with filter (nested StringFilter / BooleanFilter + and/or) and sort (DependencySort).
Update DependenciesService to apply new filter + sort options against the block_index_dependencies view and EntityInfo join.
Update admin DependenciesList / DependentsList to use DataGrid filter/sort UI and pass $filter / $sort variables; update docs/demo queries and schemas.

Reviewed changes

Copilot reviewed 15 out of 15 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
packages/api/cms-api/src/dependencies/dto/dependency-sort.ts	Introduces `DependencySort` + `DependencySortField` GraphQL input/enum.
packages/api/cms-api/src/dependencies/dto/dependencies.filter.ts	Expands filter inputs to nested `StringFilter`/`BooleanFilter` and `and`/`or`.
packages/api/cms-api/src/dependencies/dto/dependencies.args.ts	Adds `sort` argument to dependencies/dependents field args.
packages/api/cms-api/src/dependencies/dependents.resolver.factory.ts	Wires `sort` through to service.
packages/api/cms-api/src/dependencies/dependencies.resolver.factory.ts	Wires `sort` through to service.
packages/api/cms-api/src/dependencies/dependencies.service.ts	Implements Knex-side filter/sort application for dependencies/dependents queries.
packages/api/cms-api/schema.gql	Updates generated schema to expose new filter/sort inputs and visible field usage.
packages/admin/cms-admin/src/dependencies/DependentsList.tsx	Adds DataGrid filter/sort UI and forwards GQL filter/sort variables.
packages/admin/cms-admin/src/dependencies/DependenciesList.tsx	Adds DataGrid filter/sort UI and forwards GQL filter/sort variables.
packages/admin/cms-admin/src/dam/FileForm/EditFile.gql.ts	Updates dependents query to accept and forward `$filter`/`$sort`; includes `visible`.
packages/admin/admin/src/index.ts	Re-exports `GqlFilter` type from `@comet/admin`.
docs/docs/2-core-concepts/7-dependencies/index.md	Updates documentation query example to include `$filter`/`$sort` and `visible`.
demo/api/schema.gql	Updates demo schema for new filter/sort inputs.
demo/admin/src/documents/pages/EditPage.tsx	Updates demo queries to include `$filter`/`$sort` and request `visible`.
.changeset/deps-list-filter-sort.md	Declares version bumps and documents breaking API/query changes.

packages/admin/cms-admin/src/dependencies/DependentsList.tsx

+function getDisplayNameString(displayName: ReactNode, fallback: string): string {
+    if (typeof displayName === "string") return displayName;
+    if (isValidElement(displayName)) {
+        const { defaultMessage } = displayName.props as { defaultMessage?: string };
+        if (typeof defaultMessage === "string") return defaultMessage;
+    }
+    return fallback;
+}


packages/api/cms-api/src/dependencies/dependencies.service.ts

+            for (const subFilter of filter.and) {
+                qb.andWhere((sub) => {
+                    this.applyFilter(sub, subFilter);
+                });
+            }
+        }
+        if (filter.or?.length) {
+            const orFilters = filter.or;
+            qb.andWhere((outer) => {
+                for (const subFilter of orFilters) {
+                    outer.orWhere((sub) => {
+                        this.applyFilter(sub, subFilter);
+                    });
+                }
+            });


packages/api/cms-api/src/dependencies/dependencies.service.ts

+    private applyStringFilterToKnex(qb: Knex.QueryBuilder, column: string, filter: StringFilter): void {
+        const knex = this.entityManager.getKnex("read");

-        if (filter?.rootColumnName) {
-            qb.andWhere({ rootColumnName: filter.rootColumnName });
+        if (filter.contains !== undefined && filter.contains !== null) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`%${filter.contains}%`]));
+        }
+        if (filter.notContains !== undefined && filter.notContains !== null) {
+            qb.andWhere(knex.raw(`${column} NOT ILIKE ?`, [`%${filter.notContains}%`]));
+        }
+        if (filter.startsWith !== undefined && filter.startsWith !== null) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`${filter.startsWith}%`]));
+        }
+        if (filter.endsWith !== undefined && filter.endsWith !== null) {
+            qb.andWhere(knex.raw(`${column} ILIKE ?`, [`%${filter.endsWith}`]));
        }


packages/admin/cms-admin/src/dependencies/DependenciesList.tsx

+                sortBy: "visible",
+                toGqlFilter: (filterItem) => {
+                    if (filterItem.value === undefined || filterItem.value === "") return {};
+                    return { visible: { equal: filterItem.value === "true" || filterItem.value === true } } as unknown as GqlFilter;


packages/admin/cms-admin/src/dependencies/DependentsList.tsx

+                sortBy: "visible",
+                toGqlFilter: (filterItem) => {
+                    if (filterItem.value === undefined || filterItem.value === "") return {};
+                    return { visible: { equal: filterItem.value === "true" || filterItem.value === true } } as unknown as GqlFilter;


packages/admin/cms-admin/src/dependencies/DependenciesList.tsx

+function getDisplayNameString(displayName: ReactNode, fallback: string): string {
+    if (typeof displayName === "string") return displayName;
+    if (isValidElement(displayName)) {
+        const { defaultMessage } = displayName.props as { defaultMessage?: string };
+        if (typeof defaultMessage === "string") return defaultMessage;
+    }
+    return fallback;
+}


johnnyomair · 2026-03-19T07:58:04Z

packages/admin/cms-admin/src/dependencies/DependenciesList.tsx

+                    };
+
+                    return (
+                        <div style={{ display: "flex" }}>


Instead of inline styles, could we use MUI's Box?

johnnyomair · 2026-03-19T07:58:58Z

packages/api/cms-api/src/dependencies/dto/dependencies.args.ts

+    @Field(() => [DependencySort], { nullable: true })
+    @ValidateNested({ each: true })
+    @Type(() => DependencySort)
+    @IsOptional()


Could we use IsUndefinable (and maybe IsNullable)?

johnnyomair · 2026-03-19T09:07:35Z

packages/api/cms-api/src/dependencies/dependencies.service.ts

        },
        paginationArgs?: { offset: number; limit: number },
-        options?: { forceRefresh: boolean },
+        options?: { forceRefresh: boolean; sort?: DependencySort[] },


It's weird that filter and pagination are passed as root args, while sort is passed via options.

Add filtering by name, secondaryInformation, type and visibility to D…

4c730f3

…ependentsList and DependenciesList

thomasdax98 added this to the v9 milestone Mar 2, 2026

thomasdax98 added the new-entity-info label Mar 2, 2026

thomasdax98 added 6 commits March 17, 2026 23:15

Fix type filters

233fe55

Wrap columns in useMemo as done by generator

56e0974

Update docs

a781dc5

Fix filter for dependents and dependencies

ad343bc

Remove unnecessary library export

e95d45a

Add breaking changes to changeset

b5458c5

thomasdax98 commented Mar 17, 2026

View reviewed changes

Merge remote-tracking branch 'origin/next' into thomasdax98/deps-list…

e747a7c

…-filter

thomasdax98 force-pushed the thomasdax98/deps-list-filter branch from d03d93d to e747a7c Compare March 18, 2026 00:03

thomasdax98 marked this pull request as ready for review March 18, 2026 00:03

auto-assign bot requested a review from johnnyomair March 18, 2026 00:03

auto-assign bot assigned thomasdax98 Mar 18, 2026

thomasdax98 requested review from Copilot, johnnyomair and nsams and removed request for johnnyomair March 18, 2026 00:03

Copilot started reviewing on behalf of thomasdax98 March 18, 2026 00:04 View session

Copilot AI reviewed Mar 18, 2026

View reviewed changes

thomasdax98 changed the title ~~Draft: Filter for DependenciesList and DependentsList~~ Filter for DependenciesList and DependentsList Mar 18, 2026

thomasdax98 added 2 commits March 18, 2026 12:32

Check string filters for undefined and null

2cdb940

Check visible filter for undefined and null

f3c9e9f

thomasdax98 changed the base branch from next to main March 18, 2026 11:41

Skip empty and/or filter arrays in dependencies query

690f5a0

thomasdax98 requested a review from Copilot March 18, 2026 11:51

Copilot started reviewing on behalf of thomasdax98 March 18, 2026 11:51 View session

Copilot AI reviewed Mar 18, 2026

View reviewed changes

johnnyomair reviewed Mar 19, 2026

View reviewed changes

		private getBaseQueryBuilder(
		internalFilter: { targetEntityName?: string; rootEntityName?: string; targetId?: string; rootId?: string },

	if (typeof block.displayName === "string") {
	blockName = block.displayName;
	} else if (isFormattedMessage(block.displayName)) {
	blockName = intl.formatMessage(block.displayName.props);
	} else {
	throw new TypeError("Block displayName must be either a string or a FormattedMessage");
	}


		Users can now filter dependencies/dependents by name, type, secondary information, and visibility, and sort by all columns. A default filter shows only visible items. The `GqlFilter` type is now exported from `@comet/admin`.

		Breaking changes:

Conversation

thomasdax98 commented Mar 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

thomasdax98 Mar 17, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

thomasdax98 commented Mar 2, 2026 •

edited

Loading

thomasdax98 Mar 17, 2026 •

edited

Loading