Support daily and weekly visit limit (#336)

Time limit related functions

.vscode/settings.json

@@ -34,6 +34,7 @@
         "selectchanged",
         "sheepzh",
         "Treemap",
+        "Vnode",
         "vueuse",
         "webcomponents",
         "webstore",

package.json

@@ -81,4 +81,4 @@
     "engines": {
         "node": ">=20"
     }
-}
+}

src/api/chrome/common.ts

@@ -1,8 +1,10 @@
-export function handleError(scene: string) {
+export function handleError(scene: string): string {
     try {
         const lastError = chrome.runtime.lastError
         lastError && console.log(`Errored when ${scene}: ${lastError.message}`)
+        return lastError?.message
     } catch (e) {
         console.info("Can't execute here")
     }
+    return null
 }

src/api/chrome/tab.ts

@@ -78,14 +78,14 @@ export function listTabs(query?: chrome.tabs.QueryInfo): Promise<ChromeTab[]> {
     }))
 }
 
-export function sendMsg2Tab<T = any, R = any>(tabId: number, code: timer.mq.ReqCode, data: T): Promise<R> {
+export function sendMsg2Tab<T = any, R = any>(tabId: number, code: timer.mq.ReqCode, data?: T): Promise<R> {
     const request: timer.mq.Request<T> = { code, data }
     return new Promise((resolve, reject) => {
         chrome.tabs.sendMessage<timer.mq.Request<T>, timer.mq.Response>(tabId, request, response => {
-            handleError('sendMsg2Tab')
+            const sendError = handleError('sendMsg2Tab')
             const resCode = response?.code
             resCode === 'success' && resolve(response.data)
-            resCode === "fail" && reject(new Error(response?.msg))
+            reject(new Error(response?.msg ?? sendError ?? 'Unknown error'))
         })
     })
 }

src/background/content-script-handler.ts

@@ -8,7 +8,6 @@
 import { createTab } from "@api/chrome/tab"
 import { ANALYSIS_ROUTE, LIMIT_ROUTE } from "@app/router/constants"
 import whitelistHolder from "@service/components/whitelist-holder"
-import itemService from "@service/item-service"
 import limitService from "@service/limit-service"
 import optionService from "@service/option-service"
 import { getAppPageUrl } from "@util/constant/url"
@@ -44,26 +43,13 @@ const handleOpenLimitPage = (sender: ChromeMessageSender) => {
  */
 export default function init(dispatcher: MessageDispatcher) {
     dispatcher
-        // Increase the visit time
-        .register<string | { host: string, url: string }, void>('cs.incVisitCount', async (param) => {
-            let host: string, url: string = undefined
-            if (typeof param === 'string') {
-                host = param
-            } else {
-                host = param?.host
-                url = param?.url
-            }
-            itemService.addOneTime(host, url)
-        })
         // Judge is in whitelist
         .register<{ host?: string, url?: string }, boolean>('cs.isInWhitelist', ({ host, url } = {}) => whitelistHolder.contains(host, url))
         // Need to print the information of today
         .register<void, boolean>('cs.printTodayInfo', async () => {
             const option = await optionService.getAllOption()
             return !!option.printInConsole
         })
-        // Get today info
-        .register<string, timer.core.Result>('cs.getTodayInfo', host => itemService.getResult(host, new Date()))
         // cs.getLimitedRules
         .register<string, timer.limit.Item[]>('cs.getLimitedRules', url => limitService.getLimited(url))
         .register<string, timer.limit.Item[]>('cs.getRelatedRules', url => limitService.getRelated(url))

src/background/limit-processor.ts

@@ -65,8 +65,12 @@ const processAskHitVisit = async (item: timer.limit.Item) => {
     tabs = tabs?.filter(({ url }) => matches(item?.cond, url))
     const { visitTime = 0 } = item || {}
     for (const { id } of tabs) {
-        const tabFocus = await sendMsg2Tab(id, "askVisitTime", undefined)
-        if (tabFocus && tabFocus > visitTime * MILL_PER_SECOND) return true
+        try {
+            const tabFocus = await sendMsg2Tab(id, "askVisitTime")
+            if (tabFocus && tabFocus > visitTime * MILL_PER_SECOND) return true
+        } catch {
+            // Ignored
+        }
     }
     return false
 }

src/background/timer/server.ts

@@ -26,7 +26,7 @@ async function handleTime(host: string, url: string, dateRange: [number, number]
     return focusTime
 }
 
-async function handleEvent(event: timer.core.Event, sender: ChromeMessageSender): Promise<void> {
+async function handleTrackTimeEvent(event: timer.core.Event, sender: ChromeMessageSender): Promise<void> {
     const { url, start, end, ignoreTabCheck } = event
     const windowId = sender?.tab?.windowId
     const tabId = sender?.tab?.id
@@ -58,6 +58,24 @@ async function sendLimitedMessage(items: timer.limit.Item[]) {
     )
 }
 
+async function handleVisit(host: string, url: string) {
+    await itemService.addOneTime(host, url)
+    const metLimits = await limitService.incVisit(host, url)
+    // If time limited after this operation, send messages
+    metLimits?.length && sendLimitedMessage(metLimits)
+}
+
+async function handleIncVisitEvent(param: { host: string, url: string }): Promise<void> {
+    const { host, url } = param || {}
+    const { protocol } = extractHostname(url) || {}
+    if (protocol === "file" && !option.countLocalFiles) return
+    await handleVisit(host, url)
+
+}
+
 export default function initTrackServer(messageDispatcher: MessageDispatcher) {
-    messageDispatcher.register<timer.core.Event, void>('cs.trackTime', handleEvent)
+    messageDispatcher
+        .register<timer.core.Event, void>('cs.trackTime', handleTrackTimeEvent)
+        .register<{ host: string, url: string }, void>('cs.incVisitCount', handleIncVisitEvent)
+        .register<string, timer.core.Result>('cs.getTodayInfo', host => itemService.getResult(host, new Date()))
 }

src/content-script/index.ts

@@ -54,13 +54,14 @@ async function main() {
     const isWhitelist = await sendMsg2Runtime('cs.isInWhitelist', { host, url })
     if (isWhitelist) return
 
-    sendMsg2Runtime('cs.incVisitCount', { host, url })
-
     await initLocale()
     const needPrintInfo = await sendMsg2Runtime('cs.printTodayInfo')
     !!needPrintInfo && printInfo(host)
     injectPolyfill()
-    processLimit(url)
+    await processLimit(url)
+
+    // Increase visit count at the end
+    await sendMsg2Runtime('cs.incVisitCount', { host, url })
 }
 
 main()

src/content-script/limit/common.ts

@@ -1,9 +1,8 @@
 export type LimitReason =
     & Required<Pick<timer.limit.Rule, 'id' | 'cond'>>
-    & Pick<timer.limit.Item, 'allowDelay'>
-    & Partial<Pick<timer.limit.Item, 'delayCount'>>
+    & Partial<Pick<timer.limit.Item, 'delayCount' | 'allowDelay'>>
     & {
-        type: LimitType
+        type: timer.limit.ReasonType
         getVisitTime?: () => number
     }
 
@@ -16,16 +15,10 @@ export function isSameReason(a: LimitReason, b: LimitReason): boolean {
     return true
 }
 
-export type LimitType =
-    | "DAILY"
-    | "WEEKLY"
-    | "VISIT"
-    | "PERIOD"
-
 export interface MaskModal {
     addReason(...reasons: LimitReason[]): void
     removeReason(...reasons: LimitReason[]): void
-    removeReasonsByType(...types: LimitType[]): void
+    removeReasonsByType(...types: timer.limit.ReasonType[]): void
     addDelayHandler(handler: () => void): void
 }
 

src/content-script/limit/modal/Main.tsx

@@ -1,27 +1,12 @@
-import { useRequest, useWindowVisible } from "@hooks"
-import limitService from "@service/limit-service"
-import { defineComponent, watch } from "vue"
+import { defineComponent } from "vue"
 import Alert from "./components/Alert"
 import Footer from "./components/Footer"
 import Reason from "./components/Reason"
-import { provideRule, useReason } from "./context"
+import { provideRule } from "./context"
 import "./style"
 
 const _default = defineComponent(() => {
-    const reason = useReason()
-    const windowVisible = useWindowVisible()
-
-    const { data: rule, refresh } = useRequest(async () => {
-        if (!windowVisible.value) return null
-        const reasonId = reason.value?.id
-        if (!reasonId) return null
-        const rules = await limitService.select({ id: reasonId, filterDisabled: false })
-        return rules?.[0]
-    })
-
-    provideRule(rule)
-
-    watch([reason, windowVisible], refresh)
+    provideRule()
 
     return () => (
         <div id="app">

src/content-script/limit/modal/components/Footer.tsx

@@ -1,17 +1,15 @@
 import { sendMsg2Runtime } from "@api/chrome/runtime"
 import Trend from "@app/Layout/icons/Trend"
 import { judgeVerificationRequired, processVerification } from "@app/util/limit"
-import { type LimitType } from "@cs/limit/common"
 import { TAG_NAME } from "@cs/limit/element"
 import { t } from "@cs/locale"
 import { Plus, Timer } from "@element-plus/icons-vue"
 import optionService from "@service/option-service"
+import { meetTimeLimit } from "@util/limit"
 import { ElButton } from "element-plus"
 import { computed, defineComponent } from "vue"
 import { useDelayHandler, useReason, useRule } from "../context"
 
-const DELAY_ENABLED: LimitType[] = ['DAILY', 'VISIT', 'WEEKLY']
-
 async function handleMore5Minutes(rule: timer.limit.Item, callback: () => void) {
     let promise: Promise<void> = undefined
     const ele = document.querySelector(TAG_NAME).shadowRoot.querySelector('body')
@@ -27,9 +25,25 @@ async function handleMore5Minutes(rule: timer.limit.Item, callback: () => void)
 const _default = defineComponent(() => {
     const reason = useReason()
     const rule = useRule()
-    const allowDelay = computed(() => {
-        const { type, allowDelay } = reason.value || {}
-        return DELAY_ENABLED.includes(type) && allowDelay
+    const showDelay = computed(() => {
+        const { type, allowDelay, delayCount } = reason.value || {}
+        if (!allowDelay) return false
+
+        const { time, weekly, visit, waste, weeklyWaste } = rule.value || {}
+        let realLimit = 0, realWaste = 0
+        if (type === 'DAILY') {
+            realLimit = time
+            realWaste = waste
+        } else if (type === 'WEEKLY') {
+            realLimit = weekly
+            realWaste = weeklyWaste
+        } else if (type === 'VISIT') {
+            realLimit = visit
+            realWaste = reason.value?.getVisitTime?.()
+        } else {
+            return false
+        }
+        return meetTimeLimit(realLimit, realWaste, allowDelay, delayCount)
     })
 
     const delayHandler = useDelayHandler()
@@ -45,7 +59,7 @@ const _default = defineComponent(() => {
                 {t(msg => msg.menu.siteAnalysis)}
             </ElButton>
             <ElButton
-                v-show={allowDelay.value}
+                v-show={showDelay.value}
                 type="primary"
                 round
                 icon={<Plus />}