Library sort param moved from query params to url params

This commit is contained in:
NikolaBorislavovHristov 2019-12-16 17:21:09 +02:00
parent 1096d62dec
commit 8a9dae6ddc
4 changed files with 12 additions and 22 deletions

View file

@ -12,8 +12,8 @@ const routesRegexp = {
urlParamsNames: ['addonTransportUrl', 'type', 'catalogId']
},
library: {
regexp: /^\/library(?:\/([^/]*))?$/,
urlParamsNames: ['type']
regexp: /^\/library(?:\/([^/]*)\/([^/]*))?$/,
urlParamsNames: ['type', 'sort']
},
search: {
regexp: /^\/search$/,

View file

@ -7,8 +7,8 @@ const useSelectableInputs = require('./useSelectableInputs');
const useItemOptions = require('./useItemOptions');
const styles = require('./styles');
const Library = ({ urlParams, queryParams }) => {
const library = useLibrary(urlParams, queryParams);
const Library = ({ urlParams }) => {
const library = useLibrary(urlParams);
const [typeSelect, sortPropSelect] = useSelectableInputs(library);
const [options, optionOnSelect] = useItemOptions();
return (
@ -73,8 +73,8 @@ const Library = ({ urlParams, queryParams }) => {
Library.propTypes = {
urlParams: PropTypes.exact({
type: PropTypes.string,
}),
queryParams: PropTypes.instanceOf(URLSearchParams)
sort: PropTypes.string
})
};
module.exports = Library;

View file

@ -46,20 +46,17 @@ const onNewLibraryState = (library) => {
}
};
const useLibrary = (urlParams, queryParams) => {
const useLibrary = (urlParams) => {
const { core } = useServices();
const loadLibraryAction = React.useMemo(() => {
if (typeof urlParams.type === 'string') {
if (typeof urlParams.type === 'string' && typeof urlParams.sort === 'string') {
return {
action: 'Load',
args: {
load: 'LibraryFiltered',
args: {
type_name: urlParams.type,
sort_prop: queryParams.has('sort_prop') ?
queryParams.get('sort_prop')
:
null
sort_prop: urlParams.sort
}
}
};
@ -82,7 +79,7 @@ const useLibrary = (urlParams, queryParams) => {
};
}
}
}, [urlParams, queryParams]);
}, [urlParams]);
return useModelState({
model: 'library',
action: loadLibraryAction,

View file

@ -16,13 +16,7 @@ const mapSelectableInputs = (library) => {
options: library.type_names
.map((type) => ({ label: type, value: type })),
onSelect: (event) => {
const queryParams = new URLSearchParams(
library.selected !== null ?
[['sort_prop', library.selected.sort_prop]]
:
[]
);
window.location.replace(`#/library/${encodeURIComponent(event.value)}?${queryParams.toString()}`);
window.location.replace(`#/library/${encodeURIComponent(event.value)}/${encodeURIComponent(library.selected.sort_prop)}`);
}
};
const sortPropSelect = {
@ -33,9 +27,8 @@ const mapSelectableInputs = (library) => {
[],
options: SORT_PROP_OPTIONS,
onSelect: (event) => {
const queryParams = new URLSearchParams([['sort_prop', event.value]]);
if (library.selected !== null) {
window.location.replace(`#/library/${encodeURIComponent(library.selected.type_name)}?${queryParams.toString()}`);
window.location.replace(`#/library/${encodeURIComponent(library.selected.type_name)}/${encodeURIComponent(event.value)}`);
}
}
};