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.

many to many relation problem

default discord avatar
rnbsovlast year
88

I have Projects, that can assign roles/tasks to employees from employees collection





so I created join table ProjectAssignments



where employee and specific role to it can be selected



here is how project creation looks



when I try to add an assignment



it opens a new modal where I need to select project, I would like it to be populated with project I came from (and maybe even hide it, and be selected based on project I came from)



and there is also problem with these assingments, that displayed name is just id of corresponding join table



I would like it to be consisted from employee>name + role/assignment of it



I would like to probably hide ProjectsAssignments from admin ui, because I don't think users of this admin panel will understand many-to-many join table, so I would like to leave them with

Project

edit page creation of these assignments



@akhrarovsaid



@654031862146007055

I would also like to create a select component of employees, that would have avatar + name as select options



not sure it availible in payload



probably needs to be created as custom component

  • default discord avatar
    zed0547last year
    that displayed name is just id of corresponding join table

    You need

    admin.useAsTitle

    on these collections



    https://payloadcms.com/docs/configuration/collections#admin-options

    I would also like to create a select component of employees, that would have avatar + name as select options

    This sounds like a custom select component

  • default discord avatar
    rnbsovlast year

    oh, actually I already added this field



    but no avail

  • default discord avatar
    zed0547last year
    it opens a new modal where I need to select project, I would like it to be populated with project I came from

    This sounds like a bug if it's not populating, it should be



    Restart dev server



    What payload version are you on?



    Also, you are showing me collections with

    useAsTitle

    on them but you need useAsTitle on the collections in the

    relationTo

    that you reference



    projectAssignments

    need a

    useAsTitle
  • default discord avatar
    rnbsovlast year

    the first thing I tried to do



    these collection started to use as primary field, but in the projects, it displays just ids

  • default discord avatar
    zed0547last year

    In your

    projectAssignments

    do you have a

    useAsTitle

    ?

  • default discord avatar
    rnbsovlast year

    yep

  • default discord avatar
    zed0547last year

    Shouldn't be a relationship field, that's why you are getting primary key

  • default discord avatar
    rnbsovlast year

    ugh

  • default discord avatar
    zed0547last year

    You should add a new hidden field that uses the value of your employee



    Add it in a hook or something



    beforeChange would work



    It constructs the value you want, then use that as the title



    Internally, relationships are saved as id's



    That's why you get a primary key as the title

  • default discord avatar
    rnbsovlast year

    alright



    thanks



    I think I'm starting understanding



    something like this right?

  • default discord avatar
    zed0547last year

    Yep!

  • default discord avatar
    rnbsovlast year


    hooks was the concept I had troubles understanding



    thanks, your mentorship on my problem lit the light to me



    it should be

    originalDoc

    isn't?

  • default discord avatar
    zed0547last year

    I think

    data

    here should be fine



    Then return the data

  • default discord avatar
    rnbsovlast year

    bunch of errors



    ugh



  • default discord avatar
    zed0547last year

    You can use

    operation

    to scope it to create and updates, also make sure you actually have the appropriate data here to set, don't forget to add an employeeName field and generateTypes

  • default discord avatar
    rnbsovlast year
  • default discord avatar
    zed0547last year

    You are trying to overwrite a reltationship field with a string



    You need a new field

    employeeName

    And use that as the title

  • default discord avatar
    rnbsovlast year

    I should add it to the collection



    ?

  • default discord avatar
    zed0547last year

    Yep

  • default discord avatar
    rnbsovlast year


    I've set it as hidden



    okay?





    this should be working

  • default discord avatar
    zed0547last year

    You need to generate types for it but yeah, restart dev server should do that for you if HMR didn't already

  • default discord avatar
    rnbsovlast year

    yeah, problem with this



    for a some reason after restarting, the type error still present

  • default discord avatar
    zed0547last year
    const employeeID = typeof data.employee === 'number' ? data.employee : data.employee.id
  • default discord avatar
    rnbsovlast year

    just ts server error I guess



    I'm currious how it would look with

    operation

    arg that you've mention

  • default discord avatar
    zed0547last year
    if (operation === 'create' || operation === 'update') { ... }

    Just scope it down, no need to set a field if it's a delete

  • default discord avatar
    rnbsovlast year

    oh I see





    this issue is still present



    I hope scoped it properly



    I'm feeling a bit silly because I'm asking a bunch of questions and taking your time

  • default discord avatar
    zed0547last year

    You did the inverse

  • default discord avatar
    rnbsovlast year

    but your help is priceless for me

  • default discord avatar
    zed0547last year

    You want to be running your hook if it is a create or update

  • default discord avatar
    rnbsovlast year
  • default discord avatar
    zed0547last year

    Right now you are running it only if it is not a create or update



    Yep

  • default discord avatar
    rnbsovlast year

    nice



    thanks



    I don't understand this eror

  • default discord avatar
    rnbsovlast year

    why Employee object appers as a whole

  • default discord avatar
    zed0547last year

    Depending on the context it may be a number Id or an employee



    Payload doesn't know I'm advance

  • default discord avatar
    rnbsovlast year

    oh thanks

  • default discord avatar
    zed0547last year

    It also depends on access controls and depth

  • default discord avatar
    rnbsovlast year

    I don't know context where this could be employee object



    hmm

  • default discord avatar
    zed0547last year

    Well it's not necessarily up to yoy to decide, it's Payload who will decide when and where, we should account for both cases



    Generally, in hooks it will always be an ID though



    For performance

  • default discord avatar
    rnbsovlast year

    pretty tricky moment, but thanks now I know how to write hooks properly



    will keep in mind this quirk



    interesting





    strange thing





    tried to log it



    but nothing seems to appear in the console



    and in browser console too



    ugh

  • default discord avatar
    zed0547last year

    Have you added it to hooks in your collection?



    hooks.beforeChange: [getEmployeeName]
  • default discord avatar
    rnbsovlast year


    sure

  • default discord avatar
    zed0547last year

    Is there an employee set before you save?

  • default discord avatar
    rnbsovlast year

    yep



    in the Employee column, it references its name properly



    I also don't understand why loggin is not working



    seems like this hook is not called



    oh wait



    maybe this is because this entry was created before employeeName hidden field was added?



    this might be the case right?

  • default discord avatar
    zed0547last year

    Try making a new one

  • default discord avatar
    rnbsovlast year

    it works!



    ugh



    I bit upsetting, because I might encounter with it in the future again



    how do I rerun hooks on the previous entries?



    if I would need it just in case

  • default discord avatar
    zed0547last year

    Just go into them, change something, revert the change and save

  • default discord avatar
    rnbsovlast year

    oh



    alright

  • default discord avatar
    zed0547last year

    You can also just call an empty update on them via apis

  • default discord avatar
    rnbsovlast year

    not sure I know how



    just call some put method?

  • default discord avatar
    zed0547last year

    Yep

  • default discord avatar
    rnbsovlast year

    oh okay



    so is there a way to make it more convinient?



    hide project field, make it default be the project where user came from maybe



    I also don't think modal suits this task, but I don't know if payload have other options



    @654031862146007055

    I'm sorry, I need your advice please

  • default discord avatar
    zed0547last year
    so is there a way to make it more convinient?

    It sounds like a bug to me honestly, but are you clicking the '+' or the edit icon next to a doc?



    One way would be to hide the field, then use a custom component to get the doc id of the currently open doc and populate it using react hooks



    It's a Drawer component that opens btw

  • default discord avatar
    rnbsovlast year

    I was clicking the plus icon

  • default discord avatar
    zed0547last year

    Hmm, maybe open an issue with a reproduction on GH



    Might get looked at, I feel like it should open with a reference to the currently editted doc

  • default discord avatar
    rnbsovlast year

    edit icon

  • default discord avatar
    zed0547last year

    But maybe not idk

  • default discord avatar
    rnbsovlast year

    plus icon



    and yeah, now I see that's a drawer



    may I send you the whole code?



    zip it and send

  • default discord avatar
    zed0547last year

    But for what?



    This is expected behavior right now afaik

  • default discord avatar
    rnbsovlast year

    ugh



    hmm



    that's sounds hard

  • default discord avatar
    zed0547last year

    Shouldn't be too bad



    I suppose it depends on your comfort level with React

  • default discord avatar
    rnbsovlast year

    hide what field?



    you mean replace it with a custom select component?

  • default discord avatar
    zed0547last year

    The project field, no need to replace



    No need to hide technically either



    Can use a UI field type for this

  • default discord avatar
    rnbsovlast year

    hm



    I know how to get the path segments using a hook



    I don't understand where should I add this type field



    in what collection?



    projects?



  • default discord avatar
    zed0547last year

    Whatever collection this drawer opens

  • default discord avatar
    rnbsovlast year

    okay, it opens the

    ProjectAssignments

    collection



    and here project field already have type of relationship

  • default discord avatar
    zed0547last year

    Ok, so you want it to be auto populated if you're coming from an existing project and click the '+' right?



    So the ui field would grab the current project id, if any, and assign it to that relationship field

  • default discord avatar
    rnbsovlast year

    exactly



    hmm, so I need new hidden field

  • default discord avatar
    zed0547last year

    Doesn't need to be a new hidden field

  • default discord avatar
    rnbsovlast year

    and where should I write the logic

  • default discord avatar
    zed0547last year

    In a UI type field custom component



    https://payloadcms.com/docs/fields/ui
  • default discord avatar
    rnbsovlast year

    it seems like I need to do something like this



    but it should return empty component



    with running hook, that alter project field value, right?



    I wonder is there any example of similar thing implemented



    Don't know how to change project field inside of a hook, after I get the id of a project from the current url

  • default discord avatar
    zed0547last year

    Your field definition is wrong



    https://payloadcms.com/docs/fields/ui#example

    I'm also talking about doing it with

    React

    hooks not Payload hooks



    You pass a path to a custom component



    Not a React Element

  • default discord avatar
    rnbsovlast year

    yeah, I understand that\



    via path



    as always in payload



    I just wrote it this way for example



    so I will have my custom component



    but how to alter project field value inside of it

  • default discord avatar
    zed0547last year

    I encourage you to read through the docs here:

    https://payloadcms.com/docs/admin/react-hooks#useformfields
  • default discord avatar
    rnbsovlast year

    thanks!



    that was all I need



    thank you a lot!



    really



    you helped me figure payload out as no one else

  • default discord avatar
    zed0547last year

    My pleasure, truly

  • default discord avatar
    rnbsovlast year

    actually

  • default discord avatar
    zed0547last year

    Have some fun with it

  • default discord avatar
    rnbsovlast year

    I would like to become contributor too



    but I don't know where to start



    payload codebase seems to be very complex

  • default discord avatar
    zed0547last year

    My honest recommendation here is to start learning Payload as best you can. Then answer questions on Discord from users

  • default discord avatar
    rnbsovlast year

    such big projects source code looks very overwhelming and daunting

  • default discord avatar
    zed0547last year

    And then when you are comfortable enough, then start diving into the codebase



    Discord questions will naturally make you search the codebase for answers



    After you get comfortable doing that, start trying to reproduce issues in GH and finding fixes for them

  • default discord avatar
    rnbsovlast year

    okay, I will try to figure payload through docs as much as I can

  • default discord avatar
    zed0547last year

    This is how I started tbh

  • default discord avatar
    rnbsovlast year

    interesting



    thank you !

  • default discord avatar
    zed0547last year

    Of course!

  • default discord avatar
    rnbsovlast year

    best wishes!

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.