Truncate long agent descriptions text (#7924)

Truncate long agent descriptions to prevent overflow outside the agent
card container

### What problem does this PR solve?

Now the Long text of description will overflow from the agent card,
should display the long text properly with truncate.

<img width="275" alt="Screenshot 2025-05-28 220329"
src="https://github.com/user-attachments/assets/954b3a48-bcab-4669-a42f-6981d4bf859f"
/>

<img width="275" alt="Screenshot 2025-05-28 220353"
src="https://github.com/user-attachments/assets/f385d95a-3e40-4117-b412-ae6a4508e646"
/>


### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
- [ ] New Feature (non-breaking change which adds functionality)
- [ ] Documentation Update
- [ ] Refactoring
- [ ] Performance Improvement
- [ ] Other (please describe):

web/src/pages/flow/list/flow-card/index.tsx

@@ -51,7 +51,9 @@ const FlowCard = ({ item }: IProps) => {
             >
               {item.title}
             </Typography.Title>
-            <p>{item.description}</p>
+            <p className="truncate" title={item.description}>
+              {item.description}
+            </p>
           </div>
           <div className={styles.footer}>
             <div className={styles.bottom}>