code cleanup

.eslintrc.js

@@ -4,8 +4,16 @@ const ignore = 0;
 
 module.exports = {
   root: true,
-  extends: ['eslint-config-airbnb', 'plugin:jest/recommended', 'prettier'],
-  plugins: ['prettier', 'jest', 'react', 'json'],
+  extends: [
+    'eslint-config-airbnb',
+    'plugin:jsx-a11y/recommended',
+    'plugin:jest/recommended',
+    'plugin:import/warnings',
+    'plugin:json/recommended',
+    'plugin:react/recommended',
+    'plugin:prettier/recommended',
+  ],
+  plugins: ['jsx-a11y', 'jest', 'react', 'json'],
   parser: 'babel-eslint',
   parserOptions: {
     sourceType: 'module',
@@ -27,10 +35,11 @@ module.exports = {
         tabWidth: 2,
       },
     ],
-    quotes: [warn, 'single', { avoidEscape: true }],
+    // quotes: [warn, 'single', { avoidEscape: true }],
     'arrow-parens': [warn, 'as-needed'],
-    'import/no-unresolved': warn,
     'import/prefer-default-export': ignore,
-    'import/no-extraneous-dependencies': ignore,
+    'react/prop-types': ignore,
+    'react/jsx-filename-extension': ignore,
+    'no-console': ['error', { allow: ['warn', 'error'] }],
   },
 };

package.json

@@ -20,38 +20,48 @@
     "@babel/core": "^7.7.7",
     "@babel/preset-env": "^7.7.7",
     "@babel/preset-react": "^7.7.4",
-    "@focus-reactive/storybook-addon-graphcms": "^1.3.0",
-    "@storybook/addon-actions": "^5.2.8",
-    "@storybook/addon-console": "^1.2.1",
-    "@storybook/addon-links": "^5.2.8",
-    "@storybook/addon-notes": "^5.2.8",
-    "@storybook/addons": "^5.2.8",
-    "@storybook/react": "^5.2.8",
-    "@storybook/storybook-deployer": "^2.8.1",
     "@usulpro/package-prepare": "^1.2.1",
     "babel-eslint": "^7.2.3",
     "babel-jest": "^24.9.0",
     "babel-loader": "^8.0.6",
     "dotenv": "^8.1.0",
     "eslint": "^6.8.0",
     "eslint-config-airbnb": "^16.1.0",
+    "eslint-config-prettier": "^6.9.0",
     "eslint-formatter-pretty": "^1.1.0",
     "eslint-loader": "^2.0.0",
     "eslint-plugin-graphql": "^3.1.0",
+    "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-jest": "^23.1.1",
+    "eslint-plugin-json": "^2.0.1",
+    "eslint-plugin-jsx-a11y": "^6.2.3",
+    "eslint-plugin-prettier": "^3.1.2",
+    "eslint-plugin-react": "^7.17.0",
     "graphql-cli": "^3.0.14",
     "jest": "^24.9.0",
     "nodemon": "^2.0.2",
     "prettier": "^1.19.1",
     "relative-deps": "^0.2.0"
   },
   "dependencies": {
+    "@focus-reactive/storybook-addon-graphcms": "^1.3.0",
+    "@storybook/addon-actions": "^5.2.8",
+    "@storybook/addon-console": "^1.2.1",
+    "@storybook/addon-links": "^5.2.8",
+    "@storybook/addon-notes": "^5.2.8",
+    "@storybook/addons": "^5.2.8",
+    "@storybook/react": "^5.2.8",
+    "@storybook/storybook-deployer": "^2.8.1",
     "graphql-request": "^1.8.2",
+    "react": "^16.12.0",
     "react-json-view": "^1.19.1",
     "remark-html": "^10.0.0",
     "remark-parse": "^7.0.1",
     "unified": "^8.4.0"
   },
+  "peerDependencies": {
+    "dotenv": "^8.1.0"
+  },
   "relativeDependencies": {
     "@focus-reactive/storybook-addon-graphcms": "../../Addons/storybook-graphql-kit-graphcms/"
   },

src/config.js

@@ -1,4 +1,5 @@
 if (!process.env.CMS_ENDPOINT || !process.env.CMS_TOKEN) {
+  // eslint-disable-next-line global-require
   require('dotenv').config();
 }
 

src/content.stories.js

@@ -1,17 +1,13 @@
 const React = require('react');
 const ReactJson = require('react-json-view').default;
 const {
-  Query,
   QueryParams,
   withGraphCMS,
 } = require('@focus-reactive/storybook-addon-graphcms');
 const { storiesOf } = require('@storybook/react');
 
 const { credentials, conferenceTitle, eventYear } = require('./config');
 const { queriesData, getContent } = require('./index');
-// const { tagColors } = require('./utils');
-
-const allStories = {};
 
 const AwaitForData = ({ content }) => {
   if (!content) return 'Loading data from GraphCMS';

src/fetch-brand.js

@@ -19,7 +19,7 @@ const queryPages = /* GraphQL */ `
   }
 `;
 
-const fetchData = async(client, vars) => {
+const fetchData = async (client, vars) => {
   const conference = await client
     .request(queryPages, vars)
     .then(res => res.conf)

src/fetch-committee.js

@@ -7,7 +7,12 @@ const selectSettings = trySelectSettings(s => s.speakerAvatar.dimensions, {
 });
 
 const queryPages = /* GraphQL */ `
-  query($conferenceTitle: ConferenceTitle, $eventYear: EventYear, $avatarWidth: Int, $avatarHeight: Int) {
+  query(
+    $conferenceTitle: ConferenceTitle
+    $eventYear: EventYear
+    $avatarWidth: Int
+    $avatarHeight: Int
+  ) {
     conf: conferenceBrand(where: { title: $conferenceTitle }) {
       id
       status
@@ -21,7 +26,7 @@ const queryPages = /* GraphQL */ `
     }
   }
 
-${personFragment}
+  ${personFragment}
 `;
 
 const fetchData = async (client, vars) => {
@@ -31,7 +36,7 @@ const fetchData = async (client, vars) => {
 
   const speakers = await prepareSpeakers(
     data.map(speaker => ({ speaker, decor: true })),
-    {}
+    {},
   );
 
   return {

src/fetch-extended.js

@@ -35,17 +35,20 @@ const fetchData = async (client, vars) => {
     data.map(async item => ({
       ...item,
       title: await markdownToHtml(item.title),
-      subtitle: item.subtitle && await markdownToHtml(item.subtitle),
-      description: item.description && await markdownToHtml(item.description),
-      location: item.location && await markdownToHtml(item.location),
-    }))
+      subtitle: item.subtitle && (await markdownToHtml(item.subtitle)),
+      description: item.description && (await markdownToHtml(item.description)),
+      location: item.location && (await markdownToHtml(item.location)),
+    })),
   );
 
   const keys = new Set(allExtendeds.map(e => e.key));
-  const extendeds = [...keys].reduce((obj, key) => ({
-    ...obj,
-    [key]: allExtendeds.filter(e => e.key === key)
-  }), {});
+  const extendeds = [...keys].reduce(
+    (obj, key) => ({
+      ...obj,
+      [key]: allExtendeds.filter(e => e.key === key),
+    }),
+    {},
+  );
 
   return {
     extendeds,

src/fetch-faq.js

@@ -18,7 +18,6 @@ const queryPages = /* GraphQL */ `
   }
 `;
 
-
 const fetchData = async (client, vars) => {
   const faqsRow = await client
     .request(queryPages, vars)
@@ -29,7 +28,7 @@ const fetchData = async (client, vars) => {
       ...item,
       question: await markdownToHtml(item.question),
       answer: await markdownToHtml(item.answer),
-    }))
+    })),
   );
 
   const categories = [...new Set(faqsItems.map(i => i.category))];

src/fetch-jobs.js

@@ -25,7 +25,7 @@ const queryPages = /* GraphQL */ `
   ${jobLogoFragment}
 `;
 
-const fetchData = async(client, vars) => {
+const fetchData = async (client, vars) => {
   const data = await client
     .request(queryPages, vars)
     .then(res => res.conf.year[0].jobs);

src/fetch-pages.js

@@ -26,7 +26,7 @@ const queryPages = /* GraphQL */ `
   }
 `;
 
-const fetchData = async(client, vars) => {
+const fetchData = async (client, vars) => {
   const data = await client
     .request(queryPages, vars)
     .then(res => res.conf.year[0].pages);
@@ -36,7 +36,7 @@ const fetchData = async(client, vars) => {
       ...obj,
       [item.key]: { ...item, keywords: item.keywords.join(', ') },
     }),
-    {}
+    {},
   );
   return {
     pages,
@@ -49,4 +49,3 @@ module.exports = {
   getData: data => data.conf.year[0].pages,
   story: 'pages',
 };
-

src/fetch-sponsors.js

@@ -59,12 +59,6 @@ const fetchData = async (client, vars) => {
       width,
     }));
 
-  const titlesMap = {
-    Gold: 'Gold',
-    Silver: 'Silver',
-    Partner: 'Partners',
-  };
-
   const sponsors = [
     {
       title: 'Platinum',

src/fetch-talks.js

@@ -46,14 +46,14 @@ const byTime = (a, b) => {
   return aTime - bTime;
 };
 
-const fetchData = async(client, vars) => {
+const fetchData = async (client, vars) => {
   const data = await client
     .request(queryPages, vars)
     .then(res => res.conf.year[0].schedule[0]);
 
-    if (!data) {
-      throw new Error('Schedule not set for this event yet');
-    }
+  if (!data) {
+    throw new Error('Schedule not set for this event yet');
+  }
 
   const talks = data.talks
     .map(({ title, description, timeString, track, speaker }) => ({

src/fetch-texts.js

@@ -23,17 +23,17 @@ const queryPages = /* GraphQL */ `
   }
 `;
 
-const markdownRender = async (text, style) => {
+const markdownRender = (text, style) => {
   const renders = {
     [renderStyles.None_Default]: t => t,
-    [renderStyles.Standard_Markdown]: async t => await markdownToHtml(t),
+    [renderStyles.Standard_Markdown]: t => markdownToHtml(t),
   };
   const defaultRender = renders[renderStyles.None_Default];
 
-  return await (renders[style] || defaultRender)(text);
-}
+  return (renders[style] || defaultRender)(text);
+};
 
-const fetchData = async(client, vars) => {
+const fetchData = async (client, vars) => {
   const pieceOfTexts = await client
     .request(queryPages, vars)
     .then(res => res.conf.year[0].pieceOfTexts);
@@ -42,15 +42,15 @@ const fetchData = async(client, vars) => {
     pieceOfTexts.map(async item => ({
       ...item,
       html: await markdownRender(item.markdown, item.renderStyle),
-    }))
+    })),
   );
 
   const subContent = pieceOfHTMLs.reduce(
     (obj, item) => ({
       ...obj,
       [item.key]: item.html,
     }),
-    {}
+    {},
   );
   return {
     pagesPieceOfTexts: subContent,

src/fragments.js

@@ -1,9 +1,11 @@
 const personAvatarFragment = /* GraphQL */ `
   fragment avatarUrl on Speaker {
     avatar {
-      url (
+      url(
         transformation: {
-          image: { resize: { width: $avatarWidth, height: $avatarHeight, fit: crop } }
+          image: {
+            resize: { width: $avatarWidth, height: $avatarHeight, fit: crop }
+          }
           document: { output: { format: jpg } }
         }
       )
@@ -14,10 +16,10 @@ const personAvatarFragment = /* GraphQL */ `
 const sponsorLogoFragment = /* GraphQL */ `
   fragment imageUrl on Asset {
     url #(
-      # transformation: {
-      #   image: { resize: { width: 500, height: 500, fit: crop } }
-      #   document: { output: { format: jpg } }
-      # }
+    # transformation: {
+    #   image: { resize: { width: 500, height: 500, fit: crop } }
+    #   document: { output: { format: jpg } }
+    # }
     #)
   }
 `;
@@ -26,10 +28,10 @@ const jobLogoFragment = /* GraphQL */ `
   fragment logo on Job {
     image {
       url #(
-        # transformation: {
-        #   image: { resize: { width: 555 } }
-        #   document: { output: { format: jpg } }
-        # }
+      # transformation: {
+      #   image: { resize: { width: 555 } }
+      #   document: { output: { format: jpg } }
+      # }
       #)
     }
   }

src/index.js

@@ -32,7 +32,9 @@ const getQueriesData = (content, conferenceSettings) => {
     if (!Object.keys(data).length) return;
     data.vars = selectSettings(conferenceSettings);
     queriesData.push(data);
-  } catch (err) {}
+  } catch (err) {
+    console.error(err);
+  }
 };
 
 const getContent = async conferenceSettings => {
@@ -61,6 +63,7 @@ const getContent = async conferenceSettings => {
       });
     } catch (err) {
       console.error(err);
+      return undefined;
     }
   });
 
@@ -71,9 +74,12 @@ const getContent = async conferenceSettings => {
       const existentKeys = Object.keys(content);
       const intersectedKeys = newKeys.filter(k => existentKeys.includes(k));
       intersectedKeys.forEach(k => {
+        // eslint-disable-next-line no-param-reassign
         piece[k] = { ...content[k], ...piece[k] };
       });
-    } catch (err) {}
+    } catch (err) {
+      console.error(err);
+    }
     return { ...content, ...piece };
   }, {});
   contentMap.conferenceSettings = conferenceSettings;

src/markdown.js

@@ -1,6 +1,6 @@
-var unified = require('unified');
-var markdown = require('remark-parse');
-var html = require('remark-html');
+const unified = require('unified');
+const markdown = require('remark-parse');
+const html = require('remark-html');
 
 const markdownToHtml = text =>
   new Promise((resolve, reject) => {