"Payload has transformed the way our clients manage content. It's an indispensable tool for any modern agency."
Get the resources you need to start building today
Microsoft chose Payload to tell the world about AI.
Content disappearing after save with next-payload
Hello, all! I'm getting this weird bug when I save content with next-payload. After save, the page blinks and all content is gone until refreshed.
After I got this behavior in the repo I'm working, I cloned the next-payload-demo and made changes only to
.env.localfile. Same issue.
I made this screen capture to show what's happening, as well as the console errors. Am I missing some config, maybe?
Here are the changes I've made in
.env.local. I left S3 stuff blank because I'm using GCS and didn't want to mess with this for the example
MONGODB_URI=mongodb://localhost/payload-vercel-functions
PAYLOAD_SECRET=YOUR_SECRET_HERE
PAYLOAD_CONFIG_PATH=dist/payload.config.js
NEXT_PUBLIC_APP_URL=http://localhost:3000
PAYLOAD_PUBLIC_CMS_URL=http://localhost:3000
S3_ACCESS_KEY_ID=
S3_SECRET_ACCESS_KEY=
S3_REGION=
NEXT_PUBLIC_S3_ENDPOINT=
NEXT_PUBLIC_S3_BUCKET=
PAYLOAD_PRIVATE_REGENERATION_SECRET=123123
NEXT_PRIVATE_REGENERATION_SECRET=123123
This is so odd, as the errors don't even seem super related to the main issue
@736673642158620680Did you follow this repo example?
https://github.com/payloadcms/next-payloadMaybe that would be better than the other demo
Yeah, at first I tried to follow the steps from "next-payload". As I was getting these errors, I tried to clone the demo, and got the same behavior :/
I'm surprised there aren't more reports of errors
Especially if you used the demo as it is
yeah, me too. I was wondering if it has something to do with my environment, node version, I don't know
Hmm whats your enviornment like?
Happy to help debug
I'm usign Node with nvm @ v16.16.0
not sure what else should be looking into
I think your node version is OK, though as a note, we are using node version
v19.8.1I think next lets check out your package json
Here is the relevant part of ours:
"dependencies": { "cors": "^2.8.5", "dotenv": "^8.2.0", "express": "^4.18.2", "jsonwebtoken": "^8.5.1", "payload": "^1.6.32" }, "devDependencies": { "@types/express": "^4.17.17", "copyfiles": "^2.4.1", "cross-env": "^7.0.3", "nodemon": "^2.0.6", "ts-node": "^9.1.1", "typescript": "^4.8.4" }(We may have a couple of extra packages, but I'm mainly looking at payload)
I know the next project provides a few extra packages too
hm, it looks close enough:
{ "name": "next-payload-demo", "description": "Demo of Payload deployed as Vercel functions within NextJS", "version": "1.0.0", "license": "MIT", "scripts": { "dev": "next dev", "start": "next start", "lint": "next lint", "install:payload": "next-payload install", "build:next": "next build", "build": "yarn build:next", "generate:types": "cross-env PAYLOAD_CONFIG_PATH=payload/payload.config.ts payload generate:types", "generate:graphQLSchema": "PAYLOAD_CONFIG_PATH=payload/payload.config.ts payload generate:graphQLSchema" }, "dependencies": { "@aws-sdk/client-s3": "^3.245.0", "@aws-sdk/lib-storage": "^3.276.0", "@faceless-ui/css-grid": "^1.2.0", "@faceless-ui/modal": "^2.0.1", "@payloadcms/next-payload": "^0.0.16", "@payloadcms/plugin-cloud-storage": "^1.0.14", "@payloadcms/plugin-seo": "^1.0.10", "@swc/wasm": "^1.3.35", "@vercel/edge": "^0.1.2", "dotenv": "^8.2.0", "express": "^4.17.1", "next": "^13.2.4-canary.6", "payload": "^1.6.32", "payload-admin-bar": "^1.0.5", "pino-pretty": "^9.1.1", "react": "18.2.0", "react-dom": "18.2.0", "sass": "^1.58.2", "sass-loader": "^13.2.0" }, "devDependencies": { "@swc/core": "^1.3.35", "@types/express": "^4.17.9", "@types/node": "^18.11.18", "@types/react": "^18.0.28", "copyfiles": "^2.4.1", "cross-env": "^7.0.3", "eslint": "8.31.0", "eslint-config-next": "13.1.1", "nodemon": "^2.0.6", "ts-node": "^9.1.1", "typescript": "^4.8.4" } }Also tried to build && start to see if it was related to
yarn dev, but it was the same
Looking over it
your payload/next package looks updated
that got an update 12 days ago
As far as barebones goes...
Have you ruled out the extra plugins you have
possibly causing issue
@736673642158620680If you happen to have your project on a repo, I'm happy to do a code review
about plugins, the repo that I started was a next project that I used npx to install payload. So it didn't have plugins, and had the same issue
"dependencies": { "@payloadcms/next-payload": "^0.0.16", "i18next": "^22.4.14", "modern-normalize": "^1.1.0", "next": "latest", "payload": "^1.6.32", "payload-base64-plugin": "^1.2.0", "react": "^18.2.0", "react-dom": "^18.2.0", "styled-components": "^5.3.5" }, "devDependencies": { "@types/node": "^18.0.0", "@types/react": "^18.0.14", "@types/react-dom": "^18.0.5", "@types/styled-components": "^5.1.25", "typescript": "^4.7.4" }do you get the same errors if you clone next-payload-demo and set .env.local like I did?
IS that your current package.json?
the last one I sent was from my first try. I think I used create-next-app and then npx to install next-payload
hmm
and sorry, covering bases here
you created a new mongo db named "payload-vercel-functions"
?
lol, yeah. it is running
had to check hehe
ahahahahha sure!
but I think payload doesn't even start if it can't connect to a Mongo db
true
so we can rule out your .env vars not being picked up
because then the mongourl wouldnt be picked up
hm, that's right
but I'm curious. if you clone the demo repo can you reproduce?
I am wondering, is this specific to globals for you?
- @736673642158620680
ill try it out now
let me try out with a collection,
@281120856527077378- @736673642158620680
awesome ty, I would try with the same config structure too. i.e. use an array of links!
ok, that's something! It's not happening inside a collection
I copy/pasted the same field and it worked as it should
its building 😮
slowly but surely lol
hmmm
OK so i couldn't replicate locally (or run it locally lol)
But i think that is just my setup
I'm guessing this is related to globals vs collections
yeah, it looks like it. Should I open an issue
@281120856527077378?
Beautiful
yes please do!
thank you for narrowing it down
open it on the next-payload repo
pleaaaase 🙏
ahahahahah nice, will do. thanks!
thank you as well,
@1049775120559898725!
of course my friend, good luck!
I noticed this issue was closed on Github, and I am using the latest release (v0.0.20) of
next-payloadbut I am getting similar behaviour in collections. I have a relationship field which refuses to save, regardless of the fact the Admin UI says it was a successful save
- @93699784942034944
Is it with collections specifically? Or Globals?
Collections
I don’t currently have any globals in my config
Star
Discord
online
Get dedicated engineering support directly from the Payload team.