feat: exclude sites for whitelist (#348)

Author: sheepzh

.gitignore

@@ -1,3 +1,5 @@
+.DS_Store
+
 node_modules
 .idea
 dist*

package.json

@@ -32,15 +32,15 @@
         "@babel/plugin-transform-modules-commonjs": "^7.27.1",
         "@babel/preset-env": "^7.28.3",
         "@crowdin/crowdin-api-client": "^1.48.3",
-        "@rsdoctor/rspack-plugin": "^1.3.1",
+        "@rsdoctor/rspack-plugin": "^1.3.2",
         "@rspack/cli": "^1.5.8",
         "@rspack/core": "^1.5.8",
         "@swc/core": "^1.13.5",
         "@swc/jest": "^0.2.39",
-        "@types/chrome": "0.1.22",
+        "@types/chrome": "0.1.24",
         "@types/decompress": "^4.2.7",
         "@types/jest": "^30.0.0",
-        "@types/node": "^24.7.0",
+        "@types/node": "^24.7.2",
         "@types/punycode": "^2.1.4",
         "@vue/babel-plugin-jsx": "^2.0.1",
         "babel-loader": "^10.0.0",
@@ -54,7 +54,7 @@
         "postcss": "^8.5.6",
         "postcss-loader": "^8.2.0",
         "postcss-rtlcss": "^5.7.1",
-        "puppeteer": "^24.23.0",
+        "puppeteer": "^24.24.0",
         "sass": "^1.93.2",
         "sass-loader": "^16.0.5",
         "style-loader": "^4.0.0",

src/background/badge-manager.ts

@@ -10,7 +10,7 @@ import { listTabs } from "@api/chrome/tab"
 import { getFocusedNormalWindow } from "@api/chrome/window"
 import statDatabase from "@db/stat-database"
 import optionHolder from "@service/components/option-holder"
-import whitelistHolder from "@service/components/whitelist-holder"
+import whitelistHolder from "@service/whitelist/holder"
 import { IS_ANDROID } from "@util/constant/environment"
 import { extractHostname, isBrowserUrl } from "@util/pattern"
 import { MILL_PER_HOUR, MILL_PER_MINUTE, MILL_PER_SECOND } from "@util/time"

src/background/content-script-handler.ts

@@ -9,10 +9,10 @@ import { executeScript } from "@api/chrome/script"
 import { createTab } from "@api/chrome/tab"
 import { ANALYSIS_ROUTE, LIMIT_ROUTE } from "@app/router/constants"
 import optionHolder from "@service/components/option-holder"
-import whitelistHolder from "@service/components/whitelist-holder"
 import limitService from "@service/limit-service"
 import siteService from "@service/site-service"
 import { saveTimelineEvent } from '@service/timeline-service'
+import whitelistHolder from "@service/whitelist/holder"
 import { getAppPageUrl } from "@util/constant/url"
 import { extractFileHost, extractHostname } from "@util/pattern"
 import badgeManager from "./badge-manager"

src/background/migrator/whitelist-initializer.ts

@@ -1,9 +1,9 @@
-import whitelistService from "@service/whitelist-service"
+import whitelistService from "@service/whitelist/service"
 import { type Migrator } from "./common"
 
 export default class WhitelistInitializer implements Migrator {
     onInstall(): void {
-        whitelistService.add('localhost:*')
+        whitelistService.add('localhost:*/**')
     }
 
     onUpdate(version: string): void {

src/background/track-server.ts

@@ -1,10 +1,10 @@
 import { getTab, listTabs, sendMsg2Tab } from "@api/chrome/tab"
 import { getWindow } from "@api/chrome/window"
 import optionHolder from "@service/components/option-holder"
-import whitelistHolder from "@service/components/whitelist-holder"
 import itemService, { type ItemIncContext } from "@service/item-service"
 import limitService from "@service/limit-service"
 import periodService from "@service/period-service"
+import whitelistHolder from "@service/whitelist/holder"
 import { IS_ANDROID } from "@util/constant/environment"
 import { extractHostname } from "@util/pattern"
 import { formatTimeYMD, getStartOfDay, MILL_PER_DAY } from "@util/time"

src/i18n/message/app/whitelist-resource.json

@@ -1,15 +1,16 @@
 {
     "zh_CN": {
-        "addConfirmMsg": "{url} 加入白名单后，将不再统计该网站的数据",
+        "addConfirmMsg": "{url} 将被加入至白名单",
         "removeConfirmMsg": "{url} 将从白名单中移除",
         "duplicateMsg": "已存在白名单中",
         "infoAlertTitle": "你可以在这里配置网站白名单",
         "infoAlert0": "白名单内网站的上网时长和打开次数不会被统计",
         "infoAlert1": "白名单内网站的上网时间也不会被限制",
+        "infoAlert2": "您可以使用通配符 (*) 匹配多个站点，例如 *.example.com/**，并使用 + 作为前缀排除站点，例如 +need.example.com/**",
         "errorInput": "域名格式错误"
     },
     "zh_TW": {
-        "addConfirmMsg": "將 {url} 加入白名單後，將停止統計此網站的瀏覽資料",
+        "addConfirmMsg": "{url} 將會被加入白名單。",
         "removeConfirmMsg": "確定要將 {url} 從白名單移除嗎？",
         "duplicateMsg": "此網址已存在於白名單中",
         "infoAlertTitle": "網站白名單設定",
@@ -18,16 +19,17 @@
         "errorInput": "網域名稱格式錯誤"
     },
     "en": {
-        "addConfirmMsg": "{url} won't be counted after added into the whitelist any more.",
+        "addConfirmMsg": "{url} will be added to the whitelist.",
         "removeConfirmMsg": "{url} will be removed from the whitelist.",
         "duplicateMsg": "Duplicated",
         "infoAlertTitle": "You can whitelist sites on this page",
         "infoAlert0": "Whitelisted sites will not be counted",
         "infoAlert1": "Whitelisted sites will not be restricted",
+        "infoAlert2": "You can use a wildcards(*) to match multiple sites, such as *.example.com/**, and use + as a prefix to exclude sites, such as +need.example.com/**",
         "errorInput": "Invalid site URL"
     },
     "ja": {
-        "addConfirmMsg": "{url} がホワイトリストに追加されると、このWebサイトの統計はカウントされなくなります。",
+        "addConfirmMsg": "{url} がホワイトリストに追加されます。",
         "removeConfirmMsg": "{url} はホワイトリストから削除されます",
         "duplicateMsg": "繰り返される",
         "infoAlertTitle": "このページでサイトのホワイトリストを設定できます",
@@ -36,7 +38,7 @@
         "errorInput": "無効なURL"
     },
     "pt_PT": {
-        "addConfirmMsg": "{url} não será contabilizado após ser adicionado à lista de permissões.",
+        "addConfirmMsg": "{url} será adicionado à lista de permissões.",
         "removeConfirmMsg": "{url} será removido da lista de permissões.",
         "duplicateMsg": "Duplicado",
         "infoAlertTitle": "Pode adicionar sites à lista de permissões nesta página",
@@ -45,7 +47,7 @@
         "errorInput": "URL do site inválido"
     },
     "uk": {
-        "addConfirmMsg": "{url} не враховуватиметься після додавання до білого списку.",
+        "addConfirmMsg": "{url} буде додано до білого списку.",
         "removeConfirmMsg": "{url} буде вилучено з білого списку.",
         "duplicateMsg": "Дублікат",
         "infoAlertTitle": "На цій сторінці ви можете налаштувати білий список сайтів",
@@ -54,7 +56,7 @@
         "errorInput": "Неприпустима URL-адреса сайту"
     },
     "es": {
-        "addConfirmMsg": "{url} no se contará después de agregarlo a la lista blanca.",
+        "addConfirmMsg": "{url} se agregará a la lista blanca.",
         "removeConfirmMsg": "{url} será eliminado de la lista blanca.",
         "duplicateMsg": "Duplicado",
         "infoAlertTitle": "Puedes configurar una lista blanca de sitios en esta página",
@@ -63,7 +65,7 @@
         "errorInput": "URL del sitio inválida"
     },
     "de": {
-        "addConfirmMsg": "{url} wird nach dem Hinzufügen zur Whitelist nicht mehr gezählt.",
+        "addConfirmMsg": "{url} wird zur Whitelist hinzugefügt.",
         "removeConfirmMsg": "{url} wird von der Whitelist entfernt.",
         "duplicateMsg": "Dupliziert",
         "infoAlertTitle": "Sie können eine Whitelist vonseiten auf dieser Seite festlegen",
@@ -72,7 +74,7 @@
         "errorInput": "Ungültige Seiten-URL"
     },
     "fr": {
-        "addConfirmMsg": "{url} ne sera plus compté après avoir été ajouté à la liste blanche.",
+        "addConfirmMsg": "{url} sera ajouté à la liste blanche.",
         "removeConfirmMsg": "{url} sera supprimé de la liste blanche.",
         "duplicateMsg": "Doublon",
         "infoAlertTitle": "Vous pouvez ajouter des sites à la liste blanche sur cette page",
@@ -81,7 +83,7 @@
         "errorInput": "URL du site invalide"
     },
     "ru": {
-        "addConfirmMsg": "{url} больше не будет учитываться после добавления в белый список.",
+        "addConfirmMsg": "{url} будет добавлен в белый список.",
         "removeConfirmMsg": "{url} будет удален из белого списка.",
         "duplicateMsg": "Дублированный",
         "infoAlertTitle": "Вы можете добавить сайты в белый список на этой странице",
@@ -90,7 +92,7 @@
         "errorInput": "Неверный URL-адрес сайта"
     },
     "ar": {
-        "addConfirmMsg": "لن يتم احتساب {url} بعد إضافته إلى القائمة البيضاء بعد الآن.",
+        "addConfirmMsg": "سيتم إضافة {url} إلى القائمة البيضاء.",
         "removeConfirmMsg": "سيتم إزالة {url} من القائمة البيضاء.",
         "duplicateMsg": "مكررة",
         "infoAlertTitle": "يمكنك إضافة المواقع إلى القائمة البيضاء في هذه الصفحة",

src/i18n/message/app/whitelist.ts

@@ -14,6 +14,7 @@ export type WhitelistMessage = {
     infoAlertTitle: string
     infoAlert0: string
     infoAlert1: string
+    infoAlert2: string
     errorInput: string
 }
 

src/pages/app/components/Limit/LimitModify/Sop/Step2.tsx

@@ -9,6 +9,7 @@ import { t } from "@app/locale"
 import { Delete, WarnTriangleFilled } from "@element-plus/icons-vue"
 import { useState } from "@hooks"
 import Flex from "@pages/components/Flex"
+import { EXCLUDING_PREFIX } from '@util/constant/remain-host'
 import { cleanCond } from "@util/limit"
 import { ElButton, ElDivider, ElIcon, ElInput, ElLink, ElMessage, ElScrollbar, ElText, type ScrollbarInstance } from "element-plus"
 import { type StyleValue, defineComponent, ref } from "vue"
@@ -46,10 +47,7 @@ const _default = defineComponent(() => {
                     onKeydown={ev => (ev as KeyboardEvent)?.code === "Enter" && handleAdd()}
                     v-slots={{
                         append: () => (
-                            <ElButton
-                                onClick={handleAdd}
-                                style={{ display: 'flex' } satisfies StyleValue}
-                            >
+                            <ElButton onClick={handleAdd} style={{ display: 'flex' } satisfies StyleValue}>
                                 {t(msg => msg.button.add)}
                             </ElButton>
                         )
@@ -72,7 +70,7 @@ const _default = defineComponent(() => {
                             padding='0 20px'
                             style={{ backgroundColor: 'var(--el-fill-color)', borderRadius: 'var(--el-border-radius-large)' }}
                         >
-                            <ElText type="primary">{url}</ElText>
+                            <ElText type={url.startsWith(EXCLUDING_PREFIX) ? 'info' : 'primary'}>{url}</ElText>
                             <ElLink icon={Delete} type="danger" onClick={() => handleRemove(idx)} />
                         </Flex>
                     ))}

src/pages/app/components/Limit/LimitTest.tsx

@@ -8,48 +8,36 @@
 import { t } from "@app/locale"
 import { useState, useSwitch } from "@hooks"
 import limitService from "@service/limit-service"
-import { AlertProps, ElAlert, ElButton, ElDialog, ElFormItem, ElInput } from "element-plus"
+import { ElButton, ElDialog, ElFormItem, ElInput } from "element-plus"
 import { computed, defineComponent } from "vue"
+import AlertLines, { type AlertLinesProps } from '../common/AlertLines'
 import { type TestInstance } from "./context"
 
-function computeResultTitle(url: string | undefined, inputting: boolean, matched: timer.limit.Rule[]): string {
+function computeResult(url: string | undefined, inputting: boolean, matched: timer.limit.Rule[]): AlertLinesProps {
     if (!url) {
-        return t(msg => msg.limit.message.inputTestUrl)
+        return { type: 'info', title: msg => msg.limit.message.inputTestUrl }
     }
     if (inputting) {
-        return t(msg => msg.limit.message.clickTestButton, { buttonText: t(msg => msg.button.test) })
+        const title = t(msg => msg.limit.message.clickTestButton, { buttonText: t(msg => msg.button.test) })
+        return { type: 'info', title }
     }
     if (!matched?.length) {
-        return t(msg => msg.limit.message.noRuleMatched)
+        return { type: 'warning', title: msg => msg.limit.message.noRuleMatched }
     } else {
-        return t(msg => msg.limit.message.rulesMatched)
-    }
-}
-
-function computeResultDesc(url: string | undefined, inputting: boolean, matched: timer.limit.Rule[]): string[] {
-    if (!url || inputting || !matched?.length) {
-        return []
-    }
-    return matched.map(m => m.name)
-}
-
-type _ResultType = AlertProps['type']
-
-function computeResultType(url: string | undefined, inputting: boolean, matched: timer.limit.Rule[]): _ResultType {
-    if (!url || inputting) {
-        return 'info'
+        return {
+            type: 'success',
+            title: msg => msg.limit.message.rulesMatched,
+            lines: matched.map(m => m.name)
+        }
     }
-    return matched?.length ? 'success' : 'warning'
 }
 
 const _default = defineComponent((_props, ctx) => {
     const [url, , clearUrl] = useState<string>()
     const [matched, , clearMatched] = useState<timer.limit.Rule[]>([])
     const [visible, open, close] = useSwitch()
     const [urlInputting, startInput, endInput] = useSwitch(true)
-    const resultTitle = computed(() => computeResultTitle(url.value, urlInputting.value, matched.value))
-    const resultType = computed(() => computeResultType(url.value, urlInputting.value, matched.value))
-    const resultDesc = computed(() => computeResultDesc(url.value, urlInputting.value, matched.value))
+    const result = computed(() => computeResult(url.value, urlInputting.value, matched.value))
 
     const changeInput = (newVal?: string) => {
         startInput()
@@ -88,9 +76,7 @@ const _default = defineComponent((_props, ctx) => {
                     }}
                 />
             </ElFormItem>
-            <ElAlert closable={false} type={resultType.value} title={resultTitle.value}>
-                {resultDesc.value.map(desc => <li>{desc}</li>)}
-            </ElAlert>
+            <AlertLines {...result.value} />
         </ElDialog>
     )
 })