[bugfix] Store /api/web/settings state locally for persistence (#2)

This also prevents the 'Can't verify CSRF token authenticity' errors that popup whenever you modify a 'web setting', such as the column layout.

~~NB: There is something funky going on. This works 99% of the time and sometimes doesn't?~~ Fixed now, there was two bits of stuff in verify_state doing the same thing, removed the duplicate.

Reviewed-on: https://codeberg.org/superseriousbusiness/masto-fe-standalone/pulls/2
Co-authored-by: julia <midnight@trainwit.ch>
Co-committed-by: julia <midnight@trainwit.ch>
This commit is contained in:
julia
2024-12-25 11:40:11 +00:00
committed by tobi
parent 873838ebfe
commit 86fa133c50
2 changed files with 14 additions and 5 deletions

View File

@@ -26,9 +26,8 @@ const debouncedSave = debounce((dispatch, getState) => {
const data = getState().get('settings').filter((_, path) => path !== 'saved').toJS(); const data = getState().get('settings').filter((_, path) => path !== 'saved').toJS();
api(getState).put('/api/web/settings', { data }) localStorage.setItem('web_settings', JSON.stringify(data));
.then(() => dispatch({ type: SETTING_SAVE })) dispatch({ type: SETTING_SAVE });
.catch(error => dispatch(showAlertForError(error)));
}, 5000, { trailing: true }); }, 5000, { trailing: true });
export function saveSettings() { export function saveSettings() {

View File

@@ -6,14 +6,20 @@ async function loadState() {
const domain = localStorage.getItem('domain'); const domain = localStorage.getItem('domain');
const access_token = localStorage.getItem('access_token'); const access_token = localStorage.getItem('access_token');
const storedState = localStorage.getItem('initial_state'); const storedState = localStorage.getItem('initial_state');
const webSettings = localStorage.getItem('web_settings');
if (!domain || !access_token) { if (!domain || !access_token) {
window.location.href = '/login.html'; window.location.href = '/login.html';
return; return;
} }
/* We try to load the initial state now to prevent a race between us and mastodon */
if (storedState && window.location.pathname !== '/prepare.html') { if (storedState && window.location.pathname !== '/prepare.html') {
document.getElementById('initial-state').textContent = storedState; const state = JSON.parse(storedState);
if (webSettings) {
state.settings = JSON.parse(webSettings);
}
document.getElementById('initial-state').textContent = JSON.stringify(state);
} }
const apiUrl = `${protocol}${domain}/api`; const apiUrl = `${protocol}${domain}/api`;
@@ -1092,8 +1098,12 @@ async function loadState() {
], ],
}; };
if (webSettings) {
state.settings = JSON.parse(webSettings);
}
const json = JSON.stringify(state); const json = JSON.stringify(state);
if (window.location.pathname !== '/prepare.html') document.getElementById('initial-state').textContent = json; if (window.location.pathname !== '/prepare.html') document.getElementById('initial-state').textContent = json;
localStorage.setItem("initial_state", json); localStorage.setItem("initial_state", json);
if (window.location.pathname === '/prepare.html') window.location.href = '/'; if (window.location.pathname === '/prepare.html') window.location.href = '/';
} }