Merge pull request #1337 from ddaza/master

chore: Removed eslint comments, added global formatting, fixed errors

package.json

@@ -19,6 +19,7 @@
     "lint": "eslint {src,tests}/**/*.{ts,tsx}",
     "lint:fix": "yarn lint --fix",
     "lint:types": "tsc --noEmit",
+    "lint:prettier":"prettier --write src/**/**/*.{ts,tsx}",
     "build:cjs": "tsc",
     "build:es": "tsc -m esNext --outDir esm",
     "build": "yarn build:cjs && yarn build:es",
@@ -148,8 +149,9 @@
     ]
   },
   "lint-staged": {
-    "src/**/*.{ts,tsx}": [
+    "src/**/**/*.{ts,tsx}": [
       "eslint --fix",
+      "prettier --write",
       "git add"
     ]
   },

src/createBreakpoint.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useEffect, useState, useMemo } from 'react';
 
 const createBreakpoint = (

src/createGlobalState.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useState } from 'react';
 import useEffectOnce from './useEffectOnce';
 import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect';
@@ -8,7 +7,7 @@ export function createGlobalState<S = any>(initialState?: S) {
     state: initialState,
     setState(state: S) {
       store.state = state;
-      store.setters.forEach(setter => setter(store.state));
+      store.setters.forEach((setter) => setter(store.state));
     },
     setters: [],
   };
@@ -17,7 +16,7 @@ export function createGlobalState<S = any>(initialState?: S) {
     const [globalState, stateSetter] = useState<S | undefined>(store.state);
 
     useEffectOnce(() => () => {
-      store.setters = store.setters.filter(setter => setter !== stateSetter);
+      store.setters = store.setters.filter((setter) => setter !== stateSetter);
     });
 
     useIsomorphicLayoutEffect(() => {

src/createMemo.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useMemo } from 'react';
 
 const createMemo = <T extends (...args: any) => any>(fn: T) => (...args: Parameters<T>) =>

src/createReducer.ts

@@ -30,7 +30,7 @@ const createReducer = <Action, State>(...middlewares: Middleware<Action, State>[
     const [, setState] = useState(ref.current);
 
     const dispatch = useCallback(
-      action => {
+      (action) => {
         ref.current = reducer(ref.current, action);
         setState(ref.current);
         return action;

src/createRouter.ts

@@ -1,5 +1,4 @@
-/* eslint-disable */
-import * as React from 'react';
+import React from 'react';
 
 export interface RouterProviderProps {
   route: string;
@@ -14,7 +13,7 @@ const createRouter = () => {
 
   // not sure if this supposed to be unused, ignoring ts error for now
   // @ts-ignore
-  const Router: React.SFC<RouterProviderProps> = props => {
+  const Router: React.SFC<RouterProviderProps> = (props) => {
     const { route, fullRoute, parent, children } = props;
 
     if (process.env.NODE_ENV !== 'production') {

src/useAsyncFn.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { DependencyList, useCallback, useState, useRef } from 'react';
 import useMountedState from './useMountedState';
 import { FnReturningPromise, PromiseType } from './util';
@@ -40,15 +39,15 @@ export default function useAsyncFn<T extends FnReturningPromise>(
 
   const callback = useCallback((...args: Parameters<T>): ReturnType<T> => {
     const callId = ++lastCallId.current;
-    set(prevState => ({ ...prevState, loading: true }));
+    set((prevState) => ({ ...prevState, loading: true }));
 
     return fn(...args).then(
-      value => {
+      (value) => {
         isMounted() && callId === lastCallId.current && set({ value, loading: false });
 
         return value;
       },
-      error => {
+      (error) => {
         isMounted() && callId === lastCallId.current && set({ error, loading: false });
 
         return error;

src/useAsyncRetry.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { DependencyList, useCallback, useState } from 'react';
 import useAsync, { AsyncState } from './useAsync';
 
@@ -20,7 +19,7 @@ const useAsyncRetry = <T>(fn: () => Promise<T>, deps: DependencyList = []) => {
       return;
     }
 
-    setAttempt(currentAttempt => currentAttempt + 1);
+    setAttempt((currentAttempt) => currentAttempt + 1);
   }, [...deps, stateLoading]);
 
   return { ...state, retry };

src/useBattery.ts

@@ -1,9 +1,6 @@
-/* eslint-disable */
-import * as React from 'react';
+import { useState, useEffect } from 'react';
 import { off, on, isDeepEqual } from './util';
 
-const { useState, useEffect } = React;
-
 export interface BatteryState {
   charging: boolean;
   chargingTime: number;

src/useClickAway.ts

@@ -13,7 +13,7 @@ const useClickAway = <E extends Event = Event>(
     savedCallback.current = onClickAway;
   }, [onClickAway]);
   useEffect(() => {
-    const handler = event => {
+    const handler = (event) => {
       const { current: el } = ref;
       el && !el.contains(event.target) && savedCallback.current(event);
     };

src/useCopyToClipboard.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import writeText from 'copy-to-clipboard';
 import { useCallback } from 'react';
 import useMountedState from './useMountedState';
@@ -18,7 +17,7 @@ const useCopyToClipboard = (): [CopyToClipboardState, (value: string) => void] =
     noUserInteraction: true,
   });
 
-  const copyToClipboard = useCallback(value => {
+  const copyToClipboard = useCallback((value) => {
     if (!isMounted()) {
       return;
     }

src/useCounter.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useMemo } from 'react';
 import useGetSet from './useGetSet';
 import { HookState, InitialHookState, resolveHookState } from './util/resolveHookState';

src/useDrop.ts

@@ -1,7 +1,4 @@
-/* eslint-disable */
-import * as React from 'react';
-
-const { useState, useMemo, useCallback, useEffect } = React;
+import { useState, useMemo, useCallback, useEffect } from 'react';
 
 export interface DropAreaState {
   over: boolean;
@@ -50,12 +47,12 @@ const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => {
   const process = useMemo(() => createProcess(options), [onFiles, onText, onUri]);
 
   useEffect(() => {
-    const onDragOver = event => {
+    const onDragOver = (event) => {
       event.preventDefault();
       setOver(true);
     };
 
-    const onDragEnter = event => {
+    const onDragEnter = (event) => {
       event.preventDefault();
       setOver(true);
     };
@@ -68,13 +65,13 @@ const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => {
       setOver(false);
     };
 
-    const onDrop = event => {
+    const onDrop = (event) => {
       event.preventDefault();
       setOver(false);
       process(event.dataTransfer, event);
     };
 
-    const onPaste = event => {
+    const onPaste = (event) => {
       process(event.clipboardData, event);
     };
 

src/useDropArea.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useMemo, useState } from 'react';
 import useMountedState from './useMountedState';
 
@@ -41,7 +40,7 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans
   }
 
   if (dataTransfer.items && dataTransfer.items.length) {
-    dataTransfer.items[0].getAsString(text => {
+    dataTransfer.items[0].getAsString((text) => {
       if (mounted) {
         (options.onText || noop)(text, event);
       }
@@ -50,23 +49,23 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans
 };
 
 const createBond = (process, setOver): DropAreaBond => ({
-  onDragOver: event => {
+  onDragOver: (event) => {
     event.preventDefault();
   },
-  onDragEnter: event => {
+  onDragEnter: (event) => {
     event.preventDefault();
     setOver(true);
   },
   onDragLeave: () => {
     setOver(false);
   },
-  onDrop: event => {
+  onDrop: (event) => {
     event.preventDefault();
     event.persist();
     setOver(false);
     process(event.dataTransfer, event);
   },
-  onPaste: event => {
+  onPaste: (event) => {
     event.persist();
     process(event.clipboardData, event);
   },

src/useEvent.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useEffect } from 'react';
 import { isClient } from './util';
 

src/useFullscreen.ts

@@ -1,15 +1,13 @@
-/* eslint-disable */
 import { RefObject, useState } from 'react';
 import screenfull from 'screenfull';
 import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect';
 
 export interface FullScreenOptions {
-  video?: RefObject<HTMLVideoElement & { webkitEnterFullscreen?: () => void; webkitExitFullscreen?: () => void; }>;
+  video?: RefObject<HTMLVideoElement & { webkitEnterFullscreen?: () => void; webkitExitFullscreen?: () => void }>;
   onClose?: (error?: Error) => void;
 }
 
-const noop = () => {
-};
+const noop = () => {};
 
 const useFullscreen = (ref: RefObject<Element>, on: boolean, options: FullScreenOptions = {}): boolean => {
   const { video, onClose = noop } = options;
@@ -62,8 +60,7 @@ const useFullscreen = (ref: RefObject<Element>, on: boolean, options: FullScreen
         try {
           screenfull.off('change', onChange);
           screenfull.exit();
-        } catch {
-        }
+        } catch {}
       } else if (video && video.current && video.current.webkitExitFullscreen) {
         video.current.removeEventListener('webkitendfullscreen', onWebkitEndFullscreen);
         video.current.webkitExitFullscreen();

src/useGeolocation.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useEffect, useState } from 'react';
 
 export interface GeoLocationSensorState {
@@ -45,7 +44,7 @@ const useGeolocation = (options?: PositionOptions): GeoLocationSensorState => {
     }
   };
   const onEventError = (error: PositionError) =>
-    mounted && setState(oldState => ({ ...oldState, loading: false, error }));
+    mounted && setState((oldState) => ({ ...oldState, loading: false, error }));
 
   useEffect(() => {
     navigator.geolocation.getCurrentPosition(onEvent, onEventError, options);

src/useGetSet.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { Dispatch, useMemo, useRef } from 'react';
 import useUpdate from './useUpdate';
 import { HookState, InitialHookState, resolveHookState } from './util/resolveHookState';

src/useGetSetState.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useCallback, useRef } from 'react';
 import useUpdate from './useUpdate';
 

src/useHash.ts

@@ -1,27 +1,33 @@
-import { useState, useCallback } from "react"
-import useLifecycles from "./useLifecycles"
+import { useState, useCallback } from 'react';
+import useLifecycles from './useLifecycles';
 
 /**
  * read and write url hash, response to url hash change
  */
 export const useHash = () => {
-  const [hash, setHash] = useState(() => window.location.hash)
+  const [hash, setHash] = useState(() => window.location.hash);
 
   const onHashChange = useCallback(() => {
-    setHash(window.location.hash)
-  }, [])
+    setHash(window.location.hash);
+  }, []);
 
-  useLifecycles(() => {
-    window.addEventListener('hashchange', onHashChange)
-  }, () => {
-    window.removeEventListener('hashchange', onHashChange)
-  })
-
-  const _setHash = useCallback((newHash: string) => {
-    if (newHash !== hash) {
-      window.location.hash = newHash
+  useLifecycles(
+    () => {
+      window.addEventListener('hashchange', onHashChange);
+    },
+    () => {
+      window.removeEventListener('hashchange', onHashChange);
     }
-  }, [hash])
+  );
+
+  const _setHash = useCallback(
+    (newHash: string) => {
+      if (newHash !== hash) {
+        window.location.hash = newHash;
+      }
+    },
+    [hash]
+  );
 
-  return [hash, _setHash] as const
-}
+  return [hash, _setHash] as const;
+};

src/useIdle.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { useEffect, useState } from 'react';
 import { throttle } from 'throttle-debounce';
 import { off, on } from './util';

src/useIntersection.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { RefObject, useEffect, useState } from 'react';
 
 const useIntersection = (

src/useKey.ts

@@ -1,4 +1,3 @@
-/* eslint-disable */
 import { DependencyList, useMemo } from 'react';
 import useEvent, { UseEventTarget } from './useEvent';
 
@@ -26,7 +25,7 @@ const useKey = (key: KeyFilter, fn: Handler = noop, opts: UseKeyOptions = {}, de
   const { event = 'keydown', target, options } = opts;
   const useMemoHandler = useMemo(() => {
     const predicate: KeyPredicate = createKeyPredicate(key);
-    const handler: Handler = handlerEvent => {
+    const handler: Handler = (handlerEvent) => {
       if (predicate(handlerEvent)) {
         return fn(handlerEvent);
       }

src/useKeyPress.ts

@@ -3,8 +3,8 @@ import useKey, { KeyFilter } from './useKey';
 
 const useKeyPress = (keyFilter: KeyFilter) => {
   const [state, set] = useState<[boolean, null | KeyboardEvent]>([false, null]);
-  useKey(keyFilter, event => set([true, event]), { event: 'keydown' }, [state]);
-  useKey(keyFilter, event => set([false, event]), { event: 'keyup' }, [state]);
+  useKey(keyFilter, (event) => set([true, event]), { event: 'keydown' }, [state]);
+  useKey(keyFilter, (event) => set([false, event]), { event: 'keyup' }, [state]);
   return state;
 };
 

src/useKeyboardJs.ts

@@ -6,16 +6,16 @@ const useKeyboardJs = (combination: string | string[]) => {
   const [keyboardJs, setKeyboardJs] = useState<any>(null);
 
   useMount(() => {
-    import('keyboardjs').then(k => setKeyboardJs(k.default || k));
+    import('keyboardjs').then((k) => setKeyboardJs(k.default || k));
   });
 
   useEffect(() => {
     if (!keyboardJs) {
       return;
     }
 
-    const down = event => set([true, event]);
-    const up = event => set([false, event]);
+    const down = (event) => set([true, event]);
+    const up = (event) => set([false, event]);
     keyboardJs.bind(combination, down, up, true);
 
     return () => {