Use amo eslint config #2666
Use amo eslint config #2666
Conversation
There was a problem hiding this comment.
I didn't want to comment on every one but where it's obvious it would be nicer to keep every attribute on its own line when they're multiline (including the first attribute after the component/tag name) and to put the closing > on its own line.
Very cool, I like this 👍
r+wc
src/amo/components/AddonMeta.js
Outdated
| <Rating className="AddonMeta-Rating" | ||
| rating={averageRating} | ||
| readOnly | ||
| styleName="small" /> |
There was a problem hiding this comment.
Just a note that I think these multi-line tags look nicer/align better like:
<Rating className="AddonMeta-Rating"
rating={averageRating}
readOnly
styleName="small"
/>it's actually what we (I?) have been doing recently. If eslint is cool with that I'd say change it to that while we're already changing these.
There was a problem hiding this comment.
The rule relates to props on the multiline - it doesn't cover closing > or /> afaik. Will check if there's another rule that can do that.
There was a problem hiding this comment.
Aha looks like there is a rule, I'll add that and use it.
src/amo/components/Addon/index.js
Outdated
| )} className="AddonDescription"> | ||
| <ShowMoreCard | ||
| header={i18n.sprintf(i18n.gettext('About this %(addonType)s'), { addonType })} | ||
| className="AddonDescription"> |
There was a problem hiding this comment.
Same here for the ending > alignment.
src/amo/components/Categories.js
Outdated
| {categories.map((category, index) => ( | ||
| <li className="Categories-list-item" key={`category-${index}`}> | ||
| {categories.map((category) => ( | ||
| <li className="Categories-list-item" |
There was a problem hiding this comment.
I think if we have newlines in tags at all we should put every attribute on its own line.
src/amo/components/Categories.js
Outdated
| <li className="Categories-list-item" key={`category-${index}`}> | ||
| {categories.map((category) => ( | ||
| <li className="Categories-list-item" | ||
| key={category.name}> |
There was a problem hiding this comment.
Same here for the ending > alignment.
src/amo/components/Footer/index.js
Outdated
| </li> | ||
| <li> | ||
| <a href="#desktop" className="Footer-link Footer-desktop" | ||
| <a href="#desktop" |
There was a problem hiding this comment.
All attrs on newline would be good.
src/amo/components/ScreenShots.js
Outdated
| close={this.onClose} | ||
| items={formatPreviews(previews)} | ||
| options={PHOTO_SWIPE_OPTIONS} | ||
| thumbnailContent={thumbnailContent} /> |
There was a problem hiding this comment.
Same here for the ending > alignment.
src/amo/components/Search/index.js
Outdated
| currentPage={page} | ||
| count={count} | ||
| pathname={pathname} | ||
| queryParams={queryParams} /> |
There was a problem hiding this comment.
Same here for the ending > alignment.
src/amo/components/Search/index.js
Outdated
| hasSearchParams={hasSearchParams} | ||
| loading={loading} | ||
| pathname={pathname} | ||
| results={results} /> |
There was a problem hiding this comment.
Same here for the ending > alignment.
src/amo/components/SearchForm.js
Outdated
| action={`/${api.lang}/${api.clientApp}${pathname}`} | ||
| onSubmit={this.handleSearch} | ||
| className="SearchForm-form" | ||
| ref={(ref) => { this.form = ref; }}> |
There was a problem hiding this comment.
Same here for the ending > alignment.
| 'SearchSortLink--active': currentSort === sort, | ||
| })}> | ||
| <Link to={sortURL} | ||
| className={classNames('SearchSortLink', { 'SearchSortLink--active': currentSort === sort })}> |
There was a problem hiding this comment.
Same here for the ending > alignment.
| "mocha": true, | ||
| }, | ||
| "extends": "airbnb", | ||
| "extends": "amo", |
There was a problem hiding this comment.
This is outside the scope of this PR, but we should rename this. I've filed: mozilla/eslint-config-amo#7
Fixes mozilla/addons#10524
This configures addons-frontend to use https://github.com/mozilla/eslint-config-amo/
Once this lands all related eslint prs from greenkeeper can be closed.