diff --git a/.changeset/metal-chicken-share.md b/.changeset/metal-chicken-share.md new file mode 100644 index 0000000000..4812678b13 --- /dev/null +++ b/.changeset/metal-chicken-share.md @@ -0,0 +1,5 @@ +--- +"@bigcommerce/catalyst-core": minor +--- + +Refactor the `ReviewForm` to accept `trigger` prop instead of `formButtonLabel` for flexible rendering. diff --git a/core/vibes/soul/sections/reviews/index.tsx b/core/vibes/soul/sections/reviews/index.tsx index 740b5a3d91..f8be6fa6e4 100644 --- a/core/vibes/soul/sections/reviews/index.tsx +++ b/core/vibes/soul/sections/reviews/index.tsx @@ -1,4 +1,5 @@ import { Stream, Streamable } from '@/vibes/soul/lib/streamable'; +import { Button } from '@/vibes/soul/primitives/button'; import { CursorPagination, CursorPaginationInfo } from '@/vibes/soul/primitives/cursor-pagination'; import { Rating } from '@/vibes/soul/primitives/rating'; import { StickySidebarLayout } from '@/vibes/soul/sections/sticky-sidebar-layout'; @@ -67,7 +68,6 @@ export function Reviews({ return ( + {formButtonLabel} + + } /> } @@ -225,7 +229,6 @@ export function ReviewsEmptyState({

{message}

+ {formButtonLabel} + + } /> diff --git a/core/vibes/soul/sections/reviews/review-form.tsx b/core/vibes/soul/sections/reviews/review-form.tsx index 16e5e2720c..894725e505 100644 --- a/core/vibes/soul/sections/reviews/review-form.tsx +++ b/core/vibes/soul/sections/reviews/review-form.tsx @@ -27,7 +27,7 @@ export type SubmitReviewAction = Action< interface Props { productId: number; action: SubmitReviewAction; - formButtonLabel?: string; + trigger: React.ReactNode; formModalTitle?: string; formSubmitLabel?: string; formRatingLabel?: string; @@ -43,7 +43,7 @@ interface Props { export const ReviewForm = ({ productId, action, - formButtonLabel = 'Write a review', + trigger, formModalTitle = 'Write a review', formSubmitLabel = 'Submit', formRatingLabel = 'Rating', @@ -107,11 +107,7 @@ export const ReviewForm = ({ isOpen={isOpen} setOpen={setIsOpen} title={formModalTitle} - trigger={ - - } + trigger={trigger} >