From 7f56a03ccc34029d466e7432179d59d9346fcf6f Mon Sep 17 00:00:00 2001 From: Jon Kafton <939376+jonkafton@users.noreply.github.com> Date: Tue, 7 Jan 2025 21:34:22 +0100 Subject: [PATCH] Disable About page prefetching (#1938) * Disable about page prefetching * Scroll to top of page on navigate * Re-enable scroll to fragment * Update import rules for Next.js project structure --- frontends/.eslintrc.js | 8 ++++---- .../main/src/app-pages/AboutPage/AboutPage.tsx | 14 ++++---------- .../src/app-pages/DashboardPage/DashboardPage.tsx | 2 +- .../DashboardPage => common}/carousels.ts | 0 frontends/main/src/common/urls.ts | 1 + .../src/page-components/HeroSearch/HeroSearch.tsx | 5 +++-- .../LearningResourceDrawerV2.tsx | 2 +- .../ol-components/src/components/Link/Link.tsx | 1 + 8 files changed, 15 insertions(+), 18 deletions(-) rename frontends/main/src/{app-pages/DashboardPage => common}/carousels.ts (100%) diff --git a/frontends/.eslintrc.js b/frontends/.eslintrc.js index 545f0ca433..20ce1bb5d7 100644 --- a/frontends/.eslintrc.js +++ b/frontends/.eslintrc.js @@ -18,7 +18,7 @@ module.exports = { settings: { "import/resolver": { typescript: { - project: "*/tsconfig.json", + project: "**/tsconfig.json", }, }, "jsx-a11y": { @@ -99,14 +99,14 @@ module.exports = { { zones: [ { - target: "**/{components,utilities}/**", - from: "**/{pages,page-components,services}/**", + target: "**/components/**", + from: "**/{app,app-pages,page-components}/**", message: "Import breaks component hierarchy. See https://github.com/mitodl/mit-open/blob/main/docs/architecture/front-end-component-structure.md#module-boundary-and-importexport-rules", }, { target: "**/page-components/**", - from: "**/pages/**", + from: "**/{app,app-pages}/**", message: "Import breaks component hierarchy. See https://github.com/mitodl/mit-open/blob/main/docs/architecture/front-end-component-structure.md#module-boundary-and-importexport-rules", }, diff --git a/frontends/main/src/app-pages/AboutPage/AboutPage.tsx b/frontends/main/src/app-pages/AboutPage/AboutPage.tsx index 0b011cc018..292a146ebc 100644 --- a/frontends/main/src/app-pages/AboutPage/AboutPage.tsx +++ b/frontends/main/src/app-pages/AboutPage/AboutPage.tsx @@ -7,13 +7,12 @@ import { theme, styled, } from "ol-components" -import * as urls from "@/common/urls" +import { HOME, ABOUT_NON_DEGREE_LEARNING_FRAGMENT } from "@/common/urls" import React from "react" import domeImage from "@/public/mit-dome-2.jpg" import Image from "next/image" const WHAT_IS_MIT_OPEN_FRAGMENT_IDENTIFIER = "what-is-mit-learn" -const NON_DEGREE_LEARNING_FRAGMENT_IDENTIFIER = "non-degree-learning" const ACADEMIC_AND_PROFESSIONAL_CONTENT = "kinds-of-content" const SITE_NAME = process.env.NEXT_PUBLIC_SITE_NAME @@ -116,7 +115,7 @@ const AboutPage: React.FC = () => { @@ -206,7 +205,7 @@ const AboutPage: React.FC = () => { What is non-degree learning at MIT? @@ -257,9 +256,4 @@ const AboutPage: React.FC = () => { ) } -export { - AboutPage, - WHAT_IS_MIT_OPEN_FRAGMENT_IDENTIFIER, - NON_DEGREE_LEARNING_FRAGMENT_IDENTIFIER, - ACADEMIC_AND_PROFESSIONAL_CONTENT as WHAT_KINDS_OF_CONTENT_FRAGMENT_IDENTIFIER, -} +export { AboutPage } diff --git a/frontends/main/src/app-pages/DashboardPage/DashboardPage.tsx b/frontends/main/src/app-pages/DashboardPage/DashboardPage.tsx index 6caac0ce33..54cccbccae 100644 --- a/frontends/main/src/app-pages/DashboardPage/DashboardPage.tsx +++ b/frontends/main/src/app-pages/DashboardPage/DashboardPage.tsx @@ -37,7 +37,7 @@ import { POPULAR_LEARNING_RESOURCES_CAROUSEL, CERTIFICATE_COURSES_CAROUSEL, FREE_COURSES_CAROUSEL, -} from "./carousels" +} from "../../common/carousels" import ResourceCarousel from "@/page-components/ResourceCarousel/ResourceCarousel" import UserListDetailsTab from "./UserListDetailsTab" import { SettingsPage } from "./SettingsPage" diff --git a/frontends/main/src/app-pages/DashboardPage/carousels.ts b/frontends/main/src/common/carousels.ts similarity index 100% rename from frontends/main/src/app-pages/DashboardPage/carousels.ts rename to frontends/main/src/common/carousels.ts diff --git a/frontends/main/src/common/urls.ts b/frontends/main/src/common/urls.ts index 0493f9d4db..8f732c95a2 100644 --- a/frontends/main/src/common/urls.ts +++ b/frontends/main/src/common/urls.ts @@ -98,6 +98,7 @@ export const SETTINGS = "/dashboard/settings" export const SEARCH = "/search" export const ABOUT = "/about" +export const ABOUT_NON_DEGREE_LEARNING_FRAGMENT = "non-degree-learning" export const ACCESSIBILITY = "https://accessibility.mit.edu/" diff --git a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx index 39a5bd685b..f3c7fdd822 100644 --- a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx +++ b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx @@ -17,6 +17,7 @@ import { SEARCH_NEW, SEARCH_POPULAR, SEARCH_UPCOMING, + ABOUT_NON_DEGREE_LEARNING_FRAGMENT, } from "@/common/urls" import { RiAwardLine, @@ -26,7 +27,6 @@ import { RiTimeLine, RiVerifiedBadgeLine, } from "@remixicon/react" -import { NON_DEGREE_LEARNING_FRAGMENT_IDENTIFIER } from "@/app-pages/AboutPage/AboutPage" import Image from "next/image" import { SearchField } from "@/page-components/SearchField/SearchField" @@ -221,7 +221,8 @@ const HeroSearch: React.FC<{ imageIndex: number }> = ({ imageIndex }) => { Explore MIT's{" "} Non-Degree Learning diff --git a/frontends/main/src/page-components/LearningResourceDrawer/LearningResourceDrawerV2.tsx b/frontends/main/src/page-components/LearningResourceDrawer/LearningResourceDrawerV2.tsx index 055e2cf1c5..241f3f9f4f 100644 --- a/frontends/main/src/page-components/LearningResourceDrawer/LearningResourceDrawerV2.tsx +++ b/frontends/main/src/page-components/LearningResourceDrawer/LearningResourceDrawerV2.tsx @@ -22,7 +22,7 @@ import { usePostHog } from "posthog-js/react" import ResourceCarousel from "../ResourceCarousel/ResourceCarousel" import { useIsLearningPathMember } from "api/hooks/learningPaths" import { useIsUserListMember } from "api/hooks/userLists" -import { TopicCarouselConfig } from "@/app-pages/DashboardPage/carousels" +import { TopicCarouselConfig } from "@/common/carousels" const RESOURCE_DRAWER_PARAMS = [RESOURCE_DRAWER_QUERY_PARAM] as const diff --git a/frontends/ol-components/src/components/Link/Link.tsx b/frontends/ol-components/src/components/Link/Link.tsx index 6c317319dd..788a48684f 100644 --- a/frontends/ol-components/src/components/Link/Link.tsx +++ b/frontends/ol-components/src/components/Link/Link.tsx @@ -72,6 +72,7 @@ type LinkProps = LinkStyleProps & */ shallow?: boolean scroll?: boolean + prefetch?: boolean } const BaseLink = ({