diff --git a/web/apps/photos/src/pages/index.tsx b/web/apps/photos/src/pages/index.tsx index 18d45fcb82..6ec6fa2d8c 100644 --- a/web/apps/photos/src/pages/index.tsx +++ b/web/apps/photos/src/pages/index.tsx @@ -1,6 +1,6 @@ import { DevSettings } from "@/new/photos/components/DevSettings"; import log from "@/next/log"; -import { albumsAppOrigin } from "@/next/origins"; +import { albumsAppOrigin, customAPIHost } from "@/next/origins"; import { Login } from "@ente/accounts/components/Login"; import { SignUp } from "@ente/accounts/components/SignUp"; import { EnteLogo } from "@ente/shared/components/EnteLogo"; @@ -8,13 +8,14 @@ import EnteSpinner from "@ente/shared/components/EnteSpinner"; import { PHOTOS_PAGES as PAGES } from "@ente/shared/constants/pages"; import { saveKeyInSessionStore } from "@ente/shared/crypto/helpers"; import localForage from "@ente/shared/storage/localForage"; -import { getData, LS_KEYS } from "@ente/shared/storage/localStorage"; +import { LS_KEYS, getData } from "@ente/shared/storage/localStorage"; import { getToken } from "@ente/shared/storage/localStorage/helpers"; -import { getKey, SESSION_KEYS } from "@ente/shared/storage/sessionStorage"; +import { SESSION_KEYS, getKey } from "@ente/shared/storage/sessionStorage"; import { Button, - styled, + Box, Typography, + styled, type TypographyProps, } from "@mui/material"; import { t } from "i18next"; @@ -132,6 +133,7 @@ export default function LandingPage() { + @@ -229,6 +231,33 @@ const Logo_ = styled("div")` margin-block-end: 64px; `; +const MobileBox = styled("div")` + display: none; + + @media (max-width: 1024px) { + max-width: 375px; + width: 100%; + padding: 12px; + display: flex; + flex-direction: column; + gap: 8px; + } +`; + +const MobileBoxFooter: React.FC = () => { + const host = customAPIHost(); + + return ( + + {host && ( + + {host} + + )} + + ); +}; + const DesktopBox = styled("div")` flex: 1; height: 100%; @@ -243,19 +272,6 @@ const DesktopBox = styled("div")` } `; -const MobileBox = styled("div")` - display: none; - - @media (max-width: 1024px) { - max-width: 375px; - width: 100%; - padding: 12px; - display: flex; - flex-direction: column; - gap: 8px; - } -`; - const SideBox = styled("div")` display: flex; flex-direction: column;