dsternlicht / RESTool

RESTool is an open source UI tool for managing RESTful APIs. It could save you time developing your own internal tools. A live example:
https://dsternlicht.github.io/RESTool/
MIT License
478 stars 120 forks source link

Selecting multiple options from a pre-defined list #161

Closed EoinGriffin-AI closed 2 years ago

EoinGriffin-AI commented 3 years ago

Hello,

In a previous version of RESTool we could use a "select" input field to select multiple options from a pre-defined list, and it would populate an array like this:

{
// ... other properties,
  "Applicability": [
    "AppliesToReports",
    "AppliesToLocationNotes"
  ]
}

multi-select

But now that I've just updated to the most recent version, I can't see any way to select multiple options (either with a select or any other way) and maintain the same data structure that gets POSTed. I'd rather not resort to a long list of checkboxes and a new data structure if I can avoid it. How can I achieve the previous functionality with the latest version of RESTool?

Here's the best I can get with the latest version. It only allows a single selection:

multi-select-2

dsternlicht commented 3 years ago

hmm it looks like it's not available in the new version, but definitely could be added. Would you like to develop and add it?

EoinGriffin-AI commented 3 years ago

@dsternlicht At the moment I don't have the time available to work on this. I was hoping there would be a way already that I wasn't aware of.

We're still using the angular version of RESTool and unfortunately I think we're going to have to stick with that for now. I was hoping to update and make use of the dataTransform functionality but without a solution for this problem we don't have the budget to upgrade and also make the fixes to bring back older functionality that we rely on.

dsternlicht commented 3 years ago

@EoinGriffin-AI Got it. I'll try to see if there's a quick win here. Leaving this issue opened for now.

EoinGriffin-AI commented 3 years ago

@dsternlicht Have you had any chance to look into adding this functionality? It would be wonderful to have something like this available in RESTool: https://www.npmjs.com/package/multiselect-react-dropdown

RyanPrice-King commented 2 years ago

I have just started using RESTool, but this functionality to allow for a multi-select optionSource is really important for my app. Is this in the works, or what version could I use for this functionality please?

dsternlicht commented 2 years ago

hey @RyanPrice-King as far as I know it's not in work right now, but you're more than welcome to add and PR it :)

RyanPrice-King commented 2 years ago

I might struggle to find time for this as I do not know the language or your code yet. Any pointers might be useful if I am to try.

dsternlicht commented 2 years ago

@RyanPrice-King Basically what you want to do is to simply add a new case for string arrays, and to create a component for it that will handle the UI. You'll do it here: https://github.com/dsternlicht/RESTool/blob/2da014f3b65918de87d611b88d3ecb81157c3d99/src/components/formRow/formRow.comp.tsx#L149

RyanPrice-King commented 2 years ago

@dsternlicht @EoinGriffin-AI checkout #193 and let me know what you think. I believe it is finally done. It took me a while to learn the language and follow your code to get this to work, but I hope these code changes are to your liking :).

RyanPrice-King commented 2 years ago

I did initially have a separate select-multi component, but with https://www.npmjs.com/package/multiselect-react-dropdown you can use it for either, so I was able to allow it to use the normal 'select' component and just add "multi": true to the config options. Just to add additional optional configuration, you can also limit the selection limit with "selectLimit": 2. The PR also includes the changes in the README.md.

It might be good to expand this to allow for an JSON object array return based on config option too. { // ... other properties, "Applicability": [ "AppliesToReports", "AppliesToLocationNotes" ] }

So far this passes multiple selection as "{Applicability": "AppliesToReports,AppliesToLocationNotes"}

If either of you find this useful, then I may be able to implement that also.

I have just noticed I need to do some more CSS changes after the weekend too.

dsternlicht commented 2 years ago

Overall, I love the approach, but please see my comments: https://github.com/dsternlicht/RESTool/pull/193

RyanPrice-King commented 2 years ago

Is this not completed yet?

dsternlicht commented 2 years ago

Yes it is :)

EoinGriffin-AI commented 2 years ago

Yay! Thank you @RyanPrice-King for adding this 🥇 💯 Exciting news :-D I'm going to check this out. One step closer to allowing us to upgrade to the latest version 👍