Replace Toast notifications with inline feedback for "Code Copied" action

[ShubhamOulkar]

Description

Problem Currently, when a user clicks the "Copy" button on a code block, the website triggers a global toast notification at the bottom of the screen to indicate success.

While visually common, this pattern introduces significant accessibility and usability issues. Recent discussions (referenced below) highlight that toast notifications are often problematic because:

1. Timing: They often disappear too quickly for some users to read.
2. Focus/Screen Readers: Assistive technology often misses them if focus isn't managed perfectly, leaving the user unsure if the action succeeded.
3. Cognitive Load: They appear far away from the user's current locus of attention (the code block), making them easy to overlook.

Reference: Primer Design System: Toast Accessibility

Proposed Solution

We should remove the Toast dependency for the "Copy" action and instead implement inline feedback.

When the user clicks the copy button:

• The feedback should appear inside the code block header, directly adjacent to or replacing the button itself.
• Example: The copy icon could briefly change to a "Checkmark" icon, or the text "Copy" could change to "Copied!".
• Benefit: This keeps the feedback within the user's current field of vision and is more logically associated with the trigger action.

Ref Slack message