helpers.ts 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. 'use client'
  2. import { useSyncExternalStore } from 'react'
  3. import type * as React from 'react'
  4. export const detectBrowser = () => {
  5. if (!navigator) return undefined
  6. if (navigator.userAgent.indexOf('Chrome') !== -1) {
  7. return 'Chrome'
  8. } else if (navigator.userAgent.indexOf('Firefox') !== -1) {
  9. return 'Firefox'
  10. } else if (navigator.userAgent.indexOf('Safari') !== -1) {
  11. return 'Safari'
  12. }
  13. }
  14. export const isBrowser = typeof window !== 'undefined'
  15. const prefersReducedMotionMediaQuery =
  16. isBrowser && window.matchMedia('(prefers-reduced-motion: reduce)')
  17. /**
  18. * @returns boolean value If the user has expressed their preference for reduced motion.
  19. */
  20. export const useReducedMotion = (): boolean => {
  21. if (!prefersReducedMotionMediaQuery) return false
  22. return useSyncExternalStore(
  23. (callback) => {
  24. prefersReducedMotionMediaQuery.addEventListener('change', callback)
  25. return () => {
  26. prefersReducedMotionMediaQuery.removeEventListener('change', callback)
  27. }
  28. },
  29. () => prefersReducedMotionMediaQuery.matches,
  30. () => false
  31. )
  32. }
  33. export function ensurePlatformSuffix(apiUrl: string) {
  34. return apiUrl.endsWith('/platform') ? apiUrl : `${apiUrl}/platform`
  35. }
  36. export function mergeRefs<T>(...refs: React.Ref<T>[]): React.RefCallback<T> {
  37. return (value) => {
  38. refs.forEach((ref) => {
  39. if (typeof ref === 'function') {
  40. ref(value)
  41. } else if (ref !== null) {
  42. if (typeof ref === 'object' && ref !== null && 'current' in ref) {
  43. ;(ref as any).current = value
  44. }
  45. }
  46. })
  47. }
  48. }