@rpcbase/client 0.283.0 → 0.285.0

package/src/initWithRoutes.tsx

@@ -1,115 +0,0 @@
-import { StrictMode } from "react"
-import posthog from "posthog-js"
-import {createBrowserRouter, createRoutesFromElements, RouterProvider} from "@rpcbase/router"
-import { hydrateRoot } from "react-dom/client"
-
-import { initApiClient } from "./apiClient"
-import {cleanupURL} from "./cleanupURL"
-
-
-const isProduction = import.meta.env.MODE === "production"
-
-type ReactErrorInfo = { componentStack?: string }
-
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-const showErrorOverlay = (err: { title: string, message: string, reason: string, plugin: string }) => {
-  const ErrorOverlay = customElements.get("vite-error-overlay")
-  // don't open outside vite environment
-  if (!ErrorOverlay) {return}
-  console.log(err)
-  const overlay = new ErrorOverlay(err)
-  document.body.appendChild(overlay)
-}
-
-
-const handleServerErrors = () => {
-  if ((window as any).__staticRouterHydrationData?.errors) {
-
-    const {errors} = (window as any).__staticRouterHydrationData
-
-    Object.values(errors).forEach((error: any) => {
-      showErrorOverlay({
-        plugin: "ssr-router",
-        ...error.reason
-      })
-    })
-  }
-}
-
-
-// TODO: what type is this
-export const initWithRoutes = async (routesElement, opts) => {
-
-  await initApiClient()
-
-  cleanupURL()
-
-  handleServerErrors()
-
-
-  const routes = createRoutesFromElements(routesElement)
-  const router = createBrowserRouter(routes)
-
-
-  const toError = (error: unknown): Error =>
-    error instanceof Error ? error : new Error(String(error))
-
-  const mentionsHydration = (value: unknown, depth = 0): boolean => {
-    if (depth > 5) {
-      return false
-    }
-    if (typeof value === "string") {
-      return value.toLowerCase().includes("hydrat")
-    }
-    if (value instanceof Error) {
-      const digest = (value as { digest?: unknown }).digest
-      const cause = (value as { cause?: unknown }).cause
-      return (
-        mentionsHydration(value.message, depth + 1) ||
-        mentionsHydration(digest, depth + 1) ||
-        mentionsHydration(cause, depth + 1)
-      )
-    }
-    return false
-  }
-
-  const phReactHandler =
-    (react_context: "uncaught" | "caught" | "recoverable") =>
-    (error: unknown, errorInfo?: ReactErrorInfo) => {
-      const err = toError(error)
-      // send as exception (counts toward error tracking)
-      posthog.captureException(err, {
-        react_context,
-        component_stack: errorInfo?.componentStack
-      })
-      if (react_context === "uncaught") {
-        console.warn("Uncaught error", err, errorInfo?.componentStack)
-      }
-    }
-
-  const hydrationOptions: Parameters<typeof hydrateRoot>[2] | undefined = isProduction ? {
-    onUncaughtError: phReactHandler("uncaught"),
-    onCaughtError: phReactHandler("caught"),
-    onRecoverableError: phReactHandler("recoverable")
-  } : (opts?.devThrowsOnHydrationErrors ? {
-    onRecoverableError(error, errorInfo) {
-      const err = toError(error)
-      if (mentionsHydration(err) || mentionsHydration(errorInfo?.componentStack)) {
-        throw err
-      }
-      // For non-hydration recoverable errors in dev, keep a visible signal.
-      console.error(err, errorInfo?.componentStack)
-    }
-  } : undefined)
-
-
-  hydrateRoot(
-    document.getElementById("root") as HTMLElement,
-    <StrictMode>
-      <RouterProvider router={router} />
-    </StrictMode>,
-    hydrationOptions
-  )
-
-}

package/src/types.ts

@@ -1,8 +0,0 @@
-import { Ctx } from "@rpcbase/api"
-import { Params } from "@rpcbase/router"
-
-
-export type LoaderArgs = {params: Params, ctx: Ctx}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type Loader = ({params, ctx}: LoaderArgs) => Promise<any>

package/src/utils/useApplyScroll.ts

@@ -1,169 +0,0 @@
-import { useCallback, useEffect, useRef } from "react"
-import { useLocation } from "@rpcbase/router"
-
-
-function throttle(callback: (...args: any[]) => void, limit: number) {
-  let wait = false
-  return (...args: any[]) => {
-    if (!wait) {
-      callback(...args)
-      wait = true
-      setTimeout(() => {
-        wait = false
-      }, limit)
-    }
-  }
-}
-
-export function useApplyScroll() {
-  const location = useLocation()
-  const previousPathRef = useRef(location.pathname)
-  const isScrollingProgrammatically = useRef(false)
-  const scrollTimeoutRef = useRef<NodeJS.Timeout | null>(null)
-  const lastAppliedHashRef = useRef("")
-
-  useEffect(() => {
-    if (typeof window !== "undefined") {
-      lastAppliedHashRef.current = window.location.hash || ""
-    }
-  }, [])
-
-  useEffect(() => {
-    lastAppliedHashRef.current = location.hash || ""
-  }, [location.hash])
-
-  const replaceHashSilently = useCallback((hash: string) => {
-    if (typeof window === "undefined") {
-      return
-    }
-    if (lastAppliedHashRef.current === hash) {
-      return
-    }
-    const base = `${window.location.pathname}${window.location.search}`
-    window.history.replaceState(window.history.state, "", `${base}${hash}`)
-    lastAppliedHashRef.current = hash
-  }, [])
-
-  const markProgrammaticScroll = useCallback(() => {
-    isScrollingProgrammatically.current = true
-    if (scrollTimeoutRef.current) {
-      clearTimeout(scrollTimeoutRef.current)
-    }
-    scrollTimeoutRef.current = setTimeout(() => {
-      isScrollingProgrammatically.current = false
-    }, 1000)
-  }, [])
-
-  useEffect(() => {
-    const pathChanged = previousPathRef.current !== location.pathname
-
-    if (pathChanged) {
-      previousPathRef.current = location.pathname
-
-      if (!location.hash) {
-        window.scrollTo({ top: 0, left: 0, behavior: "auto" })
-        return
-      }
-
-      setTimeout(() => {
-        const id = location.hash.substring(1)
-        const element = document.getElementById(id)
-        if (element) {
-          markProgrammaticScroll()
-          element.scrollIntoView({ behavior: "smooth" })
-        }
-      }, 100)
-
-      return
-    }
-
-    if (!location.hash) {
-      return
-    }
-
-    const id = location.hash.substring(1)
-    const element = document.getElementById(id)
-    if (element) {
-      markProgrammaticScroll()
-      element.scrollIntoView({ behavior: "smooth" })
-    }
-  }, [location.hash, location.pathname, markProgrammaticScroll])
-
-  useEffect(() => {
-    if (typeof window === "undefined") {
-      return
-    }
-
-    const handleScroll = throttle(() => {
-      if (isScrollingProgrammatically.current) {
-        return
-      }
-
-      const sections = Array.from(document.querySelectorAll("section[id]"))
-
-      if (sections.length === 0) {
-        replaceHashSilently("")
-        return
-      }
-
-      const scrollPosition = window.scrollY
-      const viewportHeight = window.innerHeight
-      const checkPoint = scrollPosition + viewportHeight / 3
-
-      let activeSectionId: string | null = null
-      for (const section of sections) {
-        if (
-          section.offsetTop <= checkPoint &&
-          section.offsetTop + section.offsetHeight > checkPoint
-        ) {
-          activeSectionId = section.id
-          break
-        }
-      }
-
-      const newHash = activeSectionId ? `#${activeSectionId}` : ""
-      replaceHashSilently(newHash)
-    }, 150)
-
-    document.addEventListener("scroll", handleScroll)
-    return () => {
-      document.removeEventListener("scroll", handleScroll)
-      if (scrollTimeoutRef.current) {
-        clearTimeout(scrollTimeoutRef.current)
-        scrollTimeoutRef.current = null
-      }
-    }
-  }, [replaceHashSilently])
-
-  useEffect(() => {
-    const handleClick = (event: MouseEvent) => {
-      const target = event.target as HTMLElement | null
-      const link = target?.closest("a")
-      const currentHash =
-        typeof window !== "undefined"
-          ? window.location.hash
-          : location.hash || ""
-
-      if (
-        !link ||
-        !link.hash ||
-        link.pathname !== location.pathname ||
-        link.hash !== currentHash
-      ) {
-        return
-      }
-
-      const id = link.hash.substring(1)
-      const element = document.getElementById(id)
-      if (element) {
-        event.preventDefault()
-        event.stopPropagation()
-        markProgrammaticScroll()
-        element.scrollIntoView({ behavior: "smooth" })
-      }
-    }
-
-    document.addEventListener("click", handleClick, true)
-    return () => document.removeEventListener("click", handleClick, true)
-  }, [location.hash, location.pathname, markProgrammaticScroll])
-}