From 2accd632acd713c4db3d318ff5199789879e6304 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Wed, 27 Mar 2024 20:32:01 +0530 Subject: [PATCH 1/5] prop to disable code snippet button --- .../src/components/CodeSnippet/CodeSnippet.spec.tsx | 8 +++++++- .../src/components/CodeSnippet/CodeSnippet.stories.tsx | 8 ++++++++ .../fuselage/src/components/CodeSnippet/CodeSnippet.tsx | 4 +++- 3 files changed, 18 insertions(+), 2 deletions(-) diff --git a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx index 536bd7aa05..83d43ed6dc 100644 --- a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx +++ b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx @@ -4,7 +4,7 @@ import React from 'react'; import * as stories from './CodeSnippet.stories'; -const { Default, CopyButton, CustomButtonName, LoadingCode } = +const { Default, CopyButton, CustomButtonName, LoadingCode, DisabledButton } = composeStories(stories); describe('[CodeSnippet Component]', () => { @@ -44,4 +44,10 @@ describe('[CodeSnippet Component]', () => { const { container } = render(); expect(container.querySelector('.rcx-skeleton')).toBeInTheDocument(); }); + + it('should should render a disabled button, when buttonDisabled prop is passed', () => { + const { container } = render(); + + expect(container.closest('button')).toBeDisabled; + }); }); diff --git a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.stories.tsx b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.stories.tsx index 325b0bf0ea..5aa43315a7 100644 --- a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.stories.tsx +++ b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.stories.tsx @@ -60,3 +60,11 @@ LoadingCode.args = { children: '', onClick: action('click'), }; + +export const DisabledButton = Template.bind({}); +DisabledButton.args = { + children: 'curl -L https://go.rocket.chat/i/docker-compose.yml -O', + onClick: action('click'), + buttonText: 'Disabled Button', + buttonDisabled: true, +}; diff --git a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.tsx b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.tsx index 8b6d077b22..69582e5c9b 100644 --- a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.tsx +++ b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.tsx @@ -8,6 +8,7 @@ import { Skeleton } from '../Skeleton'; type CodeSnippetProps = ComponentProps & { children: string; buttonText?: string; + buttonDisabled?: boolean; onClick?: () => void; }; @@ -15,6 +16,7 @@ const CodeSnippet = ({ children, onClick, buttonText = 'Copy', + buttonDisabled = false, ...props }: CodeSnippetProps): ReactElement => { if (!children) { @@ -32,7 +34,7 @@ const CodeSnippet = ({ {onClick && children && ( - From bd6d71df2d713ff885726e8ef7b07398df0e1f89 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Wed, 27 Mar 2024 20:35:10 +0530 Subject: [PATCH 2/5] add cs --- .changeset/big-rockets-approve.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/big-rockets-approve.md diff --git a/.changeset/big-rockets-approve.md b/.changeset/big-rockets-approve.md new file mode 100644 index 0000000000..54794539d6 --- /dev/null +++ b/.changeset/big-rockets-approve.md @@ -0,0 +1,5 @@ +--- +"@rocket.chat/fuselage": patch +--- + +Accept disable button prop on CodeSnippet component From 8795987193434d898299bb6af5c3e849c20e706c Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Wed, 27 Mar 2024 20:38:21 +0530 Subject: [PATCH 3/5] oops --- .../fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx index 83d43ed6dc..fec7ff136c 100644 --- a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx +++ b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx @@ -48,6 +48,6 @@ describe('[CodeSnippet Component]', () => { it('should should render a disabled button, when buttonDisabled prop is passed', () => { const { container } = render(); - expect(container.closest('button')).toBeDisabled; + expect(container.closest('button')).toBeDisabled(); }); }); From d19ea1f6e233b239fbc662c279a3de1f126eae8d Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Wed, 27 Mar 2024 20:51:24 +0530 Subject: [PATCH 4/5] fix test --- .../src/components/CodeSnippet/CodeSnippet.spec.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx index fec7ff136c..a7326793fb 100644 --- a/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx +++ b/packages/fuselage/src/components/CodeSnippet/CodeSnippet.spec.tsx @@ -46,8 +46,8 @@ describe('[CodeSnippet Component]', () => { }); it('should should render a disabled button, when buttonDisabled prop is passed', () => { - const { container } = render(); - - expect(container.closest('button')).toBeDisabled(); + render(); + const button = screen.getByRole('button'); + expect(button).toBeDisabled(); }); }); From 12d20c7935ef9e826470899ae352fc776269c980 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Wed, 27 Mar 2024 22:12:47 +0530 Subject: [PATCH 5/5] change cs to minor --- .changeset/big-rockets-approve.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/big-rockets-approve.md b/.changeset/big-rockets-approve.md index 54794539d6..e5214604be 100644 --- a/.changeset/big-rockets-approve.md +++ b/.changeset/big-rockets-approve.md @@ -1,5 +1,5 @@ --- -"@rocket.chat/fuselage": patch +"@rocket.chat/fuselage": minor --- Accept disable button prop on CodeSnippet component