aws-amplify / amplify-studio

AWS Amplify Studio (Formerly Admin UI)
136 stars 31 forks source link

Add ability to configure "options" property for SelectField component in Amplify Studio #626

Open Jshhhh opened 2 years ago

Jshhhh commented 2 years ago

Is your feature request related to a problem? Please describe. Unable to configure SelectField options without writing code.

From AWS Ampliy Discord #studio-help

I haven't quite worked that out. Basically, what I'm trying to do, is have the user click an item in a Collection (of model type "Client") and then that take to a page with a Collection of model type "Card". The Card model has a relationship with Client, linked by prop "clientID". So I want to filter the Collection of Cards by the clientID. But I think my issue might be more fundamental than this. I've gone through the docs several times and tried to follow the instructions verbatim. This section here suggests I should see a "View/Edit" link on the right-hand panel:

Describe the solution you'd like Ability to add and configure "options" prop to SelectField component within Amplify Studio

Describe alternatives you've considered Current workaround (@hein-j ):

export default function MyComponent(props) {
  const {overrides,...rest} = props;
  return (
    <Flex>
      <SelectField {...getOverrideProps(overrides, "MySelectField")} />
    </ Flex>)
<MyComponent overrides={{MySelectField: {children: <><option /><option /><option /></>}}} />

Must be on ^3.1.0 of @aws-amplify/ui-react to do this in Typescript.

cacengineering commented 2 years ago

Still no update on this one ?

hein-j commented 2 years ago

Hey @cacengineering , we're currently working on a feature that will make this and other aspects of integrating UI with DataStore much more nuanced. In the meanwhile, another workaround (besides the overrides one) is to use our new feature, Slots. https://docs.amplify.aws/console/uibuilder/slots/

  1. set the children Prop of your SelectField to a slot.
  2. Pass in something like into the slot after querying data store.