fix(history): fix history caching (#262)

Author: Lanfei

src/hooks/usePath.ts

@@ -11,7 +11,6 @@ import {
   recoverHistory,
   clearHistory,
   me,
-  recordHistory,
 } from "~/store"
 import {
   fsGet,
@@ -137,7 +136,6 @@ export const usePath = () => {
           ObjStore.setRelated(data.related ?? [])
           ObjStore.setRawUrl(data.raw_url)
           ObjStore.setState(State.File)
-          recordHistory(path, index)
         }
       },
       handleErr,
@@ -175,7 +173,6 @@ export const usePath = () => {
         ObjStore.setWrite(data.write)
         ObjStore.setProvider(data.provider)
         ObjStore.setState(State.Folder)
-        recordHistory(path, index ?? 1)
       },
       handleErr,
     )

src/hooks/useRouter.ts

@@ -31,7 +31,9 @@ const useRouter = () => {
       navigate(path, options)
     },
     replace: (to: string) => {
-      navigate(encodePath(pathJoin(pathDir(location.pathname), to), true))
+      const path = encodePath(pathJoin(pathDir(location.pathname), to), true)
+      clearHistory(decodeURIComponent(path))
+      navigate(path)
     },
     pushHref: (to: string): string => {
       return encodePath(pathJoin(pathname(), to))

src/pages/home/Obj.tsx

@@ -15,7 +15,7 @@ import {
   getPagination,
   objStore,
   password,
-  recordScroll,
+  recordHistory,
   setPassword,
   /*layout,*/ State,
 } from "~/store"
@@ -37,15 +37,15 @@ export const Obj = () => {
   const pagination = getPagination()
   const page = createMemo(() => {
     return pagination.type === "pagination"
-      ? parseInt(searchParams["page"]) || 1
+      ? parseInt(searchParams["page"], 10) || 1
       : undefined
   })
   let lastPathname: string
   let lastPage: number | undefined
   createEffect(
     on([pathname, page], async ([pathname, page]) => {
       if (lastPathname) {
-        recordScroll(lastPathname, lastPage)
+        recordHistory(lastPathname, lastPage)
       }
       lastPathname = pathname
       lastPage = page

src/pages/manage/tasks/helper.tsx

@@ -1,8 +1,7 @@
 import { createSignal, JSX } from "solid-js"
 import { me } from "~/store"
 import { TaskNameAnalyzer } from "./Tasks"
-import { useRouter, useT } from "~/hooks"
-import { encodePath } from "~/utils"
+import { useT } from "~/hooks"
 
 export const getPath = (
   device: string,
@@ -13,18 +12,15 @@ export const getPath = (
   const prefix = me().base_path === "/" ? "" : me().base_path
   const accessible = fullPath.startsWith(prefix)
   const [underline, setUnderline] = createSignal(false)
-  const { to } = useRouter()
   return accessible && asLink ? (
-    <p
+    <a
       style={underline() ? "text-decoration: underline" : ""}
       onMouseOver={() => setUnderline(true)}
       onMouseOut={() => setUnderline(false)}
-      on:click={(_: MouseEvent) => {
-        to(encodePath(fullPath.slice(prefix.length)))
-      }}
+      href={fullPath.slice(prefix.length)}
     >
       {fullPath}
-    </p>
+    </a>
   ) : (
     <p>{fullPath}</p>
   )

src/store/history.ts

@@ -14,7 +14,8 @@ const waitForNextFrame = () => {
 }
 
 export const getHistoryKey = (path: string, page?: number) => {
-  return page && page > 1 ? `${path}?page=${page}` : path
+  const pathname = path.split("?")[0]
+  return page && page > 1 ? `${pathname}?page=${page}` : pathname
 }
 
 export const recordHistory = (path: string, page?: number) => {
@@ -33,15 +34,8 @@ export const recordHistory = (path: string, page?: number) => {
     page: page ?? getGlobalPage(),
     scroll: window.scrollY,
   }
-  console.log(`record history: [${key}]`)
   HistoryMap.set(key, history)
-}
-
-export const recordScroll = (path: string, page?: number) => {
-  const key = getHistoryKey(path, page)
-  if (!HistoryMap.has(key)) return
-  const history = HistoryMap.get(key)!
-  history.scroll = window.scrollY
+  console.log(`record history: [${key}]`)
 }
 
 export const recoverHistory = async (path: string, page?: number) => {
@@ -63,5 +57,21 @@ export const hasHistory = (path: string, page?: number) => {
 
 export const clearHistory = (path: string, page?: number) => {
   const key = getHistoryKey(path, page)
-  HistoryMap.delete(key)
+  if (hasHistory(path, page)) {
+    HistoryMap.delete(key)
+    console.log(`clear history: [${key}]`)
+  }
 }
+
+document.addEventListener(
+  "click",
+  (e) => {
+    let target = e.target as HTMLElement
+    let link = target.closest("a")
+    let path = link?.getAttribute("href")
+    if (path) {
+      clearHistory(decodeURIComponent(path))
+    }
+  },
+  true,
+)