brandongregoryscott / eslint-plugin-collation

ESLint plugin for making your code easier to read, with autofix and TypeScript support

Home Page:https://eslint-plugin-collation.brandonscott.me

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Bug: alphabetize-jsx-props only sorts nested JsxElements 1 level, it seems

brandongregoryscott opened this issue · comments

While there's a current test that covers this scenario:

// input
<Button marginY={8} marginRight={12} iconAfter={<CogIcon size={24} color="gray" />}>
    Settings
</Button>

// expected
<Button iconAfter={<CogIcon color="gray" size={24} />} marginRight={12} marginY={8}>
    Settings
</Button>

A forgotten node error will throw on this setup:

// input
<Pane>
    <FormField
        label="Preview"
        hint={
            <InlineAlert>
                Curve and Release changes will not be reflected until
                saving and reopening.
            </InlineAlert>
        }>
        <Button marginY={8} marginRight={12} iconAfter={<CogIcon size={24} color="gray" />}>
            Settings
        </Button>
    </FormField>
</Pane>

// expected
<Pane>
    <FormField
        hint={
            <InlineAlert>
                Curve and Release changes will not be reflected until
                saving and reopening.
            </InlineAlert>
        }
        label="Preview">
        <Button iconAfter={<CogIcon color="gray" size={24} />} marginRight={12} marginY={8}>
            Settings
        </Button>
    </FormField>
</Pane>

Resolved with 3e1df55