Strict type checking and linting (#114)

* fix

* fix

* fix

---------

Co-authored-by: thomasvo <[email protected]>

example/App.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useRef, useState } from 'react';
 import { View, Text, Image, Animated, Button } from 'react-native';
-// @ts-ignore
+
 import { ReactNativeZoomableView } from '@openspacelabs/react-native-zoomable-view';
 import { styles } from './style';
 import { debounce } from 'lodash';
@@ -33,16 +33,18 @@ export default function App() {
     []
   )();
 
-  const staticPinPosition = size
-    ? { x: size.width / 2, y: size.height / 2 }
-    : undefined;
-
+  const staticPinPosition = { x: size.width / 2, y: size.height / 2 };
   const { size: contentSize } = applyContainResizeMode(imageSize, size);
 
   return (
     <View style={styles.container}>
       <Text>ReactNativeZoomableView</Text>
-      <View style={styles.box} onLayout={(e) => setSize(e.nativeEvent.layout)}>
+      <View
+        style={styles.box}
+        onLayout={(e) => {
+          setSize(e.nativeEvent.layout);
+        }}
+      >
         <ReactNativeZoomableView
           disableMomentum
           // Where to put the pin in the content view
@@ -84,7 +86,9 @@ export default function App() {
       <Text>onStaticPinPositionMove: {stringifyPoint(movePin)}</Text>
       <Button
         title={`${showMarkers ? 'Hide' : 'Show'} markers`}
-        onPress={() => setShowMarkers((value) => !value)}
+        onPress={() => {
+          setShowMarkers((value) => !value);
+        }}
       />
     </View>
   );

example/style.ts

@@ -1,37 +1,37 @@
 import { StyleSheet } from 'react-native';
 
 export const styles = StyleSheet.create({
+  box: {
+    borderWidth: 5,
+    flexShrink: 1,
+    height: 600,
+    width: 480,
+  },
   container: {
-    flex: 1,
     alignItems: 'center',
+    flex: 1,
     justifyContent: 'center',
     padding: 20,
   },
   contents: {
-    flex: 1,
     alignSelf: 'stretch',
-  },
-  box: {
-    borderWidth: 5,
-    flexShrink: 1,
-    height: 600,
-    width: 480,
+    flex: 1,
   },
   img: {
-    width: '100%',
     height: '100%',
     resizeMode: 'contain',
+    width: '100%',
   },
   marker: {
-    position: 'absolute',
-    top: '50%',
-    left: '50%',
-    width: 20,
+    backgroundColor: 'white',
+    borderRadius: 10,
+    borderWidth: 2,
     height: 20,
+    left: '50%',
     marginLeft: -10,
     marginTop: -10,
-    borderRadius: 10,
-    backgroundColor: 'white',
-    borderWidth: 2,
+    position: 'absolute',
+    top: '50%',
+    width: 20,
   },
 });