Allow for custom purpose list to be loaded

[dnoneill]

I am trying to figure out how to do this. The problem I am running into is I can't seem to get the props outside a function and based on the way purpose lists are currently set up as a constant, I would like to basically set that constant based on the props (see below). Can't seem to figure out how to do this.

const PURPOSES = props.purposelist ? props.purposelist : [
{'value': 'assessing', 'label': 'Assessing'},
{'value': 'bookmarking', 'label': 'Bookmarking'},
{'value': 'classifying', 'label': 'Classifying'},
{'value': 'commenting', 'label': 'Commenting'},
{'value': 'describing', 'label': 'Describing'},
{'value': 'editing', 'label': 'Editing'},
{'value': 'highlighting', 'label': 'Highlighting'},
{'value': 'identifying', 'label': 'Identifying'},
{'value': 'linking', 'label': 'Linking'},
{'value': 'moderating', 'label': 'Moderating'},
{'value': 'questioning', 'label': 'Questioning'},
{'value': 'replying', 'label': 'Replying'},
{'value': 'supplementing', 'label': 'Transcription'}
]

[rsimon]

Whatever you add in the config object for the widget gets passed into the widget component via the props. The widget component in this case is the CommentWidget. Passing it further down (e.g. into Comment) is something you'll need to handle yourself, in the usual React way. (I.e. passing purposes={props.purposes} into Comment.)

[dnoneill]

Yeah I looked at that. The problem I am running into is you can't get props outside a function. If you look at the code, I can get the props at the line I have highlighted. I was wondering if there was a way to access props outside line 62. I tried this but it was undefined. So I wasn't sure if I was trying to access the wrong variable.

[rsimon]

Not sure I understand. But it's there anything keeping you from simply doing

options={props.purposes || PURPOSES}

In line https://github.com/recogito/recogito-client-core/blob/main/src/editor/widgets/comment/PurposeSelect.jsx#L30?

[dnoneill]

Yeah. https://github.com/recogito/recogito-client-core/blob/main/src/editor/widgets/comment/PurposeSelect.jsx#L23 and https://github.com/recogito/recogito-client-core/blob/main/src/editor/widgets/comment/CommentWidget.jsx#L7 stop that from working.

[rsimon]

Well there's no one-line solution, true. But you can still move all these things into the various functions. You just can't handle everything via a simple single static import as before. (Less nice, of course.)

[dnoneill]

Yeah. I tried moving purposes to a function but for some reason it would not feed props into the function.

[rsimon]

Sorry, I can't look into the details now. But there's really nothing automatic that React will do for you. The init args are wired up so that they get added to the props passed into CommentWidget. But then that's it - they won't go into PurposeDropdown, Comment, TectArea etc. automatically. If you need them anywhere in these components, you'll need to pass them in through the normal React props passing mechanism.