Feat/arrow-functions-improvements

.changeset/violet-toes-warn.md

@@ -0,0 +1,8 @@
+---
+"eslint-config-sheriff": minor
+"docs-website": minor
+"create-sheriff-config": patch
+"sheriff-webservices": patch
+---
+
+feat(rules): added eslint-plugin-arrow-return-style

apps/config-validation-playground/package.json

@@ -5,7 +5,7 @@
   "type": "module",
   "packageManager": "[email protected]",
   "scripts": {
-    "validate-config": "eslint . --max-warnings=0 --cache --cache-location 'node_modules/.cache/.eslintcache'"
+    "validate-config": "eslint . --max-warnings=0 --cache --cache-location=node_modules/.cache/.eslintcache"
   },
   "dependencies": {
     "astro": "^4.0.8",

apps/config-validation-playground/src/samples/basic.ts

@@ -4,7 +4,9 @@ export const addNumbers = function (a: number, b: number): number {
 };
 
 // Function to check if a number is even
-export const isEven = (num: number): boolean => num % 2 === 0;
+export const isEven = (num: number): boolean => {
+  return num % 2 === 0;
+};
 
 // Function to calculate the factorial of a number
 export const factorial = (num: number): number => {
@@ -16,5 +18,6 @@ export const factorial = (num: number): number => {
 };
 
 // Function to calculate the sum of a list of numbers
-export const sum = (numbers: number[]): number =>
-  numbers.reduce((acc, curr) => acc + curr, 0);
+export const sum = (numbers: number[]): number => {
+  return numbers.reduce((acc, curr) => acc + curr, 0);
+};

apps/config-validation-playground/src/samples/react.tsx

@@ -1,5 +1,7 @@
-export const MyComponent = (): JSX.Element => (
-  <div>
-    <h1>Hello, World!</h1>
-  </div>
-);
+export const MyComponent = (): JSX.Element => {
+  return (
+    <div>
+      <h1>Hello, World!</h1>
+    </div>
+  );
+};

apps/docs-website/docs/eslint-plugins.md

@@ -16,6 +16,7 @@ sidebar_position: 7
 - [eslint-plugin-sonarjs](https://github.com/SonarSource/eslint-plugin-sonarjs)
 - [eslint-plugin-fp](https://github.com/jfmengels/eslint-plugin-fp)
 - [@regru/eslint-plugin-prefer-early-return](https://github.com/regru/eslint-plugin-prefer-early-return)
+- [eslint-plugin-arrow-return-style](https://github.com/u3u/eslint-plugin-arrow-return-style)
 - [eslint-plugin-jsdoc](https://github.com/gajus/eslint-plugin-jsdoc)
 - [eslint-plugin-tsdoc](https://www.npmjs.com/package/eslint-plugin-tsdoc)
 - [eslint-plugin-jest](https://github.com/jest-community/eslint-plugin-jest)

apps/docs-website/eslint.config.js

@@ -47,7 +47,6 @@ module.exports = defineFlatConfig([
     files: ["**/*ts", "**/*tsx"],
     rules: {
       "sonarjs/no-duplicate-string": 0,
-      "arrow-body-style": 0,
       "react/jsx-props-no-spreading": 0,
       "@typescript-eslint/no-misused-promises": [
         2,

apps/docs-website/package.json

@@ -13,7 +13,7 @@
     "write-translations": "docusaurus write-translations",
     "write-heading-ids": "docusaurus write-heading-ids",
     "typecheck": "tsc --noEmit",
-    "lint": "eslint . --max-warnings=0 --cache --cache-location 'node_modules/.cache/.eslintcache'",
+    "lint": "eslint . --max-warnings=0 --cache --cache-location=node_modules/.cache/.eslintcache",
     "typesync": "typesync --dry=fail",
     "clean": "rm -rf .turbo && rm -rf dist"
   },

apps/docs-website/src/components/RulesTable.tsx

@@ -45,11 +45,13 @@ const columns = [
   }),
   columnHelper.accessor("docs", {
     header: "Docs",
-    cell: (info) => (
-      <a href={info.getValue().url} target="_blank" rel="noreferrer">
-        {info.getValue().description || info.getValue().url}
-      </a>
-    ),
+    cell: (info) => {
+      return (
+        <a href={info.getValue().url} target="_blank" rel="noreferrer">
+          {info.getValue().description || info.getValue().url}
+        </a>
+      );
+    },
   }),
   columnHelper.accessor("affectedFiles", {
     header: "Files",
@@ -161,60 +163,76 @@ export const RulesTable = (): JSX.Element => {
             placeholder="Filter by plugins..."
             value={selectValue}
             styles={{
-              control: (baseStyles) => ({
-                ...baseStyles,
-                minWidth: "300px",
-                backgroundColor:
-                  "var(--ifm-color-secondary-contrast-background)",
-              }),
-              input: (baseStyles) => ({
-                ...baseStyles,
-                color: "var(--ifm-font-color-primary)",
-              }),
-              menu: (baseStyles) => ({
-                ...baseStyles,
-                backgroundColor:
-                  "var(--ifm-color-secondary-contrast-background)",
-              }),
-              option: (baseStyles, state) => ({
-                ...baseStyles,
-                transition:
-                  "color var(--ifm-transition-fast) var(--ifm-transition-timing-default)",
-                backgroundColor: state.isFocused
-                  ? "var(--ifm-menu-color-background-hover)"
-                  : "var(--ifm-color-secondary-contrast-background)",
-                color: state.isFocused
-                  ? "var(--ifm-menu-color)"
-                  : "var(--ifm-font-color-secondary)",
-                ":active": {
-                  backgroundColor: "var(--ifm-menu-color-background-hover)",
-                },
-              }),
-              singleValue: (baseStyles) => ({
-                ...baseStyles,
-                color: "var(--ifm-font-color-primary)",
-              }),
-              clearIndicator: (baseStyles) => ({
-                ...baseStyles,
-                color: "var(--ifm-font-color-secondary)",
-                ":hover": {
+              control: (baseStyles) => {
+                return {
+                  ...baseStyles,
+                  minWidth: "300px",
+                  backgroundColor:
+                    "var(--ifm-color-secondary-contrast-background)",
+                };
+              },
+              input: (baseStyles) => {
+                return {
+                  ...baseStyles,
                   color: "var(--ifm-font-color-primary)",
-                },
-                cursor: "pointer",
-              }),
-              dropdownIndicator: (baseStyles) => ({
-                ...baseStyles,
-                color: "var(--ifm-font-color-secondary)",
-                ":hover": {
+                };
+              },
+              menu: (baseStyles) => {
+                return {
+                  ...baseStyles,
+                  backgroundColor:
+                    "var(--ifm-color-secondary-contrast-background)",
+                };
+              },
+              option: (baseStyles, state) => {
+                return {
+                  ...baseStyles,
+                  transition:
+                    "color var(--ifm-transition-fast) var(--ifm-transition-timing-default)",
+                  backgroundColor: state.isFocused
+                    ? "var(--ifm-menu-color-background-hover)"
+                    : "var(--ifm-color-secondary-contrast-background)",
+                  color: state.isFocused
+                    ? "var(--ifm-menu-color)"
+                    : "var(--ifm-font-color-secondary)",
+                  ":active": {
+                    backgroundColor: "var(--ifm-menu-color-background-hover)",
+                  },
+                };
+              },
+              singleValue: (baseStyles) => {
+                return {
+                  ...baseStyles,
                   color: "var(--ifm-font-color-primary)",
-                },
-                cursor: "pointer",
-              }),
+                };
+              },
+              clearIndicator: (baseStyles) => {
+                return {
+                  ...baseStyles,
+                  color: "var(--ifm-font-color-secondary)",
+                  ":hover": {
+                    color: "var(--ifm-font-color-primary)",
+                  },
+                  cursor: "pointer",
+                };
+              },
+              dropdownIndicator: (baseStyles) => {
+                return {
+                  ...baseStyles,
+                  color: "var(--ifm-font-color-secondary)",
+                  ":hover": {
+                    color: "var(--ifm-font-color-primary)",
+                  },
+                  cursor: "pointer",
+                };
+              },
             }}
-            options={pluginsNames.map((pluginName) => ({
-              value: pluginName,
-              label: pluginName,
-            }))}
+            options={pluginsNames.map((pluginName) => {
+              return {
+                value: pluginName,
+                label: pluginName,
+              };
+            })}
             onChange={(selectedOption) => {
               setSelectValue(selectedOption);
               resetInputValue();
@@ -233,43 +251,54 @@ export const RulesTable = (): JSX.Element => {
       ) : (
         <table>
           <thead>
-            {table.getHeaderGroups().map((headerGroup) => (
-              <tr key={headerGroup.id}>
-                {headerGroup.headers.map((header) => (
-                  <th
-                    key={header.id}
-                    className={styles.th}
-                    style={{
-                      maxWidth: cellMaxWidth,
-                    }}
-                  >
-                    {header.isPlaceholder
-                      ? null
-                      : flexRender(
-                          header.column.columnDef.header,
-                          header.getContext(),
-                        )}
-                  </th>
-                ))}
-              </tr>
-            ))}
+            {table.getHeaderGroups().map((headerGroup) => {
+              return (
+                <tr key={headerGroup.id}>
+                  {headerGroup.headers.map((header) => {
+                    return (
+                      <th
+                        key={header.id}
+                        className={styles.th}
+                        style={{
+                          maxWidth: cellMaxWidth,
+                        }}
+                      >
+                        {header.isPlaceholder
+                          ? null
+                          : flexRender(
+                              header.column.columnDef.header,
+                              header.getContext(),
+                            )}
+                      </th>
+                    );
+                  })}
+                </tr>
+              );
+            })}
           </thead>
           <tbody>
-            {table.getRowModel().rows.map((row) => (
-              <tr key={row.id} className={styles.tr}>
-                {row.getVisibleCells().map((cell) => (
-                  <td
-                    key={cell.id}
-                    className={styles.td}
-                    style={{
-                      maxWidth: cellMaxWidth,
-                    }}
-                  >
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </td>
-                ))}
-              </tr>
-            ))}
+            {table.getRowModel().rows.map((row) => {
+              return (
+                <tr key={row.id} className={styles.tr}>
+                  {row.getVisibleCells().map((cell) => {
+                    return (
+                      <td
+                        key={cell.id}
+                        className={styles.td}
+                        style={{
+                          maxWidth: cellMaxWidth,
+                        }}
+                      >
+                        {flexRender(
+                          cell.column.columnDef.cell,
+                          cell.getContext(),
+                        )}
+                      </td>
+                    );
+                  })}
+                </tr>
+              );
+            })}
           </tbody>
         </table>
       )}