From 6eed32f10a397e5853727b02f2204874d041e13a Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Thu, 5 Sep 2024 18:41:03 -0400 Subject: [PATCH 01/11] add the buttons to the drawer --- .../LearningResourceDrawer.tsx | 3 ++ .../LearningResourceExpanded/InfoSection.tsx | 43 +++++++++++++++++-- .../LearningResourceExpanded.tsx | 5 ++- 3 files changed, 47 insertions(+), 4 deletions(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx index 754b43957b..500b766cbb 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx @@ -10,6 +10,7 @@ import { useSearchParams, useLocation } from "react-router-dom" import { RESOURCE_DRAWER_QUERY_PARAM } from "@/common/urls" import { usePostHog } from "posthog-js/react" import MetaTags from "@/page-components/MetaTags/MetaTags" +import { useUserMe } from "api/hooks/user" const RESOURCE_DRAWER_PARAMS = [RESOURCE_DRAWER_QUERY_PARAM] as const @@ -56,6 +57,7 @@ const DrawerContent: React.FC<{ resourceId: number }> = ({ resourceId }) => { const resource = useLearningResourcesDetail(Number(resourceId)) + const { data: user } = useUserMe() useCapturePageView(Number(resourceId)) return ( @@ -70,6 +72,7 @@ const DrawerContent: React.FC<{ ) diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index 315f2a3e62..cdd6fe1a25 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -13,6 +13,8 @@ import { RiTranslate2, RiAwardLine, RiPresentationLine, + RiMenuAddLine, + RiBookmarkLine, } from "@remixicon/react" import { LearningResource, LearningResourceRun, ResourceTypeEnum } from "api" import { @@ -21,6 +23,8 @@ import { } from "ol-utilities" import { theme } from "../ThemeProvider/ThemeProvider" import Typography from "@mui/material/Typography" +import { User } from "api/hooks/user" +import { CardActionButton } from "ol-components" const InfoItems = styled.section` display: flex; @@ -28,6 +32,17 @@ const InfoItems = styled.section` gap: 16px; ` +const InfoHeader = styled.div` + display: flex; + justify-content: space-between; + align-items: center; +` + +const ListButtonContainer = styled.div` + display: flex; + gap: 8px; +` + const InfoItemContainer = styled.div` display: flex; align-items: flex-start; @@ -223,14 +238,19 @@ const InfoItem = ({ label, Icon, value }: InfoItemProps) => { const InfoSection = ({ resource, run, + user, }: { resource?: LearningResource run?: LearningResourceRun + user?: User }) => { if (!resource) { return null } + const inUserList = !!resource?.user_list_parents?.length + const inLearningPath = !!resource?.learning_path_parents?.length + const infoItems = INFO_ITEMS.map(({ label, Icon, selector }) => ({ label, Icon, @@ -243,9 +263,26 @@ const InfoSection = ({ return ( - - Info - + + + Info + + + {user?.is_authenticated && user?.is_learning_path_editor && ( + + + + )} + {user?.is_authenticated && ( + + + + )} + + {infoItems.map((props, index) => ( ))} diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx index a76f386725..f8ffc19125 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx @@ -20,6 +20,7 @@ import type { SimpleSelectProps } from "../SimpleSelect/SimpleSelect" import { EmbedlyCard } from "../EmbedlyCard/EmbedlyCard" import { PlatformLogo, PLATFORMS } from "../Logo/Logo" import InfoSection from "./InfoSection" +import { User } from "api/hooks/user" const Container = styled.div<{ padTop?: boolean }>` display: flex; @@ -138,6 +139,7 @@ const OnPlatform = styled.span` type LearningResourceExpandedProps = { resource?: LearningResource + user?: User imgConfig: EmbedlyConfig } @@ -314,6 +316,7 @@ const formatRunDate = ( const LearningResourceExpanded: React.FC = ({ resource, + user, imgConfig, }) => { const [selectedRun, setSelectedRun] = useState(resource?.runs?.[0]) @@ -411,7 +414,7 @@ const LearningResourceExpanded: React.FC = ({ - + ) } From 0ce756991101956818d21af0fac5ab4f09c7ed22 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 13:31:54 -0400 Subject: [PATCH 02/11] add click handlers --- .../LearningResourceDrawer.tsx | 36 +++++++++++++++++-- .../LearningResourceExpanded/InfoSection.tsx | 21 +++++++++-- .../LearningResourceExpanded.tsx | 13 ++++++- 3 files changed, 65 insertions(+), 5 deletions(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx index 500b766cbb..411370b724 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx @@ -1,16 +1,24 @@ -import React, { useEffect, useCallback } from "react" +import React, { useEffect, useCallback, useMemo } from "react" import { RoutedDrawer, LearningResourceExpanded, imgConfigs, } from "ol-components" -import type { RoutedDrawerProps } from "ol-components" +import type { + LearningResourceCardProps, + RoutedDrawerProps, +} from "ol-components" import { useLearningResourcesDetail } from "api/hooks/learningResources" import { useSearchParams, useLocation } from "react-router-dom" import { RESOURCE_DRAWER_QUERY_PARAM } from "@/common/urls" import { usePostHog } from "posthog-js/react" import MetaTags from "@/page-components/MetaTags/MetaTags" import { useUserMe } from "api/hooks/user" +import NiceModal from "@ebay/nice-modal-react" +import { + AddToLearningPathDialog, + AddToUserListDialog, +} from "../Dialogs/AddToListDialog" const RESOURCE_DRAWER_PARAMS = [RESOURCE_DRAWER_QUERY_PARAM] as const @@ -58,6 +66,28 @@ const DrawerContent: React.FC<{ }> = ({ resourceId }) => { const resource = useLearningResourcesDetail(Number(resourceId)) const { data: user } = useUserMe() + const handleAddToLearningPathClick: LearningResourceCardProps["onAddToLearningPathClick"] = + useMemo(() => { + if (user?.is_authenticated && user?.is_learning_path_editor) { + return (event, resourceId: number) => { + NiceModal.show(AddToLearningPathDialog, { resourceId }) + } + } + return null + }, [user]) + const handleAddToUserListClick: LearningResourceCardProps["onAddToUserListClick"] = + useMemo(() => { + if (!user) { + // user info is still loading + return null + } + if (user.is_authenticated) { + return (event, resourceId: number) => { + NiceModal.show(AddToUserListDialog, { resourceId }) + } + } + return null + }, [user]) useCapturePageView(Number(resourceId)) return ( @@ -73,6 +103,8 @@ const DrawerContent: React.FC<{ imgConfig={imgConfigs.large} resource={resource.data} user={user} + onAddToLearningPathClick={handleAddToLearningPathClick} + onAddToUserListClick={handleAddToUserListClick} /> ) diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index cdd6fe1a25..431859b500 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -24,7 +24,7 @@ import { import { theme } from "../ThemeProvider/ThemeProvider" import Typography from "@mui/material/Typography" import { User } from "api/hooks/user" -import { CardActionButton } from "ol-components" +import { CardActionButton, LearningResourceCardProps } from "ol-components" const InfoItems = styled.section` display: flex; @@ -239,10 +239,14 @@ const InfoSection = ({ resource, run, user, + onAddToLearningPathClick, + onAddToUserListClick, }: { resource?: LearningResource run?: LearningResourceRun user?: User + onAddToLearningPathClick: LearningResourceCardProps["onAddToLearningPathClick"] + onAddToUserListClick: LearningResourceCardProps["onAddToUserListClick"] }) => { if (!resource) { return null @@ -272,12 +276,25 @@ const InfoSection = ({ + onAddToLearningPathClick + ? onAddToLearningPathClick(event, resource.id) + : null + } > )} {user?.is_authenticated && ( - + + onAddToUserListClick + ? onAddToUserListClick(event, resource.id) + : null + } + > )} diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx index f8ffc19125..f2618e4096 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx @@ -21,6 +21,7 @@ import { EmbedlyCard } from "../EmbedlyCard/EmbedlyCard" import { PlatformLogo, PLATFORMS } from "../Logo/Logo" import InfoSection from "./InfoSection" import { User } from "api/hooks/user" +import { LearningResourceCardProps } from "ol-components" const Container = styled.div<{ padTop?: boolean }>` display: flex; @@ -141,6 +142,8 @@ type LearningResourceExpandedProps = { resource?: LearningResource user?: User imgConfig: EmbedlyConfig + onAddToLearningPathClick?: LearningResourceCardProps["onAddToLearningPathClick"] + onAddToUserListClick?: LearningResourceCardProps["onAddToUserListClick"] } const ImageSection: React.FC<{ @@ -318,6 +321,8 @@ const LearningResourceExpanded: React.FC = ({ resource, user, imgConfig, + onAddToLearningPathClick, + onAddToUserListClick, }) => { const [selectedRun, setSelectedRun] = useState(resource?.runs?.[0]) @@ -414,7 +419,13 @@ const LearningResourceExpanded: React.FC = ({ - + ) } From caf38a8811a436d68e9e9e66c3eac2a807cb35aa Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 14:17:14 -0400 Subject: [PATCH 03/11] fix imports --- .../src/components/LearningResourceExpanded/InfoSection.tsx | 3 ++- .../LearningResourceExpanded/LearningResourceExpanded.tsx | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index 431859b500..13cbc8b7b3 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -24,7 +24,8 @@ import { import { theme } from "../ThemeProvider/ThemeProvider" import Typography from "@mui/material/Typography" import { User } from "api/hooks/user" -import { CardActionButton, LearningResourceCardProps } from "ol-components" +import { CardActionButton } from "../LearningResourceCard/LearningResourceListCard" +import { LearningResourceCardProps } from "../LearningResourceCard/LearningResourceCard" const InfoItems = styled.section` display: flex; diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx index f2618e4096..f2b6ac3728 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx @@ -21,7 +21,7 @@ import { EmbedlyCard } from "../EmbedlyCard/EmbedlyCard" import { PlatformLogo, PLATFORMS } from "../Logo/Logo" import InfoSection from "./InfoSection" import { User } from "api/hooks/user" -import { LearningResourceCardProps } from "ol-components" +import { LearningResourceCardProps } from "../LearningResourceCard/LearningResourceCard" const Container = styled.div<{ padTop?: boolean }>` display: flex; From 529d29f9924cd8c330a6bbb0a7c3daaef8842318 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 14:33:49 -0400 Subject: [PATCH 04/11] fix existing tests --- .../LearningResourceDrawer/LearningResourceDrawer.test.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx index 87704724bd..c1eb786b30 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx @@ -40,6 +40,7 @@ describe("LearningResourceDrawer", () => { ])( "Renders drawer content when resource=id is in the URL and captures the view if PostHog $descriptor", async ({ enablePostHog }) => { + setMockResponse.get(urls.userMe.get(), {}) APP_SETTINGS.POSTHOG = { api_key: enablePostHog ? "test1234" : "", // pragma: allowlist secret } From 4e4cd84d8f3840fe82d800a3806d69a8ea189186 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 15:21:57 -0400 Subject: [PATCH 05/11] add a test that asserts the proper list buttons are shown in the resource drawer given a known authentication status --- .../LearningResourceDrawer.test.tsx | 89 +++++++++++++++++++ 1 file changed, 89 insertions(+) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx index c1eb786b30..77859266e9 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx @@ -5,6 +5,7 @@ import { renderWithProviders, screen, waitFor, + within, } from "@/test-utils" import LearningResourceDrawer, { useOpenLearningResourceDrawer, @@ -12,6 +13,7 @@ import LearningResourceDrawer, { import { urls, factories, setMockResponse } from "api/test-utils" import { LearningResourceExpanded } from "ol-components" import { RESOURCE_DRAWER_QUERY_PARAM } from "@/common/urls" +import { ResourceTypeEnum } from "api" jest.mock("ol-components", () => { const actual = jest.requireActual("ol-components") @@ -96,4 +98,91 @@ describe("LearningResourceDrawer", () => { dog: "woof", }) }) + + test.each([ + { + isLearningPathEditor: true, + isAuthenticated: true, + expectAddToLearningPathButton: true, + expectAddToUserListButton: true, + }, + { + isLearningPathEditor: false, + isAuthenticated: true, + expectAddToLearningPathButton: false, + expectAddToUserListButton: true, + }, + { + isLearningPathEditor: true, + isAuthenticated: false, + expectAddToLearningPathButton: false, + expectAddToUserListButton: false, + }, + { + isLearningPathEditor: false, + isAuthenticated: false, + expectAddToLearningPathButton: false, + expectAddToUserListButton: false, + }, + ])( + "Renders info section list buttons correctly", + async ({ + isLearningPathEditor, + isAuthenticated, + expectAddToLearningPathButton, + expectAddToUserListButton, + }) => { + const resource = factories.learningResources.resource({ + resource_type: ResourceTypeEnum.Course, + runs: [ + factories.learningResources.run({ + languages: ["en-us", "es-es", "fr-fr"], + }), + ], + }) + setMockResponse.get( + urls.learningResources.details({ id: resource.id }), + resource, + ) + + renderWithProviders(, { + url: `?resource=${resource.id}`, + user: { + is_learning_path_editor: isLearningPathEditor, + is_authenticated: isAuthenticated, + }, + }) + + expect(LearningResourceExpanded).toHaveBeenCalled() + + await waitFor(() => { + expectProps(LearningResourceExpanded, { resource }) + }) + + const section = screen + .getByRole("heading", { name: "Info" })! + .closest("section")! + + if (!isAuthenticated) { + const buttons = within(section).queryAllByRole("button") + expect(buttons).toHaveLength(0) + return + } else { + const buttons = within(section).getAllByRole("button") + const expectedButtons = + expectAddToLearningPathButton && expectAddToUserListButton ? 2 : 1 + expect(buttons).toHaveLength(expectedButtons) + if (expectAddToLearningPathButton) { + expect( + within(section).getByLabelText("Add to Learning Path"), + ).toBeInTheDocument() + } + if (expectAddToUserListButton) { + expect( + within(section).getByLabelText("Add to User List"), + ).toBeInTheDocument() + } + } + }, + ) }) From 241b62323e1d2c26e6f27baaa96d73219ea61b25 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 15:25:57 -0400 Subject: [PATCH 06/11] make click handlers optional --- .../src/components/LearningResourceExpanded/InfoSection.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index 13cbc8b7b3..68fca94768 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -246,8 +246,8 @@ const InfoSection = ({ resource?: LearningResource run?: LearningResourceRun user?: User - onAddToLearningPathClick: LearningResourceCardProps["onAddToLearningPathClick"] - onAddToUserListClick: LearningResourceCardProps["onAddToUserListClick"] + onAddToLearningPathClick?: LearningResourceCardProps["onAddToLearningPathClick"] + onAddToUserListClick?: LearningResourceCardProps["onAddToUserListClick"] }) => { if (!resource) { return null From bc372160edd57b29ce40951d1b85f78cb538994a Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Mon, 9 Sep 2024 16:10:48 -0400 Subject: [PATCH 07/11] fix typecheck issue and only import user type --- frontends/ol-ckeditor/src/types/settings.d.ts | 1 + .../src/components/LearningResourceExpanded/InfoSection.tsx | 2 +- .../LearningResourceExpanded/LearningResourceExpanded.tsx | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/frontends/ol-ckeditor/src/types/settings.d.ts b/frontends/ol-ckeditor/src/types/settings.d.ts index fbb37f3706..237e6ca039 100644 --- a/frontends/ol-ckeditor/src/types/settings.d.ts +++ b/frontends/ol-ckeditor/src/types/settings.d.ts @@ -8,5 +8,6 @@ export declare global { MITOL_API_BASE_URL: string PUBLIC_URL: string SITE_NAME: string + CSRF_COOKIE_NAME: string } } diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index 68fca94768..9a32bbab1a 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -23,7 +23,7 @@ import { } from "ol-utilities" import { theme } from "../ThemeProvider/ThemeProvider" import Typography from "@mui/material/Typography" -import { User } from "api/hooks/user" +import type { User } from "api/hooks/user" import { CardActionButton } from "../LearningResourceCard/LearningResourceListCard" import { LearningResourceCardProps } from "../LearningResourceCard/LearningResourceCard" diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx index f2b6ac3728..8949a85719 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/LearningResourceExpanded.tsx @@ -20,7 +20,7 @@ import type { SimpleSelectProps } from "../SimpleSelect/SimpleSelect" import { EmbedlyCard } from "../EmbedlyCard/EmbedlyCard" import { PlatformLogo, PLATFORMS } from "../Logo/Logo" import InfoSection from "./InfoSection" -import { User } from "api/hooks/user" +import type { User } from "api/hooks/user" import { LearningResourceCardProps } from "../LearningResourceCard/LearningResourceCard" const Container = styled.div<{ padTop?: boolean }>` From 483701ee4e7ce8e1a02bd470556b4d8811a1ea13 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Tue, 10 Sep 2024 11:29:33 -0400 Subject: [PATCH 08/11] test feedback --- .../LearningResourceDrawer.test.tsx | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx index 77859266e9..da5affdb13 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx @@ -14,6 +14,7 @@ import { urls, factories, setMockResponse } from "api/test-utils" import { LearningResourceExpanded } from "ol-components" import { RESOURCE_DRAWER_QUERY_PARAM } from "@/common/urls" import { ResourceTypeEnum } from "api" +import invariant from "tiny-invariant" jest.mock("ol-components", () => { const actual = jest.requireActual("ol-components") @@ -160,8 +161,9 @@ describe("LearningResourceDrawer", () => { }) const section = screen - .getByRole("heading", { name: "Info" })! - .closest("section")! + .getByRole("heading", { name: "Info" }) + .closest("section") + invariant(section) if (!isAuthenticated) { const buttons = within(section).queryAllByRole("button") @@ -172,16 +174,14 @@ describe("LearningResourceDrawer", () => { const expectedButtons = expectAddToLearningPathButton && expectAddToUserListButton ? 2 : 1 expect(buttons).toHaveLength(expectedButtons) - if (expectAddToLearningPathButton) { - expect( - within(section).getByLabelText("Add to Learning Path"), - ).toBeInTheDocument() - } - if (expectAddToUserListButton) { - expect( - within(section).getByLabelText("Add to User List"), - ).toBeInTheDocument() - } + expect( + !!within(section).queryByRole("button", { + name: "Add to Learning Path", + }), + ).toBe(expectAddToLearningPathButton) + expect( + !!within(section).queryByRole("button", { name: "Add to User List" }), + ).toBe(expectAddToUserListButton) } }, ) From 6baacf5559cf5bb108c402f0d48865227a2c3f41 Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Tue, 10 Sep 2024 11:54:50 -0400 Subject: [PATCH 09/11] only check is_learning_path_editor and remove unrealistic test case --- .../LearningResourceDrawer/LearningResourceDrawer.test.tsx | 6 ------ .../src/components/LearningResourceExpanded/InfoSection.tsx | 2 +- 2 files changed, 1 insertion(+), 7 deletions(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx index da5affdb13..bbfb594b2c 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.test.tsx @@ -113,12 +113,6 @@ describe("LearningResourceDrawer", () => { expectAddToLearningPathButton: false, expectAddToUserListButton: true, }, - { - isLearningPathEditor: true, - isAuthenticated: false, - expectAddToLearningPathButton: false, - expectAddToUserListButton: false, - }, { isLearningPathEditor: false, isAuthenticated: false, diff --git a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx index 9a32bbab1a..67c767fb42 100644 --- a/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx +++ b/frontends/ol-components/src/components/LearningResourceExpanded/InfoSection.tsx @@ -273,7 +273,7 @@ const InfoSection = ({ Info - {user?.is_authenticated && user?.is_learning_path_editor && ( + {user?.is_learning_path_editor && ( Date: Tue, 10 Sep 2024 11:55:58 -0400 Subject: [PATCH 10/11] better conditional --- .../LearningResourceDrawer/LearningResourceDrawer.tsx | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx index 411370b724..6be4b851c3 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx @@ -77,11 +77,7 @@ const DrawerContent: React.FC<{ }, [user]) const handleAddToUserListClick: LearningResourceCardProps["onAddToUserListClick"] = useMemo(() => { - if (!user) { - // user info is still loading - return null - } - if (user.is_authenticated) { + if (user?.is_authenticated) { return (event, resourceId: number) => { NiceModal.show(AddToUserListDialog, { resourceId }) } From fe6a745e3c5a7480e2f4cbd0cfb90c14e120d73c Mon Sep 17 00:00:00 2001 From: Carey Gumaer Date: Tue, 10 Sep 2024 11:56:21 -0400 Subject: [PATCH 11/11] again, no need to check authentication status here --- .../LearningResourceDrawer/LearningResourceDrawer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx index 6be4b851c3..cc762d7b83 100644 --- a/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx +++ b/frontends/mit-learn/src/page-components/LearningResourceDrawer/LearningResourceDrawer.tsx @@ -68,7 +68,7 @@ const DrawerContent: React.FC<{ const { data: user } = useUserMe() const handleAddToLearningPathClick: LearningResourceCardProps["onAddToLearningPathClick"] = useMemo(() => { - if (user?.is_authenticated && user?.is_learning_path_editor) { + if (user?.is_learning_path_editor) { return (event, resourceId: number) => { NiceModal.show(AddToLearningPathDialog, { resourceId }) }