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

Update types for with-router #7106

Merged
merged 4 commits into from
Apr 22, 2019
Merged

Conversation

lfades
Copy link
Member

@lfades lfades commented Apr 22, 2019

The current types don't really work for Typescript projects, with this changes the following code will now be possible with Typescript:

import { withRouter, WithRouterProps } from 'next/router'

const H1 = ({ router, title }: { title: string } & WithRouterProps) => <h1>{title} - {router.pathname}</h1>
const Title = withRouter(H1)

// Trying to add `router=""` here will report an error as it's a prop set by withRouter
const Page = () => (
  <Title title="Hello World" />
)

@github-actions
Copy link
Contributor

Stats from current PR

Click to expand stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 12.5s 11.6s -878ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +82 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Base Rendered Size 1.34 kB 1.34 kB
Build Dir Size 639 kB 639 kB
Click to expand serverless stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 13.8s 14.2s ⚠️ +372ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +82 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Serverless pages/link Size 338 kB 338 kB
Serverless pages/link gzip Size 87.6 kB 87.6 kB -2 B
Serverless pages/index Size 331 kB 331 kB
Serverless pages/index gzip Size 85.7 kB 85.7 kB -1 B
Serverless pages/_error Size 331 kB 331 kB
Serverless pages/_error gzip Size 85.5 kB 85.5 kB -2 B
Serverless pages/routerDirect Size 331 kB 331 kB
Serverless pages/routerDirect gzip Size 85.7 kB 85.7 kB -2 B
Serverless pages/withRouter Size 331 kB 331 kB
Serverless pages/withRouter gzip Size 85.8 kB 85.8 kB -2 B
Build Dir Size 2.24 MB 2.24 MB

@github-actions
Copy link
Contributor

Stats from current PR

Click to expand stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 13.2s 12.9s -279ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +82 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Base Rendered Size 1.34 kB 1.34 kB
Build Dir Size 639 kB 639 kB
Click to expand serverless stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 15.6s 14.6s -978ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +82 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Serverless pages/link Size 338 kB 338 kB
Serverless pages/link gzip Size 87.6 kB 87.6 kB -1 B
Serverless pages/index Size 331 kB 331 kB
Serverless pages/index gzip Size 85.7 kB 85.7 kB -1 B
Serverless pages/_error Size 331 kB 331 kB
Serverless pages/_error gzip Size 85.5 kB 85.5 kB
Serverless pages/routerDirect Size 331 kB 331 kB
Serverless pages/routerDirect gzip Size 85.7 kB 85.7 kB -1 B
Serverless pages/withRouter Size 331 kB 331 kB
Serverless pages/withRouter gzip Size 85.8 kB 85.8 kB
Build Dir Size 2.24 MB 2.24 MB

@lfades lfades changed the title Updated types for with-router Update types for with-router Apr 22, 2019
@github-actions
Copy link
Contributor

Stats from current PR

Click to expand stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 12.5s 12s -507ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +84 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Base Rendered Size 1.34 kB 1.34 kB
Build Dir Size 639 kB 639 kB
Click to expand serverless stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 14.6s 14.5s -156ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +84 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Serverless pages/link Size 338 kB 338 kB
Serverless pages/link gzip Size 87.6 kB 87.6 kB ⚠️ +3 B
Serverless pages/index Size 331 kB 331 kB
Serverless pages/index gzip Size 85.7 kB 85.7 kB
Serverless pages/_error Size 331 kB 331 kB
Serverless pages/_error gzip Size 85.5 kB 85.5 kB ⚠️ +2 B
Serverless pages/routerDirect Size 331 kB 331 kB
Serverless pages/routerDirect gzip Size 85.7 kB 85.7 kB ⚠️ +1 B
Serverless pages/withRouter Size 331 kB 331 kB
Serverless pages/withRouter gzip Size 85.8 kB 85.8 kB ⚠️ +3 B
Build Dir Size 2.24 MB 2.24 MB

@lfades
Copy link
Member Author

lfades commented Apr 22, 2019

This type: { ...this.props as any } is a workaround for a TS bug: #28938

@github-actions
Copy link
Contributor

Stats from current PR

Click to expand stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 12.5s 12s -511ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +410 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Base Rendered Size 1.34 kB 1.34 kB
Build Dir Size 639 kB 639 kB
Click to expand serverless stats
zeit/next.js canary lfades/next.js fix/with-router-types Change
Build Duration 14.2s 13.9s -248ms
node_modules Size 39.9 MB 39.9 MB ⚠️ +410 B
Total Bundle (main, webpack, commons) Size 210 kB 210 kB
Total Bundle (main, webpack, commons) gzip Size 68.5 kB 68.5 kB
Client _app Size 2.5 kB 2.5 kB
Client _app gzip Size 1.02 kB 1.02 kB
Client _error Size 9.66 kB 9.66 kB
Client _error gzip Size 3.52 kB 3.52 kB
Client pages/index Size 298 B 298 B
Client pages/index gzip Size 235 B 235 B
Client pages/link Size 3.28 kB 3.28 kB
Client pages/link gzip Size 1.49 kB 1.49 kB
Client pages/routerDirect Size 426 B 426 B
Client pages/routerDirect gzip Size 304 B 304 B
Client pages/withRouter Size 408 B 408 B
Client pages/withRouter gzip Size 293 B 293 B
Client main Size 24.4 kB 24.4 kB
Client main gzip Size 7.89 kB 7.89 kB
Client commons Size 183 kB 183 kB
Client commons gzip Size 59.4 kB 59.4 kB
Client webpack Size 1.49 kB 1.49 kB
Client webpack gzip Size 774 B 774 B
Serverless pages/link Size 338 kB 338 kB
Serverless pages/link gzip Size 87.6 kB 87.6 kB ⚠️ +1 B
Serverless pages/index Size 331 kB 331 kB
Serverless pages/index gzip Size 85.7 kB 85.7 kB ⚠️ +2 B
Serverless pages/_error Size 331 kB 331 kB
Serverless pages/_error gzip Size 85.5 kB 85.6 kB ⚠️ +2 B
Serverless pages/routerDirect Size 331 kB 331 kB
Serverless pages/routerDirect gzip Size 85.7 kB 85.7 kB
Serverless pages/withRouter Size 331 kB 331 kB
Serverless pages/withRouter gzip Size 85.8 kB 85.8 kB
Build Dir Size 2.24 MB 2.24 MB

@lfades lfades merged commit db5b3dc into vercel:canary Apr 22, 2019
@lfades lfades deleted the fix/with-router-types branch April 30, 2019 00:01
@lock lock bot locked as resolved and limited conversation to collaborators May 5, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants