Next.js: Server side _app.js

[elrumordelaluz]

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

Get initial props using a HOC in _app.js same as when using directly in all _pages_

Current Behavior

Using custom _app.js works only client-side

Steps to Reproduce (for bugs)

1. Fork/install with-apollo example
2. Create a _custom_ _app.js like here
3. Import and Wrap the default exported _Component_ of _app.js with withData :: see below
4. Unwrap the default exported Component from Index page :: see below

Context

When the withData _HOC_ wraps each _Page_, the _GraphQL_ data fetched is available _server-side_ like:

instead wrapping the _custom_ _app.js is only available _client-side_, like:

Your Environment

| Tech | Version |
|---------|---------|
| next | 6.0.0|
| node | v8.11.0 |
| OS | OSX 10.11.6 |
| browser | |
| etc | |

Code snippets

Code Snippet _app

import App, { Container } from 'next/app'
import React from 'react'
import withData from '../lib/withData'

class MyApp extends App {
  static async getInitialProps({ Component, router, ctx }) {
    let pageProps = {}

    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx)
    }

    return { pageProps }
  }

  render() {
    const { Component, pageProps } = this.props
    return (
      <Container>
        <Component {...pageProps} />
      </Container>
    )
  }
}

export default withData(MyApp)

Code Snippet Index

import App from '../components/App'
import Header from '../components/Header'
import Submit from '../components/Submit'
import PostList from '../components/PostList'

export default () => (
  <App>
    <Header />
    <Submit />
    <PostList />
  </App>
)

[elrumordelaluz]

repo https://github.com/elrumordelaluz/next-with-apollo-custom-app

[timneutkens]

See https://github.com/zeit/next.js/pull/4286

[elrumordelaluz]

cool, thank you @timneutkens !

[meazou75]

Thank you very much <3 <3