How to edit the list view of an upload collection?

Deleted User3 years ago

3

import React from "react";
import Example from "payload/dist/admin/components/views/collections/List/Default";
import { Props } from "payload/dist/admin/components/views/collections/List/types";

function ProductsList(props: Props) {
    return (
        <Example
            collection={props.collection}
            columnNames={props.columnNames}
            data={props.data}
            hasCreatePermission={props.hasCreatePermission}
            limit={props.limit}
            newDocumentURL={props.newDocumentURL}
            setColumns={props.setColumns}
            setListControls={props.setListControls}
            setSort={props.setSort}
            tableColumns={props.tableColumns}
            setLimit={props.setLimit}
        />
    );
}

export { ProductsList };

• 

  jarrod_not_jared

  3 years ago

  You can use your own custom

  List

  component to do this, read a bit more about this here:

  https://payloadcms.com/docs/admin/components#collections
  
  

  Basically, on your upload collection you will need to add

  admin: { views: { List: ProductsList } }
• 

  Deleted User3 years ago

  yes i'm doing this but i meant i want to access the default Upload list component that Payload provides me, so that i can edit parts of it. i don't want to build the component from scratch or only change some props. for example i want to change the shape of that Product in the image to be horizontal and including other fields

  
  
  

  if that's possible

  
  
  

  i imported views/collections/List/Default but i can't customize it any more than change its props like collection and columnNames, etc.

• 

  jarrod_not_jared

  3 years ago

  Sure that makes sense. Currently you would have to copy that file (ensure import paths are updated to point to dist instead of relative paths) and then swap out the UploadGallery with your own gallery component.

  
  
  

  I think in the future, uploads will change - either we go with list/grid display (option toggle) or just align the upload gallery so it matches the collection lists

  
  
  https://github.com/payloadcms/payload/discussions/1337