From 15706f23f73139edccfe27ff4e7aaec3950a993c Mon Sep 17 00:00:00 2001 From: Florian Duros Date: Thu, 12 Sep 2024 10:23:45 +0200 Subject: [PATCH] Add a no arrow option to release announcement --- ...Announcement-No-Arrow-1-chromium-linux.png | Bin 0 -> 17440 bytes .../ReleaseAnnouncement.stories.tsx | 5 +++ .../ReleaseAnnouncement.test.tsx | 8 ++++- .../ReleaseAnnouncement.tsx | 29 +++++++++------ .../ReleaseAnnouncement.test.tsx.snap | 34 ++++++++++++++++++ .../useReleaseAnnouncement.tsx | 14 ++++++-- 6 files changed, 76 insertions(+), 14 deletions(-) create mode 100644 playwright/visual.test.ts-snapshots/Release-Announcement-No-Arrow-1-chromium-linux.png diff --git a/playwright/visual.test.ts-snapshots/Release-Announcement-No-Arrow-1-chromium-linux.png b/playwright/visual.test.ts-snapshots/Release-Announcement-No-Arrow-1-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..1e49fa7e1e6c2ea5d401b94f590813addea0336d GIT binary patch literal 17440 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 NWqI}I#ZOH>{5LnN4>kY* literal 0 HcmV?d00001 diff --git a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.stories.tsx b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.stories.tsx index 7a531df5..d46caed1 100644 --- a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.stories.tsx +++ b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.stories.tsx @@ -60,3 +60,8 @@ export const BottomPlacement = Template.bind({}); BottomPlacement.args = { placement: "bottom", }; + +export const NoArrow = Template.bind({}); +NoArrow.args = { + displayArrow: false, +}; diff --git a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.test.tsx b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.test.tsx index 317eb866..e07e8f83 100644 --- a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.test.tsx +++ b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.test.tsx @@ -24,7 +24,8 @@ import React from "react"; import { ReleaseAnnouncement } from "./ReleaseAnnouncement"; import { Button } from "../Button"; -const { Default, MultiLinesContent, BottomPlacement } = composeStories(stories); +const { Default, MultiLinesContent, BottomPlacement, NoArrow } = + composeStories(stories); describe("ReleaseAnnouncement", () => { it("renders", async () => { @@ -56,4 +57,9 @@ describe("ReleaseAnnouncement", () => { ); expect(screen.queryByRole("dialog")).toBeNull(); }); + + it("renders without an arrow", async () => { + render(); + expect(await screen.findByRole("dialog")).toMatchSnapshot(); + }); }); diff --git a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.tsx b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.tsx index c09ee198..6fb0ae8e 100644 --- a/src/components/ReleaseAnnouncement/ReleaseAnnouncement.tsx +++ b/src/components/ReleaseAnnouncement/ReleaseAnnouncement.tsx @@ -40,12 +40,17 @@ import { useReleaseAnnouncement } from "./useReleaseAnnouncement"; type UseReleaseAnnouncementParam = Parameters[0]; interface ReleaseAnnouncementProps - extends Omit { + extends Omit { /** * The placement of the component * @default "right" */ placement?: Placement; + /** + * Whether to display an arrow. + * @default true + */ + displayArrow?: boolean; } /** @@ -60,9 +65,10 @@ export function ReleaseAnnouncement({ */ children, placement = "right", + displayArrow = true, ...props }: PropsWithChildren): JSX.Element { - const context = useReleaseAnnouncement({ placement, ...props }); + const context = useReleaseAnnouncement({ placement, displayArrow, ...props }); return ( @@ -121,6 +127,7 @@ function ReleaseAnnouncementContainer({ const { context: floatingContext, arrowRef, + displayArrow, ...rest } = useReleaseAnnouncementContext(); @@ -137,14 +144,16 @@ function ReleaseAnnouncementContainer({ {...rest.getFloatingProps()} className={styles.content} > - + {displayArrow && ( + + )} {children} diff --git a/src/components/ReleaseAnnouncement/__snapshots__/ReleaseAnnouncement.test.tsx.snap b/src/components/ReleaseAnnouncement/__snapshots__/ReleaseAnnouncement.test.tsx.snap index dea2cbb9..f35c7235 100644 --- a/src/components/ReleaseAnnouncement/__snapshots__/ReleaseAnnouncement.test.tsx.snap +++ b/src/components/ReleaseAnnouncement/__snapshots__/ReleaseAnnouncement.test.tsx.snap @@ -170,3 +170,37 @@ exports[`ReleaseAnnouncement > renders with a long label header and description `; + +exports[`ReleaseAnnouncement > renders without an arrow 1`] = ` + +`; diff --git a/src/components/ReleaseAnnouncement/useReleaseAnnouncement.tsx b/src/components/ReleaseAnnouncement/useReleaseAnnouncement.tsx index c036d5e0..e3d9a3f1 100644 --- a/src/components/ReleaseAnnouncement/useReleaseAnnouncement.tsx +++ b/src/components/ReleaseAnnouncement/useReleaseAnnouncement.tsx @@ -53,6 +53,10 @@ interface UseReleaseAnnouncementProps { * The event handler for the close button. */ onClick: MouseEventHandler; + /** + * Whether to display an arrow. + */ + displayArrow?: boolean; } /** @@ -65,6 +69,7 @@ export function useReleaseAnnouncement({ closeLabel, placement, onClick, + displayArrow, }: UseReleaseAnnouncementProps) { // Set on `aria-labelledby` attribute const labelId = useId(); @@ -81,9 +86,10 @@ export function useReleaseAnnouncement({ offset(16), shift({ limiter: limitShift({ offset: 50 }) }), // add the little arrow along with the floating content - arrow({ - element: arrowRef, - }), + displayArrow && + arrow({ + element: arrowRef, + }), ], }); @@ -103,6 +109,7 @@ export function useReleaseAnnouncement({ description, closeLabel, onClick, + displayArrow, arrowRef, }), [ @@ -116,6 +123,7 @@ export function useReleaseAnnouncement({ description, closeLabel, onClick, + displayArrow, arrowRef, ], );