Typescript React Component Props Error

Hi, I'm trying to implemented an AuthenticatedRoute component. I'm wrapping the Route component from react-router-dom. Getting a frustrating TS error. I just don't understand how to fix it, can anyone help?
12 Replies
cje
cje•3y ago
Use composition instead That way the only prop you need is children
Unknown User
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View
dinislam
dinislamOP•3y ago
Is there a way to inject the route props at the same time? history, location, match etc. By that I mean from within the AuthenticatedRoute component add extra props to the Component
cje
cje•3y ago
probably not if you want that, i think you'll need to figure out your generic its going to be hell though
dinislam
dinislamOP•3y ago
Ahh 😦
cje
cje•3y ago
tbh either find a library that does this or prepare to enter generics hell
dinislam
dinislamOP•3y ago
Would the future ā€œsatisfiesā€ keyword help here?
cje
cje•3y ago
you could look at the typedefs for tanstack router and other similar libraries
dinislam
dinislamOP•3y ago
Sounds good
cje
cje•3y ago
but its going to be waaaay more complex than what you had going in your op
dinislam
dinislamOP•3y ago
The generic seems straightforward conceptually. I want ā€œcomponentPropsā€ to be the same type as the props for the ā€œcomponentā€. Strange that it’s so hard in practice to do
Unknown User
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View

Did you find this page helpful?