diff --git a/frontends/.eslintrc.js b/frontends/.eslintrc.js index a2843799ac..acf1615251 100644 --- a/frontends/.eslintrc.js +++ b/frontends/.eslintrc.js @@ -154,11 +154,6 @@ function restrictedImports({ paths = [], patterns = [] } = {}) { message: "Please use @faker-js/faker/locale/en instead.", allowTypeImports: true, }, - { - name: "@mui/icons-material", - message: "Please use @mui/icons-material/ instead.", - allowTypeImports: true, - }, { name: "@mui/material", message: "Please use @mui/material/ instead.", diff --git a/frontends/mit-open/package.json b/frontends/mit-open/package.json index 2d02b8b39e..470bd397a2 100644 --- a/frontends/mit-open/package.json +++ b/frontends/mit-open/package.json @@ -60,7 +60,6 @@ "dependencies": { "@ebay/nice-modal-react": "^1.2.13", "@mitodl/course-search-utils": "^3.1.4", - "@mui/icons-material": "^5.15.15", "@remixicon/react": "^4.2.0", "@sentry/react": "^7.57.0", "@tanstack/react-query": "^4.36.1", diff --git a/frontends/mit-open/public/images/navdrawer/certificate.svg b/frontends/mit-open/public/images/navdrawer/certificate.svg deleted file mode 100644 index 37410ceb24..0000000000 --- a/frontends/mit-open/public/images/navdrawer/certificate.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/courses.svg b/frontends/mit-open/public/images/navdrawer/courses.svg deleted file mode 100644 index 7017824928..0000000000 --- a/frontends/mit-open/public/images/navdrawer/courses.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/departments.svg b/frontends/mit-open/public/images/navdrawer/departments.svg deleted file mode 100644 index cd266fe5a5..0000000000 --- a/frontends/mit-open/public/images/navdrawer/departments.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/free.svg b/frontends/mit-open/public/images/navdrawer/free.svg deleted file mode 100644 index 5c77692f56..0000000000 --- a/frontends/mit-open/public/images/navdrawer/free.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/learning_materials.svg b/frontends/mit-open/public/images/navdrawer/learning_materials.svg deleted file mode 100644 index 061cc55e0f..0000000000 --- a/frontends/mit-open/public/images/navdrawer/learning_materials.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/new.svg b/frontends/mit-open/public/images/navdrawer/new.svg deleted file mode 100644 index b338bb99da..0000000000 --- a/frontends/mit-open/public/images/navdrawer/new.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/pathways.svg b/frontends/mit-open/public/images/navdrawer/pathways.svg deleted file mode 100644 index efe88552f3..0000000000 --- a/frontends/mit-open/public/images/navdrawer/pathways.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/popular.svg b/frontends/mit-open/public/images/navdrawer/popular.svg deleted file mode 100644 index 8988481082..0000000000 --- a/frontends/mit-open/public/images/navdrawer/popular.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/programs.svg b/frontends/mit-open/public/images/navdrawer/programs.svg deleted file mode 100644 index 6fb3c243d2..0000000000 --- a/frontends/mit-open/public/images/navdrawer/programs.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/provider.svg b/frontends/mit-open/public/images/navdrawer/provider.svg deleted file mode 100644 index 1f5f1db289..0000000000 --- a/frontends/mit-open/public/images/navdrawer/provider.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/frontends/mit-open/public/images/navdrawer/topics.svg b/frontends/mit-open/public/images/navdrawer/topics.svg deleted file mode 100644 index 266ce1b713..0000000000 --- a/frontends/mit-open/public/images/navdrawer/topics.svg +++ /dev/null @@ -1,17 +0,0 @@ - - - - - - - - - - - - - - - - - diff --git a/frontends/mit-open/src/components/ChannelMenu/ChannelMenu.tsx b/frontends/mit-open/src/components/ChannelMenu/ChannelMenu.tsx index ba08fb2b58..cd4cafac90 100644 --- a/frontends/mit-open/src/components/ChannelMenu/ChannelMenu.tsx +++ b/frontends/mit-open/src/components/ChannelMenu/ChannelMenu.tsx @@ -2,7 +2,7 @@ import React, { useMemo } from "react" import * as routes from "../../common/urls" import { SimpleMenu, ActionButton, styled } from "ol-components" import type { SimpleMenuItem } from "ol-components" -import SettingsIcon from "@mui/icons-material/Settings" +import { RiSettings4Fill } from "@remixicon/react" const InvertedButton = styled(ActionButton)({ color: "white" }) @@ -29,7 +29,7 @@ const ChannelMenu: React.FC<{ channelType: string; name: string }> = ({ items={items} trigger={ - + } /> diff --git a/frontends/mit-open/src/components/RootTopicIcon/RootTopicIcon.tsx b/frontends/mit-open/src/components/RootTopicIcon/RootTopicIcon.tsx index 2b0c298b48..6cf4f4a06e 100644 --- a/frontends/mit-open/src/components/RootTopicIcon/RootTopicIcon.tsx +++ b/frontends/mit-open/src/components/RootTopicIcon/RootTopicIcon.tsx @@ -1,31 +1,31 @@ import { RiPaletteLine, - RiSeedlingLine, - RiBriefcaseLine, - RiMacbookLine, - RiBarChartBoxLine, + RiShakeHandsLine, RiEarthLine, - RiLightbulbLine, - RiBuildingLine, - RiServiceLine, RiQuillPenLine, - RiMicroscopeLine, + RiBriefcase3Line, + RiLightbulbFlashLine, + RiRobot2Line, + RiStethoscopeLine, + RiInfinityLine, + RiTestTubeLine, + RiUserSearchLine, } from "@remixicon/react" import React from "react" /* TODO Using any icons until we have a solution for specifying them */ const ICON_MAP = { - Business: RiBriefcaseLine, - Energy: RiLightbulbLine, - Engineering: RiBuildingLine, + Business: RiBriefcase3Line, + Energy: RiLightbulbFlashLine, + Engineering: RiRobot2Line, "Fine Arts": RiPaletteLine, - "Health and Medicine": RiServiceLine, + "Health and Medicine": RiStethoscopeLine, Humanities: RiQuillPenLine, - Mathematics: RiBarChartBoxLine, - Science: RiMicroscopeLine, - "Social Science": RiSeedlingLine, + Mathematics: RiInfinityLine, + Science: RiTestTubeLine, + "Social Science": RiUserSearchLine, Society: RiEarthLine, - "Teaching and Education": RiMacbookLine, + "Teaching and Education": RiShakeHandsLine, } type RootTopicIconProps = { name: string } diff --git a/frontends/mit-open/src/page-components/CardTemplate/CardTemplate.tsx b/frontends/mit-open/src/page-components/CardTemplate/CardTemplate.tsx index 77aa74385a..d88b45050c 100644 --- a/frontends/mit-open/src/page-components/CardTemplate/CardTemplate.tsx +++ b/frontends/mit-open/src/page-components/CardTemplate/CardTemplate.tsx @@ -7,7 +7,7 @@ import { styled, TruncateText, } from "ol-components" -import DragIndicatorIcon from "@mui/icons-material/DragIndicator" +import { RiDraggable } from "@remixicon/react" import { DEFAULT_RESOURCE_IMG, EmbedlyConfig, @@ -238,7 +238,7 @@ const CardTemplate = ({ {sortable ? ( - + ) : null} diff --git a/frontends/mit-open/src/page-components/ChannelDetails/ChannelDetails.tsx b/frontends/mit-open/src/page-components/ChannelDetails/ChannelDetails.tsx index 61337d8c2e..9cbab94378 100644 --- a/frontends/mit-open/src/page-components/ChannelDetails/ChannelDetails.tsx +++ b/frontends/mit-open/src/page-components/ChannelDetails/ChannelDetails.tsx @@ -2,7 +2,7 @@ import React, { useMemo } from "react" import { styled, Typography, Box } from "ol-components" import { capitalize } from "ol-utilities" import { ChannelTypeEnum, Channel } from "api/v0" -import OpenInNewIcon from "@mui/icons-material/OpenInNew" +import { RiExternalLinkLine } from "@remixicon/react" type ChannelDetailsProps = { channel: Channel @@ -90,7 +90,7 @@ const getFacetManifest = (channelType: ChannelTypeEnum) => { title: "More Information", labelFunction: (key: string, channelTitle: string) => ( - {channelTitle} website + {channelTitle} website ), order: 1, diff --git a/frontends/mit-open/src/page-components/Dialogs/AddToListDialog.tsx b/frontends/mit-open/src/page-components/Dialogs/AddToListDialog.tsx index 5e9dcb9371..b087365b2f 100644 --- a/frontends/mit-open/src/page-components/Dialogs/AddToListDialog.tsx +++ b/frontends/mit-open/src/page-components/Dialogs/AddToListDialog.tsx @@ -11,10 +11,8 @@ import { styled, } from "ol-components" -import LockOpenIcon from "@mui/icons-material/LockOpen" -import LockIcon from "@mui/icons-material/Lock" +import { RiLockLine, RiLockUnlockLine, RiAddLine } from "@remixicon/react" -import AddIcon from "@mui/icons-material/Add" import * as NiceModal from "@ebay/nice-modal-react" import { @@ -209,7 +207,7 @@ const PrivacyChip: React.FC = ({ selectedOption, }) => { const isPublic = selectedOption === publicOption - const icon = isPublic ? : + const icon = isPublic ? : return } @@ -253,7 +251,7 @@ const AddToListDialogInner: React.FC = ({ manageListDialogs.upsertLearningPath()} > - + @@ -269,7 +267,7 @@ const AddToListDialogInner: React.FC = ({ manageListDialogs.upsertUserList()} > - + diff --git a/frontends/mit-open/src/page-components/Header/Header.tsx b/frontends/mit-open/src/page-components/Header/Header.tsx index 925731db37..c8a4e74906 100644 --- a/frontends/mit-open/src/page-components/Header/Header.tsx +++ b/frontends/mit-open/src/page-components/Header/Header.tsx @@ -9,7 +9,21 @@ import { ClickAwayListener, ActionButtonLink, } from "ol-components" -import { RiSearch2Line } from "@remixicon/react" +import { + RiSearch2Line, + RiPencilRulerLine, + RiStackLine, + RiSignpostLine, + RiBookMarkedLine, + RiPresentationLine, + RiNodeTree, + RiVerifiedBadgeLine, + RiFileAddLine, + RiTimeLine, + RiHeartLine, + RiPriceTag3Line, + RiAwardLine, +} from "@remixicon/react" import { MITLogoLink, useToggle } from "ol-utilities" import UserMenu from "./UserMenu" import { MenuButton } from "./MenuButton" @@ -151,26 +165,26 @@ const navData: NavData = { items: [ { title: "Courses", - icon: "/static/images/navdrawer/courses.svg", + icon: , description: "Learn with MIT instructors", href: querifiedSearchUrl({ resource_category: "course" }), }, { title: "Programs", - icon: "/static/images/navdrawer/programs.svg", + icon: , description: "Learn in-depth from a series of courses and earn a certificate", href: querifiedSearchUrl({ resource_category: "program" }), }, { title: "Pathways", - icon: "/static/images/navdrawer/pathways.svg", + icon: , description: "Achieve your learning goals with a curated collection of courses", }, { title: "Learning Materials", - icon: "/static/images/navdrawer/learning_materials.svg", + icon: , description: "Free teaching and learning materials including videos, podcasts, lecture notes, etc.", href: querifiedSearchUrl({ resource_category: "learning_material" }), @@ -182,17 +196,17 @@ const navData: NavData = { items: [ { title: "By Topic", - icon: "/static/images/navdrawer/topics.svg", + icon: , href: TOPICS, }, { title: "By Departments", - icon: "/static/images/navdrawer/departments.svg", + icon: , href: DEPARTMENTS, }, { title: "By Provider", - icon: "/static/images/navdrawer/provider.svg", + icon: , href: UNITS, }, ], @@ -202,27 +216,27 @@ const navData: NavData = { items: [ { title: "New", - icon: "/static/images/navdrawer/new.svg", + icon: , href: querifiedSearchUrl({ sortby: "new" }), }, { title: "Upcoming", - icon: "/static/images/navdrawer/free.svg", + icon: , href: querifiedSearchUrl({ sortby: "upcoming" }), }, { title: "Popular", - icon: "/static/images/navdrawer/popular.svg", href: querifiedSearchUrl({ sortby: "-views" }), + icon: , }, { title: "Free", - icon: "/static/images/navdrawer/free.svg", + icon: , href: querifiedSearchUrl({ free: "true" }), }, { title: "With Certificate", - icon: "/static/images/navdrawer/certificate.svg", + icon: , href: querifiedSearchUrl({ certification: "true" }), }, ], diff --git a/frontends/mit-open/src/page-components/LearningResourceCard/LearningResourceCard.tsx b/frontends/mit-open/src/page-components/LearningResourceCard/LearningResourceCard.tsx index 52689ea190..11b26ae985 100644 --- a/frontends/mit-open/src/page-components/LearningResourceCard/LearningResourceCard.tsx +++ b/frontends/mit-open/src/page-components/LearningResourceCard/LearningResourceCard.tsx @@ -10,8 +10,6 @@ import * as NiceModal from "@ebay/nice-modal-react" import LearningResourceCardTemplate from "@/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate" import type { LearningResourceCardTemplateProps } from "@/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate" import { ActionButton, imgConfigs } from "ol-components" -import PlaylistAddIcon from "@mui/icons-material/PlaylistAdd" -import BookmarkBorderIcon from "@mui/icons-material/BookmarkBorder" import { AddToLearningPathDialog, AddToUserListDialog, @@ -20,6 +18,8 @@ import { LearningResource } from "api" import { useUserMe } from "api/hooks/user" import { useOpenLearningResourceDrawer } from "../LearningResourceDrawer/LearningResourceDrawer" +import { RiMenuAddLine, RiBookmarkLine } from "@remixicon/react" + type LearningResourceCardProps = Pick< LearningResourceCardTemplateProps, "variant" | "resource" | "className" | "sortable" | "suppressImage" @@ -77,7 +77,7 @@ const LearningResourceCard: React.FC = ({ aria-label="Add to Learning Path" onClick={showAddToLearningPathDialog} > - + )} {user?.is_authenticated && ( @@ -88,7 +88,7 @@ const LearningResourceCard: React.FC = ({ aria-label="Add to User List" onClick={showAddToUserListDialog} > - + )} diff --git a/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.test.tsx b/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.test.tsx index 948901a64b..fc121f569d 100644 --- a/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.test.tsx +++ b/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.test.tsx @@ -142,7 +142,7 @@ describe("LearningResourceCard", () => { />, ) - expect(!!screen.queryByTestId("DragIndicatorIcon")).toBe(sortable) + expect(!!screen.queryByTestId("CardDraggable")).toBe(sortable) }) it.each([{ variant: "row" }, { variant: "column" }] as const)( diff --git a/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.tsx b/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.tsx index 1909c8dd66..7fda5f83e6 100644 --- a/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.tsx +++ b/frontends/mit-open/src/page-components/LearningResourceCardTemplate/LearningResourceCardTemplate.tsx @@ -2,7 +2,7 @@ import React, { useCallback } from "react" import { ResourceTypeEnum } from "api" import type { LearningResource } from "api" import { Chip, styled } from "ol-components" -import CalendarTodayIcon from "@mui/icons-material/CalendarToday" +import { RiCalendarLine } from "@remixicon/react" import { formatDate, pluralize, @@ -72,7 +72,7 @@ const ResourceFooterDetails: React.FC< return ( } + icon={} label={formattedDate} /> ) diff --git a/frontends/mit-open/src/page-components/SearchDisplay/SearchInput.tsx b/frontends/mit-open/src/page-components/SearchDisplay/SearchInput.tsx index 33b91b0617..31992e8683 100644 --- a/frontends/mit-open/src/page-components/SearchDisplay/SearchInput.tsx +++ b/frontends/mit-open/src/page-components/SearchDisplay/SearchInput.tsx @@ -1,6 +1,5 @@ import React, { useCallback } from "react" -import ClearIcon from "@mui/icons-material/Clear" import { Input, AdornmentButton, @@ -10,7 +9,7 @@ import { css, } from "ol-components" import type { InputProps } from "ol-components" -import { RiSearch2Line } from "@remixicon/react" +import { RiSearch2Line, RiCloseLine } from "@remixicon/react" export interface SearchSubmissionEvent { target: { @@ -139,7 +138,7 @@ const SearchInput: React.FC = (props) => { aria-label="Clear search text" onClick={props.onClear} > - + ) } diff --git a/frontends/mit-open/src/page-components/SearchSubscriptionToggle/SearchSubscriptionToggle.tsx b/frontends/mit-open/src/page-components/SearchSubscriptionToggle/SearchSubscriptionToggle.tsx index 4b49f5fca8..1415155a97 100644 --- a/frontends/mit-open/src/page-components/SearchSubscriptionToggle/SearchSubscriptionToggle.tsx +++ b/frontends/mit-open/src/page-components/SearchSubscriptionToggle/SearchSubscriptionToggle.tsx @@ -7,10 +7,10 @@ import { } from "api/hooks/searchSubscription" import { Button, SimpleMenu } from "ol-components" import type { SimpleMenuItem } from "ol-components" -import ExpandMoreSharpIcon from "@mui/icons-material/ExpandMoreSharp" +import { RiArrowDownSLine, RiMailLine } from "@remixicon/react" import { useUserMe } from "api/hooks/user" import { SourceTypeEnum } from "api" -import MailOutlineIcon from "@mui/icons-material/MailOutline" + import { SignupPopover } from "../SignupPopover/SignupPopover" type SearchSubscriptionToggleProps = { @@ -54,7 +54,7 @@ const SearchSubscriptionToggle: React.FC = ({ return ( }> + } @@ -67,7 +67,7 @@ const SearchSubscriptionToggle: React.FC = ({ ) : ( ))} @@ -108,17 +110,17 @@ const WidgetTemplate: React.FC = ({ type="button" onClick={handleEdit} > - + diff --git a/frontends/ol-widgets/src/components/editing/WidgetsListEditable.tsx b/frontends/ol-widgets/src/components/editing/WidgetsListEditable.tsx index 8b393415c4..c914efff56 100644 --- a/frontends/ol-widgets/src/components/editing/WidgetsListEditable.tsx +++ b/frontends/ol-widgets/src/components/editing/WidgetsListEditable.tsx @@ -7,7 +7,7 @@ import { SortableList, SortEndEvent, } from "ol-components" -import AddIcon from "@mui/icons-material/Add" +import { RiAddLine } from "@remixicon/react" import { uniqueId, zip } from "lodash" import Widget from "../Widget" import type { WidgetListResponse, AnonymousWidget } from "../../interfaces" @@ -240,7 +240,7 @@ const WidgetsListEditable: React.FC = ({