Orange dot warning in the editor and preview shows default content
hi everyone, I do react work at a small agency. I published a new version of our hero component (added a badge field) and now teh editor shows an orange dot next to the slot, and when I preview the experience I just get the default content instead of the variant.
the site itself still works fine, old content renders normally. its just preview that falls back. what does the orange dot mean exactly and how do I make preview work again? thanks a lot in advance
2 answers
The orange dot is a version drift warning, and it explains both symptoms.
When you changed the component schema, that created a new version. Your deployed code still pins the old slot version, which is why the site works fine: old component versions keep serving after a schema change, nothing breaks in production. But preview fails on version mismatch, the slot version integrated in your code must match the version you are trying to preview. You are previewing content on the new version while the site requests the old one, so preview falls back to defaults.
Two ways out:
- Deploy the code that consumes the new version (update the pinned version in your slot ID, e.g. home-hero@2, regenerate types, deploy). Then preview the new version normally.
- If you are not ready to deploy, preview against the pinned version your code actually uses instead of the latest one.
Once code and previewed version line up, the orange dot goes away.
One habit stopped this from recurring for us. Treat the orange dot as a deploy reminder, not an error. Schema change in the dashboard, then code update, then deploy, in that order, and the dot lives only as long as the gap between the first and last step. If the dot has been orange for weeks it usually means someone changed a schema and forgot to tell whoever owns the frontend.
that was it! bumped the version in code, deployed, preview works and the dot is gone. thank you both so much