Error: Filename is Invalid

default discord avatar
taun2160
5 months ago
8

Hi. I'm receiving an error when I try to save the CMS fields of a portfolio item within the Payload admin panel (Below in this thread is a screenshot). The Portfolio collection is the only change I've made to this next-customer-server repo, so I don't know what to debug. I'm a beginner so the answer is most likely obvious.



[10:01:07] ERROR (payload): ValidationError: The following field is invalid: filename
    at new ExtendableError (C:\git\White_Polaroids\WhitePolaroids6\node_modules\payload\src\errors\APIError.ts:26:11)
    at new APIError (C:\git\White_Polaroids\WhitePolaroids6\node_modules\payload\src\errors\APIError.ts:43:5)
    at new ValidationError (C:\git\White_Polaroids\WhitePolaroids6\node_modules\payload\src\errors\ValidationError.ts:8:5)    
    at create (C:\git\White_Polaroids\WhitePolaroids6\node_modules\payload\src\collections\operations\create.ts:214:11)       
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async createHandler (C:\git\White_Polaroids\WhitePolaroids6\node_modules\payload\src\collections\requestHandlers\create.ts:19:17)


"The following field is invalid - filename"



import { CollectionConfig } from 'payload/types';
import slug from '../fields/slug';
import { Type as MediaType } from './Media';

export type Type = {
  title: string
  featuredMedia: MediaType
  previewMedia: {
    media: MediaType
  }[]
  location?: string
  slug: string
  meta: MetaType
}
const Portfolio: CollectionConfig = {
slug: 'portfolio',
admin: {
    useAsTitle: 'title',
},

fields: [
    {
      name: 'title',
      type: 'text',
      required: true,
    },
    {
        name: 'featuredMedia',
        label: 'Featured Media',
        type: 'upload',
        relationTo: 'media',
        required: true,
      },
      {
        name: 'location',
        label: 'Location',
        type: 'text',
        required: false,
        admin: {
          position: 'sidebar',
        }
    },
    {
    name: 'images',
    type: 'upload',
    relationTo: 'media',
    filterOptions: {
        mimeType: { contains: 'image' },
    hasMany: true,
    required: true,
  },
},
],
};

export default Portfolio;


 import { buildConfig } from 'payload/config';
import dotenv from 'dotenv';
import Page from './collections/Page';
import Media from './collections/Media';
import Portfolio from './collections/Portfolio';

dotenv.config();

export default buildConfig({
  serverURL: process.env.PAYLOAD_PUBLIC_SERVER_URL,
  collections: [
    Page,
    Media,
    Portfolio,
  ],
});


Here's a video screenshare:



I've run yarn again - packages are up to date



The EPERM error is a standard occurance when the server is already running. I don't think that is related to this issue.



I've edited the Type to include the location field

export type Type = {
  title: string
  slug: string
  text: string
  location?: string
}


I assume I must run yarn dev again or the changes don't reflect? After I run yarn dev I get this message:


 PS C:\git\White_Polaroids\WhitePolaroids6> yarn dev
yarn run v1.22.19
$ ts-node server.ts
[11:09:57] INFO (payload): Connected to Mongo server successfully!
[11:09:57] INFO (payload): Starting Payload...
info  - Loaded env from C:\git\White_Polaroids\WhitePolaroids6\.env
webpack built 0cea50bd02cd37f88e22 in 14623ms
webpack compiled successfully
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: No serializer registered for ConcatSource
<w> while serializing webpack/lib/util/registerExternalSerializer.webpack-sources/ConcatSource -> Array { 2 items } -> ConcatSource


It doesn't provide the success message I received the first time I started the server. The error persists, though I wonder if that's because the server isn't refreshing or if the Type change has had no effect?



Repo:

https://github.com/taunhealy/WhitePolaroids6


  • default discord avatar
    notchr
    5 months ago

    OK SO



    good morning 🙂



    So the filename is invalid error



    What was the file you uploaded



    Let's start with tackling

    [10:01:07] ERROR (payload): ValidationError: The following field is invalid: filename at new ExtendableError
  • default discord avatar
    taun2160
    5 months ago

    Any of these photos. The length of the charaters in the filename shouldn't matter?



    @notchr Here's a screenshot



    I don't think it has anything to do with the string of the filename, as the error persists when I upload a different image with a shorter filename.

    271660658_439098897819256_9185909210904067594_n.jpg
  • default discord avatar
    notchr
    5 months ago

    Right right, hmmm



    Haven't forget, will continue to review once I finish fixing a bug at work 🙂

  • default discord avatar
    taun2160
    5 months ago

    Cool, thanks Chris

  • discord user avatar
    jesschow
    Payload Team
    5 months ago

    The

    images

    field in your

    portfolio

    collection might be the culprit here. The

    upload

    field type doesn't have a

    hasMany

    option and

    required: true

    should be at the top-level instead of in

    filterOptions

    . Should look like this instead:


        {
          name: 'images',
          type: 'upload',
          relationTo: 'media',
          filterOptions: {
            mimeType: { contains: 'image' },
          },
          required: true,
        },
  • default discord avatar
    taun2160
    5 months ago

    Thanks!



    Ah, the error is still there - "The following field is invalid: filename"



    My updated Portfolio collection:



     import { CollectionConfig } from 'payload/types';
    import slug from '../fields/slug';
    import { Type as MediaType } from './Media';
    
    export type Type = {
      title: string
      featuredMedia: MediaType
      previewMedia: {
        media: MediaType
      }[]
      location?: string
      slug: string
    }
    const Portfolio: CollectionConfig = {
      slug: 'portfolio',
      admin: {
        useAsTitle: 'title',
      },
    
      fields: [
        slug,
        {
          name: 'title',
          type: 'text',
          required: true,
        },
        {
          name: 'featuredMedia',
          label: 'Featured Media',
          type: 'upload',
          relationTo: 'media',
          required: true,
        },
        {
          name: 'location',
          label: 'Location',
          type: 'text',
          required: false,
          admin: {
            position: 'sidebar',
          },
        },
        {
          name: 'previewMedia',
          label: 'Preview Media',
          type: 'group',
          fields: [
            {
              name: 'media',
              label: 'Media',
              type: 'upload',
              relationTo: 'media',
              required: true,
            },
          ],
        },
      ],
    };
    
    export default Portfolio;
  • discord user avatar
    jesschow
    Payload Team
    2 months ago

    @taun2160 are you still getting an error here?

  • default discord avatar
    taun2160
    2 months ago

    @jesschow - all good, thanks!

Open the post
Continue the discussion in Discord
Like what we're doing?
Star us on GitHub!

Star

Connect with the Payload Community on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.