fiverr/eslint-config-fiverr

Ignore import/no-named-as-default

alonfixler opened this issue · 6 comments

I suggest the following change:
#18

It's already been disabled in https://github.com/fiverr/logo_editor_perseus/blame/master/src/apps/editor/components/SVGRoot/SVGLayerByType/index.js#L3 and going forward I believe that many applications/packages will disable it.

Main pain is that in many cases we export wrapped components and when consuming them we don't want to call it with a weird name which contains wrapper/connected.

I'm good with this change - I find this annoying as well.

The main reason I think it's actually good is because importing a default export with the name of a named export causes a lot of confusion, especially in repos where developers export both connected components and non-connected ones.

This mitigates the possibility that you'd get confused and try to import a named export as a default and vice-versa.

I see what you're saying but I doubt if this will actually lead to a bug. Also, with our IDEs when navigating it's very clear to see where did the import originated.

For example in Gig page we have a wrapper called SafePureComponent which basically wraps all of our main components with an ErrorBoundary and creates them as a PureComponent. In the components itself I'm exporting them also as non default for unit testing since I don't want to use mount to test them and it also doesn't make sense to import them as SafeSellerCard instead of just SellerCard in the main component of the page.

I'm in for this change, I find this lint error a bit annoying as well.
Few alternatives though:
1. Reduce rule severity to warning.
2. Move the connected component to a separate file and use a default export.

Personally I prefer the second option as it also decouples redux from the UI layer.

In terms of HOC with no real functional wrapping I agree with @alonfixlerfiverr this rule will force using non intuitive naming, while on the other side using meaningful names when adding functional wrappers on a component, is up to the developers to name the wrapped component meaningfully.

Since most of us agree I'll push the pr.