Rename _sort filter to sort (#10688)

This commit is contained in:
Alexandre BODIN 2021-08-09 10:22:40 +02:00 committed by GitHub
parent 5b5434c001
commit 6ed18de85b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
29 changed files with 72 additions and 95 deletions

View File

@ -33,10 +33,10 @@ const HeaderSearch = ({ label, queryParameter }) => {
// Create a new search in order to remove the filters
currentSearch = new URLSearchParams('');
// Keep the previous params _sort, pageSize, page
// Keep the previous params sort, pageSize, page
const pageSize = query.get('pageSize');
const page = query.get('page');
const _sort = query.get('_sort');
const sort = query.get('sort');
if (page) {
currentSearch.set('page', page);
@ -46,8 +46,8 @@ const HeaderSearch = ({ label, queryParameter }) => {
currentSearch.set('pageSize', pageSize);
}
if (_sort) {
currentSearch.set('_sort', _sort);
if (sort) {
currentSearch.set('sort', sort);
}
currentSearch.set(queryParameter, encodeURIComponent(value));

View File

@ -8,7 +8,7 @@ const ListItem = ({ onClick, selectedItem, label, value }) => {
const { formatMessage } = useIntl();
const handleClick = () => {
onClick({ target: { name: '_sort', value } });
onClick({ target: { name: 'sort', value } });
};
return (

View File

@ -4,9 +4,9 @@ import { Carret, useTracking } from '@strapi/helper-plugin';
import { useListView } from '../../../hooks';
const Header = ({ fieldSchema: { type }, metadatas: { label, sortable, mainField }, name }) => {
const { _sort, firstSortableHeader, setQuery } = useListView();
const { sort, firstSortableHeader, setQuery } = useListView();
const { trackUsage } = useTracking();
const [sortBy, sortOrder] = _sort.split(':');
const [sortBy, sortOrder] = sort.split(':');
let sortField = name;
let useRelation = false;
@ -29,7 +29,7 @@ const Header = ({ fieldSchema: { type }, metadatas: { label, sortable, mainField
}
setQuery({
_sort: value,
sort: value,
});
}
};

View File

@ -151,12 +151,12 @@ const SettingsViewWrapper = ({
kind,
uid,
} = modifiedData;
const _sort = `${defaultSortBy}:${defaultSortOrder}`;
const sort = `${defaultSortBy}:${defaultSortOrder}`;
const goBackSearch = `${stringify(
{
page: 1,
pageSize,
_sort,
sort,
},
{ encode: false }
)}${pluginsQueryParams ? `&${pluginsQueryParams}` : ''}`;

View File

@ -15,7 +15,7 @@ describe('CONTENT MANAGER | Containers | CollectionTypeFormWrapper | selectors',
{
kind: 'collectionType',
name: 'application::address.address',
search: 'page=1&pageSize=50&_sort=city:ASC&plugins[i18n][locale]=fr',
search: 'page=1&pageSize=50&sort=city:ASC&plugins[i18n][locale]=fr',
title: 'Addresses',
to: '/content-manager/collectionType/application::address.address',
uid: 'application::address.address',
@ -23,7 +23,7 @@ describe('CONTENT MANAGER | Containers | CollectionTypeFormWrapper | selectors',
{
kind: 'collectionType',
name: 'application::category.category',
search: 'page=1&pageSize=50&_sort=city:ASC&plugins[i18n][locale]=fr',
search: 'page=1&pageSize=50&sort=city:ASC&plugins[i18n][locale]=fr',
title: 'Categories',
to: '/content-manager/collectionType/application::category.category',
uid: 'application::category.category',
@ -36,7 +36,7 @@ describe('CONTENT MANAGER | Containers | CollectionTypeFormWrapper | selectors',
{
kind: 'collectionType',
name: 'application::address.address',
search: 'page=1&pageSize=50&_sort=city:ASC&plugins[i18n][locale]=fr',
search: 'page=1&pageSize=50&sort=city:ASC&plugins[i18n][locale]=fr',
title: 'Addresses',
to: '/content-manager/collectionType/application::address.address',
uid: 'application::address.address',
@ -44,7 +44,7 @@ describe('CONTENT MANAGER | Containers | CollectionTypeFormWrapper | selectors',
{
kind: 'collectionType',
name: 'application::category.category',
search: 'page=1&pageSize=50&_sort=city:ASC&plugins[i18n][locale]=fr',
search: 'page=1&pageSize=50&sort=city:ASC&plugins[i18n][locale]=fr',
title: 'Categories',
to: '/content-manager/collectionType/application::category.category',
uid: 'application::category.category',

View File

@ -23,7 +23,7 @@ const generateLinks = (links, type, configurations = []) => {
const searchParams = {
page: 1,
pageSize: currentContentTypeConfig.settings.pageSize,
_sort: `${currentContentTypeConfig.settings.defaultSortBy}:${currentContentTypeConfig.settings.defaultSortOrder}`,
sort: `${currentContentTypeConfig.settings.defaultSortBy}:${currentContentTypeConfig.settings.defaultSortOrder}`,
};
search = stringify(searchParams, { encode: false });

View File

@ -48,7 +48,7 @@ describe('ADMIN | LeftMenu | utils', () => {
{
to: '/content-manager/collectionType/application::address.address',
isDisplayed: true,
search: `page=1&pageSize=2&_sort=name:ASC`,
search: `page=1&pageSize=2&sort=name:ASC`,
permissions: [
{
action: 'plugins::content-manager.explorer.create',

View File

@ -106,7 +106,7 @@ describe('checkPermissions', () => {
subject: 'application::address.address',
},
],
search: 'page=1&pageSize=10&_sort=name:ASC',
search: 'page=1&pageSize=10&sort=name:ASC',
},
{
destination: '/content-manager/collectionType/application::article.article',

View File

@ -122,7 +122,7 @@ function ListView({
return formatFiltersFromQuery(query);
}, [query]);
const _sort = query._sort;
const sort = query.sort;
const _q = query._q || '';
const label = contentType.info.label;
@ -382,7 +382,7 @@ function ListView({
<>
<ListViewProvider
_q={_q}
_sort={_sort}
sort={sort}
data={data}
entriesToDelete={entriesToDelete}
filters={filters}

View File

@ -5,19 +5,19 @@ describe('buildQueryString', () => {
const queryParams = {
page: '1',
pageSize: '10',
_sort: 'name:ASC',
sort: 'name:ASC',
};
const queryString = buildQueryString(queryParams);
expect(queryString).toBe('?page=1&pageSize=10&_sort=name:ASC');
expect(queryString).toBe('?page=1&pageSize=10&sort=name:ASC');
});
it('creates a valid query string with default params & plugin options', () => {
const queryParams = {
page: '1',
pageSize: '10',
_sort: 'name:ASC',
sort: 'name:ASC',
plugins: {
i18n: { locale: 'en' },
},
@ -25,27 +25,27 @@ describe('buildQueryString', () => {
const queryString = buildQueryString(queryParams);
expect(queryString).toBe('?page=1&pageSize=10&_sort=name:ASC&_locale=en');
expect(queryString).toBe('?page=1&pageSize=10&sort=name:ASC&_locale=en');
});
it('creates a valid query string with a _where clause', () => {
const queryParams = {
page: '1',
pageSize: '10',
_sort: 'name:ASC',
sort: 'name:ASC',
_where: [{ name: 'hello world' }],
};
const queryString = buildQueryString(queryParams);
expect(queryString).toBe('?page=1&pageSize=10&_sort=name:ASC&_where[0][name]=hello world');
expect(queryString).toBe('?page=1&pageSize=10&sort=name:ASC&_where[0][name]=hello world');
});
it('creates a valid query string with a _where and plugin options', () => {
const queryParams = {
page: '1',
pageSize: '10',
_sort: 'name:ASC',
sort: 'name:ASC',
_where: [{ name: 'hello world' }],
plugins: {
i18n: { locale: 'en' },
@ -55,7 +55,7 @@ describe('buildQueryString', () => {
const queryString = buildQueryString(queryParams);
expect(queryString).toBe(
'?page=1&pageSize=10&_sort=name:ASC&_where[0][name]=hello world&_locale=en'
'?page=1&pageSize=10&sort=name:ASC&_where[0][name]=hello world&_locale=en'
);
});
});

View File

@ -30,7 +30,7 @@ const init = (initialState, settings) => {
{
intlLabel: { id: 'Settings.permissions.menu.link.users.label' },
// Init the search params directly
to: '/settings/users?pageSize=10&page=1&_sort=firstname%3AASC',
to: '/settings/users?pageSize=10&page=1&sort=firstname',
id: 'users',
isDisplayed: false,
permissions: adminPermissions.settings.users.main,

View File

@ -50,7 +50,7 @@ const ListPage = () => {
] = useReducer(reducer, initialState, init);
const pageSize = parseInt(query.get('pageSize') || 10, 10);
const page = parseInt(query.get('page') || 0, 10);
const _sort = decodeURIComponent(query.get('_sort'));
const sort = decodeURIComponent(query.get('sort'));
const _q = decodeURIComponent(query.get('_q') || '');
const getDataRef = useRef();
const listRef = useRef();
@ -242,7 +242,7 @@ const ListPage = () => {
<>
<BaselineAlignment top size="1px">
<Flex flexWrap="wrap">
<SortPicker onChange={handleChangeSort} value={_sort} />
<SortPicker onChange={handleChangeSort} value={sort} />
<Padded right size="10px" />
<BaselineAlignment bottom size="6px">
<FilterPicker onChange={handleChangeFilter} />

View File

@ -3,24 +3,24 @@ const getFilters = search => {
const filters = [];
// eslint-disable-next-line no-restricted-syntax
for (let pair of query.entries()) {
if (!['_sort', 'pageSize', 'page', '_q'].includes(pair[0])) {
const splitted = pair[0].split('_');
for (let [key, queryValue] of query.entries()) {
if (!['sort', 'pageSize', 'page', '_q'].includes(key)) {
const splitted = key.split('_');
let filterName;
let filterType;
// Filter type === '=')
if (splitted.length === 1) {
filterType = '=';
filterName = pair[0];
filterName = key;
} else {
filterType = `_${splitted[1]}`;
filterName = splitted[0];
}
const value = decodeURIComponent(pair[1]);
const value = decodeURIComponent(queryValue);
filters.push({ displayName: filterName, name: pair[0], filter: filterType, value });
filters.push({ displayName: filterName, name: key, filter: filterType, value });
}
}

View File

@ -2,13 +2,13 @@ import getFilters from '../getFilters';
describe('ADMIN | CONTAINERS | USERS | ListPage | utils | getFilters', () => {
it('should return an empty array if there is not filter', () => {
const search = '_q=test&_sort=firstname&page=1&pageSize=1';
const search = '_q=test&sort=firstname&page=1&pageSize=1';
expect(getFilters(search)).toHaveLength(0);
});
it('should handle the = filter correctly ', () => {
const search = '_sort=firstname&page=1&pageSize=1&firstname=test&firstname_ne=something';
const search = 'sort=firstname&page=1&pageSize=1&firstname=test&firstname_ne=something';
const expected = [
{
displayName: 'firstname',

View File

@ -10,7 +10,7 @@ const generateFiltersFromSearch = search => {
x =>
!x.includes('_limit') &&
!x.includes('_page') &&
!x.includes('_sort') &&
!x.includes('sort') &&
!x.includes('_start') &&
!x.includes('_q=') &&
x !== ''

View File

@ -3,7 +3,7 @@ import generateFiltersFromSearch from '../generateFiltersFromSearch';
describe('HELPER PLUGIN | utils | generateFiltersFromSearch', () => {
it('should generate an array of filters', () => {
const search =
'?_sort=id:ASC&bool=true&big_number_ne=1&created_at_lt=2019-08-01T00:00:00Z&date_lte=2019-08-02T00:00:00Z&decimal_number_gt=2&enum_ne=noon&float_number_gte=3';
'?sort=id:ASC&bool=true&big_number_ne=1&created_at_lt=2019-08-01T00:00:00Z&date_lte=2019-08-02T00:00:00Z&decimal_number_gt=2&enum_ne=noon&float_number_gte=3';
const expected = [
{
name: 'bool',

View File

@ -4,7 +4,7 @@ describe('HELPER PLUGIN | utils | generateSearchFromFilters', () => {
it('should return a string with all the applied filters', () => {
const data = {
_limit: 10,
_sort: 'id:ASC',
sort: 'id:ASC',
_page: 2,
filters: [
{
@ -46,7 +46,7 @@ describe('HELPER PLUGIN | utils | generateSearchFromFilters', () => {
};
const expected =
'_limit=10&_sort=id:ASC&_page=2&bool=true&big_number_ne=1&created_at_lt=2019-08-01T00:00:00Z&date_lte=2019-08-02T00:00:00Z&decimal_number_gt=2&enum_ne=noon&float_number_gte=3';
'_limit=10&sort=id:ASC&_page=2&bool=true&big_number_ne=1&created_at_lt=2019-08-01T00:00:00Z&date_lte=2019-08-02T00:00:00Z&decimal_number_gt=2&enum_ne=noon&float_number_gte=3';
const encoded = expected
.split('&')
.map(pair => {

View File

@ -2,15 +2,15 @@ import generateSearchFromObject from '../generateSearchFromObject';
describe('HELPER PLUGIN | utils | generateSearchFromObject', () => {
it('should return a string containing the _limit, _start and order', () => {
const search = { _page: 1, _limit: 10, _sort: 'city:ASC' };
const expected = '_limit=10&_sort=city:ASC&_start=0';
const search = { _page: 1, _limit: 10, sort: 'city:ASC' };
const expected = '_limit=10&sort=city:ASC&_start=0';
expect(generateSearchFromObject(search)).toEqual(expected);
});
it('should remove the _q param from the search if it is empty', () => {
const search = { _page: 1, _limit: 10, _sort: 'city:ASC', _q: '' };
const expected = '_limit=10&_sort=city:ASC&_start=0';
const search = { _page: 1, _limit: 10, sort: 'city:ASC', _q: '' };
const expected = '_limit=10&sort=city:ASC&_start=0';
expect(generateSearchFromObject(search)).toEqual(expected);
});
@ -19,11 +19,11 @@ describe('HELPER PLUGIN | utils | generateSearchFromObject', () => {
const search = {
_page: 1,
_limit: 10,
_sort: 'city:ASC',
sort: 'city:ASC',
_q: '',
filters: [],
};
const expected = '_limit=10&_sort=city:ASC&_start=0';
const expected = '_limit=10&sort=city:ASC&_start=0';
expect(generateSearchFromObject(search)).toEqual(expected);
});
@ -33,11 +33,11 @@ describe('HELPER PLUGIN | utils | generateSearchFromObject', () => {
_limit: 10,
_page: 1,
_q: '',
_sort: 'city:ASC',
sort: 'city:ASC',
filters: [{ name: 'city', filter: '=', value: 'test' }],
};
const expected = '_limit=10&_sort=city:ASC&city=test&_start=0';
const expected = '_limit=10&sort=city:ASC&city=test&_start=0';
expect(generateSearchFromObject(search)).toEqual(expected);
});

View File

@ -134,7 +134,7 @@ const BrowseAssets = () => {
/>
</Padded>
)}
<SortPicker onChange={handleChangeParams} value={params._sort} />
<SortPicker onChange={handleChangeParams} value={params.sort} />
<Padded left size="sm" />
<Filters
filters={params.filters}

View File

@ -6,41 +6,17 @@
import { useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import { useDispatch } from 'react-redux';
import get from 'lodash/get';
import { request, useNotification } from '@strapi/helper-plugin';
import pluginId from '../../pluginId';
import { setFileModelTimestamps } from './actions';
// TODO use the models API and remove this component
const Initializer = ({ setPlugin }) => {
const ref = useRef();
const dispatch = useDispatch();
ref.current = setPlugin;
const toggleNotification = useNotification();
// TODO: remove
useEffect(() => {
const getData = async () => {
const requestURL = '/content-manager/content-types';
try {
const { data } = await request(requestURL, { method: 'GET' });
const fileModel = data.find(model => model.uid === 'plugins::upload.file');
const timestamps = get(fileModel, ['options', 'timestamps']);
dispatch(setFileModelTimestamps(timestamps));
ref.current(pluginId);
} catch (err) {
toggleNotification({
type: 'warning',
message: { id: 'content-manager.error.model.fetch' },
});
}
};
getData();
}, [dispatch, toggleNotification]);
ref.current(pluginId);
}, []);
return null;
};

View File

@ -2,7 +2,8 @@ import produce from 'immer';
import { SET_FILE_MODE_TIMESTAMPS } from './constants';
const initialState = {
fileModelTimestamps: [],
// TODO: rename to camelCase
fileModelTimestamps: ['created_at', 'updated_at'],
};
const reducer = (state = initialState, action) =>
@ -10,7 +11,7 @@ const reducer = (state = initialState, action) =>
produce(state, draftState => {
switch (action.type) {
case SET_FILE_MODE_TIMESTAMPS: {
draftState.fileModelTimestamps = action.timestamps;
// draftState.fileModelTimestamps = action.timestamps;
break;
}
default:

View File

@ -64,7 +64,7 @@ const InputModalStepperProvider = ({
: [],
params: {
...state.params,
_sort: `${updated_at}:DESC`,
sort: `${updated_at}:DESC`,
},
})
);
@ -336,7 +336,7 @@ const InputModalStepperProvider = ({
const fetchMediaLibFilesCount = async () => {
const requestURL = getRequestUrl('files/count');
const paramsToSend = getFilters(['_limit', '_sort', '_start']);
const paramsToSend = getFilters(['_limit', '_start']);
try {
return await request(`${requestURL}?${paramsToSend}`, {

View File

@ -21,7 +21,7 @@ const initialState = {
_start: 0,
_q: '',
filters: [],
_sort: null,
sort: null,
},
currentStep: 'list',
isFormDisabled: false,
@ -180,7 +180,7 @@ const reducer = (state, action) =>
}
case 'RESET_PROPS': {
if (action.defaultSort) {
draftState.params._sort = action.defaultSort;
draftState.params.sort = action.defaultSort;
} else {
return initialState;
}

View File

@ -1725,7 +1725,7 @@ describe('UPLOAD | components | InputModalStepperProvider | reducer', () => {
_start: 0,
_q: '',
filters: [],
_sort: null,
sort: null,
},
currentStep: 'list',
isFormDisabled: false,

View File

@ -8,7 +8,7 @@ import IntlText from '../IntlText';
const SortListItem = ({ onClick, selectedItem, label, value }) => {
const handleClick = () => {
onClick({ target: { name: '_sort', value } });
onClick({ target: { name: 'sort', value } });
};
return (

View File

@ -72,7 +72,7 @@ const HomePageSettings = ({
<Padded right />
</>
)}
<SortPicker onChange={onChange} value={query.get('_sort') || `${updated_at}:DESC`} />
<SortPicker onChange={onChange} value={query.get('sort') || `${updated_at}:DESC`} />
<Padded right />
<Filters onChange={onChange} filters={filters} onClick={onFilterDelete} />
</ControlsWrapper>

View File

@ -42,7 +42,7 @@ const HomePage = () => {
const isMounted = useRef(true);
const pluginName = formatMessage({ id: getTrad('plugin.name') });
const paramsKeys = ['_limit', '_start', '_q', '_sort'];
const paramsKeys = ['_limit', '_start', '_q', 'sort'];
useEffect(() => {
return () => (isMounted.current = false);
@ -74,9 +74,9 @@ const HomePage = () => {
const dataRequestURL = getRequestUrl('files');
const params = generateStringFromParams(query);
const paramsToSend = params.includes('_sort')
const paramsToSend = params.includes('sort')
? params
: params.concat(`&_sort=${updated_at}:DESC`);
: params.concat(`&sort=${updated_at}:DESC`);
try {
const data = await request(`${dataRequestURL}?${paramsToSend}`, {
@ -98,7 +98,7 @@ const HomePage = () => {
};
const fetchDataCount = async () => {
const params = generateStringFromParams(query, ['_limit', '_sort', '_start']);
const params = generateStringFromParams(query, ['_limit', '_start']);
const requestURL = getRequestUrl('files/count');
try {

View File

@ -35,7 +35,7 @@ describe('dataloader', () => {
test('makeQuery calls find', async () => {
const uid = 'uid';
const find = jest.fn(() => [{ id: 1 }]);
const filters = { _limit: 5, _sort: 'field' };
const filters = { limit: 5, sort: 'field' };
global.strapi = {
query() {

View File

@ -5,7 +5,7 @@ describe('getInitialLocale', () => {
const query = {
page: '1',
pageSize: '10',
_sort: 'Name:ASC',
sort: 'Name:ASC',
plugins: {
i18n: { locale: 'fr-FR' },
},
@ -47,7 +47,7 @@ describe('getInitialLocale', () => {
const query = {
page: '1',
pageSize: '10',
_sort: 'Name:ASC',
sort: 'Name:ASC',
plugins: {
something: 'great',
},
@ -90,7 +90,7 @@ describe('getInitialLocale', () => {
const query = {
page: '1',
pageSize: '10',
_sort: 'Name:ASC',
sort: 'Name:ASC',
plugins: {
something: 'great',
},