general question with custom components

default discord avatar
damnstaychill
4 months ago
9

If you swap out the view.edit or any other big view for a custom component does the custom component receive that necessary props to recreate the current functionality?



Or are there hooks to easily get those values?



Do any examples live in GitHub, I couldn’t find in on the docs or example repo.



(Just asking, I’m thinking if not I can probably look at the source code and just use the same imports etc… to recreate it on my end)

  • default discord avatar
    Alessio 🍣
    4 months ago

    What do you mean with "view.edit"?



    oh nvm now I see what you mean, you mean this part

    https://payloadcms.com/docs/admin/components#collections
  • discord user avatar
    jmikrut
    Payload Team
    4 months ago

    Yes it does include all the props that the built-in one gets

  • default discord avatar
    damnstaychill
    4 months ago

    Awesome thanks for the info, my payload app has a lot of custom stuff going on and this will allow us to take it to the next level 🚀

  • default discord avatar
    Alessio 🍣
    4 months ago

    Really interested what you're trying to do, wanting to replace the entire collection edit component

  • default discord avatar
    damnstaychill
    4 months ago

    To be honest I’m nervous because of how it could impact upgradability down the line but I’m starting to reach the limits of updating the css variables / custom scss.



    For a specific collection, I need the layout to change pretty significantly to support what I want to build.



    The particular collection is a landing page builder with built in live preview as fields change/ based on the auto save draft config. The preview button wasn’t enough anymore.



    I have it working with a custom UI field in a tab view but it’s running into some limits with having it render the desktop view in the limited width space of the current layout because of both side bars



    If I just css away the side bar I lose the publish button etc…



    For those curious, imo the easiest way to go about this is ->



    Take a look at this file for reference ->

    https://github.com/payloadcms/payload/blob/master/src/admin/components/views/collections/Edit/Default.tsx

    Or do as I did and copy that file locally and make changes to just the sections that make sense for your use case so you still get all the goodies without having to rewire it all from scratch

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.