[3.22] Fix filter for boolean attributes (#6523)

Author: lkostrowski

.changeset/purple-glasses-try.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Fixed filtering by attributes of type boolean

src/components/ConditionalFilter/API/Handler.ts

@@ -1,4 +1,5 @@
 import { type ApolloClient } from "@apollo/client";
+import { createBooleanOptions } from "@dashboard/components/ConditionalFilter/constants";
 import {
   _GetAttributeChoicesDocument,
   type _GetAttributeChoicesQuery,
@@ -40,6 +41,7 @@ import {
   _GetWarehouseChoicesDocument,
   type _GetWarehouseChoicesQuery,
   type _GetWarehouseChoicesQueryVariables,
+  AttributeInputTypeEnum,
   ChannelCurrenciesDocument,
   type ChannelCurrenciesQuery,
   type ChannelCurrenciesQueryVariables,
@@ -120,9 +122,18 @@ export class AttributeChoicesHandler implements Handler {
     public client: ApolloClient<unknown>,
     public attributeSlug: string,
     public query: string,
+    public type: string,
   ) {}
 
   fetch = async () => {
+    /**
+     * Entity-specific handlers don't work with Boolean type because it doesn't have options declared to fetch.
+     * It's just true/false, so statically use it for Booleans, no matter the entity type.
+     */
+    if (this.type === AttributeInputTypeEnum.BOOLEAN) {
+      return createBooleanOptions();
+    }
+
     const { client, attributeSlug, query } = this;
     const { data } = await client.query<
       _GetAttributeChoicesQuery,

src/components/ConditionalFilter/FiltersQueryBuilder/queryVarsBuilders/AttributeQueryVarsBuilder.test.ts

@@ -181,6 +181,32 @@ describe("AttributeQueryVarsBuilder", () => {
       expect(handler).toBeInstanceOf(AttributeChoicesHandler);
     });
 
+    it("should return static boolean options without API call for BOOLEAN attributes", async () => {
+      // Arrange
+      const mockQuery = jest.fn();
+      const mockClient = { query: mockQuery } as unknown as ApolloClient<unknown>;
+      const element = new FilterElement(
+        baseElement.value,
+        baseElement.condition,
+        false,
+        undefined,
+        new ExpressionValue("bool-attr", "BoolAttr", AttributeInputTypeEnum.BOOLEAN),
+      );
+      const def = new AttributeQueryVarsBuilder();
+
+      // Act
+      const handler = def.createOptionFetcher(mockClient, inputValue, element);
+      const options = await handler.fetch();
+
+      // Assert
+      expect(handler).toBeInstanceOf(AttributeChoicesHandler);
+      expect(mockQuery).not.toHaveBeenCalled();
+      expect(options).toEqual([
+        { label: "Yes", value: "true", slug: "true", type: undefined },
+        { label: "No", value: "false", slug: "false", type: undefined },
+      ]);
+    });
+
     it("should handle gracefully if attribute is not selected", () => {
       // Arrange
       const element = new FilterElement(

src/components/ConditionalFilter/FiltersQueryBuilder/queryVarsBuilders/AttributeQueryVarsBuilder.ts

@@ -37,7 +37,7 @@ export class AttributeQueryVarsBuilder
     inputValue: string,
     element: FilterElement,
   ): Handler {
-    const { entityType, value: id } = element.selectedAttribute || element.value;
+    const { entityType, value: id, type } = element.selectedAttribute || element.value;
 
     switch (entityType) {
       case AttributeEntityTypeEnum.PAGE:
@@ -51,7 +51,7 @@ export class AttributeQueryVarsBuilder
       case AttributeEntityTypeEnum.COLLECTION:
         return new CollectionHandler(client, inputValue);
       default:
-        return new AttributeChoicesHandler(client, id, inputValue);
+        return new AttributeChoicesHandler(client, id, inputValue, type);
     }
   }