added prettier integration with eslint

Vizzuality · Jun 8, 2021 · 92b2597 · 92b2597
1 parent 41ad9f8
commit 92b2597
Show file tree

Hide file tree

Showing 15 changed files with 155 additions and 125 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -4,9 +4,7 @@ module.exports = {
     es2021: true,
     node: true,
   },
-  extends: [
-    'airbnb-typescript',
-  ],
+  extends: ['airbnb-typescript', 'prettier'],
   parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaFeatures: {
@@ -16,7 +14,7 @@ module.exports = {
     sourceType: 'module',
     project: './tsconfig.eslint.json',
   },
-  plugins: ['@typescript-eslint'],
+  plugins: ['@typescript-eslint', 'prettier'],
   rules: {
     // https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#eslint
     'react/react-in-jsx-scope': 'off',
@@ -50,4 +48,4 @@ module.exports = {
       typescript: {},
     },
   },
-};
+}
diff --git a/lib/hoc/auth.ts b/lib/hoc/auth.ts
@@ -3,7 +3,7 @@ import { getSession } from 'next-auth/client';
 import { QueryClient } from 'react-query';
 import { dehydrate } from 'react-query/hydration';
 
-import USERS from 'services/users';
+import USERS from 'services/users'
 
 type AuthProps = {
   // TO-DO: change to a better type definition using Next types
@@ -12,7 +12,7 @@ type AuthProps = {
     permanent: boolean
   }
   props?: Record<string, unknown>
-};
+}
 
 type AuthHOC = (context: GetServerSidePropsContext, session?: unknown) => Promise<AuthProps>;
 
@@ -27,26 +27,26 @@ export function withProtection(getServerSidePropsFunc?: AuthHOC) {
           destination: `/auth/sign-in?callbackUrl=${resolvedUrl}`, // referer url, path from node
           permanent: false,
         },
-      };
+      }
     }
 
     if (getServerSidePropsFunc) {
-      const SSPF = await getServerSidePropsFunc(context, session);
+      const SSPF = await getServerSidePropsFunc(context, session)
 
       return {
         props: {
           session,
           ...SSPF.props,
         },
-      };
+      }
     }
 
     return {
       props: {
         session,
       },
-    };
-  };
+    }
+  }
 }
 
 export function withUser(getServerSidePropsFunc?: AuthHOC) {
@@ -55,49 +55,51 @@ export function withUser(getServerSidePropsFunc?: AuthHOC) {
 
     if (!session) {
       if (getServerSidePropsFunc) {
-        const SSPF = (await getServerSidePropsFunc(context)) || {};
+        const SSPF = (await getServerSidePropsFunc(context)) || {}
 
         return {
           props: {
             ...SSPF.props,
           },
-        };
+        }
       }
 
       return {
         props: {},
-      };
+      }
     }
 
-    const queryClient = new QueryClient();
+    const queryClient = new QueryClient()
 
-    await queryClient.prefetchQuery('me', () => USERS.request({
-      method: 'GET',
-      url: '/me',
-      headers: {
-        Authorization: `Bearer ${session.accessToken}`,
-      },
-    }).then((response) => response.data));
+    await queryClient.prefetchQuery('me', () =>
+      USERS.request({
+        method: 'GET',
+        url: '/me',
+        headers: {
+          Authorization: `Bearer ${session.accessToken}`,
+        },
+      }).then((response) => response.data)
+    )
 
     if (getServerSidePropsFunc) {
-      const SSPF = (await getServerSidePropsFunc(context)) || {};
+      const SSPF = (await getServerSidePropsFunc(context)) || {}
 
       return {
         props: {
           session,
           dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))),
           ...SSPF.props,
         },
-      };
+      }
     }
 
     return {
       props: {
         session,
         dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))),
       },
-    };
-  };
+    }
+  }
 }
 
 export function withoutProtection(getServerSidePropsFunc?: AuthHOC) {
@@ -110,21 +112,21 @@ export function withoutProtection(getServerSidePropsFunc?: AuthHOC) {
           destination: '/projects',
           permanent: false,
         },
-      };
+      }
     }
 
     if (getServerSidePropsFunc) {
-      const SSPF = await getServerSidePropsFunc(context);
+      const SSPF = await getServerSidePropsFunc(context)
 
       return {
         props: {
           ...SSPF.props,
         },
-      };
+      }
     }
 
     return {
       props: {},
-    };
-  };
+    }
+  }
 }
diff --git a/lib/store/index.ts b/lib/store/index.ts
@@ -1,11 +1,11 @@
-import { configureStore } from '@reduxjs/toolkit';
+import { configureStore } from '@reduxjs/toolkit'
 
 // Add your reducers here
-const reducer = {};
+const reducer = {}
 
 const store = configureStore({
   reducer,
   devTools: process.env.NODE_ENV !== 'production',
-});
+})
 
-export default store;
+export default store
diff --git a/lib/tailwind/line-clamp.js b/lib/tailwind/line-clamp.js
@@ -1,21 +1,19 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-const plugin = require('tailwindcss/plugin');
+const plugin = require('tailwindcss/plugin')
 
 module.exports = plugin(
-  ({
-    addUtilities, theme, e, variants,
-  }) => {
-    const t = theme('lineClamp');
+  ({ addUtilities, theme, e, variants }) => {
+    const t = theme('lineClamp')
     const utilities = Object.keys(t).map((key) => ({
       [`.${e(`clamp-${key}`)}`]: {
         overflow: 'hidden',
         display: '-webkit-box',
         '-webkit-line-clamp': `${t[key]}`,
         '-webkit-box-orient': 'vertical',
       },
-    }));
+    }))
 
-    addUtilities(utilities, variants('lineClamp', []));
+    addUtilities(utilities, variants('lineClamp', []))
   },
   {
     theme: {
@@ -25,5 +23,5 @@ module.exports = plugin(
         3: 3,
       },
     },
-  },
-);
+  }
+)
diff --git a/package.json b/package.json
@@ -92,12 +92,15 @@
     "cypress": "^7.3.0",
     "eslint": "^7.2.0",
     "eslint-config-airbnb-typescript": "^12.3.1",
+    "eslint-config-prettier": "^8.3.0",
     "eslint-import-resolver-typescript": "^2.4.0",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-prettier": "^3.4.0",
     "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-react-hooks": "^4",
     "husky": "^6.0.0",
+    "prettier": "^2.3.0",
     "start-server-and-test": "^1.12.1",
     "svg-sprite-loader": "^6.0.6",
     "svgo": "1.3.2",

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -1,20 +1,20 @@
-import { useRef } from 'react';
-import type { AppProps } from 'next/app';
-import { Provider as ReduxProvider } from 'react-redux';
-import { QueryClient, QueryClientProvider } from 'react-query';
-import { OverlayProvider } from '@react-aria/overlays';
-import { Hydrate } from 'react-query/hydration';
-import { Provider as AuthenticationProvider } from 'next-auth/client';
+import { useRef } from 'react'
+import type { AppProps } from 'next/app'
+import { Provider as ReduxProvider } from 'react-redux'
+import { QueryClient, QueryClientProvider } from 'react-query'
+import { OverlayProvider } from '@react-aria/overlays'
+import { Hydrate } from 'react-query/hydration'
+import { Provider as AuthenticationProvider } from 'next-auth/client'
 
-import store from 'lib/store';
+import store from 'lib/store'
 
-import 'styles/globals.css';
+import 'styles/globals.css'
 
 const MyApp: React.FC<AppProps> = ({ Component, pageProps }: AppProps) => {
-  const queryClientRef = useRef(null);
+  const queryClientRef = useRef(null)
 
   if (!queryClientRef.current) {
-    queryClientRef.current = new QueryClient();
+    queryClientRef.current = new QueryClient()
   }
 
   return (
@@ -35,7 +35,7 @@ const MyApp: React.FC<AppProps> = ({ Component, pageProps }: AppProps) => {
         </Hydrate>
       </QueryClientProvider>
     </ReduxProvider>
-  );
-};
+  )
+}
 
-export default MyApp;
+export default MyApp
diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -7,8 +7,8 @@ import { GA_TRACKING_ID } from 'lib/analytics/ga';
 
 class MyDocument extends Document {
   static async getInitialProps(ctx: DocumentContext): Promise<DocumentInitialProps> {
-    const initialProps = await Document.getInitialProps(ctx);
-    return { ...initialProps };
+    const initialProps = await Document.getInitialProps(ctx)
+    return { ...initialProps }
   }
 
   render(): JSX.Element {
@@ -35,8 +35,8 @@ class MyDocument extends Document {
           <NextScript />
         </body>
       </Html>
-    );
+    )
   }
 }
 
-export default MyDocument;
+export default MyDocument