JSX property space codestyle

In a prior version this worked but on a new machine it no longer does

 

given the following 

 

<Button
size="sm"
className="save-shift"
name="save"
type="submit"
loading={ this.state.saving }
>
Save
</Button>

in the prior version this was no issues and would even add the spaces after the {}'s for the loading prop

on the new computer with the same settings imported from the other it now removes those spaces if they exist and will not add them if they're missing.

is there something im missing or just losing my mind?
4 comments
Comment actions Permalink

is it abut spaces within `{}`? Please try enabling Preferences | Editor | Code Style | JavaScript | Spaces, Other/Within interpolation expressions

0
Comment actions Permalink

THANK YOU! this was driving me insane. it does mess up the indention of things but the spaces are now added/preserved.

 

before 

{ !shift.isOpen &&
<Button
className="save-shift mr-1"
color={ shift.published ? 'dark' : 'primary' }
loading={ this.state.saving }
name="save-publish"
size="sm"
onClick={ this.saveAndChangePublish }
>
Save & { shift.published ? 'Unpublish' : 'Publish' }
</Button>
}


after

{ !shift.isOpen &&
<Button
className="save-shift mr-1"
color={ shift.published ? 'dark' : 'primary' }
loading={ this.state.saving }
name="save-publish"
size="sm"
onClick={ this.saveAndChangePublish }
>
Save & { shift.published ? 'Unpublish' : 'Publish' }
</Button>
}

any idea on that one? the <Button component should be indented

0
Comment actions Permalink

If anyone is looking for a workaround to this, you can wrap the element after the condition with parenthesis and have the desired indentation:

{!hasId && (
<PropertyField
label={t('Devices')}
value={openAsset?.devices}
isEditing={isEditing}
xs={12}
/>
)}
0

Please sign in to leave a comment.