[PR #182] [MERGED] feat: Streamdown integration and UI/UX improvements #190

Closed
opened 2026-02-16 10:16:23 -05:00 by yindo · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/langgenius/webapp-conversation/pull/182
Author: @lyzno1
Created: 9/14/2025
Status: Merged
Merged: 9/15/2025
Merged by: @crazywoola

Base: mainHead: feature/streamdown-and-fixes


📝 Commits (10+)

  • 9ff81c0 fix: update cookies() usage for Next.js 15 compatibility
  • ba95a43 fix: assistant answer pb
  • 3025356 feat: question use streamdown
  • 2d42690 fix: max answer bubble width
  • 672ad29 Integrate Streamdown and optimize chat layout
  • c907432 fix: send button ui
  • 7a07e8d Fix auto-scroll for page-level scrolling
  • 532aba0 fix: filter empty URLs in image gallery to prevent browser reload
  • 0cb8fdc fix: await params in dynamic route for Next.js 15 compatibility
  • 18a4229 Error: Route "/api/messages/[messageId]/feedbacks" used params.messageId. params should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis

📊 Changes

19 files changed (+77 additions, -60 deletions)

View changed files

📝 app/api/conversations/[conversationId]/name/route.ts (+2 -2)
📝 app/api/messages/[messageId]/feedbacks/route.ts (+2 -2)
📝 app/api/utils/common.ts (+3 -3)
📝 app/components/base/image-gallery/index.tsx (+6 -3)
📝 app/components/base/streamdown-markdown.tsx (+1 -1)
📝 app/components/base/tooltip/index.tsx (+29 -17)
📝 app/components/chat/answer/index.tsx (+1 -1)
📝 app/components/chat/index.tsx (+3 -3)
📝 app/components/chat/question/index.tsx (+2 -2)
📝 app/components/index.tsx (+19 -14)
📝 app/components/welcome/index.tsx (+0 -1)
📝 app/layout.tsx (+2 -2)
📝 config/index.ts (+1 -1)
📝 i18n/lang/app.fr.ts (+0 -1)
📝 i18n/lang/common.fr.ts (+0 -1)
📝 i18n/lang/tools.fr.ts (+0 -1)
📝 i18n/server.ts (+4 -3)
📝 package.json (+1 -1)
📝 types/app.ts (+1 -1)

📄 Description

Summary

Integrate Streamdown library for optimized AI streaming and fix various UI/UX issues including layout, scrolling, and Next.js 15 compatibility.

Key Changes

  • Streamdown Integration: Replace react-markdown with Streamdown for better AI streaming support
  • Next.js 15 Compatibility: Update async cookies/headers API usage in i18n and layout
  • Auto-scroll Fix: Implement scrollIntoView API for reliable page-level auto-scrolling
  • Image Gallery: Add URL validation to prevent empty src browser reload errors
  • Console Error Fix: Resolve react-tooltip setState warning in useEffect

Technical Details

  • Added streamdown package (v1.2.0) for improved markdown streaming
  • Made getLocaleOnServer and LocaleLayout async for Next.js 15
  • Fixed dynamic route params awaiting in feedback API route
  • Improved auto-scroll with timeout and scrollIntoView for better UX
  • Added URL filtering in image gallery to prevent invalid image sources

Dependencies

This PR should be merged after #181 (ESLint v9 migration) to avoid conflicts.

Split from #180 for easier review.

🤖 Generated with Claude Code

Co-Authored-By: Claude noreply@anthropic.com


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/langgenius/webapp-conversation/pull/182 **Author:** [@lyzno1](https://github.com/lyzno1) **Created:** 9/14/2025 **Status:** ✅ Merged **Merged:** 9/15/2025 **Merged by:** [@crazywoola](https://github.com/crazywoola) **Base:** `main` ← **Head:** `feature/streamdown-and-fixes` --- ### 📝 Commits (10+) - [`9ff81c0`](https://github.com/langgenius/webapp-conversation/commit/9ff81c0306201b422aa49a663a02cb18d26cba3f) fix: update cookies() usage for Next.js 15 compatibility - [`ba95a43`](https://github.com/langgenius/webapp-conversation/commit/ba95a431b3bf02dddc065cf9829169a67923ee3d) fix: assistant answer pb - [`3025356`](https://github.com/langgenius/webapp-conversation/commit/3025356fa76d76c6675710bbfbe83ab861264ad6) feat: question use streamdown - [`2d42690`](https://github.com/langgenius/webapp-conversation/commit/2d426902bd40b7d97d0a61e22e53ffbf23006f7d) fix: max answer bubble width - [`672ad29`](https://github.com/langgenius/webapp-conversation/commit/672ad29e5dcc7c7d55a43247867b9ffc438c1143) Integrate Streamdown and optimize chat layout - [`c907432`](https://github.com/langgenius/webapp-conversation/commit/c907432782c3f3f744f43f2f209155e97fd55f45) fix: send button ui - [`7a07e8d`](https://github.com/langgenius/webapp-conversation/commit/7a07e8d56b47d07afa63f4de5e40f3d7652efd5e) Fix auto-scroll for page-level scrolling - [`532aba0`](https://github.com/langgenius/webapp-conversation/commit/532aba026a89d6bc14293c274feb9c0fd5c6eb23) fix: filter empty URLs in image gallery to prevent browser reload - [`0cb8fdc`](https://github.com/langgenius/webapp-conversation/commit/0cb8fdcf158f4d30773a62d3a87e2528af8328bf) fix: await params in dynamic route for Next.js 15 compatibility - [`18a4229`](https://github.com/langgenius/webapp-conversation/commit/18a4229464e495170c20588d4c0865b5216c1862) ✨Error: Route "/api/messages/[messageId]/feedbacks" used `params.messageId`. `params` should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis ### 📊 Changes **19 files changed** (+77 additions, -60 deletions) <details> <summary>View changed files</summary> 📝 `app/api/conversations/[conversationId]/name/route.ts` (+2 -2) 📝 `app/api/messages/[messageId]/feedbacks/route.ts` (+2 -2) 📝 `app/api/utils/common.ts` (+3 -3) 📝 `app/components/base/image-gallery/index.tsx` (+6 -3) 📝 `app/components/base/streamdown-markdown.tsx` (+1 -1) 📝 `app/components/base/tooltip/index.tsx` (+29 -17) 📝 `app/components/chat/answer/index.tsx` (+1 -1) 📝 `app/components/chat/index.tsx` (+3 -3) 📝 `app/components/chat/question/index.tsx` (+2 -2) 📝 `app/components/index.tsx` (+19 -14) 📝 `app/components/welcome/index.tsx` (+0 -1) 📝 `app/layout.tsx` (+2 -2) 📝 `config/index.ts` (+1 -1) 📝 `i18n/lang/app.fr.ts` (+0 -1) 📝 `i18n/lang/common.fr.ts` (+0 -1) 📝 `i18n/lang/tools.fr.ts` (+0 -1) 📝 `i18n/server.ts` (+4 -3) 📝 `package.json` (+1 -1) 📝 `types/app.ts` (+1 -1) </details> ### 📄 Description ## Summary Integrate Streamdown library for optimized AI streaming and fix various UI/UX issues including layout, scrolling, and Next.js 15 compatibility. ## Key Changes - **Streamdown Integration**: Replace react-markdown with Streamdown for better AI streaming support - **Next.js 15 Compatibility**: Update async cookies/headers API usage in i18n and layout - **Auto-scroll Fix**: Implement scrollIntoView API for reliable page-level auto-scrolling - **Image Gallery**: Add URL validation to prevent empty src browser reload errors - **Console Error Fix**: Resolve react-tooltip setState warning in useEffect ## Technical Details - Added `streamdown` package (v1.2.0) for improved markdown streaming - Made `getLocaleOnServer` and `LocaleLayout` async for Next.js 15 - Fixed dynamic route params awaiting in feedback API route - Improved auto-scroll with timeout and scrollIntoView for better UX - Added URL filtering in image gallery to prevent invalid image sources ## Dependencies This PR should be merged **after** #181 (ESLint v9 migration) to avoid conflicts. Split from #180 for easier review. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
yindo added the pull-request label 2026-02-16 10:16:23 -05:00
yindo closed this issue 2026-02-16 10:16:23 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/webapp-conversation#190