metadata.json and props generating extra quotes for enum types

[Georgegriff]

Thank you so much for helping improve the quality of Dash!

We do our best to catch bugs during the release process, but we rely on your help to find the ones that slip through.

Describe your context
Please provide us your environment, so we can easily reproduce the issue.

I've followed this template and got it working https://github.com/plotly/dash-typescript-component-template

Describe the bug

However when i wrap one of our typescript components, e.g. out button which has this prop:

type = {
variant: "primary" | "secondary" | "tertiary"
}

Then metadata.json and propTypes it generates are wrong:

  "value": [
            { "value": "'primary'", "computed": false },
            { "value": "'secondary'", "computed": false },
            { "value": "'tertiary'", "computed": false }
          ],

they have an extra quote around them

i guess under the hood its using this https://github.com/plotly/dash/blob/dev/dash/development/_generate_prop_types.py and using the metadata.json as source of truth, which i'm not sure where is coming from maybe react-docgen,

perhaps _generate_prop_types.py should strip out extra quotes of enums before writing the proptypes code?

dash/dash/development/_generate_prop_types.py

Line 69 in 76a8e16

def generate_enum(prop_info):

Expected behavior
Type enum's should not have extra quotes generated
Screenshots

[Georgegriff]

Is this proptypes stuff even that needed these days? when all the python code that gets generated from the typescript types infers all of this anyway? what does proptypes.js actually give in addition?

[T4rk1n]

This is normal, the metadata.json values is for generating Python types and validation. The proptypes.js is generated to provide runtime validation with the dash dev tools.

[gvwilson]

closing as "working as intended" - thanks.

[sam-silver-amp]

It appears that the generated proptypes.js has the same issue @gvwilson

ex.

type TestEnum = "A" | "B" | "C"

gives me in proptypes.js

pt.oneOf(["'A'", "'B'", "'C'"])};

And then the runtime checking seems to fail when passing the proper literals to the built python component