copy code button added in Ballerina Action sample

[s-vamshi]

Fixes #8001

This is how it looks

Checklist

• Page addition

  • Add permalink to pages.

• Page removal

  • Remove entry from corresponding left nav YAML file.
  • Add redirect_from on the alternative page.
  • If no alternative page, add redirection on the redirections.js file.

• Page rename

  • Add front-matter redirect_from.
  • Add front-matter redirect_to: (if applicable).

• Page restrcuture

  • Add permalink to pages.
  • Add front-matter redirect_from.
  • Add front-matter redirect_to: (if applicable).

[s-vamshi]

@sm1990 can you please review pr?

[sm1990]

@s-vamshi please add a copy button to the proto file in the grpc sample.

[s-vamshi]

@sm1990 can you please review now?

[sm1990]

@s-vamshi when copying the grpc sample, the both the Ballerina code and the proto code is shown as copied eventhough only one gets copied.

Also, in the copied text double quotes (") are shown as &quote;

Try sending the raw code as a prop to BalAction component. That way you can get rid of the htmlToCode funtion as well.
Let me know if it works.

[s-vamshi]

@s-vamshi when copying the grpc sample, the both the Ballerina code and the proto code is shown as copied eventhough only one gets copied.

Ya, It is because I am using same setCopied state for both code block.
Can I create a new state for proto code?

[s-vamshi]

@sm1990 can you please review now?
1.Removed htmltocode fun and used code props
2. Used another state for props copy

[s-vamshi]

@sm1990 I have submitted the form for previous PR as part of Hacktoberfest, should I submit the form another response with this PR link?

[sm1990]

@sm1990 I have submitted the form for previous PR as part of Hacktoberfest, should I submit the form another response with this PR link?

Yes please. Thank you again for your your contribution 😄