From 6c9caa057682b1813bd639822a6f6d19f60d3852 Mon Sep 17 00:00:00 2001 From: Jon Kafton <939376+jonkafton@users.noreply.github.com> Date: Fri, 20 Dec 2024 18:55:21 +0100 Subject: [PATCH 1/4] Disable about page prefetching --- .../main/src/app-pages/AboutPage/AboutPage.tsx | 14 ++++---------- frontends/main/src/common/urls.ts | 1 + .../src/page-components/HeroSearch/HeroSearch.tsx | 5 +++-- .../ol-components/src/components/Link/Link.tsx | 1 + 4 files changed, 9 insertions(+), 12 deletions(-) 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/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/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 = ({ From fb910e7b80e3ba6563cbbbce8f1557b322de583c Mon Sep 17 00:00:00 2001 From: Jon Kafton <939376+jonkafton@users.noreply.github.com> Date: Fri, 3 Jan 2025 21:30:49 +0100 Subject: [PATCH 2/4] Scroll to top of page on navigate --- frontends/main/src/page-components/HeroSearch/HeroSearch.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx index f3c7fdd822..718a783b0a 100644 --- a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx +++ b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx @@ -223,6 +223,7 @@ const HeroSearch: React.FC<{ imageIndex: number }> = ({ imageIndex }) => { Non-Degree Learning From 325df02ccf516fc99bcf5bf998c1f0efa923f1db Mon Sep 17 00:00:00 2001 From: Jon Kafton <939376+jonkafton@users.noreply.github.com> Date: Tue, 7 Jan 2025 11:52:29 +0100 Subject: [PATCH 3/4] Re-enable scroll to fragment --- frontends/main/src/page-components/HeroSearch/HeroSearch.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx index 718a783b0a..f3c7fdd822 100644 --- a/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx +++ b/frontends/main/src/page-components/HeroSearch/HeroSearch.tsx @@ -223,7 +223,6 @@ const HeroSearch: React.FC<{ imageIndex: number }> = ({ imageIndex }) => { Non-Degree Learning From 69eda76bf9f0cea781d18b30b88ce62c611cfdfe Mon Sep 17 00:00:00 2001 From: Jon Kafton <939376+jonkafton@users.noreply.github.com> Date: Tue, 7 Jan 2025 12:23:11 +0100 Subject: [PATCH 4/4] Update import rules for Next.js project structure --- frontends/.eslintrc.js | 8 ++++---- .../main/src/app-pages/DashboardPage/DashboardPage.tsx | 2 +- .../src/{app-pages/DashboardPage => common}/carousels.ts | 0 .../LearningResourceDrawer/LearningResourceDrawerV2.tsx | 2 +- 4 files changed, 6 insertions(+), 6 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/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/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