Add Eslint and Prettier

.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  extends: ['@react-native-community'],
+  rules: {
+    semi: 0,
+  },
+}

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  bracketSpacing: false,
+  jsxBracketSameLine: true,
+  singleQuote: true,
+  trailingComma: 'all',
+  semi: false,
+};

package.json

@@ -8,7 +8,8 @@
     "prepare":"yarn build",
     "build": "yarn tsc",
     "release": "release-it",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "lint": "eslint src/**/*.ts"
   },
   "author": "Nader Dabit",
   "license": "ISC",
@@ -17,12 +18,16 @@
     "react-native": ">=0.59"
   },
   "devDependencies": {
+    "@react-native-community/eslint-config": "^0.0.7",
     "@types/react": "^16.9.10",
     "@types/react-native": "^0.60.21",
+    "eslint": "^6.8.0",
+    "eslint-plugin-prettier": "^3.1.2",
+    "prettier": "^1.19.1",
     "release-it": "^12.3.5",
     "typescript": "^3.6.4"
   },
   "files": [
     "lib"
   ]
-}
+}

src/index.ts

@@ -19,5 +19,5 @@ export {
   useKeyboard,
   useInteractionManager,
   useDeviceOrientation,
-  useLayout
+  useLayout,
 }

src/useAccessibilityInfo.ts

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import {useEffect, useState} from 'react'
 import {
   AccessibilityInfo,
   AccessibilityChangeEvent,
@@ -39,5 +39,5 @@ export default function useAccessibilityInfo() {
     }
   }, [])
 
-  return { reduceMotionEnabled, screenReaderEnabled }
+  return {reduceMotionEnabled, screenReaderEnabled}
 }

src/useAppState.ts

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react'
-import { AppState, AppStateStatus } from 'react-native'
+import {useEffect, useState} from 'react'
+import {AppState, AppStateStatus} from 'react-native'
 
 export default function useAppState() {
   const currentState = AppState.currentState

src/useBackHandler.ts

@@ -1,5 +1,5 @@
-import React, { useEffect } from 'react'
-import { BackHandler } from 'react-native'
+import {useEffect} from 'react'
+import {BackHandler} from 'react-native'
 
 export default function useBackHandler(handler: () => void) {
   useEffect(() => {

src/useCameraRoll.ts

@@ -1,9 +1,5 @@
-import React, { useState } from 'react'
-import {
-  CameraRoll,
-  GetPhotosParamType,
-  GetPhotosReturnType,
-} from 'react-native'
+import {useState} from 'react'
+import {CameraRoll, GetPhotosParamType, GetPhotosReturnType} from 'react-native'
 
 const initialState: GetPhotosReturnType = {
   edges: [],

src/useClipboard.ts

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react'
-import { Clipboard } from 'react-native'
+import {useEffect, useState} from 'react'
+import {Clipboard} from 'react-native'
 
 export default function useClipBoard() {
   const [data, updateClipboardData] = useState('')

src/useDeviceOrientation.ts

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react'
-import { Dimensions, ScaledSize } from 'react-native'
+import {useEffect, useState, useCallback} from 'react'
+import {Dimensions, ScaledSize} from 'react-native'
 
 const screen = Dimensions.get('screen')
 
@@ -24,20 +24,20 @@ export default function() {
     landscape: isOrientationLandscape(screen),
   })
 
-  const onChange = ({ screen }: { screen: ScaledSize }) => {
+  const onChange = useCallback(({screen}: {screen: ScaledSize}) => {
     setOrientation({
       portrait: isOrientationPortrait(screen),
       landscape: isOrientationLandscape(screen),
     })
-  }
+  }, [])
 
   useEffect(() => {
     Dimensions.addEventListener('change', onChange)
 
     return () => {
       Dimensions.removeEventListener('change', onChange)
     }
-  }, [orientation.portrait, orientation.landscape])
+  }, [orientation.portrait, orientation.landscape, onChange])
 
   return orientation
 }

src/useDimensions.ts

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react'
-import { Dimensions, ScaledSize } from 'react-native'
+import {useEffect, useState} from 'react'
+import {Dimensions, ScaledSize} from 'react-native'
 
 const window = Dimensions.get('window')
 const screen = Dimensions.get('screen')
@@ -17,7 +17,7 @@ export default function useDimensions() {
     window: ScaledSize
     screen: ScaledSize
   }) => {
-    setDimensions({ window, screen })
+    setDimensions({window, screen})
   }
 
   useEffect(() => {

src/useInteractionManager.ts

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react'
-import { InteractionManager } from 'react-native'
+import {useEffect, useState} from 'react'
+import {InteractionManager} from 'react-native'
 
 export default function useInteractionManager() {
   const [complete, updateInteractionStatus] = useState(false)

src/useKeyboard.ts

@@ -1,31 +1,31 @@
-import React, { useEffect, useState } from 'react'
-import { Keyboard, KeyboardEventListener, ScreenRect } from 'react-native'
+import {useEffect, useState} from 'react'
+import {Keyboard, KeyboardEventListener, ScreenRect} from 'react-native'
 
 export default function useKeyboard() {
   const [shown, setShown] = useState(false)
   const [coordinates, setCoordinates] = useState<{
     start: ScreenRect
     end: ScreenRect
   }>({
-    start: { screenX: 0, screenY: 0, width: 0, height: 0 },
-    end: { screenX: 0, screenY: 0, width: 0, height: 0 },
+    start: {screenX: 0, screenY: 0, width: 0, height: 0},
+    end: {screenX: 0, screenY: 0, width: 0, height: 0},
   })
   const [keyboardHeight, setKeyboardHeight] = useState<number>(0)
 
-  const handleKeyboardWillShow: KeyboardEventListener = (e) => {
-    setCoordinates({ start: e.startCoordinates, end: e.endCoordinates })
+  const handleKeyboardWillShow: KeyboardEventListener = e => {
+    setCoordinates({start: e.startCoordinates, end: e.endCoordinates})
   }
-  const handleKeyboardDidShow: KeyboardEventListener = (e) => {
+  const handleKeyboardDidShow: KeyboardEventListener = e => {
     setShown(true)
-    setCoordinates({ start: e.startCoordinates, end: e.endCoordinates })
+    setCoordinates({start: e.startCoordinates, end: e.endCoordinates})
     setKeyboardHeight(e.endCoordinates.height)
   }
-  const handleKeyboardWillHide: KeyboardEventListener = (e) => {
-    setCoordinates({ start: e.startCoordinates, end: e.endCoordinates })
+  const handleKeyboardWillHide: KeyboardEventListener = e => {
+    setCoordinates({start: e.startCoordinates, end: e.endCoordinates})
   }
-  const handleKeyboardDidHide: KeyboardEventListener = (e) => {
+  const handleKeyboardDidHide: KeyboardEventListener = e => {
     setShown(false)
-    setCoordinates({ start: e.startCoordinates, end: e.endCoordinates })
+    setCoordinates({start: e.startCoordinates, end: e.endCoordinates})
     setKeyboardHeight(0)
   }
 
@@ -58,6 +58,6 @@ export default function useKeyboard() {
   return {
     keyboardShown: shown,
     coordinates,
-    keyboardHeight
+    keyboardHeight,
   }
 }

src/useLayout.ts

@@ -1,13 +1,13 @@
-import React from 'react'
+import {useState, useCallback} from 'react'
 
 export default function useLayout() {
-  const [layout, setLayout] = React.useState({
+  const [layout, setLayout] = useState({
     x: 0,
     y: 0,
     width: 0,
     height: 0,
   })
-  const onLayout = React.useCallback((e) => setLayout(e.nativeEvent.layout), [])
+  const onLayout = useCallback(e => setLayout(e.nativeEvent.layout), [])
 
   return {
     onLayout,