Replace context entry with useRouter

web/apps/accounts/src/pages/_app.tsx

@@ -30,7 +30,7 @@ interface AppContextProps {
 
 export const AppContext = createContext<AppContextProps>({} as AppContextProps);
 
-export default function App(props: AppProps) {
+export default function App({ Component, pageProps }: AppProps) {
     const [isI18nReady, setIsI18nReady] = useState<boolean>(false);
 
     const [showNavbar, setShowNavBar] = useState(false);
@@ -50,8 +50,6 @@ export default function App(props: AppProps) {
 
     const router = useRouter();
 
-    const { Component, pageProps } = props;
-
     const [themeColor] = useLocalState(LS_KEYS.THEME, THEME_COLOR.DARK);
 
     useEffect(() => {

web/apps/auth/src/pages/_app.tsx

@@ -47,8 +47,7 @@ type AppContextType = {
 
 export const AppContext = createContext<AppContextType>(null);
 
-export default function App(props: AppProps) {
-    const { Component, pageProps } = props;
+export default function App({ Component, pageProps }: AppProps) {
     const router = useRouter();
     const [isI18nReady, setIsI18nReady] = useState<boolean>(false);
     const [loading, setLoading] = useState(false);

web/apps/photos/src/pages/_app.tsx

@@ -111,8 +111,7 @@ type AppContextType = {
 
 export const AppContext = createContext<AppContextType>(null);
 
-export default function App(props: AppProps) {
-    const { Component, pageProps } = props;
+export default function App( { Component, pageProps }: AppProps) {
     const router = useRouter();
     const [isI18nReady, setIsI18nReady] = useState<boolean>(false);
     const [loading, setLoading] = useState(false);

web/packages/accounts/components/ChangeEmail.tsx

@@ -13,13 +13,14 @@ import { t } from "i18next";
 import { useRef, useState } from "react";
 import { Trans } from "react-i18next";
 import * as Yup from "yup";
+import { useRouter } from "next/router";
 
 interface formValues {
     email: string;
     ott?: string;
 }
 
-function ChangeEmailForm({ appName, router }: PageProps) {
+function ChangeEmailForm({ appName }: PageProps) {
     const [loading, setLoading] = useState(false);
     const [ottInputVisible, setShowOttInputVisibility] = useState(false);
     const ottInputRef = useRef(null);
@@ -27,6 +28,8 @@ function ChangeEmailForm({ appName, router }: PageProps) {
     const [showMessage, setShowMessage] = useState(false);
     const [success, setSuccess] = useState(false);
 
+    const router = useRouter();
+
     const requestOTT = async (
         { email }: formValues,
         { setFieldError }: FormikHelpers<formValues>,

web/packages/accounts/pages/change-email.tsx

@@ -1,7 +1,7 @@
 import { VerticallyCentered } from "@ente/shared/components/Container";
 import { t } from "i18next";
 import { useEffect } from "react";
-
+import { useRouter } from "next/router";
 import ChangeEmailForm from "@ente/accounts/components/ChangeEmail";
 import { PAGES } from "@ente/accounts/constants/pages";
 import { PageProps } from "@ente/shared/apps/types";
@@ -9,7 +9,9 @@ import FormPaper from "@ente/shared/components/Form/FormPaper";
 import FormPaperTitle from "@ente/shared/components/Form/FormPaper/Title";
 import { getData, LS_KEYS } from "@ente/shared/storage/localStorage";
 
-function ChangeEmailPage({ router, appName, appContext }: PageProps) {
+function ChangeEmailPage({ appName, appContext }: PageProps) {
+    const router = useRouter();
+
     useEffect(() => {
         const user = getData(LS_KEYS.USER);
         if (!user?.token) {

web/packages/accounts/pages/change-password.tsx

@@ -35,11 +35,15 @@ import FormPaperTitle from "@ente/shared/components/Form/FormPaper/Title";
 import LinkButton from "@ente/shared/components/LinkButton";
 import ComlinkCryptoWorker from "@ente/shared/crypto";
 import InMemoryStore, { MS_KEYS } from "@ente/shared/storage/InMemoryStore";
+import { useRouter } from "next/router";
 
-export default function ChangePassword({ appName, router }: PageProps) {
+
+export default function ChangePassword({ appName }: PageProps) {
     const [token, setToken] = useState<string>();
     const [user, setUser] = useState<User>();
 
+    const router = useRouter();
+
     useEffect(() => {
         const user = getData(LS_KEYS.USER);
         setUser(user);

web/packages/accounts/pages/credentials.tsx

@@ -44,7 +44,6 @@ import isElectron from "is-electron";
 import { getSRPAttributes } from "../api/srp";
 import { configureSRP, loginViaSRP } from "../services/srp";
 import { SRPAttributes } from "../types/srp";
-// import { APPS, getAppName } from '@ente/shared/apps';
 import { APP_HOMES } from "@ente/shared/apps/constants";
 import { PageProps } from "@ente/shared/apps/types";
 import ComlinkCryptoWorker from "@ente/shared/crypto";
@@ -54,16 +53,14 @@ import { CustomError } from "@ente/shared/error";
 import { addLocalLog } from "@ente/shared/logging";
 import { logError } from "@ente/shared/sentry";
 import InMemoryStore, { MS_KEYS } from "@ente/shared/storage/InMemoryStore";
+import { useRouter } from "next/router";
 
-export default function Credentials({
-    appContext,
-    router,
-    appName,
-}: PageProps) {
+export default function Credentials({ appContext, appName }: PageProps) {
     const [srpAttributes, setSrpAttributes] = useState<SRPAttributes>();
     const [keyAttributes, setKeyAttributes] = useState<KeyAttributes>();
     const [user, setUser] = useState<User>();
 
+    const router = useRouter();
     useEffect(() => {
         const main = async () => {
             const user: User = getData(LS_KEYS.USER);

web/packages/accounts/pages/generate.tsx

@@ -29,12 +29,16 @@ import {
     setJustSignedUp,
 } from "@ente/shared/storage/localStorage/helpers";
 import { KeyAttributes, User } from "@ente/shared/user/types";
+import { useRouter } from "next/router";
 
-export default function Generate({ router, appContext, appName }: PageProps) {
+export default function Generate({ appContext, appName }: PageProps) {
     const [token, setToken] = useState<string>();
     const [user, setUser] = useState<User>();
     const [recoverModalView, setRecoveryModalView] = useState(false);
     const [loading, setLoading] = useState(true);
+
+    const router = useRouter();
+
     useEffect(() => {
         const main = async () => {
             const key: string = getKey(SESSION_KEYS.ENCRYPTION_KEY);

web/packages/accounts/pages/login.tsx

@@ -3,13 +3,16 @@ import { VerticallyCentered } from "@ente/shared/components/Container";
 import EnteSpinner from "@ente/shared/components/EnteSpinner";
 import FormPaper from "@ente/shared/components/Form/FormPaper";
 import { LS_KEYS, getData } from "@ente/shared/storage/localStorage";
+import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 import Login from "../components/Login";
 import { PAGES } from "../constants/pages";
 
-export default function LoginPage({ appContext, router, appName }: PageProps) {
+export default function LoginPage({ appContext, appName }: PageProps) {
     const [loading, setLoading] = useState(true);
 
+    const router = useRouter();
+
     useEffect(() => {
         const user = getData(LS_KEYS.USER);
         if (user?.email) {

web/packages/accounts/pages/recover.tsx

@@ -23,13 +23,17 @@ import InMemoryStore, { MS_KEYS } from "@ente/shared/storage/InMemoryStore";
 import { LS_KEYS, getData, setData } from "@ente/shared/storage/localStorage";
 import { SESSION_KEYS, getKey } from "@ente/shared/storage/sessionStorage";
 import { KeyAttributes, User } from "@ente/shared/user/types";
+import { useRouter } from "next/router";
+
 const bip39 = require("bip39");
 // mobile client library only supports english.
 bip39.setDefaultWordlist("english");
 
-export default function Recover({ appContext, router, appName }: PageProps) {
+export default function Recover({ appContext, appName }: PageProps) {
     const [keyAttributes, setKeyAttributes] = useState<KeyAttributes>();
 
+    const router = useRouter();
+
     useEffect(() => {
         const user: User = getData(LS_KEYS.USER);
         const keyAttributes: KeyAttributes = getData(LS_KEYS.KEY_ATTRIBUTES);

web/packages/accounts/pages/signup.tsx

@@ -5,11 +5,14 @@ import { PageProps } from "@ente/shared/apps/types";
 import { VerticallyCentered } from "@ente/shared/components/Container";
 import EnteSpinner from "@ente/shared/components/EnteSpinner";
 import FormPaper from "@ente/shared/components/Form/FormPaper";
+import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 
-export default function SignUpPage({ router, appContext, appName }: PageProps) {
+export default function SignUpPage({ appContext, appName }: PageProps) {
     const [loading, setLoading] = useState(true);
 
+    const router = useRouter();
+
     useEffect(() => {
         const user = getData(LS_KEYS.USER);
         if (user?.email) {

web/packages/shared/apps/types.ts

@@ -1,6 +1,5 @@
 import { TwoFactorType } from "@ente/accounts/constants/twofactor";
 import { SetDialogBoxAttributesV2 } from "@ente/shared/components/DialogBoxV2/types";
-import { NextRouter } from "next/router";
 import { APPS } from "./constants";
 
 export interface PageProps {
@@ -9,7 +8,6 @@ export interface PageProps {
         isMobile: boolean;
         setDialogBoxAttributesV2: SetDialogBoxAttributesV2;
     };
-    router: NextRouter;
     appName: APPS;
     twoFactorType?: TwoFactorType;
 }