From ec298b12944fa049af6e88ef67c16f3cc821675f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= Date: Wed, 22 Oct 2025 21:58:05 +0200 Subject: [PATCH] pl-fe: zustand improvements MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: nicole mikołajczyk --- packages/pl-fe/src/actions/compose.ts | 4 +- packages/pl-fe/src/actions/me.ts | 2 +- packages/pl-fe/src/actions/notifications.ts | 2 +- packages/pl-fe/src/actions/pl-fe.ts | 2 +- packages/pl-fe/src/actions/settings.ts | 4 +- .../api/hooks/streaming/use-user-stream.ts | 4 +- packages/pl-fe/src/columns/notifications.tsx | 2 +- packages/pl-fe/src/components/account.tsx | 2 +- .../pl-fe/src/components/animated-number.tsx | 2 +- .../src/components/announcements/emoji.tsx | 2 +- .../announcements/reactions-bar.tsx | 2 +- .../src/components/attachment-thumbs.tsx | 2 +- .../src/components/autosuggest-emoji.tsx | 2 +- .../src/components/dropdown-navigation.tsx | 4 +- packages/pl-fe/src/components/helmet.tsx | 2 +- .../pl-fe/src/components/media-gallery.tsx | 2 +- packages/pl-fe/src/components/navlinks.tsx | 2 +- .../pl-fe/src/components/parsed-content.tsx | 2 +- packages/pl-fe/src/components/parsed-mfm.tsx | 2 +- .../src/components/scroll-top-button.tsx | 2 +- .../pl-fe/src/components/scrollable-list.tsx | 2 +- .../components/sidebar-navigation-link.tsx | 2 +- .../src/components/status-action-bar.tsx | 2 +- .../src/components/status-action-button.tsx | 2 +- .../pl-fe/src/components/status-content.tsx | 2 +- .../pl-fe/src/components/status-media.tsx | 2 +- .../src/components/status-reactions-bar.tsx | 2 +- packages/pl-fe/src/components/status.tsx | 2 +- .../statuses/sensitive-content-overlay.tsx | 2 +- packages/pl-fe/src/components/still-image.tsx | 2 +- .../src/components/thumb-navigation-link.tsx | 2 +- .../pl-fe/src/components/translate-button.tsx | 2 +- packages/pl-fe/src/components/ui/avatar.tsx | 2 +- packages/pl-fe/src/components/ui/emoji.tsx | 2 +- packages/pl-fe/src/contexts/chat-context.tsx | 2 +- .../features/account/components/header.tsx | 2 +- .../components/registration-form.tsx | 2 +- .../components/chat-page-settings.tsx | 2 +- .../chat-widget/chat-pane-header.tsx | 2 +- .../compose/components/language-dropdown.tsx | 2 +- .../compose/components/reply-mentions.tsx | 4 +- .../compose/editor/nodes/image-component.tsx | 2 +- .../editor/plugins/autosuggest-plugin.tsx | 4 +- .../compose/editor/plugins/state-plugin.tsx | 2 +- .../components/draft-status-action-bar.tsx | 4 +- .../components/emoji-picker-dropdown.tsx | 5 +- packages/pl-fe/src/features/emoji/emojify.tsx | 2 +- .../event/components/event-header.tsx | 2 +- .../notifications/components/notification.tsx | 4 +- .../pl-fe/src/features/preferences/index.tsx | 2 +- .../components/pinned-hosts-picker.tsx | 2 +- .../scheduled-status-action-bar.tsx | 4 +- .../src/features/status/components/thread.tsx | 4 +- .../components/panels/instance-info-panel.tsx | 2 +- .../ui/components/panels/promo-panel.tsx | 2 +- .../ui/components/panels/user-panel.tsx | 2 +- .../features/ui/components/profile-stats.tsx | 2 +- .../features/ui/components/theme-toggle.tsx | 2 +- packages/pl-fe/src/features/ui/index.tsx | 2 +- .../src/features/ui/util/optional-motion.tsx | 2 +- .../pl-fe/src/hooks/forms/use-image-field.ts | 2 +- packages/pl-fe/src/hooks/use-locale.ts | 4 +- packages/pl-fe/src/hooks/use-logo.ts | 3 +- packages/pl-fe/src/hooks/use-settings.ts | 6 - packages/pl-fe/src/hooks/use-system-theme.ts | 2 +- packages/pl-fe/src/hooks/use-theme-css.ts | 2 +- packages/pl-fe/src/hooks/use-theme.ts | 3 +- packages/pl-fe/src/init/pl-fe-head.tsx | 2 +- packages/pl-fe/src/layouts/home-layout.tsx | 2 +- .../manage-group-modal/steps/details-step.tsx | 2 +- .../src/pages/account-lists/directory.tsx | 4 +- .../src/pages/accounts/account-gallery.tsx | 2 +- .../src/pages/accounts/account-timeline.tsx | 2 +- .../src/pages/developers/settings-store.tsx | 5 +- .../src/pages/notifications/notifications.tsx | 2 +- packages/pl-fe/src/pages/settings/privacy.tsx | 2 +- packages/pl-fe/src/pages/statuses/status.tsx | 4 +- .../src/pages/timelines/bubble-timeline.tsx | 2 +- .../pages/timelines/community-timeline.tsx | 2 +- .../src/pages/timelines/public-timeline.tsx | 2 +- .../src/pages/timelines/remote-timeline.tsx | 2 +- .../src/pages/timelines/wrenched-timeline.tsx | 2 +- packages/pl-fe/src/pages/utils/about.tsx | 2 +- packages/pl-fe/src/stores/settings.ts | 155 +++++++++--------- 84 files changed, 180 insertions(+), 179 deletions(-) delete mode 100644 packages/pl-fe/src/hooks/use-settings.ts diff --git a/packages/pl-fe/src/actions/compose.ts b/packages/pl-fe/src/actions/compose.ts index e049b99a9..556e0f6f2 100644 --- a/packages/pl-fe/src/actions/compose.ts +++ b/packages/pl-fe/src/actions/compose.ts @@ -400,7 +400,7 @@ const submitCompose = (composeId: string, opts: SubmitComposeOpts = {}, preview useModalsStore.getState().actions.closeModal('COMPOSE'); if (compose.language && !statusId && !preview) { - useSettingsStore.getState().rememberLanguageUse(compose.language); + useSettingsStore.getState().actions.rememberLanguageUse(compose.language); dispatch(saveSettings()); } } @@ -724,7 +724,7 @@ const selectComposeSuggestion = (composeId: string, position: number, token: str completion = isNativeEmoji(suggestion) ? suggestion.native : suggestion.colons; startPosition = position - 1; - useSettingsStore.getState().rememberEmojiUse(suggestion); + useSettingsStore.getState().actions.rememberEmojiUse(suggestion); dispatch(saveSettings()); } else if (typeof suggestion === 'string' && suggestion[0] === '#') { completion = suggestion; diff --git a/packages/pl-fe/src/actions/me.ts b/packages/pl-fe/src/actions/me.ts index c7fbc84e8..2bf9908f3 100644 --- a/packages/pl-fe/src/actions/me.ts +++ b/packages/pl-fe/src/actions/me.ts @@ -87,7 +87,7 @@ const patchMe = (params: UpdateCredentialsParams) => const fetchMeSuccess = (account: CredentialAccount) => { setSentryAccount(account); - useSettingsStore.getState().loadUserSettings(account.settings_store?.[FE_NAME]); + useSettingsStore.getState().actions.loadUserSettings(account.settings_store?.[FE_NAME]); return { type: ME_FETCH_SUCCESS, diff --git a/packages/pl-fe/src/actions/notifications.ts b/packages/pl-fe/src/actions/notifications.ts index df50846a9..c3a631672 100644 --- a/packages/pl-fe/src/actions/notifications.ts +++ b/packages/pl-fe/src/actions/notifications.ts @@ -243,7 +243,7 @@ const setFilter = (filterType: FilterType, abort?: boolean) => const settingsStore = useSettingsStore.getState(); const activeFilter = settingsStore.settings.notifications.quickFilter.active as FilterType; - settingsStore.changeSetting(['notifications', 'quickFilter', 'active'], filterType); + settingsStore.actions.changeSetting(['notifications', 'quickFilter', 'active'], filterType); dispatch(expandNotifications(undefined, undefined, abort)); if (activeFilter !== filterType) dispatch(saveSettings()); diff --git a/packages/pl-fe/src/actions/pl-fe.ts b/packages/pl-fe/src/actions/pl-fe.ts index e193963c9..854ace364 100644 --- a/packages/pl-fe/src/actions/pl-fe.ts +++ b/packages/pl-fe/src/actions/pl-fe.ts @@ -82,7 +82,7 @@ const importPlFeConfig = (plFeConfig: APIEntity, host: string | null) => { plFeConfig.brandColor = '#d80482'; } - useSettingsStore.getState().loadDefaultSettings(plFeConfig?.defaultSettings); + useSettingsStore.getState().actions.loadDefaultSettings(plFeConfig?.defaultSettings); return { type: PLFE_CONFIG_REQUEST_SUCCESS, diff --git a/packages/pl-fe/src/actions/settings.ts b/packages/pl-fe/src/actions/settings.ts index ee2e36883..d171ad4f1 100644 --- a/packages/pl-fe/src/actions/settings.ts +++ b/packages/pl-fe/src/actions/settings.ts @@ -24,7 +24,7 @@ type SettingOpts = { const saveSuccessMessage = defineMessage({ id: 'settings.save.success', defaultMessage: 'Your preferences have been saved!' }); const changeSetting = (path: string[], value: any, opts?: SettingOpts) => { - useSettingsStore.getState().changeSetting(path, value); + useSettingsStore.getState().actions.changeSetting(path, value); if (opts?.save !== false) return saveSettings(opts); return () => {}; @@ -34,7 +34,7 @@ const saveSettings = (opts?: SettingOpts) => (dispatch: AppDispatch, getState: () => RootState) => { if (!isLoggedIn(getState)) return; - const { userSettings, userSettingsSaving } = useSettingsStore.getState(); + const { userSettings, actions: { userSettingsSaving } } = useSettingsStore.getState(); if (userSettings.saved) return; const { saved, ...data } = userSettings; diff --git a/packages/pl-fe/src/api/hooks/streaming/use-user-stream.ts b/packages/pl-fe/src/api/hooks/streaming/use-user-stream.ts index 7876b9db7..106c4da5c 100644 --- a/packages/pl-fe/src/api/hooks/streaming/use-user-stream.ts +++ b/packages/pl-fe/src/api/hooks/streaming/use-user-stream.ts @@ -15,7 +15,7 @@ import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import messages from 'pl-fe/messages'; import { queryClient } from 'pl-fe/queries/client'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { getUnreadChatsCount, updateChatListItem } from 'pl-fe/utils/chats'; import { play, soundCache } from 'pl-fe/utils/sounds'; @@ -103,7 +103,7 @@ const useUserStream = () => { const { isLoggedIn } = useLoggedIn(); const dispatch = useAppDispatch(); const statContext = useStatContext(); - const { settings } = useSettingsStore(); + const settings = useSettings(); const listener = useCallback((event: StreamingEvent) => { switch (event.event) { diff --git a/packages/pl-fe/src/columns/notifications.tsx b/packages/pl-fe/src/columns/notifications.tsx index 1652b9942..6a8a146c2 100644 --- a/packages/pl-fe/src/columns/notifications.tsx +++ b/packages/pl-fe/src/columns/notifications.tsx @@ -23,7 +23,7 @@ import PlaceholderNotification from 'pl-fe/features/placeholder/components/place import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { selectChild } from 'pl-fe/utils/scroll-utils'; import type { Item } from 'pl-fe/components/ui/tabs'; diff --git a/packages/pl-fe/src/components/account.tsx b/packages/pl-fe/src/components/account.tsx index 2d198e5b6..a6b1d70aa 100644 --- a/packages/pl-fe/src/components/account.tsx +++ b/packages/pl-fe/src/components/account.tsx @@ -14,7 +14,7 @@ import VerificationBadge from 'pl-fe/components/verification-badge'; import Emojify from 'pl-fe/features/emoji/emojify'; import ActionButton from 'pl-fe/features/ui/components/action-button'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { getAcct } from 'pl-fe/utils/accounts'; import { displayFqn } from 'pl-fe/utils/state'; diff --git a/packages/pl-fe/src/components/animated-number.tsx b/packages/pl-fe/src/components/animated-number.tsx index 828ab9317..c1f73b563 100644 --- a/packages/pl-fe/src/components/animated-number.tsx +++ b/packages/pl-fe/src/components/animated-number.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'; import { useIntl, type IntlShape } from 'react-intl'; import { TransitionMotion, spring } from 'react-motion'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { isNumber, roundDown } from 'pl-fe/utils/numbers'; const obfuscatedCount = (count: number): string => { diff --git a/packages/pl-fe/src/components/announcements/emoji.tsx b/packages/pl-fe/src/components/announcements/emoji.tsx index dde54b748..22e3a00c0 100644 --- a/packages/pl-fe/src/components/announcements/emoji.tsx +++ b/packages/pl-fe/src/components/announcements/emoji.tsx @@ -1,7 +1,7 @@ import React from 'react'; import unicodeMapping from 'pl-fe/features/emoji/mapping'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { joinPublicPath } from 'pl-fe/utils/static'; import type { CustomEmoji } from 'pl-api'; diff --git a/packages/pl-fe/src/components/announcements/reactions-bar.tsx b/packages/pl-fe/src/components/announcements/reactions-bar.tsx index 3d56c774d..b3a029ecd 100644 --- a/packages/pl-fe/src/components/announcements/reactions-bar.tsx +++ b/packages/pl-fe/src/components/announcements/reactions-bar.tsx @@ -2,8 +2,8 @@ import React from 'react'; import { TransitionMotion, spring } from 'react-motion'; import EmojiPickerDropdown from 'pl-fe/features/emoji/containers/emoji-picker-dropdown-container'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useAnnouncements } from 'pl-fe/queries/announcements/use-announcements'; +import { useSettings } from 'pl-fe/stores/settings'; import Reaction from './reaction'; diff --git a/packages/pl-fe/src/components/attachment-thumbs.tsx b/packages/pl-fe/src/components/attachment-thumbs.tsx index 3ef96e6df..1c6a63857 100644 --- a/packages/pl-fe/src/components/attachment-thumbs.tsx +++ b/packages/pl-fe/src/components/attachment-thumbs.tsx @@ -1,8 +1,8 @@ import React, { Suspense } from 'react'; import { MediaGallery } from 'pl-fe/features/ui/util/async-components'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import { useMediaVisible } from './statuses/sensitive-content-overlay'; diff --git a/packages/pl-fe/src/components/autosuggest-emoji.tsx b/packages/pl-fe/src/components/autosuggest-emoji.tsx index fb9d44b8d..36253fc4d 100644 --- a/packages/pl-fe/src/components/autosuggest-emoji.tsx +++ b/packages/pl-fe/src/components/autosuggest-emoji.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { isCustomEmoji } from 'pl-fe/features/emoji'; import unicodeMapping from 'pl-fe/features/emoji/mapping'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { joinPublicPath } from 'pl-fe/utils/static'; import type { Emoji } from 'pl-fe/features/emoji'; diff --git a/packages/pl-fe/src/components/dropdown-navigation.tsx b/packages/pl-fe/src/components/dropdown-navigation.tsx index 87febe5df..231743d7b 100644 --- a/packages/pl-fe/src/components/dropdown-navigation.tsx +++ b/packages/pl-fe/src/components/dropdown-navigation.tsx @@ -23,7 +23,7 @@ import { scheduledStatusesCountQueryOptions } from 'pl-fe/queries/statuses/sched import { useDraftStatusesCountQuery } from 'pl-fe/queries/statuses/use-draft-statuses'; import { useInteractionRequestsCount } from 'pl-fe/queries/statuses/use-interaction-requests'; import { makeGetOtherAccounts } from 'pl-fe/selectors'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { useIsSidebarOpen, useUiStoreActions } from 'pl-fe/stores/ui'; import sourceCode from 'pl-fe/utils/code'; @@ -80,7 +80,7 @@ const DropdownNavigation: React.FC = React.memo((): JSX.Element | null => { const features = useFeatures(); const { account } = useAccount(me || undefined); const otherAccounts = useAppSelector((state) => getOtherAccounts(state)); - const { settings } = useSettingsStore(); + const settings = useSettings(); const followRequestsCount = useFollowRequestsCount().data || 0; const interactionRequestsCount = useInteractionRequestsCount().data || 0; const scheduledStatusCount = useInfiniteQuery(authenticatedScheduledStatusesCountQueryOptions).data || 0; diff --git a/packages/pl-fe/src/components/helmet.tsx b/packages/pl-fe/src/components/helmet.tsx index dcb3c22a0..367b7761e 100644 --- a/packages/pl-fe/src/components/helmet.tsx +++ b/packages/pl-fe/src/components/helmet.tsx @@ -4,9 +4,9 @@ import { Helmet as ReactHelmet } from 'react-helmet-async'; import { useStatContext } from 'pl-fe/contexts/stat-context'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useInstance } from 'pl-fe/hooks/use-instance'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { usePendingUsersCount } from 'pl-fe/queries/admin/use-accounts'; import { usePendingReportsCount } from 'pl-fe/queries/admin/use-reports'; +import { useSettings } from 'pl-fe/stores/settings'; import FaviconService from 'pl-fe/utils/favicon-service'; FaviconService.initFaviconService(); diff --git a/packages/pl-fe/src/components/media-gallery.tsx b/packages/pl-fe/src/components/media-gallery.tsx index 31593079d..eb800e4bc 100644 --- a/packages/pl-fe/src/components/media-gallery.tsx +++ b/packages/pl-fe/src/components/media-gallery.tsx @@ -11,7 +11,7 @@ import Stack from 'pl-fe/components/ui/stack'; import Text from 'pl-fe/components/ui/text'; import { MIMETYPE_ICONS } from 'pl-fe/components/upload'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { truncateFilename } from 'pl-fe/utils/media'; import { isIOS } from '../is-mobile'; diff --git a/packages/pl-fe/src/components/navlinks.tsx b/packages/pl-fe/src/components/navlinks.tsx index 8a49c5ef0..4de608614 100644 --- a/packages/pl-fe/src/components/navlinks.tsx +++ b/packages/pl-fe/src/components/navlinks.tsx @@ -3,7 +3,7 @@ import { Link } from 'react-router-dom'; import Text from 'pl-fe/components/ui/text'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface INavlinks { type: string; diff --git a/packages/pl-fe/src/components/parsed-content.tsx b/packages/pl-fe/src/components/parsed-content.tsx index 2d502c541..0d6539998 100644 --- a/packages/pl-fe/src/components/parsed-content.tsx +++ b/packages/pl-fe/src/components/parsed-content.tsx @@ -8,7 +8,7 @@ import { FormattedMessage } from 'react-intl'; import { Link } from 'react-router-dom'; import Emojify from 'pl-fe/features/emoji/emojify'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { makeEmojiMap } from 'pl-fe/utils/normalizers'; import nyaize from 'pl-fe/utils/nyaize'; import Purify from 'pl-fe/utils/url-purify'; diff --git a/packages/pl-fe/src/components/parsed-mfm.tsx b/packages/pl-fe/src/components/parsed-mfm.tsx index fd53301b5..39006f6c3 100644 --- a/packages/pl-fe/src/components/parsed-mfm.tsx +++ b/packages/pl-fe/src/components/parsed-mfm.tsx @@ -5,7 +5,7 @@ import { clamp } from 'lodash'; import React, { CSSProperties } from 'react'; import { Link } from 'react-router-dom'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { makeEmojiMap } from 'pl-fe/utils/normalizers'; import nyaize from 'pl-fe/utils/nyaize'; diff --git a/packages/pl-fe/src/components/scroll-top-button.tsx b/packages/pl-fe/src/components/scroll-top-button.tsx index c089deaff..2128736a9 100644 --- a/packages/pl-fe/src/components/scroll-top-button.tsx +++ b/packages/pl-fe/src/components/scroll-top-button.tsx @@ -4,7 +4,7 @@ import React, { useState, useEffect, useCallback } from 'react'; import { useIntl, MessageDescriptor } from 'react-intl'; import Icon from 'pl-fe/components/ui/icon'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IScrollTopButton { /** Callback when clicked, and also when scrolled to the top. */ diff --git a/packages/pl-fe/src/components/scrollable-list.tsx b/packages/pl-fe/src/components/scrollable-list.tsx index 32815ba2b..074a33aa3 100644 --- a/packages/pl-fe/src/components/scrollable-list.tsx +++ b/packages/pl-fe/src/components/scrollable-list.tsx @@ -5,7 +5,7 @@ import { Virtuoso, Components, VirtuosoProps, VirtuosoHandle, ListRange, IndexLo import LoadMore from 'pl-fe/components/load-more'; import Spinner from 'pl-fe/components/ui/spinner'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { EmptyMessage } from './empty-message'; diff --git a/packages/pl-fe/src/components/sidebar-navigation-link.tsx b/packages/pl-fe/src/components/sidebar-navigation-link.tsx index 609285925..3de63df4a 100644 --- a/packages/pl-fe/src/components/sidebar-navigation-link.tsx +++ b/packages/pl-fe/src/components/sidebar-navigation-link.tsx @@ -2,7 +2,7 @@ import clsx from 'clsx'; import React from 'react'; import { NavLink } from 'react-router-dom'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import Icon from './ui/icon'; diff --git a/packages/pl-fe/src/components/status-action-bar.tsx b/packages/pl-fe/src/components/status-action-bar.tsx index 5869b92c7..c53028eb4 100644 --- a/packages/pl-fe/src/components/status-action-bar.tsx +++ b/packages/pl-fe/src/components/status-action-bar.tsx @@ -25,13 +25,13 @@ import { useClient } from 'pl-fe/hooks/use-client'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useChats } from 'pl-fe/queries/chats'; import { useBlockGroupUserMutation } from 'pl-fe/queries/groups/use-group-blocks'; import { useCustomEmojis } from 'pl-fe/queries/instance/use-custom-emojis'; import { useTranslationLanguages } from 'pl-fe/queries/instance/use-translation-languages'; import { useBookmarkStatus, useDislikeStatus, useFavouriteStatus, usePinStatus, useReblogStatus, useUnbookmarkStatus, useUndislikeStatus, useUnfavouriteStatus, useUnpinStatus, useUnreblogStatus } from 'pl-fe/queries/statuses/use-status-interactions'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMeta, useStatusMetaActions } from 'pl-fe/stores/status-meta'; import toast from 'pl-fe/toast'; import copy from 'pl-fe/utils/copy'; diff --git a/packages/pl-fe/src/components/status-action-button.tsx b/packages/pl-fe/src/components/status-action-button.tsx index d0daa57e3..bc1409f38 100644 --- a/packages/pl-fe/src/components/status-action-button.tsx +++ b/packages/pl-fe/src/components/status-action-button.tsx @@ -4,7 +4,7 @@ import React from 'react'; import Icon from 'pl-fe/components/ui/icon'; import Text from 'pl-fe/components/ui/text'; import { useLongPress } from 'pl-fe/hooks/use-long-press'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import AnimatedNumber from './animated-number'; diff --git a/packages/pl-fe/src/components/status-content.tsx b/packages/pl-fe/src/components/status-content.tsx index dc2a756d6..3f03a3a12 100644 --- a/packages/pl-fe/src/components/status-content.tsx +++ b/packages/pl-fe/src/components/status-content.tsx @@ -9,8 +9,8 @@ import Text from 'pl-fe/components/ui/text'; import Emojify from 'pl-fe/features/emoji/emojify'; import QuotedStatus from 'pl-fe/features/status/containers/quoted-status-container'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useStatusTranslation } from 'pl-fe/queries/statuses/use-status-translation'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMeta, useStatusMetaActions } from 'pl-fe/stores/status-meta'; import { onlyEmoji as isOnlyEmoji } from 'pl-fe/utils/rich-content'; diff --git a/packages/pl-fe/src/components/status-media.tsx b/packages/pl-fe/src/components/status-media.tsx index 21198c07f..80ae56cc9 100644 --- a/packages/pl-fe/src/components/status-media.tsx +++ b/packages/pl-fe/src/components/status-media.tsx @@ -4,8 +4,8 @@ import AttachmentThumbs from 'pl-fe/components/attachment-thumbs'; import PreviewCard from 'pl-fe/components/preview-card'; import PlaceholderCard from 'pl-fe/features/placeholder/components/placeholder-card'; import { MediaGallery, Video, Audio } from 'pl-fe/features/ui/util/async-components'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import { useMediaVisible } from './statuses/sensitive-content-overlay'; diff --git a/packages/pl-fe/src/components/status-reactions-bar.tsx b/packages/pl-fe/src/components/status-reactions-bar.tsx index e83c236b3..f91c8cb85 100644 --- a/packages/pl-fe/src/components/status-reactions-bar.tsx +++ b/packages/pl-fe/src/components/status-reactions-bar.tsx @@ -13,8 +13,8 @@ import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import { useLongPress } from 'pl-fe/hooks/use-long-press'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import AnimatedNumber from './animated-number'; diff --git a/packages/pl-fe/src/components/status.tsx b/packages/pl-fe/src/components/status.tsx index e268c6155..5e57f3190 100644 --- a/packages/pl-fe/src/components/status.tsx +++ b/packages/pl-fe/src/components/status.tsx @@ -15,10 +15,10 @@ import StatusTypeIcon from 'pl-fe/features/status/components/status-type-icon'; import { Hotkeys } from 'pl-fe/features/ui/components/hotkeys'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useFavouriteStatus, useReblogStatus, useUnfavouriteStatus, useUnreblogStatus } from 'pl-fe/queries/statuses/use-status-interactions'; import { makeGetStatus, type SelectedStatus } from 'pl-fe/selectors'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMetaActions } from 'pl-fe/stores/status-meta'; import { textForScreenReader } from 'pl-fe/utils/status'; diff --git a/packages/pl-fe/src/components/statuses/sensitive-content-overlay.tsx b/packages/pl-fe/src/components/statuses/sensitive-content-overlay.tsx index 778b4999b..29fba43fc 100644 --- a/packages/pl-fe/src/components/statuses/sensitive-content-overlay.tsx +++ b/packages/pl-fe/src/components/statuses/sensitive-content-overlay.tsx @@ -5,7 +5,7 @@ import { defineMessages, useIntl } from 'react-intl'; import Button from 'pl-fe/components/ui/button'; import HStack from 'pl-fe/components/ui/hstack'; import Text from 'pl-fe/components/ui/text'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMeta, useStatusMetaActions } from 'pl-fe/stores/status-meta'; import type { FilterResult } from 'pl-api'; diff --git a/packages/pl-fe/src/components/still-image.tsx b/packages/pl-fe/src/components/still-image.tsx index 9ccfd35fc..92ab71e67 100644 --- a/packages/pl-fe/src/components/still-image.tsx +++ b/packages/pl-fe/src/components/still-image.tsx @@ -1,7 +1,7 @@ import clsx from 'clsx'; import React, { useRef } from 'react'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IStillImage { /** Image alt text. */ diff --git a/packages/pl-fe/src/components/thumb-navigation-link.tsx b/packages/pl-fe/src/components/thumb-navigation-link.tsx index 760786da8..ebf5b45ad 100644 --- a/packages/pl-fe/src/components/thumb-navigation-link.tsx +++ b/packages/pl-fe/src/components/thumb-navigation-link.tsx @@ -4,7 +4,7 @@ import { NavLink, useLocation } from 'react-router-dom'; import IconWithCounter from 'pl-fe/components/icon-with-counter'; import Icon from 'pl-fe/components/ui/icon'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IThumbNavigationLink { count?: number; diff --git a/packages/pl-fe/src/components/translate-button.tsx b/packages/pl-fe/src/components/translate-button.tsx index 07452dee7..7f572a7f0 100644 --- a/packages/pl-fe/src/components/translate-button.tsx +++ b/packages/pl-fe/src/components/translate-button.tsx @@ -7,9 +7,9 @@ import Text from 'pl-fe/components/ui/text'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useInstance } from 'pl-fe/hooks/use-instance'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTranslationLanguages } from 'pl-fe/queries/instance/use-translation-languages'; import { useStatusTranslation } from 'pl-fe/queries/statuses/use-status-translation'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMeta, useStatusMetaActions } from 'pl-fe/stores/status-meta'; import type { Status } from 'pl-fe/normalizers/status'; diff --git a/packages/pl-fe/src/components/ui/avatar.tsx b/packages/pl-fe/src/components/ui/avatar.tsx index 31d9c675e..b042fc592 100644 --- a/packages/pl-fe/src/components/ui/avatar.tsx +++ b/packages/pl-fe/src/components/ui/avatar.tsx @@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react'; import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; import StillImage, { IStillImage } from 'pl-fe/components/still-image'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { isDefaultAvatar } from 'pl-fe/utils/accounts'; import AltIndicator from '../alt-indicator'; diff --git a/packages/pl-fe/src/components/ui/emoji.tsx b/packages/pl-fe/src/components/ui/emoji.tsx index 9518e1b96..367a3ac71 100644 --- a/packages/pl-fe/src/components/ui/emoji.tsx +++ b/packages/pl-fe/src/components/ui/emoji.tsx @@ -1,7 +1,7 @@ import React from 'react'; import StillImage from 'pl-fe/components/still-image'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { removeVS16s, toCodePoints } from 'pl-fe/utils/emoji'; import { joinPublicPath } from 'pl-fe/utils/static'; diff --git a/packages/pl-fe/src/contexts/chat-context.tsx b/packages/pl-fe/src/contexts/chat-context.tsx index 838eefaf3..a5a35ef9e 100644 --- a/packages/pl-fe/src/contexts/chat-context.tsx +++ b/packages/pl-fe/src/contexts/chat-context.tsx @@ -3,8 +3,8 @@ import { useHistory, useParams } from 'react-router-dom'; import { toggleMainWindow } from 'pl-fe/actions/chats'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useChat } from 'pl-fe/queries/chats'; +import { useSettings } from 'pl-fe/stores/settings'; import type { Chat } from 'pl-api'; diff --git a/packages/pl-fe/src/features/account/components/header.tsx b/packages/pl-fe/src/features/account/components/header.tsx index e7d6aa92e..1a5d1bb47 100644 --- a/packages/pl-fe/src/features/account/components/header.tsx +++ b/packages/pl-fe/src/features/account/components/header.tsx @@ -30,11 +30,11 @@ import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useClient } from 'pl-fe/hooks/use-client'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useChats } from 'pl-fe/queries/chats'; import { queryClient } from 'pl-fe/queries/client'; import { blockDomainMutationOptions, unblockDomainMutationOptions } from 'pl-fe/queries/settings/domain-blocks'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import toast from 'pl-fe/toast'; import { isDefaultHeader } from 'pl-fe/utils/accounts'; import copy from 'pl-fe/utils/copy'; diff --git a/packages/pl-fe/src/features/auth-login/components/registration-form.tsx b/packages/pl-fe/src/features/auth-login/components/registration-form.tsx index 11ed1b08f..f09f86c89 100644 --- a/packages/pl-fe/src/features/auth-login/components/registration-form.tsx +++ b/packages/pl-fe/src/features/auth-login/components/registration-form.tsx @@ -18,8 +18,8 @@ import CaptchaField from 'pl-fe/features/auth-login/components/captcha'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useInstance } from 'pl-fe/hooks/use-instance'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import type { CreateAccountParams } from 'pl-api'; diff --git a/packages/pl-fe/src/features/chats/components/chat-page/components/chat-page-settings.tsx b/packages/pl-fe/src/features/chats/components/chat-page/components/chat-page-settings.tsx index 101ce015f..e0e8e0525 100644 --- a/packages/pl-fe/src/features/chats/components/chat-page/components/chat-page-settings.tsx +++ b/packages/pl-fe/src/features/chats/components/chat-page/components/chat-page-settings.tsx @@ -14,8 +14,8 @@ import Toggle from 'pl-fe/components/ui/toggle'; import SettingToggle from 'pl-fe/features/settings/components/setting-toggle'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useUpdateCredentials } from 'pl-fe/queries/accounts'; +import { useSettings } from 'pl-fe/stores/settings'; type FormData = { accepts_chat_messages?: boolean; diff --git a/packages/pl-fe/src/features/chats/components/chat-widget/chat-pane-header.tsx b/packages/pl-fe/src/features/chats/components/chat-widget/chat-pane-header.tsx index 2ec4d9bc1..74374327c 100644 --- a/packages/pl-fe/src/features/chats/components/chat-widget/chat-pane-header.tsx +++ b/packages/pl-fe/src/features/chats/components/chat-widget/chat-pane-header.tsx @@ -4,7 +4,7 @@ import React, { HTMLAttributes } from 'react'; import HStack from 'pl-fe/components/ui/hstack'; import IconButton from 'pl-fe/components/ui/icon-button'; import Text from 'pl-fe/components/ui/text'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IChatPaneHeader { isOpen: boolean; diff --git a/packages/pl-fe/src/features/compose/components/language-dropdown.tsx b/packages/pl-fe/src/features/compose/components/language-dropdown.tsx index 6a99f69e4..ea1ddf2af 100644 --- a/packages/pl-fe/src/features/compose/components/language-dropdown.tsx +++ b/packages/pl-fe/src/features/compose/components/language-dropdown.tsx @@ -12,7 +12,7 @@ import { type Language, languages as languagesObject } from 'pl-fe/features/pref import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useCompose } from 'pl-fe/hooks/use-compose'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const getFrequentlyUsedLanguages = (languageCounters: Record) => ( Object.keys(languageCounters) diff --git a/packages/pl-fe/src/features/compose/components/reply-mentions.tsx b/packages/pl-fe/src/features/compose/components/reply-mentions.tsx index a53099df8..3fece4225 100644 --- a/packages/pl-fe/src/features/compose/components/reply-mentions.tsx +++ b/packages/pl-fe/src/features/compose/components/reply-mentions.tsx @@ -4,7 +4,7 @@ import { FormattedList, FormattedMessage } from 'react-intl'; import { useCompose } from 'pl-fe/hooks/use-compose'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useModalsActions } from 'pl-fe/stores/modals'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IReplyMentions { composeId: string; @@ -16,7 +16,7 @@ const ReplyMentions: React.FC = ({ composeId }) => { const compose = useCompose(composeId); const to = compose.to; - const { forceImplicitAddressing } = useSettingsStore().settings; + const { forceImplicitAddressing } = useSettings(); const explicitAddressing = features.createStatusExplicitAddressing && !forceImplicitAddressing; if (!explicitAddressing || !compose.in_reply_to || !to) { diff --git a/packages/pl-fe/src/features/compose/editor/nodes/image-component.tsx b/packages/pl-fe/src/features/compose/editor/nodes/image-component.tsx index 9e47ace71..e5a4b4b77 100644 --- a/packages/pl-fe/src/features/compose/editor/nodes/image-component.tsx +++ b/packages/pl-fe/src/features/compose/editor/nodes/image-component.tsx @@ -31,8 +31,8 @@ import * as v from 'valibot'; import HStack from 'pl-fe/components/ui/hstack'; import Icon from 'pl-fe/components/ui/icon'; import IconButton from 'pl-fe/components/ui/icon-button'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import { $isImageNode } from './image-node'; diff --git a/packages/pl-fe/src/features/compose/editor/plugins/autosuggest-plugin.tsx b/packages/pl-fe/src/features/compose/editor/plugins/autosuggest-plugin.tsx index 1784eb7ae..07a1b6ded 100644 --- a/packages/pl-fe/src/features/compose/editor/plugins/autosuggest-plugin.tsx +++ b/packages/pl-fe/src/features/compose/editor/plugins/autosuggest-plugin.tsx @@ -38,7 +38,7 @@ import AutosuggestEmoji from 'pl-fe/components/autosuggest-emoji'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useCompose } from 'pl-fe/hooks/use-compose'; import { selectAccount } from 'pl-fe/selectors'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettingsStoreActions } from 'pl-fe/stores/settings'; import { textAtCursorMatchesToken } from 'pl-fe/utils/suggestions'; import AutosuggestAccount from '../../components/autosuggest-account'; @@ -286,7 +286,7 @@ const AutosuggestPlugin = ({ suggestionsHidden, setSuggestionsHidden, }: AutosuggestPluginProps): JSX.Element | null => { - const { rememberEmojiUse } = useSettingsStore(); + const { rememberEmojiUse } = useSettingsStoreActions(); const { suggestions } = useCompose(composeId); const dispatch = useAppDispatch(); diff --git a/packages/pl-fe/src/features/compose/editor/plugins/state-plugin.tsx b/packages/pl-fe/src/features/compose/editor/plugins/state-plugin.tsx index b74a57f84..04d82f9f0 100644 --- a/packages/pl-fe/src/features/compose/editor/plugins/state-plugin.tsx +++ b/packages/pl-fe/src/features/compose/editor/plugins/state-plugin.tsx @@ -11,7 +11,7 @@ import { addSuggestedLanguage, addSuggestedQuote, setEditorState, suggestClearLi import { fetchStatus } from 'pl-fe/actions/statuses'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { getStatusIdsFromLinksInContent } from 'pl-fe/utils/status'; import Purify from 'pl-fe/utils/url-purify'; diff --git a/packages/pl-fe/src/features/draft-statuses/components/draft-status-action-bar.tsx b/packages/pl-fe/src/features/draft-statuses/components/draft-status-action-bar.tsx index 5ee6baab8..ea3ae3afd 100644 --- a/packages/pl-fe/src/features/draft-statuses/components/draft-status-action-bar.tsx +++ b/packages/pl-fe/src/features/draft-statuses/components/draft-status-action-bar.tsx @@ -8,7 +8,7 @@ import HStack from 'pl-fe/components/ui/hstack'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useCancelDraftStatus } from 'pl-fe/queries/statuses/use-draft-statuses'; import { useModalsActions } from 'pl-fe/stores/modals'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import type { Status as StatusEntity } from 'pl-fe/normalizers/status'; import type { DraftStatus } from 'pl-fe/queries/statuses/use-draft-statuses'; @@ -28,7 +28,7 @@ const DraftStatusActionBar: React.FC = ({ source, status const intl = useIntl(); const { openModal } = useModalsActions(); - const { settings } = useSettingsStore(); + const settings = useSettings(); const dispatch = useAppDispatch(); const cancelDraftStatus = useCancelDraftStatus(); diff --git a/packages/pl-fe/src/features/emoji/components/emoji-picker-dropdown.tsx b/packages/pl-fe/src/features/emoji/components/emoji-picker-dropdown.tsx index 4d87b073a..c5acddbc7 100644 --- a/packages/pl-fe/src/features/emoji/components/emoji-picker-dropdown.tsx +++ b/packages/pl-fe/src/features/emoji/components/emoji-picker-dropdown.tsx @@ -3,10 +3,9 @@ import { defineMessages, useIntl } from 'react-intl'; import { changeSetting, saveSettings } from 'pl-fe/actions/settings'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTheme } from 'pl-fe/hooks/use-theme'; import { useCustomEmojis } from 'pl-fe/queries/instance/use-custom-emojis'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings , useSettingsStoreActions } from 'pl-fe/stores/settings'; import { buildCustomEmojiCategories } from '../../emoji'; import { EmojiPicker } from '../../ui/util/async-components'; @@ -125,7 +124,7 @@ const EmojiPickerDropdown: React.FC = ({ const dispatch = useAppDispatch(); const title = intl.formatMessage(messages.emoji); const theme = useTheme(); - const { rememberEmojiUse } = useSettingsStore(); + const { rememberEmojiUse } = useSettingsStoreActions(); const { data: customEmojis } = useCustomEmojis(getCustomEmojis); diff --git a/packages/pl-fe/src/features/emoji/emojify.tsx b/packages/pl-fe/src/features/emoji/emojify.tsx index fc1f96fdf..e857582ab 100644 --- a/packages/pl-fe/src/features/emoji/emojify.tsx +++ b/packages/pl-fe/src/features/emoji/emojify.tsx @@ -2,7 +2,7 @@ import split from 'graphemesplit'; import React from 'react'; import Emoji from 'pl-fe/components/ui/emoji'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { makeEmojiMap } from 'pl-fe/utils/normalizers'; import { joinPublicPath } from 'pl-fe/utils/static'; diff --git a/packages/pl-fe/src/features/event/components/event-header.tsx b/packages/pl-fe/src/features/event/components/event-header.tsx index 5371eaed0..99cb88897 100644 --- a/packages/pl-fe/src/features/event/components/event-header.tsx +++ b/packages/pl-fe/src/features/event/components/event-header.tsx @@ -21,10 +21,10 @@ import Emojify from 'pl-fe/features/emoji/emojify'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useChats } from 'pl-fe/queries/chats'; import { useBookmarkStatus, usePinStatus, useReblogStatus, useUnbookmarkStatus, useUnpinStatus, useUnreblogStatus } from 'pl-fe/queries/statuses/use-status-interactions'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; import copy from 'pl-fe/utils/copy'; import { download } from 'pl-fe/utils/download'; import { shortNumberFormat } from 'pl-fe/utils/numbers'; diff --git a/packages/pl-fe/src/features/notifications/components/notification.tsx b/packages/pl-fe/src/features/notifications/components/notification.tsx index f62a3ac9a..2da731274 100644 --- a/packages/pl-fe/src/features/notifications/components/notification.tsx +++ b/packages/pl-fe/src/features/notifications/components/notification.tsx @@ -19,7 +19,7 @@ import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import { useFavouriteStatus, useUnfavouriteStatus, useReblogStatus, useUnreblogStatus } from 'pl-fe/queries/statuses/use-status-interactions'; import { makeGetNotification } from 'pl-fe/selectors'; import { useModalsActions } from 'pl-fe/stores/modals'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMetaActions } from 'pl-fe/stores/status-meta'; import { NotificationType } from 'pl-fe/utils/notification'; @@ -216,7 +216,7 @@ const Notification: React.FC = (props) => { const { me } = useLoggedIn(); const { toggleStatusesMediaHidden } = useStatusMetaActions(); const { openModal } = useModalsActions(); - const { settings } = useSettingsStore(); + const settings = useSettings(); const node = useRef(null); diff --git a/packages/pl-fe/src/features/preferences/index.tsx b/packages/pl-fe/src/features/preferences/index.tsx index 21274776c..a51ac2ed5 100644 --- a/packages/pl-fe/src/features/preferences/index.tsx +++ b/packages/pl-fe/src/features/preferences/index.tsx @@ -15,8 +15,8 @@ import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { PaletteListItem } from 'pl-fe/pages/dashboard/theme-editor'; +import { useSettings } from 'pl-fe/stores/settings'; import sourceCode from 'pl-fe/utils/code'; import colors from 'pl-fe/utils/colors'; import { isStandalone } from 'pl-fe/utils/state'; diff --git a/packages/pl-fe/src/features/remote-timeline/components/pinned-hosts-picker.tsx b/packages/pl-fe/src/features/remote-timeline/components/pinned-hosts-picker.tsx index 1644b7e60..067af74c8 100644 --- a/packages/pl-fe/src/features/remote-timeline/components/pinned-hosts-picker.tsx +++ b/packages/pl-fe/src/features/remote-timeline/components/pinned-hosts-picker.tsx @@ -2,7 +2,7 @@ import React from 'react'; import Button from 'pl-fe/components/ui/button'; import HStack from 'pl-fe/components/ui/hstack'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IPinnedHostsPicker { /** The active host among pinned hosts. */ diff --git a/packages/pl-fe/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx b/packages/pl-fe/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx index 838c9dba1..3533b17ad 100644 --- a/packages/pl-fe/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx +++ b/packages/pl-fe/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx @@ -6,7 +6,7 @@ import Button from 'pl-fe/components/ui/button'; import HStack from 'pl-fe/components/ui/hstack'; import { cancelScheduledStatusMutationOptions } from 'pl-fe/queries/statuses/scheduled-statuses'; import { useModalsActions } from 'pl-fe/stores/modals'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import type { Status as StatusEntity } from 'pl-fe/normalizers/status'; @@ -26,7 +26,7 @@ const ScheduledStatusActionBar: React.FC = ({ status const { mutate: cancelScheduledStatus } = useMutation(cancelScheduledStatusMutationOptions(status.id)); const { openModal } = useModalsActions(); - const { settings } = useSettingsStore(); + const settings = useSettings(); const handleCancelClick = () => { const deleteModal = settings.deleteModal; diff --git a/packages/pl-fe/src/features/status/components/thread.tsx b/packages/pl-fe/src/features/status/components/thread.tsx index 02a8c2876..14ae863e1 100644 --- a/packages/pl-fe/src/features/status/components/thread.tsx +++ b/packages/pl-fe/src/features/status/components/thread.tsx @@ -18,7 +18,7 @@ import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFavouriteStatus, useReblogStatus, useUnfavouriteStatus, useUnreblogStatus } from 'pl-fe/queries/statuses/use-status-interactions'; import { RootState } from 'pl-fe/store'; import { useModalsActions } from 'pl-fe/stores/modals'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { useStatusMetaActions } from 'pl-fe/stores/status-meta'; import { selectChild } from 'pl-fe/utils/scroll-utils'; import { textForScreenReader } from 'pl-fe/utils/status'; @@ -142,7 +142,7 @@ const Thread = ({ const { expandStatuses, revealStatusesMedia, toggleStatusesMediaHidden } = useStatusMetaActions(); const { openModal } = useModalsActions(); - const { settings: { boostModal, threads: { displayMode } } } = useSettingsStore(); + const { boostModal, threads: { displayMode } } = useSettings(); const { mutate: favouriteStatus } = useFavouriteStatus(status.id); const { mutate: unfavouriteStatus } = useUnfavouriteStatus(status.id); diff --git a/packages/pl-fe/src/features/ui/components/panels/instance-info-panel.tsx b/packages/pl-fe/src/features/ui/components/panels/instance-info-panel.tsx index 2b536b442..fbda2eea8 100644 --- a/packages/pl-fe/src/features/ui/components/panels/instance-info-panel.tsx +++ b/packages/pl-fe/src/features/ui/components/panels/instance-info-panel.tsx @@ -5,8 +5,8 @@ import { pinHost, unpinHost } from 'pl-fe/actions/remote-timeline'; import Widget from 'pl-fe/components/ui/widget'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { makeGetRemoteInstance } from 'pl-fe/selectors'; +import { useSettings } from 'pl-fe/stores/settings'; const getRemoteInstance = makeGetRemoteInstance(); diff --git a/packages/pl-fe/src/features/ui/components/panels/promo-panel.tsx b/packages/pl-fe/src/features/ui/components/panels/promo-panel.tsx index 80eef9584..808a5bc32 100644 --- a/packages/pl-fe/src/features/ui/components/panels/promo-panel.tsx +++ b/packages/pl-fe/src/features/ui/components/panels/promo-panel.tsx @@ -6,7 +6,7 @@ import HStack from 'pl-fe/components/ui/hstack'; import Widget from 'pl-fe/components/ui/widget'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const PromoPanel: React.FC = () => { const instance = useInstance(); diff --git a/packages/pl-fe/src/features/ui/components/panels/user-panel.tsx b/packages/pl-fe/src/features/ui/components/panels/user-panel.tsx index f06003bf9..869b2d3df 100644 --- a/packages/pl-fe/src/features/ui/components/panels/user-panel.tsx +++ b/packages/pl-fe/src/features/ui/components/panels/user-panel.tsx @@ -12,7 +12,7 @@ import Text from 'pl-fe/components/ui/text'; import VerificationBadge from 'pl-fe/components/verification-badge'; import Emojify from 'pl-fe/features/emoji/emojify'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { getAcct } from 'pl-fe/utils/accounts'; import { shortNumberFormat } from 'pl-fe/utils/numbers'; import { displayFqn } from 'pl-fe/utils/state'; diff --git a/packages/pl-fe/src/features/ui/components/profile-stats.tsx b/packages/pl-fe/src/features/ui/components/profile-stats.tsx index 940b9a452..af19fee51 100644 --- a/packages/pl-fe/src/features/ui/components/profile-stats.tsx +++ b/packages/pl-fe/src/features/ui/components/profile-stats.tsx @@ -4,7 +4,7 @@ import { NavLink } from 'react-router-dom'; import HStack from 'pl-fe/components/ui/hstack'; import Text from 'pl-fe/components/ui/text'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { shortNumberFormat } from 'pl-fe/utils/numbers'; import type { Account } from 'pl-fe/normalizers/account'; diff --git a/packages/pl-fe/src/features/ui/components/theme-toggle.tsx b/packages/pl-fe/src/features/ui/components/theme-toggle.tsx index 991b7fb25..5c3443d97 100644 --- a/packages/pl-fe/src/features/ui/components/theme-toggle.tsx +++ b/packages/pl-fe/src/features/ui/components/theme-toggle.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { changeSetting } from 'pl-fe/actions/settings'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import ThemeSelector from './theme-selector'; diff --git a/packages/pl-fe/src/features/ui/index.tsx b/packages/pl-fe/src/features/ui/index.tsx index 250e3eb48..f988a87e0 100644 --- a/packages/pl-fe/src/features/ui/index.tsx +++ b/packages/pl-fe/src/features/ui/index.tsx @@ -22,7 +22,6 @@ import { useInstance } from 'pl-fe/hooks/use-instance'; import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import AdminLayout from 'pl-fe/layouts/admin-layout'; import ChatsLayout from 'pl-fe/layouts/chats-layout'; import DefaultLayout from 'pl-fe/layouts/default-layout'; @@ -43,6 +42,7 @@ import { prefetchFollowRequests } from 'pl-fe/queries/accounts/use-follow-reques import { queryClient } from 'pl-fe/queries/client'; import { prefetchCustomEmojis } from 'pl-fe/queries/instance/use-custom-emojis'; import { scheduledStatusesQueryOptions } from 'pl-fe/queries/statuses/scheduled-statuses'; +import { useSettings } from 'pl-fe/stores/settings'; import { useShoutboxSubscription } from 'pl-fe/stores/shoutbox'; import { useIsDropdownMenuOpen } from 'pl-fe/stores/ui'; import { getVapidKey } from 'pl-fe/utils/auth'; diff --git a/packages/pl-fe/src/features/ui/util/optional-motion.tsx b/packages/pl-fe/src/features/ui/util/optional-motion.tsx index cea611835..d18322a71 100644 --- a/packages/pl-fe/src/features/ui/util/optional-motion.tsx +++ b/packages/pl-fe/src/features/ui/util/optional-motion.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Motion, MotionProps } from 'react-motion'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import ReducedMotion from './reduced-motion'; diff --git a/packages/pl-fe/src/hooks/forms/use-image-field.ts b/packages/pl-fe/src/hooks/forms/use-image-field.ts index 80cf7dbd1..4bbdcf6f9 100644 --- a/packages/pl-fe/src/hooks/forms/use-image-field.ts +++ b/packages/pl-fe/src/hooks/forms/use-image-field.ts @@ -1,8 +1,8 @@ import { useState } from 'react'; +import { useSettings } from 'pl-fe/stores/settings'; import resizeImage from 'pl-fe/utils/resize-image'; -import { useSettings } from '../use-settings'; import { usePreview } from './use-preview'; diff --git a/packages/pl-fe/src/hooks/use-locale.ts b/packages/pl-fe/src/hooks/use-locale.ts index 940e9299d..01b4eede1 100644 --- a/packages/pl-fe/src/hooks/use-locale.ts +++ b/packages/pl-fe/src/hooks/use-locale.ts @@ -1,12 +1,12 @@ import messages from 'pl-fe/messages'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; /** Locales which should be presented in right-to-left. */ const RTL_LOCALES = ['ar', 'ckb', 'fa', 'he']; /** Get valid locale from settings. */ const useLocale = (fallback = 'en') => { - const localeWithVariant = useSettingsStore().settings.locale.replace('_', '-'); + const localeWithVariant = useSettings().locale.replace('_', '-'); const localeFirstPart = localeWithVariant.split('-')[0]; return Object.keys(messages).includes(localeWithVariant) ? localeWithVariant : Object.keys(messages).includes(localeFirstPart) ? localeFirstPart : fallback; }; diff --git a/packages/pl-fe/src/hooks/use-logo.ts b/packages/pl-fe/src/hooks/use-logo.ts index ed63ca24f..d0a657ab4 100644 --- a/packages/pl-fe/src/hooks/use-logo.ts +++ b/packages/pl-fe/src/hooks/use-logo.ts @@ -1,5 +1,6 @@ +import { useSettings } from 'pl-fe/stores/settings'; + import { usePlFeConfig } from './use-pl-fe-config'; -import { useSettings } from './use-settings'; import { useTheme } from './use-theme'; const useLogo = () => { diff --git a/packages/pl-fe/src/hooks/use-settings.ts b/packages/pl-fe/src/hooks/use-settings.ts deleted file mode 100644 index b05b569e8..000000000 --- a/packages/pl-fe/src/hooks/use-settings.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { useSettingsStore } from 'pl-fe/stores/settings'; - -/** Get the user settings from the store */ -const useSettings = () => useSettingsStore().settings; - -export { useSettings }; diff --git a/packages/pl-fe/src/hooks/use-system-theme.ts b/packages/pl-fe/src/hooks/use-system-theme.ts index 012f0662f..cf1220666 100644 --- a/packages/pl-fe/src/hooks/use-system-theme.ts +++ b/packages/pl-fe/src/hooks/use-system-theme.ts @@ -1,6 +1,6 @@ import { useState, useEffect } from 'react'; -import { useSettings } from './use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import type { Theme } from './use-theme'; diff --git a/packages/pl-fe/src/hooks/use-theme-css.ts b/packages/pl-fe/src/hooks/use-theme-css.ts index 5c0905980..86bf68526 100644 --- a/packages/pl-fe/src/hooks/use-theme-css.ts +++ b/packages/pl-fe/src/hooks/use-theme-css.ts @@ -1,10 +1,10 @@ import { useMemo } from 'react'; +import { useSettings } from 'pl-fe/stores/settings'; import { toTailwind } from 'pl-fe/utils/tailwind'; import { generateAccent, generateThemeCss } from 'pl-fe/utils/theme'; import { usePlFeConfig } from './use-pl-fe-config'; -import { useSettings } from './use-settings'; import type { PlFeConfig } from 'pl-fe/normalizers/pl-fe/pl-fe-config'; diff --git a/packages/pl-fe/src/hooks/use-theme.ts b/packages/pl-fe/src/hooks/use-theme.ts index b4a3cfba9..b24545a68 100644 --- a/packages/pl-fe/src/hooks/use-theme.ts +++ b/packages/pl-fe/src/hooks/use-theme.ts @@ -1,4 +1,5 @@ -import { useSettings } from './use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; + import { useSystemTheme } from './use-system-theme'; type Theme = 'light' | 'dark' | 'black'; diff --git a/packages/pl-fe/src/init/pl-fe-head.tsx b/packages/pl-fe/src/init/pl-fe-head.tsx index 7352947f8..7a2507361 100644 --- a/packages/pl-fe/src/init/pl-fe-head.tsx +++ b/packages/pl-fe/src/init/pl-fe-head.tsx @@ -4,11 +4,11 @@ import React, { useEffect } from 'react'; import InlineStyle from 'pl-fe/components/inline-style'; import { useLocale, useLocaleDirection } from 'pl-fe/hooks/use-locale'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTheme } from 'pl-fe/hooks/use-theme'; import { useThemeCss } from 'pl-fe/hooks/use-theme-css'; import { startSentry } from 'pl-fe/sentry'; import { useHasModals } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; const Helmet = React.lazy(() => import('pl-fe/components/helmet')); diff --git a/packages/pl-fe/src/layouts/home-layout.tsx b/packages/pl-fe/src/layouts/home-layout.tsx index 189a96c61..e0b002754 100644 --- a/packages/pl-fe/src/layouts/home-layout.tsx +++ b/packages/pl-fe/src/layouts/home-layout.tsx @@ -24,7 +24,7 @@ import { useDraggedFiles } from 'pl-fe/hooks/use-dragged-files'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IHomeLayout { children: React.ReactNode; diff --git a/packages/pl-fe/src/modals/manage-group-modal/steps/details-step.tsx b/packages/pl-fe/src/modals/manage-group-modal/steps/details-step.tsx index 728b6d7d3..456f1c59f 100644 --- a/packages/pl-fe/src/modals/manage-group-modal/steps/details-step.tsx +++ b/packages/pl-fe/src/modals/manage-group-modal/steps/details-step.tsx @@ -10,7 +10,7 @@ import HeaderPicker from 'pl-fe/features/edit-profile/components/header-picker'; import { usePreview } from 'pl-fe/hooks/forms/use-preview'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useInstance } from 'pl-fe/hooks/use-instance'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; import resizeImage from 'pl-fe/utils/resize-image'; import type { CreateGroupParams } from 'pl-api'; diff --git a/packages/pl-fe/src/pages/account-lists/directory.tsx b/packages/pl-fe/src/pages/account-lists/directory.tsx index 23e192d07..10631dbcb 100644 --- a/packages/pl-fe/src/pages/account-lists/directory.tsx +++ b/packages/pl-fe/src/pages/account-lists/directory.tsx @@ -22,7 +22,7 @@ import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { useDirectory } from 'pl-fe/queries/accounts/use-directory'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; import { shortNumberFormat } from 'pl-fe/utils/numbers'; const messages = defineMessages({ @@ -40,7 +40,7 @@ interface IAccountCard { const AccountCard: React.FC = ({ id }) => { const me = useAppSelector((state) => state.me); const { account } = useAccount(id); - const { autoPlayGif } = useSettingsStore().settings; + const { autoPlayGif } = useSettings(); if (!account) return null; diff --git a/packages/pl-fe/src/pages/accounts/account-gallery.tsx b/packages/pl-fe/src/pages/accounts/account-gallery.tsx index fc6edb8db..1204857bb 100644 --- a/packages/pl-fe/src/pages/accounts/account-gallery.tsx +++ b/packages/pl-fe/src/pages/accounts/account-gallery.tsx @@ -13,9 +13,9 @@ import StillImage from 'pl-fe/components/still-image'; import Column from 'pl-fe/components/ui/column'; import Spinner from 'pl-fe/components/ui/spinner'; import { type AccountGalleryAttachment, useAccountGallery } from 'pl-fe/hooks/use-account-gallery'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { isIOS } from 'pl-fe/is-mobile'; import { useModalsActions } from 'pl-fe/stores/modals'; +import { useSettings } from 'pl-fe/stores/settings'; interface IMediaItem { attachment: AccountGalleryAttachment; diff --git a/packages/pl-fe/src/pages/accounts/account-timeline.tsx b/packages/pl-fe/src/pages/accounts/account-timeline.tsx index 1e9ec9317..4f9bc76d7 100644 --- a/packages/pl-fe/src/pages/accounts/account-timeline.tsx +++ b/packages/pl-fe/src/pages/accounts/account-timeline.tsx @@ -13,8 +13,8 @@ import Text from 'pl-fe/components/ui/text'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { makeGetStatusIds } from 'pl-fe/selectors'; +import { useSettings } from 'pl-fe/stores/settings'; const getStatusIds = makeGetStatusIds(); diff --git a/packages/pl-fe/src/pages/developers/settings-store.tsx b/packages/pl-fe/src/pages/developers/settings-store.tsx index 331f2cac4..cf6023674 100644 --- a/packages/pl-fe/src/pages/developers/settings-store.tsx +++ b/packages/pl-fe/src/pages/developers/settings-store.tsx @@ -12,7 +12,7 @@ import FormGroup from 'pl-fe/components/ui/form-group'; import Textarea from 'pl-fe/components/ui/textarea'; import SettingToggle from 'pl-fe/features/settings/components/setting-toggle'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettingsStore, useSettingsStoreActions } from 'pl-fe/stores/settings'; import toast from 'pl-fe/toast'; const isJSONValid = (text: any): boolean => { @@ -33,7 +33,8 @@ const messages = defineMessages({ const SettingsStore: React.FC = () => { const intl = useIntl(); const dispatch = useAppDispatch(); - const { settings, userSettings, loadUserSettings } = useSettingsStore(); + const { settings, userSettings } = useSettingsStore(); + const { loadUserSettings } = useSettingsStoreActions(); const [rawJSON, setRawJSON] = useState(JSON.stringify(userSettings, null, 2)); const [jsonValid, setJsonValid] = useState(true); diff --git a/packages/pl-fe/src/pages/notifications/notifications.tsx b/packages/pl-fe/src/pages/notifications/notifications.tsx index 0bc414875..d8eb113ee 100644 --- a/packages/pl-fe/src/pages/notifications/notifications.tsx +++ b/packages/pl-fe/src/pages/notifications/notifications.tsx @@ -4,7 +4,7 @@ import { defineMessages, useIntl } from 'react-intl'; import NotificationsColumn from 'pl-fe/columns/notifications'; import Column from 'pl-fe/components/ui/column'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'column.notifications', defaultMessage: 'Notifications' }, diff --git a/packages/pl-fe/src/pages/settings/privacy.tsx b/packages/pl-fe/src/pages/settings/privacy.tsx index d1a39f667..58146858c 100644 --- a/packages/pl-fe/src/pages/settings/privacy.tsx +++ b/packages/pl-fe/src/pages/settings/privacy.tsx @@ -16,8 +16,8 @@ import Toggle from 'pl-fe/components/ui/toggle'; import { SelectDropdown } from 'pl-fe/features/forms'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import KVStore from 'pl-fe/storage/kv-store'; +import { useSettings } from 'pl-fe/stores/settings'; import { hasCanvasExtractPermission } from 'pl-fe/utils/favicon-service'; import { KVStoreRedirectServicesItem } from 'pl-fe/utils/url-purify'; diff --git a/packages/pl-fe/src/pages/statuses/status.tsx b/packages/pl-fe/src/pages/statuses/status.tsx index 61bf930e4..ae8f00bb1 100644 --- a/packages/pl-fe/src/pages/statuses/status.tsx +++ b/packages/pl-fe/src/pages/statuses/status.tsx @@ -16,7 +16,7 @@ import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import { makeGetStatus } from 'pl-fe/selectors'; -import { useSettingsStore } from 'pl-fe/stores/settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'status.title', defaultMessage: 'Post details' }, @@ -59,7 +59,7 @@ const StatusPage: React.FC = (props) => { const [expandAllStatuses, setExpandAllStatuses] = useState<() => void>(); const [isLoaded, setIsLoaded] = useState(!!status); - const { settings: { displaySpoilers, threads: { displayMode } } } = useSettingsStore(); + const { displaySpoilers, threads: { displayMode } } = useSettings(); /** Fetch the status (and context) from the API. */ const fetchData = () => { diff --git a/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx b/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx index 3d9be98b5..5f7e6608b 100644 --- a/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx +++ b/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx @@ -8,7 +8,7 @@ import Column from 'pl-fe/components/ui/column'; import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'column.bubble', defaultMessage: 'Bubble timeline' }, diff --git a/packages/pl-fe/src/pages/timelines/community-timeline.tsx b/packages/pl-fe/src/pages/timelines/community-timeline.tsx index b61010013..47cf95b07 100644 --- a/packages/pl-fe/src/pages/timelines/community-timeline.tsx +++ b/packages/pl-fe/src/pages/timelines/community-timeline.tsx @@ -7,7 +7,7 @@ import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Column from 'pl-fe/components/ui/column'; import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'column.community', defaultMessage: 'Local timeline' }, diff --git a/packages/pl-fe/src/pages/timelines/public-timeline.tsx b/packages/pl-fe/src/pages/timelines/public-timeline.tsx index c170dad5f..efeaef411 100644 --- a/packages/pl-fe/src/pages/timelines/public-timeline.tsx +++ b/packages/pl-fe/src/pages/timelines/public-timeline.tsx @@ -12,7 +12,7 @@ import PinnedHostsPicker from 'pl-fe/features/remote-timeline/components/pinned- import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useInstance } from 'pl-fe/hooks/use-instance'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'column.public', defaultMessage: 'Fediverse timeline' }, diff --git a/packages/pl-fe/src/pages/timelines/remote-timeline.tsx b/packages/pl-fe/src/pages/timelines/remote-timeline.tsx index 188475047..89588ed2a 100644 --- a/packages/pl-fe/src/pages/timelines/remote-timeline.tsx +++ b/packages/pl-fe/src/pages/timelines/remote-timeline.tsx @@ -11,7 +11,7 @@ import Text from 'pl-fe/components/ui/text'; import PinnedHostsPicker from 'pl-fe/features/remote-timeline/components/pinned-hosts-picker'; import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; interface IRemoteTimelinePage { params?: { diff --git a/packages/pl-fe/src/pages/timelines/wrenched-timeline.tsx b/packages/pl-fe/src/pages/timelines/wrenched-timeline.tsx index 7bfd1c92d..528923d7e 100644 --- a/packages/pl-fe/src/pages/timelines/wrenched-timeline.tsx +++ b/packages/pl-fe/src/pages/timelines/wrenched-timeline.tsx @@ -7,7 +7,7 @@ import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Column from 'pl-fe/components/ui/column'; import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useSettings } from 'pl-fe/hooks/use-settings'; +import { useSettings } from 'pl-fe/stores/settings'; const messages = defineMessages({ title: { id: 'column.wrenched', defaultMessage: 'Recent wrenches timeline' }, diff --git a/packages/pl-fe/src/pages/utils/about.tsx b/packages/pl-fe/src/pages/utils/about.tsx index 8f7272107..b1dd54b55 100644 --- a/packages/pl-fe/src/pages/utils/about.tsx +++ b/packages/pl-fe/src/pages/utils/about.tsx @@ -6,8 +6,8 @@ import { Navlinks } from 'pl-fe/components/navlinks'; import Card from 'pl-fe/components/ui/card'; import { languages } from 'pl-fe/features/preferences'; import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; -import { useSettings } from 'pl-fe/hooks/use-settings'; import { useAboutPage } from 'pl-fe/queries/pl-fe/use-about-page'; +import { useSettings } from 'pl-fe/stores/settings'; /** Displays arbitrary user-uploaded HTML on a page at `/about/:slug` */ const AboutPage: React.FC = () => { diff --git a/packages/pl-fe/src/stores/settings.ts b/packages/pl-fe/src/stores/settings.ts index bdfa2171e..e7002f9a2 100644 --- a/packages/pl-fe/src/stores/settings.ts +++ b/packages/pl-fe/src/stores/settings.ts @@ -31,12 +31,14 @@ type State = { settings: Settings; - loadDefaultSettings: (settings: APIEntity) => void; - loadUserSettings: (settings: APIEntity) => void; - userSettingsSaving: () => void; - changeSetting: (path: string[], value: any) => void; - rememberEmojiUse: (emoji: Emoji) => void; - rememberLanguageUse: (language: string) => void; + actions: { + loadDefaultSettings: (settings: APIEntity) => void; + loadUserSettings: (settings: APIEntity) => void; + userSettingsSaving: () => void; + changeSetting: (path: string[], value: any) => void; + rememberEmojiUse: (emoji: Emoji) => void; + rememberLanguageUse: (language: string) => void; + }; } const changeSetting = (object: APIEntity, path: string[], value: any, root?: Settings) => { @@ -94,93 +96,96 @@ const useSettingsStore = create()(mutative((set) => ({ settings: v.parse(settingsSchema, { locale: navigator.language }), - loadDefaultSettings: (settings: APIEntity) => set((state: State) => { - if (typeof settings !== 'object') return; + actions: { + loadDefaultSettings: (settings: APIEntity) => set((state: State) => { + if (typeof settings !== 'object') return; - state.defaultSettings = v.parse(settingsSchema, settings); - mergeSettings(state); - }), + state.defaultSettings = v.parse(settingsSchema, settings); + mergeSettings(state); + }), - loadUserSettings: (settings?: APIEntity) => set((state: State) => { - if (typeof settings !== 'object') return; + loadUserSettings: (settings?: APIEntity) => set((state: State) => { + if (typeof settings !== 'object') return; - state.userSettings = v.parse(settingsSchemaPartial, settings); + state.userSettings = v.parse(settingsSchemaPartial, settings); - const me = lazyStore?.getState().me; - if (me) { - KVStore.getItem('url-purify-rules:last').then((value) => { - if (value !== me) { - if (state.userSettings.urlPrivacy?.rulesUrl) { - updateRulesFromUrl(me, state.userSettings.urlPrivacy.rulesUrl, state.userSettings.urlPrivacy.hashUrl).then(() => { - toast.success(messages.rulesUpdateSuccess); - }).catch(() => { - toast.error(messages.rulesUpdateFail); - }); - } else { - resetRules(me); - } - switch (state.userSettings.urlPrivacy?.redirectLinksMode) { - case 'auto': - updateRedirectServicesFromUrl(me, state.userSettings.urlPrivacy?.redirectServicesUrl); - break; - case 'manual': - setManualRedirectServices(me, state.userSettings.urlPrivacy.redirectServices); - break; - default: - setManualRedirectServices(me, {}); - break; - } - } else { - KVStore.getItem(`url-purify-redirect-services:${me}`).then((services) => { - if (state.userSettings.urlPrivacy?.redirectLinksMode === 'auto') { - if (services?.redirectServicesUrl !== state.userSettings.urlPrivacy?.redirectServicesUrl) { - updateRedirectServicesFromUrl(me, state.userSettings.urlPrivacy?.redirectServicesUrl); - } + const me = lazyStore?.getState().me; + if (me) { + KVStore.getItem('url-purify-rules:last').then((value) => { + if (value !== me) { + if (state.userSettings.urlPrivacy?.rulesUrl) { + updateRulesFromUrl(me, state.userSettings.urlPrivacy.rulesUrl, state.userSettings.urlPrivacy.hashUrl).then(() => { + toast.success(messages.rulesUpdateSuccess); + }).catch(() => { + toast.error(messages.rulesUpdateFail); + }); } else { - setManualRedirectServices(me, state.userSettings.urlPrivacy?.redirectServices || {}); + resetRules(me); } - }).catch(() => {}); - } - }).catch(() => {}); - } + switch (state.userSettings.urlPrivacy?.redirectLinksMode) { + case 'auto': + updateRedirectServicesFromUrl(me, state.userSettings.urlPrivacy?.redirectServicesUrl); + break; + case 'manual': + setManualRedirectServices(me, state.userSettings.urlPrivacy.redirectServices); + break; + default: + setManualRedirectServices(me, {}); + break; + } + } else { + KVStore.getItem(`url-purify-redirect-services:${me}`).then((services) => { + if (state.userSettings.urlPrivacy?.redirectLinksMode === 'auto') { + if (services?.redirectServicesUrl !== state.userSettings.urlPrivacy?.redirectServicesUrl) { + updateRedirectServicesFromUrl(me, state.userSettings.urlPrivacy?.redirectServicesUrl); + } + } else { + setManualRedirectServices(me, state.userSettings.urlPrivacy?.redirectServices || {}); + } + }).catch(() => {}); + } + }).catch(() => {}); + } - mergeSettings(state); - }), + mergeSettings(state); + }), - userSettingsSaving: () => set((state: State) => { - state.userSettings.saved = true; + userSettingsSaving: () => set((state: State) => { + state.userSettings.saved = true; - mergeSettings(state); - }), + mergeSettings(state); + }), - changeSetting: (path: string[], value: any) => set((state: State) => { - state.userSettings.saved = false; - changeSetting(state.userSettings, path, value, state.defaultSettings); + changeSetting: (path: string[], value: any) => set((state: State) => { + state.userSettings.saved = false; + changeSetting(state.userSettings, path, value, state.defaultSettings); - mergeSettings(state, true); - }), + mergeSettings(state, true); + }), - rememberEmojiUse: (emoji: Emoji) => set((state: State) => { - const settings = state.userSettings; - if (!settings.frequentlyUsedEmojis) settings.frequentlyUsedEmojis = {}; + rememberEmojiUse: (emoji: Emoji) => set((state: State) => { + const settings = state.userSettings; + if (!settings.frequentlyUsedEmojis) settings.frequentlyUsedEmojis = {}; - settings.frequentlyUsedEmojis[emoji.id] = (settings.frequentlyUsedEmojis[emoji.id] || 0) + 1; - settings.saved = false; + settings.frequentlyUsedEmojis[emoji.id] = (settings.frequentlyUsedEmojis[emoji.id] || 0) + 1; + settings.saved = false; - mergeSettings(state); - }), + mergeSettings(state); + }), - rememberLanguageUse: (language: string) => set((state: State) => { - const settings = state.userSettings; - if (!settings.frequentlyUsedLanguages) settings.frequentlyUsedLanguages = {}; + rememberLanguageUse: (language: string) => set((state: State) => { + const settings = state.userSettings; + if (!settings.frequentlyUsedLanguages) settings.frequentlyUsedLanguages = {}; - settings.frequentlyUsedLanguages[language] = (settings.frequentlyUsedLanguages[language] || 0) + 1; - settings.saved = false; + settings.frequentlyUsedLanguages[language] = (settings.frequentlyUsedLanguages[language] || 0) + 1; + settings.saved = false; - mergeSettings(state); - }), + mergeSettings(state); + }), + }, }), { enableAutoFreeze: true })); const useSettings = () => useSettingsStore().settings; +const useSettingsStoreActions = () => useSettingsStore().actions; -export { useSettingsStore, useSettings }; +export { useSettingsStore, useSettings, useSettingsStoreActions };