From 8c478a7e023edaf456946f0908990cbd5e6a706c Mon Sep 17 00:00:00 2001
From: vadim <vadim@appsmith.com>
Date: Fri, 4 Apr 2025 14:52:59 +0200
Subject: [PATCH] chore: Improvide codeblock in WDS Markdown (#40094)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Description

Added icon change, added left padding to the language name.

### After


https://github.com/user-attachments/assets/c68b3804-f3b5-4e9b-8edf-bd7220af317d

### Before


https://github.com/user-attachments/assets/35abf9cd-8141-40b2-8746-797c8f5a8c5e

## Automation

/ok-to-test tags="@tag.Sanity"

### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/14264621511>
> Commit: 06355e33b652355eb9aacdf05a724aa907f520ed
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=14264621511&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Sanity`
> Spec:
> <hr>Fri, 04 Apr 2025 12:28:35 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [x] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Enhanced the copy button within code snippets to provide dynamic
visual feedback—displaying updated text and icons when a copy action is
successful.
  - Improved component spacing for a cleaner, more polished layout.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../src/components/Markdown/src/mdComponents/Code.tsx     | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/app/client/packages/design-system/widgets/src/components/Markdown/src/mdComponents/Code.tsx b/app/client/packages/design-system/widgets/src/components/Markdown/src/mdComponents/Code.tsx
index e4f4fb3c37..1b395792c6 100644
--- a/app/client/packages/design-system/widgets/src/components/Markdown/src/mdComponents/Code.tsx
+++ b/app/client/packages/design-system/widgets/src/components/Markdown/src/mdComponents/Code.tsx
@@ -31,9 +31,15 @@ export const Code = (props: CodeProps) => {
         alignItems="center"
         justifyContent="space-between"
         padding="spacing-1"
+        paddingLeft="spacing-4"
       >
         <Text size="caption">{match[1]}</Text>
-        <Button icon="copy" onPress={handleCopy} size="small" variant="ghost">
+        <Button
+          icon={copied ? "check" : "copy"}
+          onPress={handleCopy}
+          size="small"
+          variant="ghost"
+        >
           {copied ? "Copied!" : "Copy"}
         </Button>
       </Flex>