feat: add prettier rules in eslint (#2807)

Co-authored-by: Ansh Goyal <[email protected]>
asyncapi · Mar 26, 2024 · 4c71bef · 4c71bef
1 parent 8255b32
commit 4c71bef
Show file tree

Hide file tree

Showing 47 changed files with 1,182 additions and 968 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -19,15 +19,27 @@
       "error",
       {
         "singleQuote": true,
-        "endOfLine": "auto"
+        "endOfLine": "auto",
+        "semi": true,
+        "tabWidth": 2,
+        "trailingComma": "none",
+        "arrowParens": "always",
+        "bracketSpacing": true,
+        "jsxBracketSameLine": false,
+        "useTabs": false,
+        "quoteProps": "as-needed",
+        "insertPragma": false,
+        "requirePragma": false,
+        "jsxSingleQuote": true,
+        "printWidth": 120
       }
     ],
     "max-len": [
       "error",
       {
         "code": 120,
         "ignoreUrls": true,
-        "ignorePattern": "*className=([\\s\\S]*?)*" // Ignore classnames
+        "ignorePattern": "(className=\\{[\\s\\S]*\\}|.*\\}|'.*'|className='.*')" // Ignore classnames
       }
     ]
   },
@@ -57,20 +69,14 @@
         "project": "./tsconfig.json"
       },
       "rules": {
-        "prettier/prettier": [
-          "error",
-          {
-            "singleQuote": true,
-            "endOfLine": "auto"
-          }
-        ],
         "react/destructuring-assignment": "off", // Vscode doesn't support automatically destructuring, it's a pain to add a new variable
         "react/require-default-props": "off", // Allow non-defined react props as undefined
         "react/jsx-props-no-spreading": "off", // _app.tsx uses spread operator and also, react-hook-form
         "react-hooks/exhaustive-deps": "off", // Incorrectly report needed dependency with Next.js router
         "@next/next/no-img-element": "off", // We currently not using next/image because it isn't supported with SSG mode
         "@next/next/link-passhref": "off", // Only needed when the child of Link wraps an <a> tag
         "@typescript-eslint/comma-dangle": "off", // Avoid conflict rule between Eslint and Prettier
+        "@typescript-eslint/indent": "off", // Avoid conflict rule between Eslint and Prettier
         "@typescript-eslint/consistent-type-imports": "error", // Ensure `import type` is used when it's necessary
         "no-restricted-syntax": [
           "error",
@@ -136,26 +142,6 @@
         "func-name-matching": "error",
         "func-names": "off",
         "func-style": "off",
-        "function-paren-newline": [
-          "error",
-          "never"
-        ],
-        "implicit-arrow-linebreak": [
-          "error",
-          "beside"
-        ],
-        "indent": [
-          "error",
-          2,
-          {
-            "VariableDeclarator": {
-              "var": 1,
-              "let": 1,
-              "const": 1
-            },
-            "SwitchCase": 1
-          }
-        ],
         "jsx-quotes": [
           "error",
           "prefer-single"
@@ -274,7 +260,10 @@
         ],
         "quotes": [
           "error",
-          "single"
+          "single",
+          {
+            "avoidEscape": true
+          }
         ],
         "require-jsdoc": "warn",
         "semi": "error",
@@ -303,6 +292,12 @@
         ],
         "switch-colon-spacing": "error"
       }
+    },
+    {
+      "files": ["components/logos/*"],
+      "rules": {
+        "max-len": "off"
+      }
     }
   ]
 }
diff --git a/.prettierignore b/.prettierignore
diff --git a/.prettierrc.json b/.prettierrc.json
diff --git a/components/AlgoliaSearch.tsx b/components/AlgoliaSearch.tsx
@@ -29,7 +29,7 @@ interface IHitProps {
     __is_child?: () => boolean;
     __is_first?: () => boolean;
     __is_last?: () => boolean;
-  }
+  };
   children: React.ReactNode;
 }
 
@@ -76,10 +76,7 @@ function transformItems(items: DocSearchHit[]) {
       url: `${a.pathname}${hash}`,
       __is_result: () => true,
       __is_parent: () => item.type === 'lvl1' && items.length > 1 && index === 0,
-      __is_child: () => item.type !== 'lvl1' &&
-        items.length > 1 &&
-        items[0].type === 'lvl1' &&
-        index !== 0,
+      __is_child: () => item.type !== 'lvl1' && items.length > 1 && items[0].type === 'lvl1' && index !== 0,
       __is_first: () => index === 1,
       __is_last: () => index === items.length - 1 && index !== 0
     };
@@ -116,30 +113,32 @@ function Hit({ hit, children }: IHitProps) {
 function AlgoliaModal({ onClose, initialQuery, indexName }: AlgoliaModalProps) {
   const router = useRouter();
 
-  return createPortal(<DocSearchModal
-    initialQuery={initialQuery}
-    initialScrollY={window.scrollY}
-    searchParameters={{
-      distinct: 1
-    }}
-    placeholder={indexName === DOCS_INDEX_NAME ? 'Search documentation' : 'Search resources'}
-    onClose={onClose}
-    indexName={indexName}
-    apiKey={API_KEY}
-    appId={APP_ID}
-    navigator={{
-      navigate({ itemUrl }) {
-        onClose();
-        router.push(itemUrl);
-      }
-    }}
-    hitComponent={Hit}
-    transformItems={transformItems}
-    getMissingResultsUrl={({ query }) => {
-      return `https://github.com/asyncapi/website/issues/new?title=Cannot%20search%20given%20query:%20${query}`;
-    }}
-  />,
-  document.body);
+  return createPortal(
+    <DocSearchModal
+      initialQuery={initialQuery}
+      initialScrollY={window.scrollY}
+      searchParameters={{
+        distinct: 1
+      }}
+      placeholder={indexName === DOCS_INDEX_NAME ? 'Search documentation' : 'Search resources'}
+      onClose={onClose}
+      indexName={indexName}
+      apiKey={API_KEY}
+      appId={APP_ID}
+      navigator={{
+        navigate({ itemUrl }) {
+          onClose();
+          router.push(itemUrl);
+        }
+      }}
+      hitComponent={Hit}
+      transformItems={transformItems}
+      getMissingResultsUrl={({ query }) => {
+        return `https://github.com/asyncapi/website/issues/new?title=Cannot%20search%20given%20query:%20${query}`;
+      }}
+    />,
+    document.body
+  );
 }
 
 /**
@@ -152,10 +151,7 @@ function isEditingContent(event: KeyboardEvent) {
   const { tagName } = element as HTMLElement;
 
   return (
-    (element as HTMLElement).isContentEditable ||
-    tagName === 'INPUT' ||
-    tagName === 'SELECT' ||
-    tagName === 'TEXTAREA'
+    (element as HTMLElement).isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA'
   );
 }
 
@@ -235,27 +231,32 @@ function useDocSearchKeyboardEvents({ isOpen, onOpen, onClose }: IUseDocSearchKe
  * @description The Algolia search component used for searching the website
  * @param {React.ReactNode} children - The content of the page
  */
-export default function AlgoliaSearch({ children } : { children: React.ReactNode }) {
+export default function AlgoliaSearch({ children }: { children: React.ReactNode }) {
   const [isOpen, setIsOpen] = useState(false);
   const [indexName, setIndexName] = useState<string>(INDEX_NAME);
   const [initialQuery, setInitialQuery] = useState<string>();
 
-  const onOpen = useCallback((_indexName?: string) => {
-    if (_indexName) {
-      setIndexName(_indexName);
-    }
-    setIsOpen(true);
-  }, [setIsOpen, setIndexName]);
+  const onOpen = useCallback(
+    (_indexName?: string) => {
+      if (_indexName) {
+        setIndexName(_indexName);
+      }
+      setIsOpen(true);
+    },
+    [setIsOpen, setIndexName]
+  );
 
   const onClose = useCallback(() => {
     setIsOpen(false);
   }, [setIsOpen]);
 
-  const onInput = useCallback((e: React.KeyboardEvent) => {
-    setIsOpen(true);
-    setInitialQuery(e.key);
-  },
-  [setIsOpen, setInitialQuery]);
+  const onInput = useCallback(
+    (e: React.KeyboardEvent) => {
+      setIsOpen(true);
+      setInitialQuery(e.key);
+    },
+    [setIsOpen, setInitialQuery]
+  );
 
   useDocSearchKeyboardEvents({
     isOpen,
@@ -269,9 +270,7 @@ export default function AlgoliaSearch({ children } : { children: React.ReactNode
       <Head>
         <link rel='preconnect' href={`https://${APP_ID}-dsn.algolia.net`} crossOrigin='anonymous' />
       </Head>
-      <SearchContext.Provider value={{ isOpen, onOpen, onClose, onInput }}>
-        {children}
-      </SearchContext.Provider>
+      <SearchContext.Provider value={{ isOpen, onOpen, onClose, onInput }}>{children}</SearchContext.Provider>
       {isOpen && <AlgoliaModal initialQuery={initialQuery ?? ''} onClose={onClose} indexName={indexName} />}
     </>
   );