callstack / callstack/react-native-paper

Nested component in Portal not receiving state values of React Context

Ouverte
#3,880 15 commentaires 15 réactions 0 personnes assignées Voir sur GitHub
bug Portal
Langage dominant
TypeScript
Étoiles
14.5k
Forks
2.2k
Merge moyen
5 j 23 h
PR mergées (30 j)
12

Description

### Current behaviour
When using Portal component you are not given the context of the state in the wrapping/global React Context Provider

### Expected behaviour
You should be able to access the state values of the Context Provider

### How to reproduce?
- create a new expo app
- install react-native-paper
- create a context using createContext from react and give it an initial state/default value
- wrap the entire app in your named context.Provider
- create any component (text, view, snackbar etc.)
- using the Portal component wrap the created component
- inside the created component call the useContext() with your created context as the parameter
- expect the state to be defined/a value, but it is undefined

https://snack.expo.dev/184285Vsi - here is a simple snack to what the issue is, with some logs

### Preview
The Context and Provider
![image](https://github.com/callstack/react-native-paper/assets/41947220/5933da12-2b5a-47bd-9a25-25865a78395f)

Main App wrapped in Provider
![image](https://github.com/callstack/react-native-paper/assets/41947220/99e54a63-a8e9-4328-8b0e-fa7a32a800cd)

Portal Component
![image](https://github.com/callstack/react-native-paper/assets/41947220/9fcec0b7-cade-495a-827b-d100b6ea7669)

nested component of Portal
![image](https://github.com/callstack/react-native-paper/assets/41947220/448ca2be-8994-42d8-aa35-3a96f030e232)

Log of initial values outside of Portal
![image](https://github.com/callstack/react-native-paper/assets/41947220/20138a2e-4135-4bbc-bd71-aded9b800829)

We expect these values to be the same within the portal

However as seen the in screenshot of the logs below it is undefined:
![image](https://github.com/callstack/react-native-paper/assets/41947220/8428389e-e1c9-4966-8acf-a2437ae09499)

### What have you tried so far?
To fix this I have passed in the state values as props to the nested component - this seems to work, however it is defeating the purpose of using Context Providers of react

### Your Environment

| software | version
| ----------------------- | -------
| react-native | 0.71.7
| react-native-paper | ^5.7.0
| node | 16.19.0
| npm | 8.19.3
| expo sdk | ^48.0.11

Guide de contribution

Ouvrir le guide de contribution

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.