Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[2.x] Declare global types for React PageProps #405

Merged
merged 5 commits into from
Sep 11, 2024

Conversation

matsantosz
Copy link
Contributor

This PR aims to improve the React Stack by declaring the types of PageProps or usePage() globally, just like in Vue Stack.

Before:
const user = usePage<PageProps>().props.auth.user

After:
const user = usePage().props.auth.user


Also, there's no need to pass an user to AuthenticatedLayout every time since it is globally available through page props and can be grabbed inside the layout, just like in Vue Stack.

@taylorotwell taylorotwell merged commit 8f4176b into laravel:2.x Sep 11, 2024
16 checks passed
@navaneeth-dev
Copy link

Not building in Docker but works fine locally.
After putting usePage<PageProps>() it builds in Docker too.
Any ideas how to solve? I'm using pnpm in docker.

root@dbc1efd30348:/app# pnpm build                                                                                                                                       
                                                                                                                                                                         
> @ build /app                                                                                                                                                           
> tsc && vite build                                                                                                                                                      
                                                                                                                                                                         
resources/js/Layouts/AuthenticatedLayout.tsx:12:18 - error TS2571: Object is of type 'unknown'.                                                                          
                                                                                                                                                                         
12     const user = usePage().props.auth.user;                                                                                                                           
                    ~~~~~~~~~~~~~~~~~~~~                                                                                                                                 
                                                                                                                                                                         
resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.tsx:18:18 - error TS2571: Object is of type 'unknown'.                                                  
                                                                                                                                                                         
18     const user = usePage().props.auth.user;                                                                                                                           
                    ~~~~~~~~~~~~~~~~~~~~                                                                                                                                 
                                                                                                                                                                         
                                                                                                                                                                         
Found 2 errors in 2 files.                                                                                                                                               
                                                                                                                                                                         
Errors  Files                                                                                                                                                            
     1  resources/js/Layouts/AuthenticatedLayout.tsx:12                                                                                                                  
     1  resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.tsx:18
 ELIFECYCLE  Command failed with exit code 2.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants