docusaurus icon indicating copy to clipboard operation
docusaurus copied to clipboard

Make a distributed eslint plugin to enforce best Docusaurus practices

Open Josh-Cena opened this issue 3 years ago • 16 comments

Have you read the Contributing Guidelines on issues?

Motivation

I realized there are a few text labels in our repo that are accidentally not translated. This has happened a few times in the past as well (see #4542). It would be interesting if we can make an eslint plugin with two rules:

  1. no-dynamic-i18n-messages: ensures that all translate calls are plain text labels
  2. no-untranslated-text: ensures all text labels in JSX are wrapped by translate calls (may have lots of false positives, but interesting to see how close we can get)

See https://docusaurus.io/docs/next/i18n/tutorial#translate-your-react-code for some documentation of the mental model of translate APIs.

We can publish this plugin as @docusaurus/eslint-plugin, so users can use this for themselves, as well as plugin/theme authors.

We may even ensure more best practices:

  • prefer-docusaurus-link: ensures @docusaurus/Link is used instead of a tags
  • prefer-ideal-image: ensures @theme/IdealImage is used instead of img tags
  • prefer-docusaurus-heading: ensures @theme/Heading is used instead of h2 tags
  • no-hardcoded-src: ensures all src attributes are either require or useBaseUrl
  • no-window-eq-undefined: forbid typeof window !== 'undefined' because this is not an adequate way to escape SSR

Self-service

  • [X] I'd be willing to do some initial work on this proposal myself.

Josh-Cena avatar Jan 26 '22 10:01 Josh-Cena

yes we definitively want an eslint plugin 👍

slorber avatar Jan 27 '22 12:01 slorber

Hello can I be assigned this issue?

dave-sh avatar Jan 28 '22 20:01 dave-sh

@dave-sh Sure, please go ahead. You have a week to send your initial work. Good luck!

Josh-Cena avatar Jan 29 '22 01:01 Josh-Cena

This issue is up for grabs again, since @dave-sh seems to be unavailable.

Josh-Cena avatar Feb 05 '22 03:02 Josh-Cena

can I contribute to this?

Ash-KODES avatar Feb 25 '22 09:02 Ash-KODES

@Ash-KODES Sure—again, the work needed is given in the description. If you have any doubts, you can ask on the Discord server. You have a week to send your initial work. Good luck!

Josh-Cena avatar Feb 25 '22 09:02 Josh-Cena

Due to the unresponsive nature of these kinds of issues, if anyone wants to grab the issue, just send a PR directly. No need to ask for permissions.

Josh-Cena avatar Mar 05 '22 01:03 Josh-Cena

I would like to take up this issue @Josh-Cena . I would require some pointers as well on solving this issue.

alceil avatar Apr 01 '22 06:04 alceil

@alceil This issue would require you to have some understanding in developing ESLing plugins, or at least working with ASTs in general. Are you looking for pointers on how to develop an ESLint plugin, or just how to translate my issue description into more concrete demand? I can elaborate on the latter, but probably not on the former.

Josh-Cena avatar Apr 01 '22 06:04 Josh-Cena

Also cc @armano2 not sure about your availability, but I guess you would like this? This issue would probably not be resolved in a while, so whenever you have time you can take a look

Josh-Cena avatar Apr 01 '22 06:04 Josh-Cena

I would like some pointer on developing eslint plugins. I can get it done @Josh-Cena . Also I would like to know more about the issue

alceil avatar Apr 01 '22 06:04 alceil

I don't have many good resources to share, but https://eslint.org/docs/developer-guide/working-with-plugins and other related docs there would be a good starting point. When I work on ESLint I also find the AST explorer quite useful (you should use the TS-ESLint parser + ESLint v8 Transform). The TS-ESLint playground is quite good as well, but since we don't use type-aware linting here, AST explorer should be more preferable since you can visualize fixers.

Now this issue does assume you have some understanding in ESLint (as I said), so I will not go through the 101s of working with ASTs or fixers. You can try to learn from the resources above—the API is quite straightforward (I'd say much better than Babel's, because the goal is much simpler).

Josh-Cena avatar Apr 01 '22 07:04 Josh-Cena

Okay got it @Josh-Cena

alceil avatar Apr 01 '22 07:04 alceil

Okay, i see a PR merged, why is it still open? What else should be done? Thank you!

AnmolBansalDEV avatar Aug 06 '22 19:08 AnmolBansalDEV

Please check the list in the issue description—there are a lot of missing features that could be implemented as follow-up. If you want to take a shot feel free to.

Josh-Cena avatar Aug 07 '22 01:08 Josh-Cena

@Josh-Cena I would like to work on this, is necessary to cover all the good practices mentioned, or can I submit the ones I can develop?

SanGeeky avatar Sep 30 '22 17:09 SanGeeky

@Josh-Cena can I work on these

no-hardcoded-src: ensures all src attributes are either require or useBaseUrl
no-window-eq-undefined: forbid typeof window !== 'undefined' because this is not an adequate way to escape SSR

mahendra1290 avatar May 31 '23 16:05 mahendra1290