nandorojo / solito

🧍‍♂️ React Native + Next.js, unified.
https://solito.dev
MIT License
3.54k stars 180 forks source link

usePathname() doesn't work with expo-router #445

Open hamsterhomka opened 1 year ago

hamsterhomka commented 1 year ago

Is there an existing issue for this?

Do you want this issue prioritized?

Current Behavior

usePathname() returns undefined in expo application with expo-router.

Expected Behavior

Work the same as in next.js

Steps To Reproduce

No response

Versions

- Solito: 4.0.1
- Next.js: 13.5.4
- Expo: 49
- React Native: 0.72.4

Screenshots

I think that usePathname from 'solito/navigation' should use usePathname from 'expo-router' under the hood instead of useContext(NavigationRouteContext)

Reproduction

No response

hamsterhomka commented 1 year ago

Created two files

1) usePathname.ts

import { usePathname as useExpoPathname } from 'expo-router'

export const usePathname = () => {
  return useExpoPathname()
}

2) usePathname.web.ts

import { usePathname as useNextPathname } from 'next/navigation'

export const usePathname = () => {
  return useNextPathname()
}

And it worked perfectly!

nandorojo commented 1 year ago

Hm interesting. Well what you did is correct!

gijosso commented 11 months ago
  1. usePathname.web.ts
import { usePathname as useNextPathname } from 'next/navigation'

export const usePathname = () => {
  return useNextPathname()
}

@hamsterhomka usePathname from solito/navigation works and does exactly that, so you could just do:

 import { usePathname } from 'solito/navigation'

 export { usePathname } 

Trying to figure out a way to get the expected behaviour on native without the expo/router dependency but no luck so far.

The comment can be edited though, it doesn't work with the expo router.

@nandorojo Is there a relevant way to add a warning about this unexpected behaviour ?

nandorojo commented 11 months ago

Yeah we probably need a config variable for expo router at the root