From aa795e2731b2deee1471cb2a54fd6fe9f22565ed Mon Sep 17 00:00:00 2001 From: Gabe Yuan Date: Thu, 31 Aug 2023 00:18:57 +0800 Subject: [PATCH] dev...... --- src/apis/index.js | 13 +--- src/config/index.js | 2 +- src/hooks/ColorMode.js | 2 +- src/hooks/Rules.js | 38 +--------- src/hooks/Setting.js | 34 +-------- src/hooks/Storage.js | 80 -------------------- src/hooks/SubRules.js | 72 +++++++++++++----- src/hooks/Sync.js | 11 --- src/hooks/Translate.js | 2 +- src/libs/auth.js | 12 +-- src/libs/browser.js | 18 ----- src/libs/index.js | 15 ++++ src/libs/rules.js | 30 +------- src/libs/storage.js | 48 +----------- src/libs/subRules.js | 18 ++++- src/libs/sync.js | 32 +++----- src/libs/translator.js | 5 +- src/userscript.js | 9 ++- src/views/Options/Rules.js | 125 ++++++++++++++----------------- src/views/Options/Setting.js | 69 ++++++++--------- src/views/Options/SyncSetting.js | 42 +++++------ 21 files changed, 228 insertions(+), 449 deletions(-) diff --git a/src/apis/index.js b/src/apis/index.js index 5dc43a7..53483d6 100644 --- a/src/apis/index.js +++ b/src/apis/index.js @@ -1,7 +1,6 @@ import queryString from "query-string"; import { fetchPolyfill } from "../libs/fetch"; import { - GLOBAL_KEY, OPT_TRANS_GOOGLE, OPT_TRANS_MICROSOFT, OPT_TRANS_OPENAI, @@ -11,9 +10,8 @@ import { PROMPT_PLACE_TO, KV_SALT_SYNC, } from "../config"; -import { detectLang } from "../libs/browser"; +import { detectLang } from "../libs"; import { sha256 } from "../libs/utils"; -import { checkRules } from "../libs/rules"; /** * 同步数据 @@ -39,13 +37,8 @@ export const apiSyncData = async (url, key, data, isBg = false) => * @param {*} isBg * @returns */ -export const apiFetchRules = async (url, isBg = false) => { - const res = await fetchPolyfill(url, { isBg }); - const rules = checkRules(res).filter( - (rule) => rule.pattern.replaceAll(GLOBAL_KEY, "") !== "" - ); - return rules; -}; +export const apiFetchRules = (url, isBg = false) => + fetchPolyfill(url, { isBg }); /** * 谷歌翻译 diff --git a/src/config/index.js b/src/config/index.js index 023da41..b8fb956 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -159,7 +159,7 @@ export const DEFAULT_SUBRULES_LIST = [ selected: true, }, { - url: "https://fishjar.github.io/kiss-translator/kiss-translator-rules.json", + url: process.env.REACT_APP_RULESURL2, selected: false, }, ]; diff --git a/src/hooks/ColorMode.js b/src/hooks/ColorMode.js index 1dc90f1..1ffbb0c 100644 --- a/src/hooks/ColorMode.js +++ b/src/hooks/ColorMode.js @@ -13,7 +13,7 @@ export function useDarkMode() { const toggleDarkMode = useCallback(async () => { await updateSetting({ darkMode: !darkMode }); - }, [darkMode]); + }, [darkMode, updateSetting]); return { darkMode, toggleDarkMode }; } diff --git a/src/hooks/Rules.js b/src/hooks/Rules.js index 5396518..6a794f0 100644 --- a/src/hooks/Rules.js +++ b/src/hooks/Rules.js @@ -23,7 +23,7 @@ export function useRules() { await updateSync({ rulesUpdateAt: updateAt }); trySyncRules(); }, - [rulesUpdateAt] + [rulesUpdateAt, save, updateSync] ); const add = useCallback( @@ -87,39 +87,3 @@ export function useRules() { return { list, add, del, put, merge }; } - -// /** -// * 订阅规则 -// * @returns -// */ -// export function useSubrules() { -// const setting = useSetting(); -// const updateSetting = useSettingUpdate(); -// const list = setting?.subrulesList || DEFAULT_SUBRULES_LIST; - -// const select = async (url) => { -// const subrulesList = [...list]; -// subrulesList.forEach((item) => { -// if (item.url === url) { -// item.selected = true; -// } else { -// item.selected = false; -// } -// }); -// await updateSetting({ subrulesList }); -// }; - -// const add = async (url) => { -// const subrulesList = [...list]; -// subrulesList.push({ url }); -// await updateSetting({ subrulesList }); -// }; - -// const del = async (url) => { -// let subrulesList = [...list]; -// subrulesList = subrulesList.filter((item) => item.url !== url); -// await updateSetting({ subrulesList }); -// }; - -// return { list, select, add, del }; -// } diff --git a/src/hooks/Setting.js b/src/hooks/Setting.js index 3abfd07..6a07b88 100644 --- a/src/hooks/Setting.js +++ b/src/hooks/Setting.js @@ -23,7 +23,7 @@ export function SettingProvider({ children }) { await updateSync({ settingUpdateAt: updateAt }); trySyncSetting(); }, - [settingUpdateAt] + [settingUpdateAt, update, updateSync] ); return ( @@ -45,35 +45,3 @@ export function SettingProvider({ children }) { export function useSetting() { return useContext(SettingContext); } - -// export function useSetting() { -// const [setting,setSeting]= useState(null); -// useEffect(()=>{ -// (async ()=>{ -// const -// })() -// },[]) -// } - -// /** -// * 设置hook -// * @returns -// */ -// export function useSetting() { -// const storages = useStorages(); -// return storages?.[STOKEY_SETTING]; -// } - -// /** -// * 更新设置 -// * @returns -// */ -// export function useSettingUpdate() { -// const sync = useSync(); -// return async (obj) => { -// const updateAt = sync.opt?.settingUpdateAt ? Date.now() : 0; -// await storage.putObj(STOKEY_SETTING, obj); -// await sync.update({ settingUpdateAt: updateAt }); -// trySyncSetting(); -// }; -// } diff --git a/src/hooks/Storage.js b/src/hooks/Storage.js index 5c5f6f6..a4ed757 100644 --- a/src/hooks/Storage.js +++ b/src/hooks/Storage.js @@ -33,83 +33,3 @@ export function useStorage(key, defaultVal = null) { return { data, save, update, remove }; } - -// /** -// * 默认配置 -// */ -// export const defaultStorage = { -// [STOKEY_SETTING]: DEFAULT_SETTING, -// [STOKEY_RULES]: DEFAULT_RULES, -// [STOKEY_SYNC]: DEFAULT_SYNC, -// }; - -// const activeKeys = Object.keys(defaultStorage); - -// const StoragesContext = createContext(null); - -// export function StoragesProvider({ children }) { -// const [storages, setStorages] = useState(null); - -// const handleChanged = (changes) => { -// if (isWeb || isGm) { -// const { key, oldValue, newValue } = changes; -// changes = { -// [key]: { -// oldValue, -// newValue, -// }, -// }; -// } -// const newStorages = {}; -// Object.entries(changes) -// .filter( -// ([key, { oldValue, newValue }]) => -// activeKeys.includes(key) && oldValue !== newValue -// ) -// .forEach(([key, { newValue }]) => { -// newStorages[key] = JSON.parse(newValue); -// }); -// if (Object.keys(newStorages).length !== 0) { -// setStorages((pre) => ({ ...pre, ...newStorages })); -// } -// }; - -// useEffect(() => { -// // 首次从storage同步配置到内存 -// (async () => { -// const curStorages = {}; -// for (const key of activeKeys) { -// const val = await storage.get(key); -// if (val) { -// curStorages[key] = JSON.parse(val); -// } else { -// await storage.setObj(key, defaultStorage[key]); -// curStorages[key] = defaultStorage[key]; -// } -// } -// setStorages(curStorages); -// })(); - -// // 监听storage，并同步到内存中 -// storage.onChanged(handleChanged); - -// // 解除监听 -// return () => { -// if (isExt) { -// browser.storage.onChanged.removeListener(handleChanged); -// } else { -// window.removeEventListener("storage", handleChanged); -// } -// }; -// }, []); - -// return ( -// -// {children} -// -// ); -// } - -// export function useStorages() { -// return useContext(StoragesContext); -// } diff --git a/src/hooks/SubRules.js b/src/hooks/SubRules.js index 982a5b3..8bc5012 100644 --- a/src/hooks/SubRules.js +++ b/src/hooks/SubRules.js @@ -1,47 +1,81 @@ import { DEFAULT_SUBRULES_LIST } from "../config"; import { useSetting } from "./Setting"; -import { useCallback } from "react"; +import { useCallback, useEffect, useMemo, useState } from "react"; +import { loadOrFetchSubRules } from "../libs/subRules"; +import { delSubRules } from "../libs/storage"; /** * 订阅规则 * @returns */ export function useSubRules() { - const { data: setting, update: updateSetting } = useSetting(); - const list = setting?.subRulesList || DEFAULT_SUBRULES_LIST; + const [loading, setLoading] = useState(false); + const [selectedRules, setSelectedRules] = useState([]); + const { setting, updateSetting } = useSetting(); + const list = setting?.subrulesList || DEFAULT_SUBRULES_LIST; - const select = useCallback( + const selectedSub = useMemo(() => list.find((item) => item.selected), [list]); + const selectedUrl = selectedSub.url; + + const selectSub = useCallback( async (url) => { - const subRulesList = [...list]; - subRulesList.forEach((item) => { + const subrulesList = [...list]; + subrulesList.forEach((item) => { if (item.url === url) { item.selected = true; } else { item.selected = false; } }); - await updateSetting({ subRulesList }); + await updateSetting({ subrulesList }); }, - [list] + [list, updateSetting] ); - const add = useCallback( + const addSub = useCallback( async (url) => { - const subRulesList = [...list]; - subRulesList.push({ url, selected: false }); - await updateSetting({ subRulesList }); + const subrulesList = [...list]; + subrulesList.push({ url, selected: false }); + await updateSetting({ subrulesList }); }, - [list] + [list, updateSetting] ); - const del = useCallback( + const delSub = useCallback( async (url) => { - let subRulesList = [...list]; - subRulesList = subRulesList.filter((item) => item.url !== url); - await updateSetting({ subRulesList }); + let subrulesList = [...list]; + subrulesList = subrulesList.filter((item) => item.url !== url); + await updateSetting({ subrulesList }); + await delSubRules(url); }, - [list] + [list, updateSetting] ); - return { list, select, add, del }; + useEffect(() => { + (async () => { + if (selectedUrl) { + try { + setLoading(true); + const rules = await loadOrFetchSubRules(selectedUrl); + setSelectedRules(rules); + } catch (err) { + console.log("[loadOrFetchSubRules]", err); + } finally { + setLoading(false); + } + } + })(); + }, [selectedUrl]); + + return { + subList: list, + selectSub, + addSub, + delSub, + selectedSub, + selectedUrl, + selectedRules, + setSelectedRules, + loading, + }; } diff --git a/src/hooks/Sync.js b/src/hooks/Sync.js index af85bcd..9cec0a8 100644 --- a/src/hooks/Sync.js +++ b/src/hooks/Sync.js @@ -9,14 +9,3 @@ export function useSync() { const { data, update } = useStorage(STOKEY_SYNC, DEFAULT_SYNC); return { sync: data, updateSync: update }; } -// export function useSync() { -// const storages = useStorages(); -// const opt = storages?.[STOKEY_SYNC]; -// const update = useCallback(async (obj) => { -// await storage.putObj(STOKEY_SYNC, obj); -// }, []); -// return { -// opt, -// update, -// }; -// } diff --git a/src/hooks/Translate.js b/src/hooks/Translate.js index 6a76d71..6e54f58 100644 --- a/src/hooks/Translate.js +++ b/src/hooks/Translate.js @@ -1,6 +1,6 @@ import { useEffect } from "react"; import { useState } from "react"; -import { detectLang } from "../libs/browser"; +import { detectLang } from "../libs"; import { apiTranslate } from "../apis"; /** diff --git a/src/libs/auth.js b/src/libs/auth.js index 8661076..72b17c5 100644 --- a/src/libs/auth.js +++ b/src/libs/auth.js @@ -1,5 +1,5 @@ -import storage from "./storage"; -import { STOKEY_MSAUTH, URL_MICROSOFT_AUTH } from "../config"; +import { getMsauth, setMsauth } from "./storage"; +import { URL_MICROSOFT_AUTH } from "../config"; import { fetchData } from "./fetch"; const parseMSToken = (token) => { @@ -26,9 +26,9 @@ const _msAuth = () => { } // 查询storage缓存 - const res = (await storage.getObj(STOKEY_MSAUTH)) || {}; - token = res.token; - exp = res.exp; + const res = await getMsauth(); + token = res?.token; + exp = res?.exp; if (token && exp * 1000 > now + 1000) { return [token, exp]; } @@ -36,7 +36,7 @@ const _msAuth = () => { // 缓存没有或失效，查询接口 token = await fetchData(URL_MICROSOFT_AUTH); exp = parseMSToken(token); - await storage.setObj(STOKEY_MSAUTH, { token, exp }); + await setMsauth({ token, exp }); return [token, exp]; }; }; diff --git a/src/libs/browser.js b/src/libs/browser.js index db3f0cd..f2c86a2 100644 --- a/src/libs/browser.js +++ b/src/libs/browser.js @@ -13,21 +13,3 @@ function _browser() { } export const browser = _browser(); -// export const client = process.env.REACT_APP_CLIENT; -// export const isExt = CLIENT_EXTS.includes(client); -// export const isGm = client === CLIENT_USERSCRIPT; -// export const isWeb = client === CLIENT_WEB; - -/** - * 本地语言识别 - * @param {*} q - * @returns - */ -export const detectLang = async (q) => { - try { - const res = await browser?.i18n?.detectLanguage(q); - return res?.languages?.[0]?.language; - } catch (err) { - console.log("[detect lang]", err); - } -}; diff --git a/src/libs/index.js b/src/libs/index.js index 78e6355..126eaca 100644 --- a/src/libs/index.js +++ b/src/libs/index.js @@ -1,4 +1,5 @@ import { CACHE_NAME } from "../config"; +import { browser } from "./browser"; /** * 清除缓存数据 @@ -10,3 +11,17 @@ export const tryClearCaches = async () => { console.log("[clean caches]", err.message); } }; + +/** + * 本地语言识别 + * @param {*} q + * @returns + */ +export const detectLang = async (q) => { + try { + const res = await browser?.i18n?.detectLanguage(q); + return res?.languages?.[0]?.language; + } catch (err) { + console.log("[detect lang]", err); + } +}; diff --git a/src/libs/rules.js b/src/libs/rules.js index b8b4c89..69a149e 100644 --- a/src/libs/rules.js +++ b/src/libs/rules.js @@ -1,12 +1,3 @@ -import { - getSyncWithDefault, - updateSync, - getSubRulesWithDefault, - getSubRules, - delSubRules, - setSubRules, -} from "./storage"; -import { fetchPolyfill } from "./fetch"; import { matchValue, type, isMatch } from "./utils"; import { GLOBAL_KEY, @@ -17,8 +8,7 @@ import { GLOBLA_RULE, DEFAULT_SUBRULES_LIST, } from "../config"; - -// import { syncOpt } from "./sync"; +import { loadOrFetchSubRules } from "./subRules"; /** * 根据href匹配规则 @@ -36,7 +26,7 @@ export const matchRule = async ( try { const selectedSub = subrulesList.find((item) => item.selected); if (selectedSub?.url) { - const subRules = await loadSubRules(selectedSub.url); + const subRules = await loadOrFetchSubRules(selectedSub.url); rules.splice(-1, 0, ...subRules); } } catch (err) { @@ -123,19 +113,3 @@ export const checkRules = (rules) => { return rules; }; - -// /** -// * 订阅规则的本地缓存 -// */ -// export const rulesCache = { -// fetch: async (url, isBg = false) => { -// const res = await fetchPolyfill(url, { isBg }); -// const rules = checkRules(res).filter( -// (rule) => rule.pattern.replaceAll(GLOBAL_KEY, "") !== "" -// ); -// return rules; -// }, -// set: (url, rules) => setSubRules(url, rules), -// get: (url) => getSubRulesWithDefault(url), -// del: (url) => delSubRules(url), -// }; diff --git a/src/libs/storage.js b/src/libs/storage.js index 7a1dae1..b6aacae 100644 --- a/src/libs/storage.js +++ b/src/libs/storage.js @@ -10,32 +10,16 @@ import { DEFAULT_SYNC, BUILTIN_RULES, } from "../config"; -import { browser, isExt, isGm } from "./client"; -// import { APP_NAME } from "../config/app"; +import { isExt, isGm } from "./client"; +import { browser } from "./browser"; async function set(key, val) { if (isExt) { await browser.storage.local.set({ [key]: val }); } else if (isGm) { - // const oldValue = await (window.KISS_GM || GM).getValue(key); await (window.KISS_GM || GM).setValue(key, val); - // window.dispatchEvent( - // new StorageEvent("storage", { - // key, - // oldValue, - // newValue: val, - // }) - // ); } else { - // const oldValue = window.localStorage.getItem(key); window.localStorage.setItem(key, val); - // window.dispatchEvent( - // new StorageEvent("storage", { - // key, - // oldValue, - // newValue: val, - // }) - // ); } } @@ -54,25 +38,9 @@ async function del(key) { if (isExt) { await browser.storage.local.remove([key]); } else if (isGm) { - // const oldValue = await (window.KISS_GM || GM).getValue(key); await (window.KISS_GM || GM).deleteValue(key); - // window.dispatchEvent( - // new StorageEvent("storage", { - // key, - // oldValue, - // newValue: null, - // }) - // ); } else { - // const oldValue = window.localStorage.getItem(key); window.localStorage.removeItem(key); - // window.dispatchEvent( - // new StorageEvent("storage", { - // key, - // oldValue, - // newValue: null, - // }) - // ); } } @@ -96,18 +64,6 @@ async function putObj(key, obj) { await setObj(key, { ...cur, ...obj }); } -// /** -// * 监听storage事件 -// * @param {*} handleChanged -// */ -// function onChanged(handleChanged) { -// if (isExt) { -// browser.storage.onChanged.addListener(handleChanged); -// } else { -// window.addEventListener("storage", handleChanged); -// } -// } - /** * 对storage的封装 */ diff --git a/src/libs/subRules.js b/src/libs/subRules.js index e6deb1b..80c0d2e 100644 --- a/src/libs/subRules.js +++ b/src/libs/subRules.js @@ -1,5 +1,12 @@ -import { getSyncWithDefault, updateSync } from "./storage"; +import { GLOBAL_KEY } from "../config"; +import { + getSyncWithDefault, + updateSync, + setSubRules, + getSubRules, +} from "./storage"; import { apiFetchRules } from "../apis"; +import { checkRules } from "./rules"; /** * 同步订阅规则 @@ -7,9 +14,12 @@ import { apiFetchRules } from "../apis"; * @returns */ export const syncSubRules = async (url, isBg = false) => { - const rules = await apiFetchRules(url, isBg); + const res = await apiFetchRules(url, isBg); + const rules = checkRules(res).filter( + (rule) => rule.pattern.replaceAll(GLOBAL_KEY, "") !== "" + ); if (rules.length > 0) { - await rulesCache.set(url, rules); + await setSubRules(url, rules); } return rules; }; @@ -54,7 +64,7 @@ export const trySyncAllSubRules = async ({ subrulesList }, isBg = false) => { * @returns */ export const loadOrFetchSubRules = async (url) => { - const rules = await apiFetchRules(url); + const rules = await getSubRules(url); if (rules?.length) { return rules; } diff --git a/src/libs/sync.js b/src/libs/sync.js index f21af0f..4404aab 100644 --- a/src/libs/sync.js +++ b/src/libs/sync.js @@ -1,28 +1,20 @@ import { - STOKEY_SYNC, - DEFAULT_SYNC, KV_SETTING_KEY, KV_RULES_KEY, KV_RULES_SHARE_KEY, - STOKEY_SETTING, - STOKEY_RULES, KV_SALT_SHARE, } from "../config"; -import { storage, getSyncWithDefault, updateSync } from "../libs/storage"; -import { getSetting, getRules } from "."; +import { + getSyncWithDefault, + updateSync, + getSettingWithDefault, + getRulesWithDefault, + setSetting, + setRules, +} from "./storage"; import { apiSyncData } from "../apis"; import { sha256 } from "./utils"; -// /** -// * 同步相关数据 -// */ -// export const syncOpt = { -// load: async () => (await storage.getObj(STOKEY_SYNC)) || DEFAULT_SYNC, -// update: async (obj) => { -// await storage.putObj(STOKEY_SYNC, obj); -// }, -// }; - /** * 同步设置 * @returns @@ -33,7 +25,7 @@ const syncSetting = async (isBg = false) => { return; } - const setting = await getSetting(); + const setting = await getSettingWithDefault(); const res = await apiSyncData( syncUrl, syncKey, @@ -50,7 +42,7 @@ const syncSetting = async (isBg = false) => { settingUpdateAt: res.updateAt, settingSyncAt: res.updateAt, }); - await storage.setObj(STOKEY_SETTING, res.value); + await setSetting(res.value); } else { await updateSync({ settingSyncAt: res.updateAt }); } @@ -74,7 +66,7 @@ const syncRules = async (isBg = false) => { return; } - const rules = await getRules(); + const rules = await getRulesWithDefault(); const res = await apiSyncData( syncUrl, syncKey, @@ -91,7 +83,7 @@ const syncRules = async (isBg = false) => { rulesUpdateAt: res.updateAt, rulesSyncAt: res.updateAt, }); - await storage.setObj(STOKEY_RULES, res.value); + await setRules(res.value); } else { await updateSync({ rulesSyncAt: res.updateAt }); } diff --git a/src/libs/translator.js b/src/libs/translator.js index 1987824..397e886 100644 --- a/src/libs/translator.js +++ b/src/libs/translator.js @@ -12,7 +12,6 @@ import { import Content from "../views/Content"; import { fetchUpdate, fetchClear } from "./fetch"; import { debounce } from "./utils"; -import { isExt } from "./client"; /** * 翻译类 @@ -102,6 +101,10 @@ export class Translator { } } + get setting() { + return this._setting; + } + get rule() { // console.log("get rule", this._rule); return this._rule; diff --git a/src/userscript.js b/src/userscript.js index 5506626..ba5f062 100644 --- a/src/userscript.js +++ b/src/userscript.js @@ -3,13 +3,14 @@ import ReactDOM from "react-dom/client"; import Action from "./views/Action"; import createCache from "@emotion/cache"; import { CacheProvider } from "@emotion/react"; -import { getSetting, getRules, matchRule, getFab } from "./libs"; +import { getSettingWithDefault, getRulesWithDefault, getFabWithDefault } from "./libs/storage"; import { Translator } from "./libs/translator"; import { trySyncAllSubRules } from "./libs/subRules"; import { isGm } from "./libs/client"; import { MSG_TRANS_TOGGLE, MSG_TRANS_PUTRULE } from "./config"; import { isIframe } from "./libs/iframe"; import { handlePing, injectScript } from "./libs/gm"; +import { matchRule } from "./libs/rules"; /** * 入口函数 @@ -36,8 +37,8 @@ const init = async () => { // 翻译页面 const href = isIframe ? document.referrer : document.location.href; - const setting = await getSetting(); - const rules = await getRules(); + const setting = await getSettingWithDefault(); + const rules = await getRulesWithDefault(); const rule = await matchRule(rules, href, setting); const translator = new Translator(rule, setting); @@ -59,7 +60,7 @@ const init = async () => { } // 浮球按钮 - const fab = await getFab(); + const fab = await getFabWithDefault(); const $action = document.createElement("div"); $action.setAttribute("id", "kiss-translator"); document.body.parentElement.appendChild($action); diff --git a/src/views/Options/Rules.js b/src/views/Options/Rules.js index 1f09fad..a91109b 100644 --- a/src/views/Options/Rules.js +++ b/src/views/Options/Rules.js @@ -24,7 +24,7 @@ import MenuItem from "@mui/material/MenuItem"; import Grid from "@mui/material/Grid"; import FileDownloadIcon from "@mui/icons-material/FileDownload"; import FileUploadIcon from "@mui/icons-material/FileUpload"; -import { useSetting, useSettingUpdate } from "../../hooks/Setting"; +import { useSetting } from "../../hooks/Setting"; import FormControlLabel from "@mui/material/FormControlLabel"; import Switch from "@mui/material/Switch"; import Tabs from "@mui/material/Tabs"; @@ -35,11 +35,13 @@ import DeleteIcon from "@mui/icons-material/Delete"; import IconButton from "@mui/material/IconButton"; import ShareIcon from "@mui/icons-material/Share"; import SyncIcon from "@mui/icons-material/Sync"; -import { useSubrules } from "../../hooks/Rules"; -import { rulesCache, loadSubRules, syncSubRules } from "../../libs/rules"; +import { useSubRules } from "../../hooks/SubRules"; +import { syncSubRules } from "../../libs/subRules"; +import { loadOrFetchSubRules } from "../../libs/subRules"; import { useAlert } from "../../hooks/Alert"; -import { syncOpt, syncShareRules } from "../../libs/sync"; +import { syncShareRules } from "../../libs/sync"; import { debounce } from "../../libs/utils"; +import { delSubRules, getSyncWithDefault } from "../../libs/storage"; function RuleFields({ rule, rules, setShow, setKeyword }) { const initFormValues = rule || { ...DEFAULT_RULE, transOpen: "true" }; @@ -409,12 +411,12 @@ function UploadButton({ onChange, text }) { ); } -function ShareButton({ rules, injectRules, selectedSub }) { +function ShareButton({ rules, injectRules, selectedUrl }) { const alert = useAlert(); const i18n = useI18n(); const handleClick = async () => { try { - const { syncUrl, syncKey } = await syncOpt.load(); + const { syncUrl, syncKey } = await getSyncWithDefault(); if (!syncUrl || !syncKey) { alert.warning(i18n("error_sync_setting")); return; @@ -422,7 +424,7 @@ function ShareButton({ rules, injectRules, selectedSub }) { const shareRules = [...rules.list]; if (injectRules) { - const subRules = await loadSubRules(selectedSub?.url); + const subRules = await loadOrFetchSubRules(selectedUrl); shareRules.splice(-1, 0, ...subRules); } @@ -451,19 +453,15 @@ function ShareButton({ rules, injectRules, selectedSub }) { ); } -function UserRules() { +function UserRules({ subRules }) { const i18n = useI18n(); const rules = useRules(); const [showAdd, setShowAdd] = useState(false); - const setting = useSetting(); - const updateSetting = useSettingUpdate(); - const subrules = useSubrules(); - const [subRules, setSubRules] = useState([]); + const { setting, updateSetting } = useSetting(); const [keyword, setKeyword] = useState(""); - const selectedSub = subrules.list.find((item) => item.selected); - const injectRules = !!setting?.injectRules; + const { selectedUrl, selectedRules } = subRules; const handleImport = (e) => { const file = e.target.files[0]; @@ -493,19 +491,6 @@ function UserRules() { }); }; - useEffect(() => { - (async () => { - if (selectedSub?.url) { - try { - const rules = await loadSubRules(selectedSub?.url); - setSubRules(rules); - } catch (err) { - console.log("[load rules]", err); - } - } - })(); - }, [selectedSub?.url]); - useEffect(() => { if (!showAdd) { setKeyword(""); @@ -514,7 +499,13 @@ function UserRules() { return ( - +