chore: Agent chat annotated label in query pane (#40237)

## Description

| Before | After |
|--------|--------|
| <img width="150" alt="Screenshot 2025-04-14 at 11 54 32"
src="https://github.com/user-attachments/assets/bcd2fe01-be2d-4105-aad9-92ea6b71f830"
/> | <img width="175" alt="Screenshot 2025-04-14 at 11 48 26"
src="https://github.com/user-attachments/assets/6f910ae6-1975-4ead-bb88-bd681c0161c3"
/> |

## Automation

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

### 🔍 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/14442989734>
> Commit: df9a8417410347c0211e0ecbf9fdceb887810177
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=14442989734&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Sanity`
> Spec:
> <hr>Mon, 14 Apr 2025 10:51:05 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

- **Style**
  - Enhanced dark mode appearance with a more consistent color scheme.
  - Updated code block typography and styling for improved readability.
- Refined the visual presentation of code elements, including fonts,
colors, and spacing.
  - Modified the copy button appearance to a neutral style.
- Introduced an annotated label with a dotted underline for clearer
visual cues.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
vadim 2025-04-14 15:28:29 +02:00 committed by GitHub
parent 88484a4fbb
commit 4783df3c37
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -42,6 +42,13 @@ const Header = styled.div`
justify-content: space-between;
`;
const AnnotatedLabel = styled(Text)`
text-decoration-line: underline;
text-decoration-style: dotted;
text-decoration-color: var(--ads-v2-color-border-emphasis);
text-underline-offset: var(--ads-v2-spaces-1);
`;
const ConfigItems = styled.div`
display: flex;
flex-direction: column;
@ -115,9 +122,9 @@ export const FunctionCallingConfigForm = ({
content="Function calling allows the agent to intelligently fetch data, perform actions, and generate accurate, real-time responses."
>
<Flex alignItems="center" flexDirection="row" gap="spaces-2">
<Text isBold kind="heading-s" renderAs="p">
<AnnotatedLabel isBold kind="heading-s" renderAs="p">
Functions
</Text>
</AnnotatedLabel>
<Icon name="info" size="md" />
</Flex>
</Tooltip>