diff --git a/src/contents/App.tsx b/src/contents/App.tsx index a0230b1..e20f60a 100644 --- a/src/contents/App.tsx +++ b/src/contents/App.tsx @@ -1,11 +1,13 @@ import cssText from "data-text:~style.content.css"; import { sendToBackground } from "@plasmohq/messaging"; +import { Storage } from "@plasmohq/storage"; +import { useStorage } from "@plasmohq/storage/hook"; import type { PlasmoCSConfig } from "plasmo"; import React from "react"; import AlertError from "~lib/components/AlertError"; import LoadingCards from "~lib/components/LoadingCards"; import Modal from "~lib/components/Modal"; -import { MESSAGE_NAMES } from "~lib/constants"; +import { MESSAGE_NAMES, STORAGE_KEYS } from "~lib/constants"; import { useRetrieveBskyUsers } from "~lib/hooks/useRetrieveBskyUsers"; export const config: PlasmoCSConfig = { @@ -29,7 +31,6 @@ const App = () => { restart, isBottomReached, errorMessage, - listName, } = useRetrieveBskyUsers(); const [isModalOpen, setIsModalOpen] = React.useState(false); @@ -67,13 +68,25 @@ const App = () => { }; }, [initialize]); + const [_, setKey] = useStorage( + { + key: STORAGE_KEYS.RENDER_KEY, + instance: new Storage({ + area: "local", + }), + }, + (v) => (v === undefined ? "" : v), + ); + const openOptionPage = () => { sendToBackground({ name: "openOptionPage" }); + // force re-render option page + setKey(Date.now().toString()); }; const stopAndShowDetectedUsers = () => { - stopRetrieveLoop(); openOptionPage(); + stopRetrieveLoop(); }; return ( diff --git a/src/lib/constants.ts b/src/lib/constants.ts index 846f155..68df44f 100644 --- a/src/lib/constants.ts +++ b/src/lib/constants.ts @@ -39,6 +39,7 @@ export const STORAGE_KEYS = { BSKY_MESSAGE_NAME: `${STORAGE_PREFIX}_bsky_message_name`, DETECTED_BSKY_USERS: `${STORAGE_PREFIX}_detected_bsky_users`, LIST_NAME: `${STORAGE_PREFIX}_list_name`, + RENDER_KEY: `${STORAGE_PREFIX}_render_key`, } as const; export const TARGET_URLS_REGEX = { diff --git a/src/lib/hooks/useBskyUserManager.ts b/src/lib/hooks/useBskyUserManager.ts index 242853b..34ea3c8 100644 --- a/src/lib/hooks/useBskyUserManager.ts +++ b/src/lib/hooks/useBskyUserManager.ts @@ -202,6 +202,17 @@ export const useBskyUserManager = () => { return actionCount; }, [filteredUsers, actionMode, setUsers]); + const [key] = useStorage( + { + key: STORAGE_KEYS.RENDER_KEY, + instance: new Storage({ + area: "local", + }), + }, + (v) => (v === undefined ? "" : v), + ); + + // biome-ignore lint/correctness/useExhaustiveDependencies: force re-render option page React.useEffect(() => { chrome.storage.local.get( [STORAGE_KEYS.BSKY_CLIENT_SESSION, STORAGE_KEYS.BSKY_MESSAGE_NAME], @@ -215,7 +226,7 @@ export const useBskyUserManager = () => { ); }, ); - }, []); + }, [key]); const matchTypeStats = React.useMemo(() => { return Object.keys(matchTypeFilter).reduce( diff --git a/src/lib/services/xService.ts b/src/lib/services/xService.ts index 207c3ce..f127324 100644 --- a/src/lib/services/xService.ts +++ b/src/lib/services/xService.ts @@ -44,7 +44,7 @@ export class XService extends AbstractService { ? (document.querySelector('div[data-viewportview="true"]') as HTMLElement) : document.documentElement; - const initialScrollHeight = scrollTarget.scrollHeight; + const initialScrollHeight = scrollTarget?.scrollHeight; scrollTarget.scrollTop += initialScrollHeight; await wait(3000);