apply prettier formating

web/.prettierrc.js

@@ -1,9 +1,9 @@
 module.exports = {
-    printWidth: 120,
-    useTabs: false,
-    semi: true,
-    singleQuote: true,
-    trailingComma: 'es5',
-    bracketSpacing: true,
-    arrowParens: 'avoid',
+  printWidth: 120,
+  useTabs: false,
+  semi: true,
+  singleQuote: true,
+  trailingComma: 'es5',
+  bracketSpacing: true,
+  arrowParens: 'avoid',
 };

web/app/common/api.js

@@ -15,94 +15,108 @@ export const getPostComments = ({ sort, url }) => fetcher.get(`/find?url=${url}&
 
 export const getLastComments = ({ siteId, max }) => fetcher.get(`/last/${max}?site=${siteId}`);
 
-export const getCommentsCount = ({ urls, siteId }) => fetcher.post({
-  url: `/counts?site=${siteId}`,
-  body: urls,
-});
+export const getCommentsCount = ({ urls, siteId }) =>
+  fetcher.post({
+    url: `/counts?site=${siteId}`,
+    body: urls,
+  });
 
 export const getComment = ({ id }) => fetcher.get(`/id/${id}?url=${url}`);
 
 export const getUserComments = ({ user, limit }) => fetcher.get(`/comments?user=${user}&limit=${limit}`);
 
-export const putCommentVote = ({ id, url, value }) => fetcher.put({
-  url: `/vote/${id}?url=${url}&vote=${value}`,
-  withCredentials: true,
-});
+export const putCommentVote = ({ id, url, value }) =>
+  fetcher.put({
+    url: `/vote/${id}?url=${url}&vote=${value}`,
+    withCredentials: true,
+  });
 
-export const addComment = ({ text, pid }) => fetcher.post({
-  url: '/comment',
-  body: {
-    text,
-    locator: {
-      site: siteId,
-      url,
+export const addComment = ({ text, pid }) =>
+  fetcher.post({
+    url: '/comment',
+    body: {
+      text,
+      locator: {
+        site: siteId,
+        url,
+      },
+      ...(pid ? { pid } : {}),
     },
-    ...(pid ? { pid } : {}),
-  },
-  withCredentials: true,
-});
+    withCredentials: true,
+  });
 
-export const updateComment = ({ text, id }) => fetcher.put({
-  url: `/comment/${id}?url=${url}`,
-  body: {
-    text,
-  },
-  withCredentials: true,
-});
+export const updateComment = ({ text, id }) =>
+  fetcher.put({
+    url: `/comment/${id}?url=${url}`,
+    body: {
+      text,
+    },
+    withCredentials: true,
+  });
 
-export const getPreview = ({ text }) => fetcher.post({
-  url: '/preview',
-  body: {
-    text,
-  },
-  withCredentials: true,
-});
+export const getPreview = ({ text }) =>
+  fetcher.post({
+    url: '/preview',
+    body: {
+      text,
+    },
+    withCredentials: true,
+  });
 
-export const getUser = () => fetcher.get({
-  url: '/user',
-  withCredentials: true
-});
+export const getUser = () =>
+  fetcher.get({
+    url: '/user',
+    withCredentials: true,
+  });
 
 /* admin */
-export const pinComment = ({ id, url }) => fetcher.put({
-  url: `/admin/pin/${id}?url=${url}&pin=1`,
-  withCredentials: true,
-});
+export const pinComment = ({ id, url }) =>
+  fetcher.put({
+    url: `/admin/pin/${id}?url=${url}&pin=1`,
+    withCredentials: true,
+  });
 
-export const unpinComment = ({ id, url }) => fetcher.put({
-  url: `/admin/pin/${id}?url=${url}&pin=0`,
-  withCredentials: true,
-});
+export const unpinComment = ({ id, url }) =>
+  fetcher.put({
+    url: `/admin/pin/${id}?url=${url}&pin=0`,
+    withCredentials: true,
+  });
 
-export const setVerifyStatus = ({ id }) => fetcher.put({
-  url: `/admin/verify/${id}?verified=1`,
-  withCredentials: true,
-});
+export const setVerifyStatus = ({ id }) =>
+  fetcher.put({
+    url: `/admin/verify/${id}?verified=1`,
+    withCredentials: true,
+  });
 
-export const removeVerifyStatus = ({ id }) => fetcher.put({
-  url: `/admin/verify/${id}?verified=0`,
-  withCredentials: true,
-});
+export const removeVerifyStatus = ({ id }) =>
+  fetcher.put({
+    url: `/admin/verify/${id}?verified=0`,
+    withCredentials: true,
+  });
 
-export const removeComment = ({ id }) => fetcher.delete({
-  url: `/admin/comment/${id}?url=${url}`,
-  withCredentials: true,
-});
+export const removeComment = ({ id }) =>
+  fetcher.delete({
+    url: `/admin/comment/${id}?url=${url}`,
+    withCredentials: true,
+  });
 
-export const blockUser = ({ id }) => fetcher.put({
-  url: `/admin/user/${id}?block=1`,
-  withCredentials: true,
-});
+export const blockUser = ({ id }) =>
+  fetcher.put({
+    url: `/admin/user/${id}?block=1`,
+    withCredentials: true,
+  });
 
-export const unblockUser = ({ id }) => fetcher.put({
-  url: `/admin/user/${id}?block=0`,
-  withCredentials: true,
-});
+export const unblockUser = ({ id }) =>
+  fetcher.put({
+    url: `/admin/user/${id}?block=0`,
+    withCredentials: true,
+  });
 
-export const getBlocked = () => fetcher.get({
-  url: '/admin/blocked',
-  withCredentials: true,
-});
+export const getBlocked = () =>
+  fetcher.get({
+    url: '/admin/blocked',
+    withCredentials: true,
+  });
 
 export default {
   logOut,

web/app/common/constants.js

@@ -32,4 +32,4 @@ module.exports = {
   DEFAULT_SORT,
   LS_COLLAPSE_KEY,
   LS_SORT_KEY,
-};
+};

web/app/common/fetcher.js

@@ -8,12 +8,8 @@ const methods = ['get', 'post', 'put', 'patch', 'delete', 'head'];
 
 methods.forEach(method => {
   fetcher[method] = data => {
-    const {
-      url,
-      body = {},
-      withCredentials = false,
-      overriddenApiBase = API_BASE,
-    } = (typeof data === 'string' ? { url: data } : data);
+    const { url, body = {}, withCredentials = false, overriddenApiBase = API_BASE } =
+      typeof data === 'string' ? { url: data } : data;
     const basename = `${BASE_URL}${overriddenApiBase}`;
 
     return new Promise((resolve, reject) => {

web/app/common/polyfills.js

@@ -5,8 +5,8 @@ Promise.prototype.finally = function finallyFn(callback) {
   const constructor = this.constructor;
 
   return this.then(
-    (value) => constructor.resolve(callback()).then(() => value),
-    (reason) => constructor.resolve(callback()).then(() => reason)
+    value => constructor.resolve(callback()).then(() => value),
+    reason => constructor.resolve(callback()).then(() => reason)
   );
 };
 
@@ -20,7 +20,8 @@ export default function loadPolyfills() {
       'includes' in Array.prototype &&
       'assign' in Object &&
       'keys' in Object
-    ) return Promise.resolve();
+    )
+      return Promise.resolve();
 
     return import(/* webpackChunkName: "polyfills" */ 'core-js');
   };

web/app/common/settings.js

@@ -1,8 +1,12 @@
-const querySettings = window.location.search.substr(1).split('&').reduce((acc, param) => {
-  const pair = param.split('=');
-  acc[pair[0]] = decodeURIComponent(pair[1]);
-  return acc;
-}, {}) || {};
+const querySettings =
+  window.location.search
+    .substr(1)
+    .split('&')
+    .reduce((acc, param) => {
+      const pair = param.split('=');
+      acc[pair[0]] = decodeURIComponent(pair[1]);
+      return acc;
+    }, {}) || {};
 
 export const siteId = querySettings['site_id'];
 export const url = querySettings['url'];

web/app/common/store.js

@@ -19,7 +19,6 @@ class Store {
     this.listeners[key].push(cb);
   }
 
-
   set(key, obj) {
     this.data[key] = obj;
 

web/app/common/store.test.js

@@ -6,8 +6,8 @@ describe('Store', () => {
 
     store.set('comments', []);
     store.onUpdate('comments', listener);
-    store.addComment({id:`new`});
+    store.addComment({ id: `new` });
 
-    expect(listener).toBeCalledWith([{"comment": {"id": "new"}}]);
+    expect(listener).toBeCalledWith([{ comment: { id: 'new' } }]);
   });
 });

web/app/components/auth-panel/auth-panel.jsx

@@ -46,7 +46,7 @@ export default class AuthPanel extends Component {
               {user.name}
             </strong>
             {isUserIdVisible && <span className="auth-panel__user-id"> ({user.id})</span>}.{' '}
-            <span {...getHandleClickProps(props.onSignOut)} className="auth-panel__pseudo-link" role="link" >
+            <span {...getHandleClickProps(props.onSignOut)} className="auth-panel__pseudo-link" role="link">
               Sign out?
             </span>
           </div>
@@ -79,7 +79,7 @@ export default class AuthPanel extends Component {
           {user.admin && (
             <span
               className="auth-panel__pseudo-link auth-panel__admin-action"
-               {...getHandleClickProps(this.toggleBlockedVisibility)}
+              {...getHandleClickProps(this.toggleBlockedVisibility)}
               role="link"
             >
               {isBlockedVisible ? 'Hide' : 'Show'} blocked

web/app/components/blocked-users/__list-item/_view/_invisible/blocked-users__list-item_view_invisible.scss

@@ -1,6 +1,6 @@
 .blocked-users__list-item_view_invisible {
   .blocked-users__username {
-    opacity: .5;
+    opacity: 0.5;
     text-decoration: line-through;
   }
 }

web/app/components/blocked-users/blocked-users.jsx

@@ -52,16 +52,12 @@ export default class BlockedUsers extends Component {
                   <span className="blocked-users__username">{user.name}</span>{' '}
                   <span className="blocked-users__user-id">({user.id})</span>
                   {isUserUnblocked && (
-                    <span
-                      {...getHandleClickProps(() => this.block(user))}
-                      className="blocked-users__action">
+                    <span {...getHandleClickProps(() => this.block(user))} className="blocked-users__action">
                       block
                     </span>
                   )}
                   {!isUserUnblocked && (
-                    <span
-                      {...getHandleClickProps(() => this.unblock(user))}
-                      className="blocked-users__action">
+                    <span {...getHandleClickProps(() => this.unblock(user))} className="blocked-users__action">
                       unblock
                     </span>
                   )}

web/app/components/comment/__action/comment__action.scss

@@ -3,7 +3,7 @@
   vertical-align: middle;
   cursor: pointer;
   user-select: none;
-  color: #259C9A;
+  color: #259c9a;
 
   &:hover {
     color: #31c7c5;

web/app/components/comment/__control/comment__control.scss

@@ -1,7 +1,7 @@
 .comment__control {
   margin-right: 8px;
   cursor: pointer;
-  color: #8CD4D4;
+  color: #8cd4d4;
 
   &:last-child {
     margin-right: 0;

web/app/components/comment/__username/comment__username.scss

@@ -7,6 +7,6 @@
   cursor: pointer;
 
   &:hover {
-    opacity: .75;
+    opacity: 0.75;
   }
 }

web/app/components/comment/__verification/comment__verification.scss

@@ -8,6 +8,6 @@
   background-size: cover;
 
   &:hover {
-    opacity: .75;
+    opacity: 0.75;
   }
 }

web/app/components/comment/__vote/_disabled/comment__vote_disabled.scss

@@ -1,5 +1,6 @@
 .comment__vote_disabled {
-  &, &:hover {
+  &,
+  &:hover {
     background-image: url('comment__vote_disabled.svg');
     cursor: not-allowed;
   }

web/app/components/comment/__vote/_type/_down/comment__vote_type_down.scss

@@ -3,7 +3,8 @@
   margin-left: 4px;
 
   &.comment__vote_selected {
-    &, &:hover {
+    &,
+    &:hover {
       background-image: url('comment__vote_type_down.svg');
     }
   }

web/app/components/comment/__vote/_type/_up/comment__vote_type_up.scss

@@ -2,7 +2,8 @@
   margin-right: 4px;
 
   &.comment__vote_selected {
-    &, &:hover {
+    &,
+    &:hover {
       background-image: url('comment__vote_type_up.svg');
     }
   }

web/app/components/comment/_collapsed/comment_collapsed.scss

@@ -1,6 +1,7 @@
 .comment_collapsed {
   > .comment__body {
-    .comment__text, .comment__actions {
+    .comment__text,
+    .comment__actions {
       display: none;
     }
   }

web/app/components/comment/_editing/comment_editing.scss

@@ -13,7 +13,7 @@
   }
 
   // it isn't mobile first, but it's fine here
-  @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer:coarse) and (max-width: 768px) {
+  @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer: coarse) and (max-width: 768px) {
     border: 8px solid #eee;
     padding-bottom: 0;
 

web/app/components/comment/_level/comment_level.scss

@@ -7,7 +7,7 @@ $step: 24px;
 
       &.comment_replying {
         .comment__input {
-          @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer:coarse) and (max-width: 768px) {
+          @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer: coarse) and (max-width: 768px) {
             margin-left: -$i * $step;
           }
         }

web/app/components/comment/_replying/comment_replying.scss

@@ -9,7 +9,7 @@
   }
 
   // it isn't mobile first, but it's fine here
-  @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer:coarse) and (max-width: 768px) {
+  @media (-moz-touch-enabled: 1) and (max-width: 768px), (pointer: coarse) and (max-width: 768px) {
     border: 8px solid #eee;
     padding-bottom: 0;
 

web/app/components/comment/_useless/comment_useless.scss

@@ -1,5 +1,5 @@
 .comment_useless {
   .comment__body {
-    opacity: .35;
+    opacity: 0.35;
   }
 }

web/app/components/comment/_view/_admin/comment_view_admin.scss

@@ -1,5 +1,5 @@
 .comment_view_admin {
   .comment__username {
     color: #0e7e9d;
-  };
-}
+  }
+}

web/app/components/comment/_view/_preview/comment_view_preview.scss

@@ -4,7 +4,7 @@
 
   .comment__username {
     color: #0aa;
-  };
+  }
 
   .comment__info {
     display: inline;

web/app/components/comment/_view/_user/comment_view_user.scss

@@ -1,6 +1,7 @@
 .comment_view_user {
   &.comment_collapsed {
-    .comment__text, .comment__actions {
+    .comment__text,
+    .comment__actions {
       display: block;
     }
   }

web/app/components/input/__button/_type/_preview/input__button_type_preview.scss

@@ -2,7 +2,8 @@
   background: #fff;
   color: #000;
 
-  &:hover, &:focus {
+  &:hover,
+  &:focus {
     box-shadow: inset 0 0 0 2px #0aa;
     color: #099;
   }

web/app/components/input/__button/_type/_send/input__button_type_send.scss

@@ -1,8 +1,9 @@
 .input__button_type_send {
-  background: #259C9A;
+  background: #259c9a;
   color: #fff;
 
-  &:hover, &:focus {
+  &:hover,
+  &:focus {
     background: #0aa;
   }
 }

web/app/components/input/__button/input__button.scss

@@ -12,7 +12,7 @@
   }
 
   &:disabled {
-    opacity: .5;
+    opacity: 0.5;
     pointer-events: none;
   }
 }

web/app/components/input/__field/input__field.scss

@@ -21,7 +21,7 @@
   transform: translateZ(0); // let's try to fix blinking in Safari, again
 
   &:focus {
-    box-shadow: inset 0 0 0 2px #259C9A;
+    box-shadow: inset 0 0 0 2px #259c9a;
     outline: none;
   }
 

web/app/components/raw-content/raw-content.scss

@@ -30,7 +30,12 @@
     max-height: 300px;
   }
 
-  h1, h2, h3, h4, h5, h6 {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
     &:first-child {
       margin-top: 0;
     }
@@ -58,7 +63,8 @@
       font-weight: 600;
     }
 
-    th, td {
+    th,
+    td {
       padding: 6px 13px;
       border: 1px solid #dfe2e5;
     }
@@ -77,7 +83,7 @@
     padding: 0.2em 0.4em;
     margin: 0;
     font-size: 85%;
-    background-color: rgba(#1b1f23, .05);
+    background-color: rgba(#1b1f23, 0.05);
     border-radius: 3px;
   }
 
@@ -115,8 +121,10 @@
     }
   }
 
-  sup, sub {
-    sup, sub {
+  sup,
+  sub {
+    sup,
+    sub {
       vertical-align: middle; // to prevent some visual cheats
     }
   }

web/app/components/root/__show-more/root__show-more.scss

@@ -5,7 +5,7 @@
   height: 36px;
   margin: 20px auto;
   padding: 0;
-  background: #259C9A;
+  background: #259c9a;
   border-radius: 4px;
   border: 0;
   font-size: 14px;
@@ -14,7 +14,8 @@
   color: #fff;
   cursor: pointer;
 
-  &:hover, &:focus {
+  &:hover,
+  &:focus {
     background: #0aa;
   }
 

web/app/counter.js

@@ -13,7 +13,7 @@ function init() {
   const nodes = [].slice.call(document.getElementsByClassName(COUNTER_NODE_CLASSNAME));
 
   if (!nodes) {
-    console.error('Remark42: Can\'t find counter nodes.');
+    console.error("Remark42: Can't find counter nodes.");
     return;
   }
 
@@ -34,9 +34,7 @@ function init() {
     return acc;
   }, {});
 
-  api.getCommentsCount({ urls: Object.keys(map), siteId: remark_config.site_id })
-    .then(res => {
-      res.forEach(item => (map[item.url].innerHTML = item.count));
-    });
+  api.getCommentsCount({ urls: Object.keys(map), siteId: remark_config.site_id }).then(res => {
+    res.forEach(item => (map[item.url].innerHTML = item.count));
+  });
 }
-

web/app/embed.js

@@ -11,7 +11,7 @@ function init() {
   const node = document.getElementById(NODE_ID);
 
   if (!node) {
-    console.error('Remark42: Can\'t find root node.');
+    console.error("Remark42: Can't find root node.");
     return;
   }
 
@@ -79,4 +79,3 @@ function init() {
     }
   }
 }
-

web/app/testUtils/index.js

@@ -3,7 +3,7 @@ export function createDomContainer(setup) {
   beforeAll(() => {
     domContainer = document.createElement('div');
     (document.body || document.documentElement).appendChild(domContainer);
-    setup({domContainer});
+    setup({ domContainer });
   });
 
   beforeEach(() => {

web/babelOptions.js

@@ -1,15 +1,14 @@
 module.exports = {
   presets: [
-    ['env', {
-      targets: {
-        browsers: ['> 1%', 'android >= 4.4.4', 'ios >= 9', 'IE >= 11']
+    [
+      'env',
+      {
+        targets: {
+          browsers: ['> 1%', 'android >= 4.4.4', 'ios >= 9', 'IE >= 11'],
+        },
+        useBuiltIns: true,
       },
-      useBuiltIns: true,
-    }],
-  ],
-  plugins: [
-    'syntax-dynamic-import',
-    'transform-object-rest-spread',
-    ['transform-react-jsx', { 'pragma': 'h' }]
+    ],
   ],
+  plugins: ['syntax-dynamic-import', 'transform-object-rest-spread', ['transform-react-jsx', { pragma: 'h' }]],
 };

web/fileTransformer.js

@@ -1,7 +1,6 @@
-const {createTransformer} = require(`babel-jest`);
+const { createTransformer } = require(`babel-jest`);
 const babelOptions = require('./babelOptions');
 
-
 module.exports = createTransformer({
   babelrc: false,
   ...babelOptions,

web/webpack.config.js

@@ -28,15 +28,15 @@ const commonStyleLoaders = [
         require('postcss-url')({ url: 'inline', maxSize: 5 }),
         require('postcss-wrap')({ selector: `#${NODE_ID}` }),
         require('postcss-csso'),
-      ]
-    }
+      ],
+    },
   },
   {
     loader: 'sass-loader',
     options: {
       includePaths: [path.resolve(__dirname, 'app')],
-    }
-  }
+    },
+  },
 ];
 
 module.exports = {
@@ -50,11 +50,11 @@ module.exports = {
   output: {
     path: publicFolder,
     filename: `[name].js`,
-    chunkFilename: '[name].js'
+    chunkFilename: '[name].js',
   },
   resolve: {
     extensions: ['.jsx', '.js'],
-    modules: [path.resolve(__dirname, 'app'), path.resolve(__dirname, 'node_modules')]
+    modules: [path.resolve(__dirname, 'app'), path.resolve(__dirname, 'node_modules')],
   },
   module: {
     rules: [
@@ -64,30 +64,28 @@ module.exports = {
         use: {
           loader: 'babel-loader',
           options: babelOptions,
-        }
+        },
       },
       {
         test: /\.scss$/,
-        use: env === 'production'
-          ? ExtractText.extract({
-            fallback: 'style-loader',
-            use: commonStyleLoaders,
-          })
-          : [
-            'style-loader',
-            ...commonStyleLoaders,
-          ],
+        use:
+          env === 'production'
+            ? ExtractText.extract({
+                fallback: 'style-loader',
+                use: commonStyleLoaders,
+              })
+            : ['style-loader', ...commonStyleLoaders],
       },
       {
         test: /\.(png|jpg|jpeg|gif|svg)$/,
         use: {
           loader: 'file-loader',
           options: {
-            name: `files/[name].[hash].[ext]`
-          }
-        }
-      }
-    ]
+            name: `files/[name].[hash].[ext]`,
+          },
+        },
+      },
+    ],
   },
   plugins: [
     new Clean(publicFolder),
@@ -114,32 +112,38 @@ module.exports = {
       filename: 'last-comments.html',
       inject: false,
     }),
-    ...(env === 'production' ? [] : [new Html({
-      template: path.resolve(__dirname, 'dev.ejs'),
-      filename: 'dev.html',
-      inject: false,
-    })]),
+    ...(env === 'production'
+      ? []
+      : [
+          new Html({
+            template: path.resolve(__dirname, 'dev.ejs'),
+            filename: 'dev.html',
+            inject: false,
+          }),
+        ]),
     new ExtractText({
       filename: `remark.css`,
-      allChunks: true
+      allChunks: true,
     }),
     new webpack.optimize.ModuleConcatenationPlugin(),
     ...(env === 'production' ? [new webpack.optimize.UglifyJsPlugin()] : []),
-    ...(process.env.CI === 'true' ? [] : [
-      new BundleAnalyze({
-        analyzerMode: 'static',
-        reportFilename: 'report.html',
-        defaultSizes: 'parsed',
-        generateStatsFile: false,
-        logLevel: 'info',
-        openAnalyzer: false
-      })
-    ]),
+    ...(process.env.CI === 'true'
+      ? []
+      : [
+          new BundleAnalyze({
+            analyzerMode: 'static',
+            reportFilename: 'report.html',
+            defaultSizes: 'parsed',
+            generateStatsFile: false,
+            logLevel: 'info',
+            openAnalyzer: false,
+          }),
+        ]),
     new Copy(['./iframe.html']),
   ],
   watch: env === 'dev',
   watchOptions: {
-    ignored: /(node_modules|\.vendor\.js$)/
+    ignored: /(node_modules|\.vendor\.js$)/,
   },
   devServer: {
     host: '0.0.0.0',