maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

skip unnecessary history pushes and preserve intuitive forward/back (#20762)

Browse source
This commit is contained in:
Makar 2024-03-27 21:54:50 +04:00 • committed by GitHub
parent 58b7f2eade
commit ec32a8e7cc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 12 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/javascript/readingList/readingList.jsx
View file

@ -77,10 +77,10 @@ export class ReadingList extends Component {
searchOptions: { status: `${statusView}` },
});
const persistedTag = checkForPersistedTag();
if (persistedTag) {
const persistedAvailableTag = checkForPersistedTag(this.state.availableTags);
if (persistedAvailableTag) {
this.selectTag({
target: { value: persistedTag },
target: { value: persistedAvailableTag, },
preventDefault(){},
});
}

14
app/javascript/searchableItemList/searchableItemList.js
View file

@ -18,7 +18,7 @@ export function onSearchBoxType(event) {
export function selectTag(event) {
event.preventDefault();
const { value, dataset } = event.target;
const { value, dataset, skipPushState } = event.target;
const selectedTagOrAll = value ?? dataset.tag;
const selectedTag = selectedTagOrAll?.match(/all tags/i) ? null : selectedTagOrAll;
const component = this;
@ -32,7 +32,10 @@ export function selectTag(event) {
});
// persist the selected tag in query params
window.history.pushState(null, null, `/readinglist${selectedTag ? `?selectedTag=${selectedTag}` : ''}`);
if (!skipPushState) {
const newQueryParams = selectedTag ? `?selectedTag=${selectedTag}` : '';
window.history.pushState(null, null, `/readinglist${newQueryParams}`);
}
}
export function clearSelectedTags(event) {
@ -140,11 +143,12 @@ export function loadNextPage() {
});
}
export function checkForPersistedTag() {
export function checkForPersistedTag(availableTags) {
// credit: https://stackoverflow.com/a/9870540
const params = (new URL(window.location)).searchParams
const selectedTag = params.get('selectedTag');
const selectedTag = params.get('selectedTag');
return selectedTag || '';
if (availableTags?.includes(selectedTag)) return selectedTag;
return null;
}