[fix] use plasmohq/storage

This commit is contained in:
kawamataryo 2024-11-06 19:15:08 +09:00
parent aeec876d2b
commit 9be889413c
6 changed files with 42 additions and 52 deletions

18
package-lock.json generated
View File

@ -1,17 +1,17 @@
{ {
"name": "sky-follower-bridge", "name": "sky-follower-bridge",
"version": "0.9.8", "version": "1.0.1",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "sky-follower-bridge", "name": "sky-follower-bridge",
"version": "0.9.8", "version": "1.0.1",
"dependencies": { "dependencies": {
"@atproto/api": "^0.13.12", "@atproto/api": "^0.13.12",
"@changesets/cli": "^2.27.1", "@changesets/cli": "^2.27.1",
"@plasmohq/messaging": "^0.6.2", "@plasmohq/messaging": "^0.6.2",
"@plasmohq/storage": "^1.9.1", "@plasmohq/storage": "^1.12.0",
"framer-motion": "^11.11.11", "framer-motion": "^11.11.11",
"plasmo": "^0.84.2", "plasmo": "^0.84.2",
"react": "18.2.0", "react": "18.2.0",
@ -7566,9 +7566,9 @@
} }
}, },
"node_modules/@plasmohq/storage": { "node_modules/@plasmohq/storage": {
"version": "1.9.1", "version": "1.12.0",
"resolved": "https://registry.npmjs.org/@plasmohq/storage/-/storage-1.9.1.tgz", "resolved": "https://registry.npmjs.org/@plasmohq/storage/-/storage-1.12.0.tgz",
"integrity": "sha512-65UXCZEWUA0aHhho2Mu5igrP/zdxkvPsT5N3rIypOYh0prn6Xk5HD0dt7q0mo8hb16QUUWDUL7OUPH4IDeDsIg==", "integrity": "sha512-LoCyO0PXl609ee8QKVEwVpkTyD/8WjYQhd0sxFomLxbdxsZC0LD4n8nv4nSegP5X8lYQBQnR/LMq4ZXoQh87wA==",
"dependencies": { "dependencies": {
"pify": "6.1.0" "pify": "6.1.0"
}, },
@ -28126,9 +28126,9 @@
} }
}, },
"@plasmohq/storage": { "@plasmohq/storage": {
"version": "1.9.1", "version": "1.12.0",
"resolved": "https://registry.npmjs.org/@plasmohq/storage/-/storage-1.9.1.tgz", "resolved": "https://registry.npmjs.org/@plasmohq/storage/-/storage-1.12.0.tgz",
"integrity": "sha512-65UXCZEWUA0aHhho2Mu5igrP/zdxkvPsT5N3rIypOYh0prn6Xk5HD0dt7q0mo8hb16QUUWDUL7OUPH4IDeDsIg==", "integrity": "sha512-LoCyO0PXl609ee8QKVEwVpkTyD/8WjYQhd0sxFomLxbdxsZC0LD4n8nv4nSegP5X8lYQBQnR/LMq4ZXoQh87wA==",
"requires": { "requires": {
"pify": "6.1.0" "pify": "6.1.0"
}, },

View File

@ -1,7 +1,7 @@
{ {
"name": "sky-follower-bridge", "name": "sky-follower-bridge",
"displayName": "Sky Follower Bridge", "displayName": "Sky Follower Bridge",
"version": "1.0.0", "version": "1.0.1",
"description": "Instantly find and follow the same users from your Twitter follows on Bluesky.", "description": "Instantly find and follow the same users from your Twitter follows on Bluesky.",
"author": "kawamataryou", "author": "kawamataryou",
"scripts": { "scripts": {
@ -22,7 +22,7 @@
"@atproto/api": "^0.13.12", "@atproto/api": "^0.13.12",
"@changesets/cli": "^2.27.1", "@changesets/cli": "^2.27.1",
"@plasmohq/messaging": "^0.6.2", "@plasmohq/messaging": "^0.6.2",
"@plasmohq/storage": "^1.9.1", "@plasmohq/storage": "^1.12.0",
"framer-motion": "^11.11.11", "framer-motion": "^11.11.11",
"plasmo": "^0.84.2", "plasmo": "^0.84.2",
"react": "18.2.0", "react": "18.2.0",

BIN
sky-follower-bridge-src.zip Normal file

Binary file not shown.

View File

@ -1,3 +1,5 @@
import { useStorage } from "@plasmohq/storage/hook";
import { Storage } from "@plasmohq/storage";
import React from "react"; import React from "react";
import { BskyServiceWorkerClient } from "~lib/bskyServiceWorkerClient"; import { BskyServiceWorkerClient } from "~lib/bskyServiceWorkerClient";
import { import {
@ -9,13 +11,15 @@ import {
import { wait } from "~lib/utils"; import { wait } from "~lib/utils";
import type { BskyUser, MatchType } from "~types"; import type { BskyUser, MatchType } from "~types";
export const useBskyUserManager = ({ export const useBskyUserManager = () => {
users, const [users, setUsers] = useStorage<BskyUser[]>({
setUsers, key: STORAGE_KEYS.DETECTED_BSKY_USERS,
}: { instance: new Storage({
users: BskyUser[]; area: "local",
setUsers: React.Dispatch<React.SetStateAction<BskyUser[]>>; }),
}) => { },
(v) => (v === undefined ? [] : v)
);
const bskyClient = React.useRef<BskyServiceWorkerClient | null>(null); const bskyClient = React.useRef<BskyServiceWorkerClient | null>(null);
const [actionMode, setActionMode] = React.useState< const [actionMode, setActionMode] = React.useState<
(typeof ACTION_MODE)[keyof typeof ACTION_MODE] (typeof ACTION_MODE)[keyof typeof ACTION_MODE]
@ -40,7 +44,7 @@ export const useBskyUserManager = ({
const result = await bskyClient.current.follow(user.did); const result = await bskyClient.current.follow(user.did);
resultUri = result.uri; resultUri = result.uri;
} }
setUsers((prev) => await setUsers((prev) =>
prev.map((prevUser) => { prev.map((prevUser) => {
if (prevUser.did === user.did) { if (prevUser.did === user.did) {
return { return {
@ -62,7 +66,7 @@ export const useBskyUserManager = ({
const result = await bskyClient.current.block(user.did); const result = await bskyClient.current.block(user.did);
resultUri = result.uri; resultUri = result.uri;
} }
setUsers((prev) => await setUsers((prev) =>
prev.map((prevUser) => { prev.map((prevUser) => {
if (prevUser.did === user.did) { if (prevUser.did === user.did) {
return { return {
@ -125,7 +129,7 @@ export const useBskyUserManager = ({
} }
const result = await bskyClient.current.follow(user.did); const result = await bskyClient.current.follow(user.did);
resultUri = result.uri; resultUri = result.uri;
setUsers((prev) => await setUsers((prev) =>
prev.map((prevUser) => { prev.map((prevUser) => {
if (prevUser.did === user.did) { if (prevUser.did === user.did) {
return { return {
@ -149,7 +153,7 @@ export const useBskyUserManager = ({
const result = await bskyClient.current.block(user.did); const result = await bskyClient.current.block(user.did);
resultUri = result.uri; resultUri = result.uri;
} }
setUsers((prev) => await setUsers((prev) =>
prev.map((prevUser) => { prev.map((prevUser) => {
if (prevUser.did === user.did) { if (prevUser.did === user.did) {
return { return {
@ -175,7 +179,7 @@ export const useBskyUserManager = ({
bskyClient.current = new BskyServiceWorkerClient(session); bskyClient.current = new BskyServiceWorkerClient(session);
setActionMode( setActionMode(
MESSAGE_NAME_TO_ACTION_MODE_MAP[ MESSAGE_NAME_TO_ACTION_MODE_MAP[
result[STORAGE_KEYS.BSKY_MESSAGE_NAME] result[STORAGE_KEYS.BSKY_MESSAGE_NAME]
], ],
); );
}, },

View File

@ -1,4 +1,6 @@
import type { AtpSessionData } from "@atproto/api"; import type { AtpSessionData } from "@atproto/api";
import { useStorage } from "@plasmohq/storage/hook";
import { Storage } from "@plasmohq/storage";
import React from "react"; import React from "react";
import { BskyServiceWorkerClient } from "~lib/bskyServiceWorkerClient"; import { BskyServiceWorkerClient } from "~lib/bskyServiceWorkerClient";
import { import {
@ -39,7 +41,14 @@ export const useRetrieveBskyUsers = () => {
const [detectedXUsers, setDetectedXUsers] = React.useState< const [detectedXUsers, setDetectedXUsers] = React.useState<
ReturnType<typeof detectXUsers> ReturnType<typeof detectXUsers>
>([]); >([]);
const [users, setUsers] = React.useState<BskyUser[]>([]); const [users, setUsers] = useStorage<BskyUser[]>({
key: STORAGE_KEYS.DETECTED_BSKY_USERS,
instance: new Storage({
area: "local",
})
},
(v) => (v === undefined ? [] : v)
);
const [loading, setLoading] = React.useState(true); const [loading, setLoading] = React.useState(true);
const [errorMessage, setErrorMessage] = React.useState(""); const [errorMessage, setErrorMessage] = React.useState("");
const [isBottomReached, setIsBottomReached] = React.useState(false); const [isBottomReached, setIsBottomReached] = React.useState(false);
@ -62,7 +71,7 @@ export const useRetrieveBskyUsers = () => {
userData, userData,
}); });
if (searchResult) { if (searchResult) {
setUsers((prev) => { await setUsers((prev) => {
if (prev.some((u) => u.did === searchResult.bskyProfile.did)) { if (prev.some((u) => u.did === searchResult.bskyProfile.did)) {
return prev; return prev;
} }
@ -85,7 +94,7 @@ export const useRetrieveBskyUsers = () => {
} }
} }
}, },
[], [setUsers],
); );
const abortControllerRef = React.useRef<AbortController | null>(null); const abortControllerRef = React.useRef<AbortController | null>(null);
@ -170,6 +179,7 @@ export const useRetrieveBskyUsers = () => {
}, },
); );
setLoading(true); setLoading(true);
await setUsers([]);
showModal(); showModal();
}, []); }, []);

View File

@ -1,13 +1,11 @@
import { useEffect, useState } from "react";
import UserCard from "~lib/components/UserCard"; import UserCard from "~lib/components/UserCard";
import { useBskyUserManager } from "~lib/hooks/useBskyUserManager"; import { useBskyUserManager } from "~lib/hooks/useBskyUserManager";
import type { BskyUser } from "~lib/hooks/useRetrieveBskyUsers";
import "./style.css"; import "./style.css";
import Sidebar from "~lib/components/Sidebar"; import Sidebar from "~lib/components/Sidebar";
const Option = () => { const Option = () => {
const [users, setUsers] = useState<BskyUser[]>([]);
const { const {
users,
filteredUsers, filteredUsers,
matchTypeFilter, matchTypeFilter,
changeMatchTypeFilter, changeMatchTypeFilter,
@ -15,29 +13,7 @@ const Option = () => {
actionMode, actionMode,
actionAll, actionAll,
matchTypeStats, matchTypeStats,
} = useBskyUserManager({ } = useBskyUserManager();
users,
setUsers,
});
useEffect(() => {
chrome.storage.local.get("users", (result) => {
setUsers(JSON.parse(result.users || "[]"));
});
const getUsers = () => {
chrome.storage.local.get("users", (result) => {
const _users = JSON.parse(result.users || "[]") as BskyUser[];
setUsers((prev) => {
const newUsers = _users.filter(
(u) => !prev.some((p) => p.did === u.did),
);
return [...prev, ...newUsers];
});
});
};
const interval = setInterval(getUsers, 2000);
return () => clearInterval(interval);
}, []);
const handleActionAll = async () => { const handleActionAll = async () => {
if ( if (