Fix lint issues

Author: michaelclapham

src/App.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useState } from "react";
 import "./App.css";
 import { IonApp, IonPage, IonRouterOutlet } from "@ionic/react";
 import { IonReactRouter } from "@ionic/react-router";

src/NavigateOnStateChange.tsx

@@ -1,13 +1,13 @@
 import { useIonRouter } from "@ionic/react";
-import React, { useContext, useEffect } from "react";
+import React, { useEffect } from "react";
 
 type NavigateOnStateChangeProps = { route?: string, onNavigate?: () => void}
 
 export const NavigateOnStateChange: React.FC<NavigateOnStateChangeProps> = ({route, onNavigate}) => {
     const ionRouter = useIonRouter();
     console.log("NavigateOnStateChange", ionRouter);
     useEffect(() => {
-      if (route) {
+      if (route && ionRouter) {
         console.log("Route changed ", route);
         setTimeout(() => {
             ionRouter.push(route);
@@ -16,6 +16,8 @@ export const NavigateOnStateChange: React.FC<NavigateOnStateChangeProps> = ({rou
             onNavigate();
         }
       }
+    /* This useEffect should ONLY run when route changes */
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [route]);
     return <></>
   }