Skip to content

Commit

Permalink
Merge pull request #11477 from nanaya/preferences-storage-sync
Browse files Browse the repository at this point in the history
Sync user preferences when updated from a different tab
  • Loading branch information
notbakaneko authored Sep 9, 2024
2 parents adf1e94 + 22367c6 commit d6625a6
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 23 deletions.
28 changes: 24 additions & 4 deletions resources/js/core/user/user-preferences.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,19 @@ import { route } from 'laroute';
import { action, makeObservable, observable } from 'mobx';
import { onErrorWithCallback } from 'utils/ajax';

const localStorageKey = 'userPreferences';

export default class UserPreferences {
@observable private current: UserPreferencesJson;
private updatingOptions = false;
private user?: CurrentUserJson;

constructor() {
this.current = Object.assign({}, defaultUserPreferencesJson, this.fromStorage());
this.current = this.fromStorageWithDefaults();

makeObservable(this);

window.addEventListener('storage', this.updateFromStorage);
}

get<T extends keyof UserPreferencesJson>(key: T) {
Expand All @@ -27,7 +31,7 @@ export default class UserPreferences {
if (this.current[key] === value) return;

this.current[key] = value;
localStorage.userPreferences = JSON.stringify(this.current);
this.updateStorage();

if (this.user == null) return;

Expand All @@ -51,13 +55,14 @@ export default class UserPreferences {
this.user = user;

if (!this.updatingOptions) {
this.current = user?.user_preferences ?? structuredClone(defaultUserPreferencesJson);
this.current = user?.user_preferences ?? defaultUserPreferencesJson();
this.updateStorage();
}
}

private fromStorage(): Partial<UserPreferencesJson> {
try {
const data = localStorage.getItem('userPreferences');
const data = localStorage.getItem(localStorageKey);
if (data != null) {
const preferences = JSON.parse(data) as unknown;

Expand All @@ -71,4 +76,19 @@ export default class UserPreferences {

return {};
}

private fromStorageWithDefaults() {
return Object.assign(defaultUserPreferencesJson(), this.fromStorage());
}

@action
private readonly updateFromStorage = (event: StorageEvent) => {
if (event.key == null || event.key === localStorageKey) {
this.current = this.fromStorageWithDefaults();
}
};

private updateStorage() {
localStorage[localStorageKey] = JSON.stringify(this.current);
}
}
38 changes: 20 additions & 18 deletions resources/js/interfaces/user-preferences-json.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,26 @@ import { BeatmapsetCardSize } from 'beatmapset-panel';
import { ViewMode } from 'components/user-card';
import { Filter, SortMode } from 'components/user-list';

export const defaultUserPreferencesJson: UserPreferencesJson = {
audio_autoplay: false,
audio_muted: false,
audio_volume: 0.45,
beatmapset_card_size: 'normal',
beatmapset_download: 'all',
beatmapset_show_nsfw: false,
beatmapset_title_show_original: false,
comments_show_deleted: false,
comments_sort: 'new',
forum_posts_show_deleted: true,
legacy_score_only: false,
profile_cover_expanded: true,
scoring_mode: 'standardised',
user_list_filter: 'all',
user_list_sort: 'last_visit',
user_list_view: 'card',
};
export function defaultUserPreferencesJson(): UserPreferencesJson {
return {
audio_autoplay: false,
audio_muted: false,
audio_volume: 0.45,
beatmapset_card_size: 'normal',
beatmapset_download: 'all',
beatmapset_show_nsfw: false,
beatmapset_title_show_original: false,
comments_show_deleted: false,
comments_sort: 'new',
forum_posts_show_deleted: true,
legacy_score_only: false,
profile_cover_expanded: true,
scoring_mode: 'standardised',
user_list_filter: 'all',
user_list_sort: 'last_visit',
user_list_view: 'card',
};
}

export default interface UserPreferencesJson {
audio_autoplay: boolean;
Expand Down
2 changes: 1 addition & 1 deletion tests/karma/test-current-user-json.ts
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ const testCurrentUserJson: CurrentUserJson = {
title_url: null,
twitter: null,
unread_pm_count: 0,
user_preferences: defaultUserPreferencesJson,
user_preferences: defaultUserPreferencesJson(),
username: 'foo',
website: null,
};
Expand Down

0 comments on commit d6625a6

Please sign in to comment.