diff --git a/.github/workflows/code_quolity.yml b/.github/workflows/code_quolity.yml new file mode 100644 index 0000000..f65ed1a --- /dev/null +++ b/.github/workflows/code_quolity.yml @@ -0,0 +1,18 @@ +name: Code quality + +on: + push: + pull_request: + +jobs: + quality: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + - name: Setup Biome + uses: biomejs/setup-biome@v2 + with: + version: latest + - name: Run Biome + run: biome ci ./src diff --git a/biome.json b/biome.json new file mode 100644 index 0000000..3f32d34 --- /dev/null +++ b/biome.json @@ -0,0 +1,18 @@ +{ + "$schema": "https://biomejs.dev/schemas/1.5.1/schema.json", + "organizeImports": { + "enabled": true + }, + "formatter": { + "indentStyle": "space" + }, + "linter": { + "enabled": true, + "rules": { + "recommended": true, + "a11y": { + "noSvgWithoutTitle": "off" + } + } + } +} diff --git a/package-lock.json b/package-lock.json index 81afbb5..a03ee83 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "sky-follower-bridge", - "version": "0.7.4", + "version": "0.7.5", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "sky-follower-bridge", - "version": "0.7.4", + "version": "0.7.5", "dependencies": { "@atproto/api": "^0.7.4", "@changesets/cli": "^2.27.1", @@ -19,6 +19,7 @@ "vanjs-core": "^1.2.7" }, "devDependencies": { + "@biomejs/biome": "1.5.1", "@plasmohq/prettier-plugin-sort-imports": "4.0.1", "@types/chrome": "0.0.254", "@types/node": "20.10.6", @@ -452,6 +453,161 @@ "node": ">=6.9.0" } }, + "node_modules/@biomejs/biome": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/biome/-/biome-1.5.1.tgz", + "integrity": "sha512-rdMA/N1Zc1nxUtbXMVr+50Sg/Pezz+9qGQa2uyRWFtrCoyr3dv0pVz+0ifGGue18ip50ZH8x2r5CV7zo8Q/0mA==", + "dev": true, + "hasInstallScript": true, + "bin": { + "biome": "bin/biome" + }, + "engines": { + "node": ">=14.*" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/biome" + }, + "optionalDependencies": { + "@biomejs/cli-darwin-arm64": "1.5.1", + "@biomejs/cli-darwin-x64": "1.5.1", + "@biomejs/cli-linux-arm64": "1.5.1", + "@biomejs/cli-linux-arm64-musl": "1.5.1", + "@biomejs/cli-linux-x64": "1.5.1", + "@biomejs/cli-linux-x64-musl": "1.5.1", + "@biomejs/cli-win32-arm64": "1.5.1", + "@biomejs/cli-win32-x64": "1.5.1" + } + }, + "node_modules/@biomejs/cli-darwin-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-arm64/-/cli-darwin-arm64-1.5.1.tgz", + "integrity": "sha512-E9pLakmSVHP6UH2uqAghqEkr/IHAIDfDyCedqJVnyFc+uufNTHwB8id4XTiWy/eKIdgxHZsTSE+R+W0IqrTNVQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-darwin-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-x64/-/cli-darwin-x64-1.5.1.tgz", + "integrity": "sha512-8O1F+FcoCi02JlocyilB6R3y3kT9sRkBCRwYddaBIScQe2hCme/mA2rVzrhCCHhskrclJ51GEKjkEORj4/8c2A==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-linux-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64/-/cli-linux-arm64-1.5.1.tgz", + "integrity": "sha512-25gwY4FMzmi1Rl6N835raLq7nzTk+PyEQd88k9Em6dqtI4qpljqmZlMmVjOiwXKe3Ee80J/Vlh7BM36lsHUTEg==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-linux-arm64-musl": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64-musl/-/cli-linux-arm64-musl-1.5.1.tgz", + "integrity": "sha512-Lw9G3LUdhRMp8L8RMeVevnfQCa7luT6ubQ8GRjLju32glxWKefpDrzgfHixGyvTQPlhnYjQ+V8/QQ/I7WPzOoA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-linux-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64/-/cli-linux-x64-1.5.1.tgz", + "integrity": "sha512-YDM0gZP4UbAuaBI3DVbUuj5X+Omm6uxzD1Qpc6hcduH1kzXzs9L0ee7cn/kJtNndoXR8MlmUS0O0/wWvZf2YaA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-linux-x64-musl": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64-musl/-/cli-linux-x64-musl-1.5.1.tgz", + "integrity": "sha512-5gapxc/VlwTgGRbTc9h8PMTpf8eNahIBauFUGSXncHgayi3VpezKSicgaQ1bb8FahVXf/5eNEVxVARq/or71Ag==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-win32-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-arm64/-/cli-win32-arm64-1.5.1.tgz", + "integrity": "sha512-TVpLBOLUMLQmH2VRFBKFr3rgEkr7XvG4QZxHOxWB9Ivc/sQPvg4aHMd8qpgPKXABGUnultyc9t0+WvfIDxuALg==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=14.*" + } + }, + "node_modules/@biomejs/cli-win32-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-x64/-/cli-win32-x64-1.5.1.tgz", + "integrity": "sha512-qx8EKwScZmVYZjMPZ6GF3ZUmgg/N6zqh+d8vHA2E43opNCyqIPTl89sOqkc7zd1CyyABDWxsbqI9Ih6xTT6hnQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=14.*" + } + }, "node_modules/@changesets/apply-release-plan": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-7.0.0.tgz", @@ -12917,6 +13073,78 @@ "to-fast-properties": "^2.0.0" } }, + "@biomejs/biome": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/biome/-/biome-1.5.1.tgz", + "integrity": "sha512-rdMA/N1Zc1nxUtbXMVr+50Sg/Pezz+9qGQa2uyRWFtrCoyr3dv0pVz+0ifGGue18ip50ZH8x2r5CV7zo8Q/0mA==", + "dev": true, + "requires": { + "@biomejs/cli-darwin-arm64": "1.5.1", + "@biomejs/cli-darwin-x64": "1.5.1", + "@biomejs/cli-linux-arm64": "1.5.1", + "@biomejs/cli-linux-arm64-musl": "1.5.1", + "@biomejs/cli-linux-x64": "1.5.1", + "@biomejs/cli-linux-x64-musl": "1.5.1", + "@biomejs/cli-win32-arm64": "1.5.1", + "@biomejs/cli-win32-x64": "1.5.1" + } + }, + "@biomejs/cli-darwin-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-arm64/-/cli-darwin-arm64-1.5.1.tgz", + "integrity": "sha512-E9pLakmSVHP6UH2uqAghqEkr/IHAIDfDyCedqJVnyFc+uufNTHwB8id4XTiWy/eKIdgxHZsTSE+R+W0IqrTNVQ==", + "dev": true, + "optional": true + }, + "@biomejs/cli-darwin-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-x64/-/cli-darwin-x64-1.5.1.tgz", + "integrity": "sha512-8O1F+FcoCi02JlocyilB6R3y3kT9sRkBCRwYddaBIScQe2hCme/mA2rVzrhCCHhskrclJ51GEKjkEORj4/8c2A==", + "dev": true, + "optional": true + }, + "@biomejs/cli-linux-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64/-/cli-linux-arm64-1.5.1.tgz", + "integrity": "sha512-25gwY4FMzmi1Rl6N835raLq7nzTk+PyEQd88k9Em6dqtI4qpljqmZlMmVjOiwXKe3Ee80J/Vlh7BM36lsHUTEg==", + "dev": true, + "optional": true + }, + "@biomejs/cli-linux-arm64-musl": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64-musl/-/cli-linux-arm64-musl-1.5.1.tgz", + "integrity": "sha512-Lw9G3LUdhRMp8L8RMeVevnfQCa7luT6ubQ8GRjLju32glxWKefpDrzgfHixGyvTQPlhnYjQ+V8/QQ/I7WPzOoA==", + "dev": true, + "optional": true + }, + "@biomejs/cli-linux-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64/-/cli-linux-x64-1.5.1.tgz", + "integrity": "sha512-YDM0gZP4UbAuaBI3DVbUuj5X+Omm6uxzD1Qpc6hcduH1kzXzs9L0ee7cn/kJtNndoXR8MlmUS0O0/wWvZf2YaA==", + "dev": true, + "optional": true + }, + "@biomejs/cli-linux-x64-musl": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64-musl/-/cli-linux-x64-musl-1.5.1.tgz", + "integrity": "sha512-5gapxc/VlwTgGRbTc9h8PMTpf8eNahIBauFUGSXncHgayi3VpezKSicgaQ1bb8FahVXf/5eNEVxVARq/or71Ag==", + "dev": true, + "optional": true + }, + "@biomejs/cli-win32-arm64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-arm64/-/cli-win32-arm64-1.5.1.tgz", + "integrity": "sha512-TVpLBOLUMLQmH2VRFBKFr3rgEkr7XvG4QZxHOxWB9Ivc/sQPvg4aHMd8qpgPKXABGUnultyc9t0+WvfIDxuALg==", + "dev": true, + "optional": true + }, + "@biomejs/cli-win32-x64": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-x64/-/cli-win32-x64-1.5.1.tgz", + "integrity": "sha512-qx8EKwScZmVYZjMPZ6GF3ZUmgg/N6zqh+d8vHA2E43opNCyqIPTl89sOqkc7zd1CyyABDWxsbqI9Ih6xTT6hnQ==", + "dev": true, + "optional": true + }, "@changesets/apply-release-plan": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-7.0.0.tgz", diff --git a/package.json b/package.json index 0bac21d..2c6a97e 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ "build:firefox": "plasmo build --target=firefox-mv3", "package": "plasmo package", "package:firefox": "plasmo package --target=firefox-mv3", - "run-client": "ts-node --project tsconfig.script.json scripts/client.ts" + "run-client": "ts-node --project tsconfig.script.json scripts/client.ts", + "check": "npx @biomejs/biome check --apply-unsafe ./src" }, "dependencies": { "@atproto/api": "^0.7.4", @@ -24,6 +25,7 @@ "vanjs-core": "^1.2.7" }, "devDependencies": { + "@biomejs/biome": "1.5.1", "@plasmohq/prettier-plugin-sort-imports": "4.0.1", "@types/chrome": "0.0.254", "@types/node": "20.10.6", diff --git a/src/background/messages/block.ts b/src/background/messages/block.ts index 05ae698..e951d0d 100644 --- a/src/background/messages/block.ts +++ b/src/background/messages/block.ts @@ -1,21 +1,21 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "~lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { session, subjectDid } = req.body - const client = BskyClient.createAgentFromSession(session) + const { session, subjectDid } = req.body; + const client = BskyClient.createAgentFromSession(session); try { res.send({ - result: await client.block(subjectDid) - }) + result: await client.block(subjectDid), + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/background/messages/follow.ts b/src/background/messages/follow.ts index 17b8644..71eb913 100644 --- a/src/background/messages/follow.ts +++ b/src/background/messages/follow.ts @@ -1,21 +1,21 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "~lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { session, subjectDid } = req.body - const client = BskyClient.createAgentFromSession(session) + const { session, subjectDid } = req.body; + const client = BskyClient.createAgentFromSession(session); try { res.send({ - result: await client.follow(subjectDid) - }) + result: await client.follow(subjectDid), + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/background/messages/login.ts b/src/background/messages/login.ts index dc5c5d3..27630d6 100644 --- a/src/background/messages/login.ts +++ b/src/background/messages/login.ts @@ -1,25 +1,25 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "../../lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { identifier, password } = req.body + const { identifier, password } = req.body; try { const agent = await BskyClient.createAgent({ identifier, password, - }) + }); res.send({ session: agent.session, - }) + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/background/messages/searchUser.ts b/src/background/messages/searchUser.ts index 358787a..a5d7a55 100644 --- a/src/background/messages/searchUser.ts +++ b/src/background/messages/searchUser.ts @@ -1,24 +1,24 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "~lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { session, term, limit } = req.body - const client = BskyClient.createAgentFromSession(session) + const { session, term, limit } = req.body; + const client = BskyClient.createAgentFromSession(session); try { res.send({ actors: await client.searchUser({ term, limit, - }) - }) + }), + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/background/messages/unblock.ts b/src/background/messages/unblock.ts index ff28723..7fd57a0 100644 --- a/src/background/messages/unblock.ts +++ b/src/background/messages/unblock.ts @@ -1,21 +1,21 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "~lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { session, blockUri } = req.body - const client = BskyClient.createAgentFromSession(session) + const { session, blockUri } = req.body; + const client = BskyClient.createAgentFromSession(session); try { res.send({ - result: await client.unblock(blockUri) - }) + result: await client.unblock(blockUri), + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/background/messages/unfollow.ts b/src/background/messages/unfollow.ts index a0946f6..e28894e 100644 --- a/src/background/messages/unfollow.ts +++ b/src/background/messages/unfollow.ts @@ -1,21 +1,21 @@ -import type { PlasmoMessaging } from "@plasmohq/messaging" +import type { PlasmoMessaging } from "@plasmohq/messaging"; import { BskyClient } from "~lib/bskyClient"; const handler: PlasmoMessaging.MessageHandler = async (req, res) => { - const { session, followUri } = req.body - const client = BskyClient.createAgentFromSession(session) + const { session, followUri } = req.body; + const client = BskyClient.createAgentFromSession(session); try { res.send({ - result: await client.unfollow(followUri) - }) + result: await client.unfollow(followUri), + }); } catch (e) { res.send({ error: { message: e.message, - } - }) + }, + }); } -} +}; -export default handler +export default handler; diff --git a/src/content.ts b/src/content.ts index 55b3cd3..767ef75 100644 --- a/src/content.ts +++ b/src/content.ts @@ -1,21 +1,20 @@ -import { type BskyLoginParams } from "./lib/bskyClient"; -import type { PlasmoCSConfig } from "plasmo" -import { MESSAGE_NAMES, VIEWER_STATE } from "~lib/constants"; -import "./style.content.css" -import { searchAndInsertBskyUsers } from '~lib/searchAndInsertBskyUsers'; +import type { PlasmoCSConfig } from "plasmo"; import { BskyServiceWorkerClient } from "~lib/bskyServiceWorkerClient"; +import { MESSAGE_NAMES, VIEWER_STATE } from "~lib/constants"; +import { searchAndInsertBskyUsers } from "~lib/searchAndInsertBskyUsers"; +import { type BskyLoginParams } from "./lib/bskyClient"; +import "./style.content.css"; export const config: PlasmoCSConfig = { matches: ["https://twitter.com/*", "https://x.com/*"], - all_frames: true -} + all_frames: true, +}; const searchAndShowBskyUsers = async ({ identifier, password, messageName, }: BskyLoginParams & { messageName: string }) => { - const agent = await BskyServiceWorkerClient.createAgent({ identifier, password, @@ -31,11 +30,12 @@ const searchAndShowBskyUsers = async ({ progressive: "Following", }, statusKey: VIEWER_STATE.FOLLOWING, - userCellQueryParam: '[data-testid="primaryColumn"] [data-testid="UserCell"]', + userCellQueryParam: + '[data-testid="primaryColumn"] [data-testid="UserCell"]', addQuery: async (arg: string) => await agent.follow(arg), removeQuery: async (arg: string) => await agent.unfollow(arg), - }) - break + }); + break; case MESSAGE_NAMES.SEARCH_BSKY_USER_ON_LIST_MEMBERS_PAGE: await searchAndInsertBskyUsers({ agent, @@ -45,11 +45,12 @@ const searchAndShowBskyUsers = async ({ progressive: "Following", }, statusKey: VIEWER_STATE.FOLLOWING, - userCellQueryParam: '[data-testid="cellInnerDiv"] [data-testid="UserCell"]', + userCellQueryParam: + '[data-testid="cellInnerDiv"] [data-testid="UserCell"]', addQuery: async (arg: string) => await agent.follow(arg), removeQuery: async (arg: string) => await agent.unfollow(arg), - }) - break + }); + break; case MESSAGE_NAMES.SEARCH_BSKY_USER_ON_BLOCK_PAGE: // TODO: If already blocked, don't show blocking state. because blocking user can't find. await searchAndInsertBskyUsers({ @@ -63,10 +64,10 @@ const searchAndShowBskyUsers = async ({ userCellQueryParam: '[data-testid="UserCell"]', addQuery: async (arg: string) => await agent.block(arg), removeQuery: async (arg: string) => await agent.unblock(arg), - }) - break + }); + break; } -} +}; chrome.runtime.onMessage.addListener((message, _, sendResponse) => { if (Object.values(MESSAGE_NAMES).includes(message.name)) { @@ -76,13 +77,13 @@ chrome.runtime.onMessage.addListener((message, _, sendResponse) => { messageName: message.name, }) .then(() => { - sendResponse({ hasError: false }) + sendResponse({ hasError: false }); }) .catch((e) => { - console.error(e) - sendResponse({ hasError: true, message: e.toString() }) + console.error(e); + sendResponse({ hasError: true, message: e.toString() }); }); - return true + return true; } - return false -}) + return false; +}); diff --git a/src/lib/bskyClient.ts b/src/lib/bskyClient.ts index c9fa788..7ab88ef 100644 --- a/src/lib/bskyClient.ts +++ b/src/lib/bskyClient.ts @@ -1,9 +1,9 @@ -import { AtUri, BskyAgent, type AtpSessionData } from "@atproto/api"; +import { AtUri, type AtpSessionData, BskyAgent } from "@atproto/api"; export type BskyLoginParams = { identifier: string; password: string; -} +}; export class BskyClient { private service = "https://bsky.social"; @@ -13,12 +13,15 @@ export class BskyClient { email: string; }; agent: BskyAgent; - session = {} + session = {}; private constructor() { - this.agent = new BskyAgent({ service: this.service, persistSession: (evt, session) => { - this.session = session - } }); + this.agent = new BskyAgent({ + service: this.service, + persistSession: (evt, session) => { + this.session = session; + }, + }); } public static createAgentFromSession(session: AtpSessionData): BskyClient { @@ -28,7 +31,7 @@ export class BskyClient { did: session.did, handle: session.handle, email: session.email, - } + }; return client; } @@ -38,15 +41,15 @@ export class BskyClient { password, }: BskyLoginParams): Promise { const client = new BskyClient(); - const {data} = await client.agent.login({ + const { data } = await client.agent.login({ identifier: identifier.replace(/^@/, ""), // if identifier is a handle name, @ is not required - password + password, }); client.me = { did: data.did, handle: data.handle, email: data.email, - } + }; return client; } @@ -66,30 +69,32 @@ export class BskyClient { public follow = async (subjectDid: string) => { return await this.agent.follow(subjectDid); - } + }; public unfollow = async (followUri: string) => { return await this.agent.deleteFollow(followUri); - } + }; public block = async (subjectDid: string) => { - return await this.agent.app.bsky.graph.block.create({ - repo: this.me.did, - collection: "app.bsky.graph.block", - }, - { - subject: subjectDid, - createdAt: new Date().toISOString(), - }) - } + return await this.agent.app.bsky.graph.block.create( + { + repo: this.me.did, + collection: "app.bsky.graph.block", + }, + { + subject: subjectDid, + createdAt: new Date().toISOString(), + }, + ); + }; public unblock = async (blockUri: string) => { // TODO: unblock is not working. Need to fix it. - const {rkey} = new AtUri(blockUri) + const { rkey } = new AtUri(blockUri); return await this.agent.app.bsky.graph.block.delete({ repo: this.me.did, collection: "app.bsky.graph.block", rkey, }); - } + }; } diff --git a/src/lib/bskyHelpers.ts b/src/lib/bskyHelpers.ts index f2778f9..6a16267 100644 --- a/src/lib/bskyHelpers.ts +++ b/src/lib/bskyHelpers.ts @@ -1,53 +1,76 @@ -import type { ProfileView } from "@atproto/api/dist/client/types/app/bsky/actor/defs" -import { BSKY_USER_MATCH_TYPE } from "./constants" +import type { ProfileView } from "@atproto/api/dist/client/types/app/bsky/actor/defs"; +import { BSKY_USER_MATCH_TYPE } from "./constants"; type Names = { - accountName: string, - accountNameRemoveUnderscore: string, - displayName: string, -} + accountName: string; + accountNameRemoveUnderscore: string; + displayName: string; +}; -export const isSimilarUser = (names: Names, bskyProfile: ProfileView | undefined): { - isSimilar: boolean, - type: typeof BSKY_USER_MATCH_TYPE[keyof typeof BSKY_USER_MATCH_TYPE], +export const isSimilarUser = ( + names: Names, + bskyProfile: ProfileView | undefined, +): { + isSimilar: boolean; + type: (typeof BSKY_USER_MATCH_TYPE)[keyof typeof BSKY_USER_MATCH_TYPE]; } => { if (!bskyProfile) { return { isSimilar: false, type: BSKY_USER_MATCH_TYPE.NONE, - } + }; } - const lowerCaseNames = Object.entries(names).reduce((acc, [key, value]) => { - acc[key] = value.toLowerCase(); - return acc; - }, {} as Names); + const lowerCaseNames = Object.entries(names).reduce( + (acc, [key, value]) => { + acc[key] = value.toLowerCase(); + return acc; + }, + {} as Names, + ); - const bskyHandle = bskyProfile.handle.toLocaleLowerCase().replace("@", "").split('.')[0]; + const bskyHandle = bskyProfile.handle + .toLocaleLowerCase() + .replace("@", "") + .split(".")[0]; - if (lowerCaseNames.accountName === bskyHandle || lowerCaseNames.accountNameRemoveUnderscore === bskyHandle) { + if ( + lowerCaseNames.accountName === bskyHandle || + lowerCaseNames.accountNameRemoveUnderscore === bskyHandle + ) { return { isSimilar: true, type: BSKY_USER_MATCH_TYPE.HANDLE, - } + }; } - if (lowerCaseNames.displayName === bskyProfile.displayName?.toLocaleLowerCase()) { + if ( + lowerCaseNames.displayName === bskyProfile.displayName?.toLocaleLowerCase() + ) { return { isSimilar: true, type: BSKY_USER_MATCH_TYPE.DISPLAY_NAME, - } + }; } - if (bskyProfile.description?.toLocaleLowerCase().includes(`@${lowerCaseNames.accountName}`) && !['pfp ', 'pfp: ', 'pfp by '].some(t => bskyProfile.description.toLocaleLowerCase().includes(`${t}@${lowerCaseNames.accountName}`))) { + if ( + bskyProfile.description + ?.toLocaleLowerCase() + .includes(`@${lowerCaseNames.accountName}`) && + !["pfp ", "pfp: ", "pfp by "].some((t) => + bskyProfile.description + .toLocaleLowerCase() + .includes(`${t}@${lowerCaseNames.accountName}`), + ) + ) { return { isSimilar: true, type: BSKY_USER_MATCH_TYPE.DESCRIPTION, - } + }; } return { isSimilar: false, type: BSKY_USER_MATCH_TYPE.NONE, - } -} + }; +}; diff --git a/src/lib/bskyServiceWorkerClient.ts b/src/lib/bskyServiceWorkerClient.ts index 8957b0e..97c816c 100644 --- a/src/lib/bskyServiceWorkerClient.ts +++ b/src/lib/bskyServiceWorkerClient.ts @@ -3,13 +3,12 @@ import { sendToBackground } from "@plasmohq/messaging"; export type BskyLoginParams = { identifier: string; password: string; -} +}; export class BskyServiceWorkerClient { - private session = {} + private session = {}; - private constructor() { - } + private constructor() {} public static async createAgent({ identifier, @@ -21,11 +20,11 @@ export class BskyServiceWorkerClient { body: { identifier, password, - } - }) - if(error) throw new Error(error.message) + }, + }); + if (error) throw new Error(error.message); - client.session = session + client.session = session; return client; } @@ -42,9 +41,9 @@ export class BskyServiceWorkerClient { session: this.session, term, limit, - } - }) - if(error) throw new Error(error.message) + }, + }); + if (error) throw new Error(error.message); return actors; }; @@ -54,39 +53,39 @@ export class BskyServiceWorkerClient { name: "follow", body: { session: this.session, - subjectDid - } - }) - if(error) throw new Error(error.message) + subjectDid, + }, + }); + if (error) throw new Error(error.message); return result; - } + }; public unfollow = async (followUri: string) => { const { result, error } = await sendToBackground({ name: "unfollow", body: { session: this.session, - followUri - } - }) - if(error) throw new Error(error.message) + followUri, + }, + }); + if (error) throw new Error(error.message); return result; - } + }; public block = async (subjectDid: string) => { const { result, error } = await sendToBackground({ name: "block", body: { session: this.session, - subjectDid - } - }) - if(error) throw new Error(error.message) + subjectDid, + }, + }); + if (error) throw new Error(error.message); return result; - } + }; public unblock = async (blockUri: string) => { // TODO: unblock is not working. Need to fix it. @@ -94,11 +93,11 @@ export class BskyServiceWorkerClient { name: "unblock", body: { session: this.session, - blockUri - } - }) - if(error) throw new Error(error.message) + blockUri, + }, + }); + if (error) throw new Error(error.message); return result; - } + }; } diff --git a/src/lib/components/BskyUserCell.ts b/src/lib/components/BskyUserCell.ts index 9e71d83..b434777 100644 --- a/src/lib/components/BskyUserCell.ts +++ b/src/lib/components/BskyUserCell.ts @@ -1,110 +1,145 @@ -import type { ProfileView, ViewerState } from "@atproto/api/dist/client/types/app/bsky/actor/defs" -import { P, match } from "ts-pattern" -import van from 'vanjs-core' -import { BSKY_USER_MATCH_TYPE } from "~lib/constants" +import type { + ProfileView, + ViewerState, +} from "@atproto/api/dist/client/types/app/bsky/actor/defs"; +import { P, match } from "ts-pattern"; +import van from "vanjs-core"; +import { BSKY_USER_MATCH_TYPE } from "~lib/constants"; - -const { a, div, p, img, button, span } = van.tags -const { svg, path } = van.tagsNS("http://www.w3.org/2000/svg") +const { a, div, p, img, button, span } = van.tags; +const { svg, path } = van.tagsNS("http://www.w3.org/2000/svg"); export type UserCellBtnLabel = { - add: string, - remove: string, - progressive: string, -} + add: string; + remove: string; + progressive: string; +}; -const ActionButton = ({ statusKey, profile, btnLabel, addAction, removeAction }: { - profile: ProfileView, - statusKey: keyof ViewerState, - btnLabel: UserCellBtnLabel, - addAction: () => Promise, - removeAction: () => Promise +const ActionButton = ({ + statusKey, + profile, + btnLabel, + addAction, + removeAction, +}: { + profile: ProfileView; + statusKey: keyof ViewerState; + btnLabel: UserCellBtnLabel; + addAction: () => Promise; + removeAction: () => Promise; }) => { - const label = van.state(`${profile.viewer[statusKey] ? btnLabel.progressive : btnLabel.add} on Bluesky`) + const label = van.state( + `${ + profile.viewer[statusKey] ? btnLabel.progressive : btnLabel.add + } on Bluesky`, + ); - const isStateOfBeing = van.state(profile.viewer[statusKey]) - const isProcessing = van.state(false) - const isJustApplied = van.state(false) + const isStateOfBeing = van.state(profile.viewer[statusKey]); + const isProcessing = van.state(false); + const isJustApplied = van.state(false); - const beingClass = van.derive(() => isStateOfBeing.val ? "action-button__being" : "") - const processingClass = van.derive(() => isProcessing.val ? "action-button__processing" : "") - const justAppliedClass = van.derive(() => isJustApplied.val ? "action-button__just-applied" : "") + const beingClass = van.derive(() => + isStateOfBeing.val ? "action-button__being" : "", + ); + const processingClass = van.derive(() => + isProcessing.val ? "action-button__processing" : "", + ); + const justAppliedClass = van.derive(() => + isJustApplied.val ? "action-button__just-applied" : "", + ); const onClick = async () => { - if (isProcessing.val) return - isProcessing.val = true - label.val = "Processing..." + if (isProcessing.val) return; + isProcessing.val = true; + label.val = "Processing..."; if (isStateOfBeing.val) { - await removeAction() - label.val = `${btnLabel.add} on Bluesky` - isStateOfBeing.val = false + await removeAction(); + label.val = `${btnLabel.add} on Bluesky`; + isStateOfBeing.val = false; } else { - await addAction() - label.val = `${btnLabel.progressive} on Bluesky` - isStateOfBeing.val = true - isJustApplied.val = true + await addAction(); + label.val = `${btnLabel.progressive} on Bluesky`; + isStateOfBeing.val = true; + isJustApplied.val = true; } - isProcessing.val = false - } + isProcessing.val = false; + }; const onMouseover = () => { - if ( - isProcessing.val || - isJustApplied.val || - !isStateOfBeing.val - ) return + if (isProcessing.val || isJustApplied.val || !isStateOfBeing.val) return; - label.val = `${btnLabel.remove} on Bluesky` - } + label.val = `${btnLabel.remove} on Bluesky`; + }; const onMouseout = () => { if (isJustApplied.val) { - isJustApplied.val = false + isJustApplied.val = false; } - if (!isStateOfBeing.val) return + if (!isStateOfBeing.val) return; - label.val = `${btnLabel.progressive} on Bluesky` - } + label.val = `${btnLabel.progressive} on Bluesky`; + }; - return button({ - class: () => `action-button ${beingClass.val} ${processingClass.val} ${justAppliedClass.val}`, - onclick: onClick, - onmouseover: onMouseover, - onmouseout: onMouseout, - }, + return button( + { + class: () => + `action-button ${beingClass.val} ${processingClass.val} ${justAppliedClass.val}`, + onclick: onClick, + onmouseover: onMouseover, + onmouseout: onMouseout, + }, () => label.val, - ) -} + ); +}; const Avatar = ({ avatar }: { avatar?: string }) => { - return avatar ? img({ src: avatar, width: "40" }) : div({ class: "no-avatar" }) -} + return avatar + ? img({ src: avatar, width: "40" }) + : div({ class: "no-avatar" }); +}; -const MatchTypeLabel = ({ matchType }: { matchType: typeof BSKY_USER_MATCH_TYPE[keyof typeof BSKY_USER_MATCH_TYPE] }) => { +const MatchTypeLabel = ({ + matchType, +}: { + matchType: (typeof BSKY_USER_MATCH_TYPE)[keyof typeof BSKY_USER_MATCH_TYPE]; +}) => { const [text, labelClass] = match(matchType) - .with( - BSKY_USER_MATCH_TYPE.HANDLE, - () => ["Same handle name", "match-type__handle"] - ) - .with( - BSKY_USER_MATCH_TYPE.DISPLAY_NAME, - () => ["Same display name", "match-type__display-name"] - ) - .with( - BSKY_USER_MATCH_TYPE.DESCRIPTION, - () => ["Included handle name in description", "match-type__description"] - ) - .run() + .with(BSKY_USER_MATCH_TYPE.HANDLE, () => [ + "Same handle name", + "match-type__handle", + ]) + .with(BSKY_USER_MATCH_TYPE.DISPLAY_NAME, () => [ + "Same display name", + "match-type__display-name", + ]) + .with(BSKY_USER_MATCH_TYPE.DESCRIPTION, () => [ + "Included handle name in description", + "match-type__description", + ]) + .run(); - return div({ class: `match-type ${labelClass}` }, - svg({ fill: "none", width: "12", viewBox: "0 0 24 24", "stroke-width": "3", stroke: "currentColor", class: "w-6 h-6" }, - path({ "stroke-linecap": "round", "stroke-linejoin": "round", "d": "M4.5 12.75l6 6 9-13.5" }), + return div( + { class: `match-type ${labelClass}` }, + svg( + { + fill: "none", + width: "12", + viewBox: "0 0 24 24", + "stroke-width": "3", + stroke: "currentColor", + class: "w-6 h-6", + }, + path({ + "stroke-linecap": "round", + "stroke-linejoin": "round", + d: "M4.5 12.75l6 6 9-13.5", + }), ), - text - ) -} + text, + ); +}; export const BskyUserCell = ({ profile, @@ -114,32 +149,46 @@ export const BskyUserCell = ({ addAction, removeAction, }: { - profile: ProfileView, - statusKey: keyof ViewerState, - btnLabel: UserCellBtnLabel, - matchType: typeof BSKY_USER_MATCH_TYPE[keyof typeof BSKY_USER_MATCH_TYPE], - addAction: () => Promise, - removeAction: () => Promise + profile: ProfileView; + statusKey: keyof ViewerState; + btnLabel: UserCellBtnLabel; + matchType: (typeof BSKY_USER_MATCH_TYPE)[keyof typeof BSKY_USER_MATCH_TYPE]; + addAction: () => Promise; + removeAction: () => Promise; }) => { - return div({ class: "bsky-user-content-wrapper" }, + return div( + { class: "bsky-user-content-wrapper" }, MatchTypeLabel({ matchType }), - div({ class: "bsky-user-content bsky-fade-in" }, - div({ class: "icon-section" }, - a({ href: `https://bsky.app/profile/${profile.handle}`, target: "_blank", rel: "noopener" }, + div( + { class: "bsky-user-content bsky-fade-in" }, + div( + { class: "icon-section" }, + a( + { + href: `https://bsky.app/profile/${profile.handle}`, + target: "_blank", + rel: "noopener", + }, Avatar({ avatar: profile.avatar }), ), ), - div({ class: "content" }, - div({ class: "name-and-controller" }, + div( + { class: "content" }, + div( + { class: "name-and-controller" }, div( - p({ class: "display-name" }, - a({ href: `https://bsky.app/profile/${profile.handle}`, target: "_blank", rel: "noopener" }, + p( + { class: "display-name" }, + a( + { + href: `https://bsky.app/profile/${profile.handle}`, + target: "_blank", + rel: "noopener", + }, profile.displayName ?? profile.handle, ), ), - p({ class: "handle" }, - `@${profile.handle}`, - ), + p({ class: "handle" }, `@${profile.handle}`), ), div( ActionButton({ @@ -148,10 +197,13 @@ export const BskyUserCell = ({ btnLabel, addAction, removeAction, - }) + }), ), ), - profile.description ? p({ class: "description" }, profile.description) : "", + profile.description + ? p({ class: "description" }, profile.description) + : "", ), - )) -} + ), + ); +}; diff --git a/src/lib/components/NotFoundCell.ts b/src/lib/components/NotFoundCell.ts index 2d1e747..1607d00 100644 --- a/src/lib/components/NotFoundCell.ts +++ b/src/lib/components/NotFoundCell.ts @@ -1,30 +1,35 @@ +import van from "vanjs-core"; -import van from "vanjs-core" +const { div, p } = van.tags; +const { svg, path } = van.tagsNS("http://www.w3.org/2000/svg"); -const { div, p } = van.tags -const { svg, path } = van.tagsNS("http://www.w3.org/2000/svg") - -const WarningIcon = () => svg( - { - fill: "none", - "stroke-width": "1.5", - stroke: "currentColor", - class: "w-6 h-6", - viewBox: "0 0 24 24" - }, - path({ - "stroke-linecap": "round", - "stroke-linejoin": "round", - d: "M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" - }), -) - -export const NotFoundCell = () => div({ class: "bsky-user-content-wrapper" }, - div({ class: "bsky-user-content bsky-user-content__not-found bsky-fade-in" }, - WarningIcon(), - p({ - class: "not-found" +const WarningIcon = () => + svg( + { + fill: "none", + "stroke-width": "1.5", + stroke: "currentColor", + class: "w-6 h-6", + viewBox: "0 0 24 24", }, - "No similar users found." - ) - )) + path({ + "stroke-linecap": "round", + "stroke-linejoin": "round", + d: "M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z", + }), + ); + +export const NotFoundCell = () => + div( + { class: "bsky-user-content-wrapper" }, + div( + { class: "bsky-user-content bsky-user-content__not-found bsky-fade-in" }, + WarningIcon(), + p( + { + class: "not-found", + }, + "No similar users found.", + ), + ), + ); diff --git a/src/lib/components/ReloadBtn.ts b/src/lib/components/ReloadBtn.ts index 646b312..3b248bf 100644 --- a/src/lib/components/ReloadBtn.ts +++ b/src/lib/components/ReloadBtn.ts @@ -1,19 +1,24 @@ -import van from "vanjs-core" +import van from "vanjs-core"; -const { button, div } = van.tags +const { button, div } = van.tags; -export const ReloadButton = ({clickAction}: {clickAction: () => void}) => { - const deleted = van.state(false) +export const ReloadButton = ({ clickAction }: { clickAction: () => void }) => { + const deleted = van.state(false); - return () => deleted.val ? null : div({ class: "bsky-reload-btn-wrapper" }, - button( - { - class: "bsky-reload-btn bsky-fade-in", - onclick: () => { - clickAction() - deleted.val = true - } - }, - "Find More" - )) -} + return () => + deleted.val + ? null + : div( + { class: "bsky-reload-btn-wrapper" }, + button( + { + class: "bsky-reload-btn bsky-fade-in", + onclick: () => { + clickAction(); + deleted.val = true; + }, + }, + "Find More", + ), + ); +}; diff --git a/src/lib/constants.ts b/src/lib/constants.ts index 5d4c43e..65efe1a 100644 --- a/src/lib/constants.ts +++ b/src/lib/constants.ts @@ -1,37 +1,37 @@ export const MESSAGE_NAMES = { SEARCH_BSKY_USER_ON_FOLLOW_PAGE: "search_bsky_user_on_follow_page", - SEARCH_BSKY_USER_ON_LIST_MEMBERS_PAGE: "search_bsky_user_on_list_members_page", + SEARCH_BSKY_USER_ON_LIST_MEMBERS_PAGE: + "search_bsky_user_on_list_members_page", SEARCH_BSKY_USER_ON_BLOCK_PAGE: "search_bsky_user_on_block_page", -} +}; -const STORAGE_PREFIX = "sky_follower_bridge_storage" +const STORAGE_PREFIX = "sky_follower_bridge_storage"; export const STORAGE_KEYS = { BSKY_USER_ID: `${STORAGE_PREFIX}_bsky_password`, BSKY_PASSWORD: `${STORAGE_PREFIX}_bsky_user`, -} as const +} as const; export const TARGET_URLS_REGEX = { FOLLOW: /https:\/\/(twitter|x)\.com\/[^/]+\/(verified_follow|follow)/, LIST: /^https:\/\/(twitter|x)\.com\/[^/]+\/lists\/[^/]+\/members/, BLOCK: /^https:\/\/(twitter|x)\.com\/settings\/blocked/, -} as const +} as const; export const MESSAGE_TYPE = { ERROR: "error", SUCCESS: "success", -} as const +} as const; export const VIEWER_STATE = { BLOCKING: "blocking", FOLLOWING: "following", -} as const - +} as const; export const BSKY_USER_MATCH_TYPE = { HANDLE: "handle", DISPLAY_NAME: "display_name", DESCRIPTION: "description", NONE: "none", -} as const +} as const; -export const MAX_RELOAD_COUNT = 1 +export const MAX_RELOAD_COUNT = 1; diff --git a/src/lib/domHelpers.ts b/src/lib/domHelpers.ts index b8b1270..aafc12a 100644 --- a/src/lib/domHelpers.ts +++ b/src/lib/domHelpers.ts @@ -1,67 +1,91 @@ -import type { ProfileView, ViewerState } from "@atproto/api/dist/client/types/app/bsky/actor/defs" -import van from "vanjs-core" -import { ReloadButton } from "./components/ReloadBtn" -import { NotFoundCell } from "./components/NotFoundCell" -import { BskyUserCell, type UserCellBtnLabel } from "./components/BskyUserCell" -import type { BSKY_USER_MATCH_TYPE } from "./constants" +import type { + ProfileView, + ViewerState, +} from "@atproto/api/dist/client/types/app/bsky/actor/defs"; +import van from "vanjs-core"; +import { BskyUserCell, type UserCellBtnLabel } from "./components/BskyUserCell"; +import { NotFoundCell } from "./components/NotFoundCell"; +import { ReloadButton } from "./components/ReloadBtn"; +import type { BSKY_USER_MATCH_TYPE } from "./constants"; -export const getUserCells = ({ queryParam, filterInsertedElement }: { queryParam: string, filterInsertedElement: boolean }) => { +export const getUserCells = ({ + queryParam, + filterInsertedElement, +}: { queryParam: string; filterInsertedElement: boolean }) => { const userCells = document.querySelectorAll(queryParam); // filter out already inserted elements if (filterInsertedElement) { return Array.from(userCells).filter((userCell) => { - const nextElement = userCell.nextElementSibling - if (!nextElement) { return true } - return nextElement.classList.contains("bsky-user-content-wrapper") === false - }) - } else { - return Array.from(userCells) + const nextElement = userCell.nextElementSibling; + if (!nextElement) { + return true; + } + return ( + nextElement.classList.contains("bsky-user-content-wrapper") === false + ); + }); } -} + return Array.from(userCells); +}; export const insertReloadEl = (clickAction: () => void) => { - const lastInsertedEl = Array.from(document.querySelectorAll('.bsky-user-content')).at(-1) - van.add(lastInsertedEl.parentElement, ReloadButton({clickAction})) -} + const lastInsertedEl = Array.from( + document.querySelectorAll(".bsky-user-content"), + ).at(-1); + van.add(lastInsertedEl.parentElement, ReloadButton({ clickAction })); +}; export const removeReloadEl = () => { - const reloadEl = document.querySelectorAll('.bsky-reload-btn-wrapper') - reloadEl.forEach(el => el.remove()) -} + const reloadEl = document.querySelectorAll(".bsky-reload-btn-wrapper"); + for (const el of reloadEl) { + el.remove(); + } +}; export const getAccountNameAndDisplayName = (userCell: Element) => { - const [avatarEl, displayNameEl] = userCell?.querySelectorAll("a") - const twAccountName = avatarEl?.getAttribute("href")?.replace("/", "") - const twAccountNameRemoveUnderscore = twAccountName.replaceAll("_", "") // bsky does not allow underscores in handle, so remove them. - const twDisplayName = displayNameEl?.textContent - return { twAccountName, twDisplayName, twAccountNameRemoveUnderscore } -} + const [avatarEl, displayNameEl] = userCell.querySelectorAll("a"); + const twAccountName = avatarEl?.getAttribute("href")?.replace("/", ""); + const twAccountNameRemoveUnderscore = twAccountName.replaceAll("_", ""); // bsky does not allow underscores in handle, so remove them. + const twDisplayName = displayNameEl?.textContent; + return { twAccountName, twDisplayName, twAccountNameRemoveUnderscore }; +}; -export const insertBskyProfileEl = ({ dom, profile, statusKey, btnLabel, matchType, addAction, removeAction }: { - dom: Element, - profile: ProfileView, - statusKey: keyof ViewerState, - btnLabel: UserCellBtnLabel, - matchType: typeof BSKY_USER_MATCH_TYPE[keyof typeof BSKY_USER_MATCH_TYPE], - addAction: () => Promise, - removeAction: () => Promise +export const insertBskyProfileEl = ({ + dom, + profile, + statusKey, + btnLabel, + matchType, + addAction, + removeAction, +}: { + dom: Element; + profile: ProfileView; + statusKey: keyof ViewerState; + btnLabel: UserCellBtnLabel; + matchType: (typeof BSKY_USER_MATCH_TYPE)[keyof typeof BSKY_USER_MATCH_TYPE]; + addAction: () => Promise; + removeAction: () => Promise; }) => { - van.add(dom.parentElement, BskyUserCell({ - profile, - statusKey, - btnLabel, - matchType, - addAction, - removeAction, - })) -} + van.add( + dom.parentElement, + BskyUserCell({ + profile, + statusKey, + btnLabel, + matchType, + addAction, + removeAction, + }), + ); +}; export const insertNotFoundEl = (dom: Element) => { - van.add(dom.parentElement, NotFoundCell()) -} + van.add(dom.parentElement, NotFoundCell()); +}; export const isOutOfTopViewport = (el: Element) => { const rect = el.getBoundingClientRect(); - return rect.top < 0 -} + return rect.top < 0; +}; diff --git a/src/lib/searchAndInsertBskyUsers.ts b/src/lib/searchAndInsertBskyUsers.ts index dbc6ece..d9aac66 100644 --- a/src/lib/searchAndInsertBskyUsers.ts +++ b/src/lib/searchAndInsertBskyUsers.ts @@ -1,92 +1,98 @@ -import { isOutOfTopViewport, removeReloadEl } from './domHelpers'; -import { getAccountNameAndDisplayName, getUserCells, insertBskyProfileEl, insertNotFoundEl, insertReloadEl } from "~lib/domHelpers"; +import type { ViewerState } from "@atproto/api/dist/client/types/app/bsky/actor/defs"; import { isSimilarUser } from "~lib/bskyHelpers"; +import { + getAccountNameAndDisplayName, + getUserCells, + insertBskyProfileEl, + insertNotFoundEl, + insertReloadEl, +} from "~lib/domHelpers"; import { debugLog, isOneSymbol } from "~lib/utils"; -import type { BskyClient } from './bskyClient'; -import type { ViewerState } from '@atproto/api/dist/client/types/app/bsky/actor/defs'; -import type { UserCellBtnLabel } from './components/BskyUserCell'; -import type { BskyServiceWorkerClient } from './bskyServiceWorkerClient'; +import type { BskyClient } from "./bskyClient"; +import type { BskyServiceWorkerClient } from "./bskyServiceWorkerClient"; +import type { UserCellBtnLabel } from "./components/BskyUserCell"; +import { isOutOfTopViewport, removeReloadEl } from "./domHelpers"; +const notFoundUserCache = new Set(); -const notFoundUserCache = new Set() +const bskyUserUrlMap = new Map(); -const bskyUserUrlMap = new Map() - -export const searchAndInsertBskyUsers = async ( - { - agent, - btnLabel, - userCellQueryParam, - statusKey, - addQuery, - removeQuery, - }: { - agent: BskyServiceWorkerClient | BskyClient, - userCellQueryParam: string, - btnLabel: UserCellBtnLabel, - statusKey: keyof ViewerState, - addQuery: (arg: string) => Promise, - removeQuery: (arg: string) => Promise, - }) => { - - removeReloadEl() +export const searchAndInsertBskyUsers = async ({ + agent, + btnLabel, + userCellQueryParam, + statusKey, + addQuery, + removeQuery, +}: { + agent: BskyServiceWorkerClient | BskyClient; + userCellQueryParam: string; + btnLabel: UserCellBtnLabel; + statusKey: keyof ViewerState; + // biome-ignore lint: + addQuery: (arg: string) => Promise; + // biome-ignore lint: + removeQuery: (arg: string) => Promise; +}) => { + removeReloadEl(); const userCells = getUserCells({ queryParam: userCellQueryParam, filterInsertedElement: true, - }) - debugLog(`userCells length: ${userCells.length}`) + }); + debugLog(`userCells length: ${userCells.length}`); - let index = 0 + let index = 0; // loop over twitter user profile cells and search and insert bsky user for (const userCell of userCells) { if (isOutOfTopViewport(userCell)) { - continue + continue; } - const { twAccountName, twDisplayName, twAccountNameRemoveUnderscore } = getAccountNameAndDisplayName(userCell) + const { twAccountName, twDisplayName, twAccountNameRemoveUnderscore } = + getAccountNameAndDisplayName(userCell); if (notFoundUserCache.has(twAccountName)) { - insertNotFoundEl(userCell) - continue + insertNotFoundEl(userCell); + continue; } - const searchTerms = [ - twAccountNameRemoveUnderscore, - twDisplayName, - ] + const searchTerms = [twAccountNameRemoveUnderscore, twDisplayName]; - let targetAccount = null - let matchType = null + let targetAccount = null; + let matchType = null; // Loop over search parameters and break if a user is found searchLoop: for (const term of searchTerms) { // one symbol is not a valid search term for bsky if (!term || isOneSymbol(term)) { - continue + continue; } try { const searchResults = await agent.searchUser({ term: term, limit: 3, - }) + }); for (const searchResult of searchResults) { - const { isSimilar: isUserFound, type } = isSimilarUser({ - accountName: twAccountName, - accountNameRemoveUnderscore: twAccountNameRemoveUnderscore, - displayName: twDisplayName, - }, searchResult) + const { isSimilar: isUserFound, type } = isSimilarUser( + { + accountName: twAccountName, + accountNameRemoveUnderscore: twAccountNameRemoveUnderscore, + displayName: twDisplayName, + }, + searchResult, + ); if (isUserFound) { - targetAccount = searchResult - matchType = type + targetAccount = searchResult; + matchType = type; break searchLoop; // Stop searching when a user is found } } } catch (e) { - console.error(e) + console.error(e); } } @@ -100,7 +106,7 @@ export const searchAndInsertBskyUsers = async ( matchType, addAction: async () => { const result = await addQuery(targetAccount.did); - bskyUserUrlMap.set(targetAccount.did, result.uri) + bskyUserUrlMap.set(targetAccount.did, result.uri); }, removeAction: async () => { if (targetAccount?.viewer?.following) { @@ -109,16 +115,16 @@ export const searchAndInsertBskyUsers = async ( await removeQuery(bskyUserUrlMap.get(targetAccount.did)); } }, - }) + }); } else { - insertNotFoundEl(userCell) - notFoundUserCache.add(twAccountName) + insertNotFoundEl(userCell); + notFoundUserCache.add(twAccountName); } - index++ + index++; if (process.env.NODE_ENV === "development" && index > 5) { - break + break; } } @@ -131,6 +137,6 @@ export const searchAndInsertBskyUsers = async ( statusKey, addQuery, removeQuery, - }) - }) -} + }); + }); +}; diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 2a89352..b56db16 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -1,9 +1,9 @@ export const debugLog = (message: string) => { - if(process.env.NODE_ENV === "development") { - console.log(`🔷 [Sky Follower Bridge] ${message}`) + if (process.env.NODE_ENV === "development") { + console.log(`🔷 [Sky Follower Bridge] ${message}`); } -} +}; export const isOneSymbol = (str: string) => { return /^[^\w\s]$/.test(str); -} +}; diff --git a/src/popup.tsx b/src/popup.tsx index a6fe0d2..a202fa8 100644 --- a/src/popup.tsx +++ b/src/popup.tsx @@ -1,252 +1,264 @@ -import { type FormEvent, useState, useEffect } from "react" -import { P, match } from "ts-pattern" - -import "./style.css" - -import { sendToContentScript } from "@plasmohq/messaging" - -import { - MAX_RELOAD_COUNT, - MESSAGE_NAMES, - MESSAGE_TYPE, - STORAGE_KEYS, - TARGET_URLS_REGEX -} from "~lib/constants" - -function IndexPopup() { - const [isLoading, setIsLoading] = useState(false) - const [password, setPassword] = useState("") - const [userId, setUserId] = useState("") - const [reloadCount, setReloadCount] = useState(0) - const [message, setMessage] = useState(null) - const isDisabled = !password || !userId || isLoading - const isShowErrorMessage = message?.type === MESSAGE_TYPE.ERROR - const isShowSuccessMessage = message?.type === MESSAGE_TYPE.SUCCESS - - const setErrorMessage = (message: string) => { - setMessage({ type: MESSAGE_TYPE.ERROR, message }) - } - - const reloadActiveTab = async () => { - const [{ id: tabId }] = await chrome.tabs.query({ - active: true, - currentWindow: true - }) - await chrome.tabs.reload(tabId) - } - - const saveCredentialsToStorage = () => { - chrome.storage.local.set({ - [STORAGE_KEYS.BSKY_PASSWORD]: password, - [STORAGE_KEYS.BSKY_USER_ID]: userId - }) - } - - const loadCredentialsFromStorage = async () => { - chrome.storage.local.get( - [STORAGE_KEYS.BSKY_PASSWORD, STORAGE_KEYS.BSKY_USER_ID], - (result) => { - setPassword(result[STORAGE_KEYS.BSKY_PASSWORD] || "") - setUserId(result[STORAGE_KEYS.BSKY_USER_ID] || "") - } - ) - } - - const searchBskyUser = async (e?: FormEvent) => { - if(e) { - e.preventDefault() - } - saveCredentialsToStorage() - - const [{ url: currentUrl }] = await chrome.tabs.query({ - active: true, - currentWindow: true - }) - - if (!Object.values(TARGET_URLS_REGEX).some((r) => r.test(currentUrl))) { - setErrorMessage( - "Error: Invalid page. please open the Twitter following or blocking page." - ) - return - } - - const messageName = match(currentUrl) - .with( - P.when((url) => TARGET_URLS_REGEX.FOLLOW.test(url)), - () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_FOLLOW_PAGE - ) - .with( - P.when((url) => TARGET_URLS_REGEX.BLOCK.test(url)), - () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_BLOCK_PAGE - ) - .with( - P.when((url) => TARGET_URLS_REGEX.LIST.test(url)), - () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_LIST_MEMBERS_PAGE - ) - .run() - - setMessage(null) - setIsLoading(true) - - try { - const res: { hasError: boolean; message: string } = - await sendToContentScript({ - name: messageName, - body: { - password, - userId - } - }) - if (res.hasError) { - setErrorMessage(res.message) - } else { - setMessage({ - type: MESSAGE_TYPE.SUCCESS, - message: "Completed. Try again if no results found.”" - }) - } - } catch (e) { - if(e.message && e.message.includes("Could not establish connection") && reloadCount < MAX_RELOAD_COUNT) { - setReloadCount((prev) => prev + 1) - await reloadActiveTab() - await new Promise(r => setTimeout(r, 3000)) - await searchBskyUser() - } else { - setErrorMessage( - "Error: Something went wrong. Please reload the web page and try again." - ) - console.error(e) - } - } finally { - setIsLoading(false) - } - } - - useEffect(() => { - loadCredentialsFromStorage() - }, []) - - return ( -
-

- - - - - - - Sky Follower Bridge -

-
- - - - {isShowErrorMessage && ( -
- - - - {message.message} -
- )} - {isShowSuccessMessage && ( -
- - - - Success. Try again if no results found. -
- )} -
-
- ) -} - -export default IndexPopup +import { type FormEvent, useEffect, useState } from "react"; +import { P, match } from "ts-pattern"; + +import "./style.css"; + +import { sendToContentScript } from "@plasmohq/messaging"; + +import { + MAX_RELOAD_COUNT, + MESSAGE_NAMES, + MESSAGE_TYPE, + STORAGE_KEYS, + TARGET_URLS_REGEX, +} from "~lib/constants"; + +function IndexPopup() { + const [isLoading, setIsLoading] = useState(false); + const [password, setPassword] = useState(""); + const [userId, setUserId] = useState(""); + const [reloadCount, setReloadCount] = useState(0); + const [message, setMessage] = useState(null); + const isDisabled = !password || !userId || isLoading; + const isShowErrorMessage = message?.type === MESSAGE_TYPE.ERROR; + const isShowSuccessMessage = message?.type === MESSAGE_TYPE.SUCCESS; + + const setErrorMessage = (message: string) => { + setMessage({ type: MESSAGE_TYPE.ERROR, message }); + }; + + const reloadActiveTab = async () => { + const [{ id: tabId }] = await chrome.tabs.query({ + active: true, + currentWindow: true, + }); + await chrome.tabs.reload(tabId); + }; + + const saveCredentialsToStorage = () => { + chrome.storage.local.set({ + [STORAGE_KEYS.BSKY_PASSWORD]: password, + [STORAGE_KEYS.BSKY_USER_ID]: userId, + }); + }; + + const loadCredentialsFromStorage = async () => { + chrome.storage.local.get( + [STORAGE_KEYS.BSKY_PASSWORD, STORAGE_KEYS.BSKY_USER_ID], + (result) => { + setPassword(result[STORAGE_KEYS.BSKY_PASSWORD] || ""); + setUserId(result[STORAGE_KEYS.BSKY_USER_ID] || ""); + }, + ); + }; + + const searchBskyUser = async (e?: FormEvent) => { + if (e) { + e.preventDefault(); + } + saveCredentialsToStorage(); + + const [{ url: currentUrl }] = await chrome.tabs.query({ + active: true, + currentWindow: true, + }); + + if (!Object.values(TARGET_URLS_REGEX).some((r) => r.test(currentUrl))) { + setErrorMessage( + "Error: Invalid page. please open the Twitter following or blocking page.", + ); + return; + } + + const messageName = match(currentUrl) + .with( + P.when((url) => TARGET_URLS_REGEX.FOLLOW.test(url)), + () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_FOLLOW_PAGE, + ) + .with( + P.when((url) => TARGET_URLS_REGEX.BLOCK.test(url)), + () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_BLOCK_PAGE, + ) + .with( + P.when((url) => TARGET_URLS_REGEX.LIST.test(url)), + () => MESSAGE_NAMES.SEARCH_BSKY_USER_ON_LIST_MEMBERS_PAGE, + ) + .run(); + + setMessage(null); + setIsLoading(true); + + try { + const res: { hasError: boolean; message: string } = + await sendToContentScript({ + name: messageName, + body: { + password, + userId, + }, + }); + if (res.hasError) { + setErrorMessage(res.message); + } else { + setMessage({ + type: MESSAGE_TYPE.SUCCESS, + message: "Completed. Try again if no results found.”", + }); + } + } catch (e) { + if ( + e.message?.includes("Could not establish connection") && + reloadCount < MAX_RELOAD_COUNT + ) { + setReloadCount((prev) => prev + 1); + await reloadActiveTab(); + await new Promise((r) => setTimeout(r, 3000)); + await searchBskyUser(); + } else { + setErrorMessage( + "Error: Something went wrong. Please reload the web page and try again.", + ); + console.error(e); + } + } finally { + setIsLoading(false); + } + }; + + useEffect(() => { + loadCredentialsFromStorage(); + }, [loadCredentialsFromStorage]); + + return ( +
+

+ + + + + + + Sky Follower Bridge +

+
+ + + + {isShowErrorMessage && ( +
+ + + + {message.message} +
+ )} + {isShowSuccessMessage && ( +
+ + + + Success. Try again if no results found. +
+ )} +
+
+ ); +} + +export default IndexPopup;