Shadcn Hooks

useHash

A hook to get current hash

GitHubView on GitHub

Installation

npx shadcn@latest add "https://shadcn-hooks.vercel.app/r/use-hash.json"
pnpm dlx shadcn@latest add "https://shadcn-hooks.vercel.app/r/use-hash.json"
yarn dlx shadcn@latest add "https://shadcn-hooks.vercel.app/r/use-hash.json"
bun x shadcn@latest add "https://shadcn-hooks.vercel.app/r/use-hash.json"

Copy and paste the following code into your project.

use-hash.ts
import { useSyncExternalStore } from 'react'

function subscribe(onStoreChange: () => void) {
  window.addEventListener('hashchange', onStoreChange)
  return () => window.removeEventListener('hashchange', onStoreChange)
}

function getSnapshot() {
  return window.location.hash
}

function getServerSnapshot() {
  return ''
}

export function useHash() {
  return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)
}

API

/**
 * A hook to get current hash
 * @returns The current hash
 */
export function useHash(): string

Credits

Last updated on

useDeepCompareLayoutEffect

A hook to use a deep compare layout effect

useIsOnline

A hook to check if the user is online

On this page

InstallationAPICredits