Merge pull request #5657 from marmelab/Fix-compound-filter-show

Fix Filter fails to show compound filters with no default value
marmelab · Dec 11, 2020 · caec5d7 · caec5d7
2 parents b092973 + 1d96140
commit caec5d7
Show file tree

Hide file tree

Showing 2 changed files with 151 additions and 2 deletions.
diff --git a/...core/src/controller/useListParams.spec.ts → ...ore/src/controller/useListParams.spec.tsx b/...core/src/controller/useListParams.spec.ts → ...ore/src/controller/useListParams.spec.tsx
@@ -1,4 +1,11 @@
-import { getQuery, getNumberOrDefault } from './useListParams';
+import * as React from 'react';
+import expect from 'expect';
+import { render } from '@testing-library/react';
+import { Router } from 'react-router-dom';
+import { stringify } from 'query-string';
+
+import TestContext from '../util/TestContext';
+import useListParams, { getQuery, getNumberOrDefault } from './useListParams';
 import {
     SORT_DESC,
     SORT_ASC,
@@ -182,4 +189,144 @@ describe('useListParams', () => {
             expect(result).toEqual(0);
         });
     });
+    describe('showFilter', () => {
+        it('should initialize displayed filters', () => {
+            const TestedComponent = () => {
+                const [, { showFilter }] = useListParams({
+                    resource: 'foo',
+                    location: {} as any,
+                });
+                showFilter('foo');
+                return <span />;
+            };
+            const history = {
+                listen: jest.fn(),
+                push: jest.fn(),
+                location: { pathname: '', search: '' },
+            } as any;
+            render(
+                <Router history={history}>
+                    <TestContext history={history}>
+                        <TestedComponent />
+                    </TestContext>
+                </Router>
+            );
+            expect(history.push).toBeCalledWith({
+                search:
+                    '?' +
+                    stringify({
+                        displayedFilters: JSON.stringify({ foo: true }),
+                        filter: '{}',
+                        sort: 'id',
+                        order: 'ASC',
+                        page: 1,
+                        perPage: 10,
+                    }),
+            });
+        });
+        it('should initialize filters', () => {
+            const TestedComponent = () => {
+                const [, { showFilter }] = useListParams({
+                    resource: 'foo',
+                    location: {} as any,
+                });
+                showFilter('foo', 'bar');
+                return <span />;
+            };
+            const history = {
+                listen: jest.fn(),
+                push: jest.fn(),
+                location: { pathname: '', search: '' },
+            } as any;
+            render(
+                <Router history={history}>
+                    <TestContext history={history}>
+                        <TestedComponent />
+                    </TestContext>
+                </Router>
+            );
+            expect(history.push).toBeCalledWith({
+                search:
+                    '?' +
+                    stringify({
+                        displayedFilters: JSON.stringify({ foo: true }),
+                        filter: JSON.stringify({ foo: 'bar' }),
+                        sort: 'id',
+                        order: 'ASC',
+                        page: 1,
+                        perPage: 10,
+                    }),
+            });
+        });
+
+        it('should initialize displayed filters on compound filters', () => {
+            const TestedComponent = () => {
+                const [, { showFilter }] = useListParams({
+                    resource: 'foo',
+                    location: {} as any,
+                });
+                showFilter('foo.bar');
+                return <span />;
+            };
+            const history = {
+                listen: jest.fn(),
+                push: jest.fn(),
+                location: { pathname: '', search: '' },
+            } as any;
+            render(
+                <Router history={history}>
+                    <TestContext history={history}>
+                        <TestedComponent />
+                    </TestContext>
+                </Router>
+            );
+            expect(history.push).toBeCalledWith({
+                search:
+                    '?' +
+                    stringify({
+                        displayedFilters: JSON.stringify({ 'foo.bar': true }),
+                        filter: '{}',
+                        sort: 'id',
+                        order: 'ASC',
+                        page: 1,
+                        perPage: 10,
+                    }),
+            });
+        });
+
+        it('should initialize filters on compound filters', () => {
+            const TestedComponent = () => {
+                const [, { showFilter }] = useListParams({
+                    resource: 'foo',
+                    location: {} as any,
+                });
+                showFilter('foo.bar', 'baz');
+                return <span />;
+            };
+            const history = {
+                listen: jest.fn(),
+                push: jest.fn(),
+                location: { pathname: '', search: '' },
+            } as any;
+            render(
+                <Router history={history}>
+                    <TestContext history={history}>
+                        <TestedComponent />
+                    </TestContext>
+                </Router>
+            );
+            expect(history.push).toBeCalledWith({
+                search:
+                    '?' +
+                    stringify({
+                        displayedFilters: JSON.stringify({ 'foo.bar': true }),
+                        filter: JSON.stringify({ foo: { bar: 'baz' } }),
+                        sort: 'id',
+                        order: 'ASC',
+                        page: 1,
+                        perPage: 10,
+                    }),
+            });
+        });
+    });
 });
diff --git a/packages/ra-core/src/controller/useListParams.ts b/packages/ra-core/src/controller/useListParams.ts
@@ -246,7 +246,9 @@ const useListParams = ({
             ...displayedFilterValues,
             [filterName]: true,
         };
-        const filter = set(filterValues, filterName, defaultValue);
+        const filter = defaultValue
+            ? set(filterValues, filterName, defaultValue)
+            : filterValues;
         changeParams({
             type: SET_FILTER,
             payload: {