Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Relationship/Upload causing page refresh

default discord avatar
.redjoker2 years ago
4

Dealing with this issue locally running

yarn dev

on Payload v1.8.2.



Expected: Based on the Payload Demo when on a "page" I click "Upload new media" on an upload field it should open an upload modal and let me add one, then I can close the modal with the media relationship set. No page transition.



What happens: When I open the media modal it refreshes the page and changes the route to the media collection. Clicking "back" in the browser it takes me to my "page" collections listings.



import { CollectionConfig } from 'payload/types';

const Media: CollectionConfig = {
  slug: 'media',
  versions: {
    drafts: {
      autosave: true,
    }
  },
  admin: {
    useAsTitle: 'filename',
    group: 'Content',
  },
  upload: {
    staticURL: '/media',
    staticDir: 'assets',
    imageSizes: [
      {
        name: 'thumbnail',
        width: 400,
        height: 300,
        position: 'center',
      },
    ],
    adminThumbnail: 'thumbnail',
    mimeTypes: ['image/*'],
  },
  fields: [
    {
      name: 'alt',
      type: 'text',
    },
  ],
};

export default Media;
  • default discord avatar
    notchr2 years ago

    Hello

    @477521743842639884

    - that is odd, what version of Payload are you on?

  • default discord avatar
    .redjoker2 years ago

    Payload v1.8.2

  • default discord avatar
    notchr2 years ago

    Hmm, okay, do you get any errors in dev tools?

  • default discord avatar
    .redjoker2 years ago

    No error when I click "upload new media" from the "page" collection.



    I figured it out! Turns out you shouldn't set your media to have the versioning config. The autosave was causing issues.



    (You can still use drafts)

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.