Issues with applying hook output to a field with type select

remy_903 years ago

12

• 

  jarrod_not_jared

  3 years ago

  You can make a collection for

  questions

  and then make this field a relationship field related to the questions collection. Then in this field users could search/select or create new questions inline.

• 

  remy_903 years ago

  @281120856527077378

  could you provide a bit more info:

  
  

  * Is there something wrong with using a field in this scenario?

  
  
  

  On a separate note, following on from your suggestion, I've created:

  
  
  import { CollectionConfig } from 'payload/types'; import { prerequisite } from '../prerequisite'; import richText from '../../fields/richText'; export const QuestionSets: CollectionConfig = { slug: 'question-set', versions: { drafts: true, }, fields: [ { name: 'Question set', type: 'relationship', required: true, relationTo: "" }, richText({ name: "question", label: "Question", required: true, admin: { elements: [], leaves: ["underline"], }, }), prerequisite, { name: "answers", type: "array", label: "Answers", minRows: 2, required: true, labels: { singular: "answer", plural: "answers" }, fields: [ { name: "answer", type: "text", } ] }, ] }
  
  

  but I didn't quite follow what you meant by "make this field a relationship field related to the questions collection" - Is this a relationship to itself?

  
  
  

  You refer to questions as a collection

  and

  as a relationship field?

• 

  jarrod_not_jared

  3 years ago

  So a relation field like:

  
  

  {
    name: 'questions',
    type: 'relationship',
    hasMany: true,
    required: true,
    relationTo: ""
  }

  
  
  

  needs to have a relationTo value, the relationTo value is the slug of the collection, it could be

  questions

  and then on your

  QuestionSets

  collection, you would add a field like the above and set

  relationTo: "questions"
• 

  remy_903 years ago

  Thanks for getting back to me on this. So both question-set and question are collections in this scenario?

  
  
  

  I'm also trying to understand what you're proposing each collection does - would it be that one creates questions and answers, the other populates the select options?

• 

  jarrod_not_jared

  3 years ago

  Correct, one holds the q&a's, and the relationship field allows you to select them, allowing for dynamic values

• 

  remy_903 years ago

  So I've rearranged my data structures how I think you've described. I have a "Question set" collection with a relationship to a "Prerequisite" collection:

  
  
  export const Prerequisite: CollectionConfig = { slug: 'prerequisite', labels: { plural: 'prerequisites', singular: 'prerequisite' }, fields: [ prerequisite ], hooks: { beforeChange: [beforeChangePrerequisite], beforeValidate: [beforeValidatePrerequisite], beforeRead: [beforeReadPrerequisite], beforeOperation: [beforeOperationPrerequisite] } }
  
  

  I feel like I've gone a step backwards as the hooks no longer have access to the questionSet data and have been replaced with data that looks like this:

  
  
  "{ id: '63e36bc9d64cd8091ec9b961', createdAt: '2023-02-08T09:30:49.196Z', updatedAt: '2023-02-08T09:30:49.196Z' }"
  
  

  which are the prerequisites I've created with the text input. So if relationships are the recommended model, how can data from the relationship parent be passed to the relatesTo child?

• 

  jarrod_not_jared

  3 years ago

  What is the goal here? I feel like we are talking very abstract and it makes it challenging to align thoughts.

  
  
  

  As for getting the data, you can use

  await payload.findByID({ ... })

  function to fulfill the questionSet document data inside your hook 👍

• 

  remy_903 years ago

  The goal is to setup a survey with conditional follow up questions based on answers to questions. i.e. if Q1 = A, fast forward to Q3.

  
  
  

  In the admin UI, I would want to assign the prerequisite ID on

  Q3

  as "Q1=A", from a dynamic dropdown of all the possible Question&Answer combos.

  
  
  

  will report back regarding the data fetch

  
  
  

  One initial question still remains: how do I get the data from find by id into a field of type select?

  
  
  @281120856527077378

  I've messaged a video link describing the goal and a bit of my implementation, apologies for the low quality, just trying to keep file size down

• 

  jarrod_not_jared

  3 years ago

  Hey

  @536888652257558538

  just watched your vid! Gathering some thoughts now

  
  
  

  So do you want answers to show/hide? or questions? (based on previous question answers)

• 

  remy_903 years ago

  Yes. The logic for showing questions will live in the ui, the decisions will be made in the cms

  
  
  

  I’m trying to accomplish this with anything other than a text input, if I do so, I think my company will be sold on the transition

  
  
  

  I would like to show/hide

  question sets

  , questions with their answers

  
  
  

  (Conditional answers will probably be a nice to have but not part of my POC)

• 

  jarrod_not_jared

  3 years ago

  I think a custom component would likely be the best solution here. Since arrays arrays are determined by user input, to get the dynamic select you are looking for you will want to use text field, with a custom component (assuming you want to keep the value format to match your current ui shape)

  
  
  

  This would actually be really cool

  
  
  

  not sure if you have seen our react hooks, but they can provide the data you need to create the custom select options, you can use payloads Select component as well and just feed your formatted options into that!

  
  
  

  react hooks:

  https://payloadcms.com/docs/admin/hooks#react-hooks
  
  

  select component (can be imported from

  payload/components/fields/Select

  ):

  https://github.com/payloadcms/payload/blob/master/components/fields/Select.ts
• 

  remy_903 years ago

  I was thinking I'd go down the custom component route, just wanted to make sure I wasn't underutilising what already exists. I've got till Tuesday. Will share what I have if I'm successful with my timeframe

  
  
  

  Thanks!