diff --git a/src/App.tsx b/src/App.tsx index 663d10109..e1ce06df5 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,10 +1,10 @@ -import { useState } from "react"; +import { useState, lazy, Suspense } from "react"; import { Redirect, Route, Switch } from "react-router-dom"; import { DraftContext, getAllDrafts } from "@/state/context"; -import { User } from "@/user/User"; import { + CircularProgress, CssBaseline, StyledEngineProvider, ThemeProvider, @@ -12,15 +12,17 @@ import { import { theme } from "./theme"; import { CampaignForm } from "@/user/views/adsManager/types"; import { AuthVerify } from "@/auth/views/AuthVerify"; -import { Login } from "@/auth/views/Login"; -import { MagicLink } from "@/auth/views/MagicLink"; -import { Register } from "@/auth/registration/Register"; import { LandingPage } from "@/auth/views/LandingPage"; import { BraveAdsContactFrame } from "@/auth/registration/BraveAdsContactFrame"; import { useMatomo } from "@jonkoops/matomo-tracker-react"; -import { SearchLandingPage } from "@/search/SearchLandingPage"; import { BasicAttentionTokenLandingPage } from "@/basic-attention-token/BasicAttentionTokenLandingPage"; -import { SearchPreviewPage } from "./search/preview/SearchPreviewPage"; + +const UserView = lazy(() => import("@/user/User")); +const SearchPreview = lazy(() => import("@/search/preview/SearchPreviewPage")); +const SignIn = lazy(() => import("@/auth/views/Login")); +const Register = lazy(() => import("@/auth/registration/Register")); +const AuthLink = lazy(() => import("@/auth/views/MagicLink")); +const SearchLandingPage = lazy(() => import("@/search/SearchLandingPage")); export function App() { const { enableLinkTracking } = useMatomo(); @@ -40,19 +42,26 @@ export function App() { }, }} > - - - - - - - - - - - - - + }> + + + + + + + ( + + )} + /> + + + + + + + diff --git a/src/auth/registration/Register.tsx b/src/auth/registration/Register.tsx index 75ade04e4..e517792cb 100644 --- a/src/auth/registration/Register.tsx +++ b/src/auth/registration/Register.tsx @@ -2,7 +2,7 @@ import { AdvertiserRegistered } from "@/auth/registration/AdvertiserRegistered"; import { Redirect, Route, Switch } from "react-router-dom"; import { BrowserRegister } from "@/auth/registration/BrowserRegister"; -export function Register() { +export default function Register() { return ( diff --git a/src/auth/views/Login.tsx b/src/auth/views/Login.tsx index 79897a597..c866c2678 100644 --- a/src/auth/views/Login.tsx +++ b/src/auth/views/Login.tsx @@ -8,7 +8,7 @@ import { useTrackWithMatomo } from "@/hooks/useTrackWithMatomo"; import { Trans, msg } from "@lingui/macro"; import { useLingui } from "@lingui/react"; -export function Login() { +export default function Login() { const { trackMatomoEvent } = useTrackWithMatomo({ documentTitle: "Password Login", }); diff --git a/src/auth/views/MagicLink.tsx b/src/auth/views/MagicLink.tsx index 449e518b5..54af8da9e 100644 --- a/src/auth/views/MagicLink.tsx +++ b/src/auth/views/MagicLink.tsx @@ -9,7 +9,7 @@ import { useTrackWithMatomo } from "@/hooks/useTrackWithMatomo"; import { msg, Trans } from "@lingui/macro"; import { useLingui } from "@lingui/react"; -export function MagicLink() { +export default function MagicLink() { const { trackMatomoEvent } = useTrackWithMatomo({ documentTitle: "Magic Link Login", }); diff --git a/src/basic-attention-token/BasicAttentionTokenLandingPage.tsx b/src/basic-attention-token/BasicAttentionTokenLandingPage.tsx index a867854ec..05a4fb0bf 100644 --- a/src/basic-attention-token/BasicAttentionTokenLandingPage.tsx +++ b/src/basic-attention-token/BasicAttentionTokenLandingPage.tsx @@ -3,7 +3,7 @@ import { useTrackMatomoPageView, } from "@/hooks/useTrackWithMatomo"; import { Box, Button, Link, Stack, Typography } from "@mui/material"; -import { Link as RouterLink } from "react-router-dom"; +import { Link as RouterLink, Redirect } from "react-router-dom"; import { Trans } from "@lingui/macro"; import basicattentiontoken from "@/assets/images/basic-attention-token.svg"; import { LandingPageAppBar } from "@/components/AppBar/LandingPageAppBar"; @@ -11,10 +11,21 @@ import { Background } from "@/components/Background/Background"; import { BottomSwoop } from "@/components/Assets/BottomSwoop"; import { TopSwoop } from "@/components/Assets/TopSwoop"; -export function BasicAttentionTokenLandingPage() { +interface Props { + reroute: boolean; +} + +export function BasicAttentionTokenLandingPage({ reroute }: Props) { useTrackMatomoPageView({ documentTitle: "Basic Attention Token Landing Page", }); + + if (reroute) { + // Not fully removing page (2024-08-23), but discounts need further evaluation + window.open("https://basicattentiontoken.org/", "_blank", "noopener"); + return ; + } + return ( diff --git a/src/search/SearchLandingPage.tsx b/src/search/SearchLandingPage.tsx index 6b577740a..438003758 100644 --- a/src/search/SearchLandingPage.tsx +++ b/src/search/SearchLandingPage.tsx @@ -7,7 +7,7 @@ import { SearchRegister } from "@/auth/registration/SearchRegister"; import braveSearch from "@/assets/videos/setting_up_brave_search_ads.mp4"; import { SearchTalkingPoints } from "@/search/SearchTalkingPoints"; -export function SearchLandingPage() { +export default function SearchLandingPage() { useTrackMatomoPageView({ documentTitle: "Search Landing Page" }); return ( diff --git a/src/search/preview/SearchPreviewPage.tsx b/src/search/preview/SearchPreviewPage.tsx index d195f316e..54aabf465 100644 --- a/src/search/preview/SearchPreviewPage.tsx +++ b/src/search/preview/SearchPreviewPage.tsx @@ -9,7 +9,7 @@ import { NoPreviewAvailable } from "./NoPreviewAvailable"; /* eslint-disable lingui/no-unlocalized-strings */ -export function SearchPreviewPage() { +export default function SearchPreviewPage() { const { slug } = useParams<{ slug: string }>(); const { loading, data } = useLandingPageData(slug); return ( diff --git a/src/user/User.tsx b/src/user/User.tsx index 99981f352..664490170 100644 --- a/src/user/User.tsx +++ b/src/user/User.tsx @@ -65,7 +65,7 @@ const buildApolloClient = () => { }); }; -export function User() { +export default function User() { const client = useMemo(() => buildApolloClient(), []); const [fromDate, setFromDate] = useState( dayjs().subtract(6, "month").startOf("day").toDate(), diff --git a/vite.config.mts b/vite.config.mts index fd5e6451e..3b88231a5 100644 --- a/vite.config.mts +++ b/vite.config.mts @@ -55,6 +55,19 @@ export default defineConfig(({ mode }) => { sourcemap: true, // vite automagically decides whether to inline assets depending on their size. We are explicitly disabling this. assetsInlineLimit: 0, + rollupOptions: { + output: { + manualChunks: { + lodash: ["lodash"], + highcharts: ["highcharts"], + "highcharts-react-official": ["highcharts-react-official"], + "react-dom": ["react-dom"], + forms: ["yup", "formik", "bignumber.js"], + }, + minifyInternalExports: true, + assetFileNames: "static/[name].[hash][extname]", + }, + }, }, test: { // see https://vitest.dev/config/#globals