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}` }, searchOptions: { status: `${statusView}` },
}); });
const persistedTag = checkForPersistedTag(); const persistedAvailableTag = checkForPersistedTag(this.state.availableTags);
if (persistedTag) { if (persistedAvailableTag) {
this.selectTag({ this.selectTag({
target: { value: persistedTag }, target: { value: persistedAvailableTag, },
preventDefault(){}, preventDefault(){},
}); });
} }

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

@ -18,7 +18,7 @@ export function onSearchBoxType(event) {
export function selectTag(event) { export function selectTag(event) {
event.preventDefault(); event.preventDefault();
const { value, dataset } = event.target; const { value, dataset, skipPushState } = event.target;
const selectedTagOrAll = value ?? dataset.tag; const selectedTagOrAll = value ?? dataset.tag;
const selectedTag = selectedTagOrAll?.match(/all tags/i) ? null : selectedTagOrAll; const selectedTag = selectedTagOrAll?.match(/all tags/i) ? null : selectedTagOrAll;
const component = this; const component = this;
@ -32,7 +32,10 @@ export function selectTag(event) {
}); });
// persist the selected tag in query params // 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) { export function clearSelectedTags(event) {
@ -140,11 +143,12 @@ export function loadNextPage() {
}); });
} }
export function checkForPersistedTag() { export function checkForPersistedTag(availableTags) {
// credit: https://stackoverflow.com/a/9870540 // credit: https://stackoverflow.com/a/9870540
const params = (new URL(window.location)).searchParams 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;
} }