From fa7d6241589760c16808df75e539191f8b0fd22a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= Date: Tue, 14 Oct 2025 08:55:31 +0200 Subject: [PATCH] pl-fe: fix incomplete shoutbox port 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/reducers/shoutbox.ts | 14 -------------- packages/pl-fe/src/stores/shoutbox.ts | 18 ++++++++++++------ 2 files changed, 12 insertions(+), 20 deletions(-) delete mode 100644 packages/pl-fe/src/reducers/shoutbox.ts diff --git a/packages/pl-fe/src/reducers/shoutbox.ts b/packages/pl-fe/src/reducers/shoutbox.ts deleted file mode 100644 index 4abd1ce38..000000000 --- a/packages/pl-fe/src/reducers/shoutbox.ts +++ /dev/null @@ -1,14 +0,0 @@ -import type { PlApiClient } from 'pl-api'; -import type { AnyAction } from 'redux'; - -interface State { - socket: ReturnType<(InstanceType)['shoutbox']['connect']> | null; -} - -const initialState: State = { - socket: null, -}; - -const shoutboxReducer = (state = initialState, action: AnyAction) => state; - -export { shoutboxReducer as default }; diff --git a/packages/pl-fe/src/stores/shoutbox.ts b/packages/pl-fe/src/stores/shoutbox.ts index 194f11671..738e6f0a0 100644 --- a/packages/pl-fe/src/stores/shoutbox.ts +++ b/packages/pl-fe/src/stores/shoutbox.ts @@ -3,7 +3,7 @@ import { create } from 'zustand'; import { mutative } from 'zustand-mutative'; import { useClient } from 'pl-fe/hooks/use-client'; -import { useInstance } from 'pl-fe/hooks/use-instance'; +import { useFeatures } from 'pl-fe/hooks/use-features'; import { useLoggedIn } from 'pl-fe/hooks/use-logged-in'; import type { PlApiClient, ShoutMessage as BaseShoutMessage } from 'pl-api'; @@ -21,31 +21,35 @@ type State = { isLoading: boolean; setMessages: (messages: Array) => void; pushMessage: (message: BaseShoutMessage) => void; + setSocket: (socket: State['socket']) => void; }; const useShoutboxStore = create()(mutative((set) => ({ socket: null, messages: [], isLoading: true, - setMessages: (messages: Array) => set((state: State) => { + setMessages: (messages) => set((state: State) => { state.messages = messages.map(minifyMessage); state.isLoading = false; }), - pushMessage: (message: BaseShoutMessage) => set((state: State) => { + pushMessage: (message) => set((state: State) => { state.messages.push(minifyMessage(message)); }), + setSocket: (socket) => set((state: State) => { + state.socket = socket; + }), }), { enableAutoFreeze: false, })); const useShoutboxSubscription = () => { const client = useClient(); - const instance = useInstance(); + const { shoutbox: shoutboxAvailable } = useFeatures(); const { isLoggedIn } = useLoggedIn(); const shoutboxStore = useShoutboxStore(); useEffect(() => { - if (!(instance.fetched && isLoggedIn)) return; + if (!(shoutboxAvailable && isLoggedIn)) return; let socket: ReturnType<(InstanceType)['shoutbox']['connect']>; @@ -55,13 +59,15 @@ const useShoutboxSubscription = () => { onMessage: (message) => shoutboxStore.pushMessage(message), onMessages: (messages) => shoutboxStore.setMessages(messages), }); + shoutboxStore.setSocket(socket); } }).catch(() => {}); return () => { socket?.close(); + shoutboxStore.setSocket(null); }; - }, [instance.fetched && isLoggedIn]); + }, [shoutboxAvailable && isLoggedIn]); }; const useCreateShoutboxMessage = () => {