blitz-js / babel-plugin-superjson-next

Automatically transform your Next.js Pages to use SuperJSON
MIT License
125 stars 15 forks source link

Doesn't appear to be working with Blitz v0.3.* #44

Closed ThePaulMcBride closed 3 years ago

ThePaulMcBride commented 3 years ago

Recently upgraded to Blitz v0.3.0 then v.0.3.1 and have run into issues with superjson. Following a chat with @flybayer I removed superjson from my .babelrc file as it should now be handled by Blitz.

My page code is below and is at the following path app/pages/jobs/[companySlug]/[jobSlug].tsx

export async function getStaticPaths() {
  return {
    paths: [],
    fallback: "blocking",
  }
}

export async function getStaticProps(context) {
  const { companySlug, jobSlug } = context.params

  const company = await getCompanyBySlug({ slug: companySlug })

  if (!company) {
    return {
      notFound: true,
    }
  }

  const job = await getJobBySlugAndCompany({ slug: jobSlug, companyId: company.id })

  if (!job) {
    return {
      notFound: true,
    }
  }

  return {
    props: {
      company,
      job,
    },
    revalidate: 1, // In seconds
  }
}

export default function JobView(props) {
  console.log(props)
  return <pre>{JSON.stringify(props, null, 2)}</pre>
}

I would expect the props passed to the page to be an object containing a company and a job. However, the data I am getting is instead

{
  "json": {
    "company": {
      "id": "7fc33b71-acd0-4d49-8814-101c675d17ce",
      "title": "WeCode NI",
      "slug": "wecode-ni",
      "logoUrl": null,
      "description": "The best tech and software development jobs in Belfast and Northern Ireland",
      "url": "https://wecodeni.com",
      "plan": "basic_29",
      "subscriptionStatus": "active",
      "stripeCustomerId": "123",
      "createdAt": "2021-01-25T17:21:39.394Z",
      "updatedAt": "2021-01-25T17:32:22.268Z"
    },
    "job": {
      "id": "2af4a06c-8b27-4b66-8c40-8bd1e72df7ad",
      "slug": "another-test-1",
      "title": "Another Test",
      "description": "Test",
      "salary": "£62,000 per year",
      "employmentType": [
        "TEMPORARY"
      ],
      "location": "Dublin",
      "publishedAt": "2021-02-19T14:55:59.077Z",
      "closesAt": "2021-03-06T00:00:00.000Z",
      "companyId": "7fc33b71-acd0-4d49-8814-101c675d17ce",
      "createdAt": "2021-02-19T14:55:59.078Z",
      "updatedAt": "2021-02-19T14:55:59.078Z",
      "deletedAt": null
    }
  },
  "_superjson": true,
  "meta": {
    "values": {
      "job.closesAt": [
        "Date"
      ],
      "job.createdAt": [
        "Date"
      ],
      "job.updatedAt": [
        "Date"
      ],
      "job.publishedAt": [
        "Date"
      ],
      "company.createdAt": [
        "Date"
      ],
      "company.updatedAt": [
        "Date"
      ]
    }
  }
}

Superjson is clearly doing something here, but it doesn't seem to pass props to the page component how I would expect.

flybayer commented 3 years ago

If you are using yarn, what's the output of yarn why babel-plugin-superjson-next ?

ThePaulMcBride commented 3 years ago
➜ yarn why babel-plugin-superjson-next
yarn why v1.22.10
[1/4] 🤔  Why do we have the module "babel-plugin-superjson-next"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "babel-plugin-superjson-next@0.2.1"
info Reasons this module exists
   - "blitz#@blitzjs#babel-preset" depends on it
   - Hoisted from "blitz#@blitzjs#babel-preset#babel-plugin-superjson-next"
info Disk size without dependencies: "80KB"
info Disk size with unique dependencies: "184KB"
info Disk size with transitive dependencies: "6.49MB"
info Number of shared dependencies: 7
flybayer commented 3 years ago

This is so odd. Could we get access to your repo by chance?

Skn0tt commented 3 years ago

I've also just run a few sanity checks, and couldn't find the issue. Access to the repo / a reproduction would be great.

ThePaulMcBride commented 3 years ago

Sure. I've temporarily made the repo public. I'm a Typescript noob, so don't judge me too harshly.

https://github.com/ThePaulMcBride/rocketrecruit

Skn0tt commented 3 years ago

You have a .babelrc that contains "plugins": ["superjson-next"] in your root directory. Since blitz/babel also includes this, it is now applied twice. Remove .babelrc to fix.

ThePaulMcBride commented 3 years ago

Ahh you're right. I'm a dumbass! Thank you so much for the help!

flybayer commented 3 years ago

@ThePaulMcBride you're not a dumbass. Dev is just hard :)