diff --git a/web/packages/accounts/pages/login.tsx b/web/packages/accounts/pages/login.tsx
index 103f8ab14..506cc81bc 100644
--- a/web/packages/accounts/pages/login.tsx
+++ b/web/packages/accounts/pages/login.tsx
@@ -61,10 +61,10 @@ interface LoginProps {
 }
 
 function Login(props: LoginProps) {
-    const router = useRouter();
-
     const appNameOld = appNameToAppNameOld(props.appName);
 
+    const router = useRouter();
+
     const loginUser: SingleInputFormProps["callback"] = async (
         email,
         setFieldError,
diff --git a/web/packages/accounts/pages/recover.tsx b/web/packages/accounts/pages/recover.tsx
index d56d0c880..53596ef6c 100644
--- a/web/packages/accounts/pages/recover.tsx
+++ b/web/packages/accounts/pages/recover.tsx
@@ -30,15 +30,14 @@ const bip39 = require("bip39");
 bip39.setDefaultWordlist("english");
 
 const Page: React.FC<PageProps> = ({ appContext }) => {
+    const appNameOld = appNameToAppNameOld(appContext.appName);
+
     const [keyAttributes, setKeyAttributes] = useState<
         KeyAttributes | undefined
     >();
 
     const router = useRouter();
 
-    const appNameOld = appNameToAppNameOld(appContext.appName);
-
-
     useEffect(() => {
         const user: User = getData(LS_KEYS.USER);
         const keyAttributes: KeyAttributes = getData(LS_KEYS.KEY_ATTRIBUTES);
diff --git a/web/packages/accounts/pages/signup.tsx b/web/packages/accounts/pages/signup.tsx
index c99f6e3b0..02f810250 100644
--- a/web/packages/accounts/pages/signup.tsx
+++ b/web/packages/accounts/pages/signup.tsx
@@ -5,7 +5,7 @@ import { PAGES } from "@ente/accounts/constants/pages";
 import { isWeakPassword } from "@ente/accounts/utils";
 import { generateKeyAndSRPAttributes } from "@ente/accounts/utils/srp";
 import { LS_KEYS, getData } from "@ente/shared//storage/localStorage";
-import { APPS } from "@ente/shared/apps/constants";
+import { appNameToAppNameOld } from "@ente/shared/apps/constants";
 import type { PageProps } from "@ente/shared/apps/types";
 import { VerticallyCentered } from "@ente/shared/components/Container";
 import EnteSpinner from "@ente/shared/components/EnteSpinner";
@@ -42,11 +42,14 @@ import { Formik, type FormikHelpers } from "formik";
 import { t } from "i18next";
 import type { NextRouter } from "next/router";
 import { useRouter } from "next/router";
+import type { AppName } from "packages/next/types/app";
 import React, { useEffect, useState } from "react";
 import { Trans } from "react-i18next";
 import * as Yup from "yup";
 
-export default function SignUpPage({ appContext, appName }: PageProps) {
+const Page: React.FC<PageProps> = ({ appContext }) => {
+    const { appName } = appContext;
+
     const [loading, setLoading] = useState(true);
 
     const router = useRouter();
@@ -75,7 +78,9 @@ export default function SignUpPage({ appContext, appName }: PageProps) {
             )}
         </VerticallyCentered>
     );
-}
+};
+
+export default Page;
 
 interface FormValues {
     email: string;
@@ -87,10 +92,12 @@ interface FormValues {
 interface SignUpProps {
     router: NextRouter;
     login: () => void;
-    appName: APPS;
+    appName: AppName;
 }
 
 function SignUp({ router, appName, login }: SignUpProps) {
+    const appNameOld = appNameToAppNameOld(appName);
+
     const [acceptTerms, setAcceptTerms] = useState(false);
     const [loading, setLoading] = useState(false);
     const [showPassword, setShowPassword] = useState(false);
@@ -118,7 +125,7 @@ function SignUp({ router, appName, login }: SignUpProps) {
             try {
                 setData(LS_KEYS.USER, { email });
                 setLocalReferralSource(referral);
-                await sendOtt(appName, email);
+                await sendOtt(appNameOld, email);
             } catch (e) {
                 const message = e instanceof Error ? e.message : "";
                 setFieldError("confirm", `${t("UNKNOWN_ERROR")} ${message}`);