[style] Upgrade linter & fix linter/tsc warnings

Author: IjzerenHein

package.json

@@ -42,18 +42,18 @@
     "hoist-non-react-statics": "^3.3.2"
   },
   "devDependencies": {
-    "@commitlint/config-conventional": "^11.0.0",
+    "@commitlint/config-conventional": "^13.1.0",
     "@react-navigation/bottom-tabs": "^5.11.2",
     "@react-navigation/material-top-tabs": "^5.3.10",
     "@react-navigation/native": "^5.8.10",
     "@react-navigation/stack": "^5.12.8",
-    "@types/react": "^17.0.0",
-    "@types/react-native": "^0.63.37",
-    "commitlint": "^11.0.0",
+    "@types/react": "^17.0.15",
+    "@types/react-native": "^0.64.12",
+    "commitlint": "^13.1.0",
     "conventional-changelog-cli": "^2.1.1",
-    "eslint": "^7.15.0",
-    "expo-module-scripts": "^1.2.0",
-    "prettier": "^2.2.1",
+    "eslint": "^7.32.0",
+    "expo-module-scripts": "^2.0.0",
+    "prettier": "^2.3.2",
     "react-native-shared-element": "^0.7.0",
     "react-navigation": "^4.4.4",
     "react-navigation-stack": "^2.10.4"

src/SharedElementRendererContext.ts

@@ -2,8 +2,7 @@ import * as React from "react";
 
 import { ISharedElementRendererData } from "./SharedElementRendererData";
 
-const SharedElementRendererContext = React.createContext<ISharedElementRendererData | null>(
-  null
-);
+const SharedElementRendererContext =
+  React.createContext<ISharedElementRendererData | null>(null);
 
 export default SharedElementRendererContext;

src/SharedElementRendererData.ts

@@ -62,7 +62,8 @@ type SceneRoute = {
  */
 
 export default class SharedElementRendererData
-  implements ISharedElementRendererData {
+  implements ISharedElementRendererData
+{
   private scenes: SceneRoute[] = [];
   private updateSubscribers = new Set<SharedElementRendererUpdateHandler>();
   private sharedElements: SharedElementsStrictConfig | null = null;
@@ -359,13 +360,8 @@ export default class SharedElementRendererData
   }
 
   getTransitions(): SharedElementTransitionProps[] {
-    const {
-      sharedElements,
-      prevScene,
-      scene,
-      isShowing,
-      sceneAnimValue,
-    } = this;
+    const { sharedElements, prevScene, scene, isShowing, sceneAnimValue } =
+      this;
 
     if (!sharedElements || !scene || !prevScene) return NO_SHARED_ELEMENTS;
     return sharedElements.map(({ id, otherId, ...other }) => {

src/SharedElementRendererView.tsx

@@ -30,13 +30,15 @@ export default class SharedElementRendererView extends React.PureComponent<Props
     // console.log('SharedElementRendererView.render: ', transitions);
     return (
       <View style={StyleSheet.absoluteFill} pointerEvents="none">
-        {transitions.map((
-          // @ts-ignore
-          { key, ...props },
-          index
-        ) => (
-          <SharedElementTransition key={`${key}:${index}`} {...props} />
-        ))}
+        {transitions.map(
+          (
+            // @ts-ignore
+            { key, ...props },
+            index
+          ) => (
+            <SharedElementTransition key={`${key}:${index}`} {...props} />
+          )
+        )}
       </View>
     );
   }

src/SharedElementSceneContext.ts

@@ -2,8 +2,7 @@ import * as React from "react";
 
 import SharedElementSceneData from "./SharedElementSceneData";
 
-const SharedElementSceneContext = React.createContext<SharedElementSceneData | null>(
-  null
-);
+const SharedElementSceneContext =
+  React.createContext<SharedElementSceneData | null>(null);
 
 export default SharedElementSceneContext;

src/createSharedElementScene.tsx

@@ -39,8 +39,9 @@ function isValidNavigationState(
 // Gets the current screen from navigation state
 function getActiveRoute(state: NavigationState): Route<any> {
   const route = state.routes[state.index];
-  return route.state && isValidNavigationState(route.state)
-    ? getActiveRoute(route.state) // Dive into nested navigators
+  const routeState = route.state as Partial<NavigationState>;
+  return route.state && isValidNavigationState(routeState)
+    ? getActiveRoute(routeState) // Dive into nested navigators
     : route;
 }
 

src/createSharedElementStackNavigator.tsx

@@ -100,6 +100,7 @@ export default function createSharedElementStackNavigator<
     );
 
     if (debug) {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
       React.useLayoutEffect(() => {
         rendererDataProxy.addDebugRef();
         return function cleanup() {

src/v4/createSharedElementStackNavigator.tsx

@@ -33,7 +33,7 @@ function createSharedElementStackSceneNavigator(
     ...routeConfigs,
   };
   for (const key in routeConfigs) {
-    let routeConfig: any = wrappedRouteConfigs[key];
+    const routeConfig: any = wrappedRouteConfigs[key];
     const component =
       typeof routeConfig === "object" && routeConfig.screen
         ? routeConfig.screen
@@ -59,7 +59,7 @@ function createSharedElementStackSceneNavigator(
   // hook in into the transition lifecycle events.
   const defaultNavigationOptions = stackConfig?.defaultNavigationOptions;
   function defaultNavigationOptionsFn(props: any) {
-    let defaultNavigationOptionsResult =
+    const defaultNavigationOptionsResult =
       typeof defaultNavigationOptions === "function"
         ? defaultNavigationOptions(props)
         : defaultNavigationOptions;