Skip to content

Commit 0483776

Browse files
committed
[BLD-26] Portal: AI Chat UI improvements (#7764)
<!-- ## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000): ## Notes for the reviewer Anything important to call out? Be sure to also clarify these in your comments. ## How to test Unit tests, playground, etc. --> <!-- start pr-codex --> --- ## PR-Codex overview This PR primarily focuses on enhancing the UI components and improving the styling, particularly around the `ScrollShadow` component. It also introduces new animations and adjusts various layouts for better responsiveness. ### Detailed summary - Removed `ScrollShadow.tsx` and its CSS module. - Updated color in `NextTopLoader` from `--link-foreground` to `--foreground`. - Added `sonner` package for toasts. - Integrated `ScrollShadow` in multiple components. - Adjusted layout styles in `page.tsx` and `MarkdownRenderer.tsx`. - Enhanced `Chat` component with `ScrollShadow` for better scrolling behavior. - Introduced `TextShimmer` and `UnderlineLink` components. - Improved styling and responsiveness in various components. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex --> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Introduced a shimmering text effect for loading states. * Added a customizable toast notification system with theme support. * Added an underlined link component for consistent link styling. * **Enhancements** * Refined chat interface with improved empty state, message rendering, feedback handling, and visual distinction between user and AI messages. * Updated markdown rendering for improved link, heading, list, and paragraph styles. * Improved icon rendering with unique ID management and monochrome support. * Adjusted chat page and loader bar styling for better layout and color consistency. * **Bug Fixes** * Corrected React key usage in code snippet rendering to use unique platform IDs. * **Refactor** * Modularized chat message rendering and feedback logic. * Updated import paths for scroll shadow components across multiple files. * **Chores** * Updated dependencies to include the "sonner" package. * Cleaned up whitespace, formatting, and removed unused lint comments. * Adjusted Tailwind configuration for border radius and added shimmer animation. * **Removals** * Deleted legacy scroll shadow component and associated CSS. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
1 parent cd142f9 commit 0483776

20 files changed

+405
-404
lines changed

apps/portal/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@
3434
"remark-gfm": "4.0.1",
3535
"server-only": "^0.0.1",
3636
"shiki": "1.27.0",
37+
"sonner": "2.0.6",
3738
"tailwind-merge": "^2.6.0",
3839
"tailwindcss-animate": "^1.0.7",
3940
"thirdweb": "workspace:*",

apps/portal/src/app/chat/page.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const queryClient = new QueryClient();
88
export default function ChatPage() {
99
return (
1010
<QueryClientProvider client={queryClient}>
11-
<div className="m-auto flex h-[calc(100vh-4rem)] w-full flex-col overflow-hidden lg:size-[calc(100vh-8rem)]">
11+
<div className="flex h-[calc(100vh-65px)] flex-col overflow-hidden lg:h-[calc(100vh-102px)]">
1212
<Chat />
1313
</div>
1414
</QueryClientProvider>

apps/portal/src/app/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export default function RootLayout({
4343
enableSystem={false}
4444
>
4545
<NextTopLoader
46-
color="hsl(var(--link-foreground))"
46+
color="hsl(var(--foreground))"
4747
height={2}
4848
shadow={false}
4949
showSpinner={false}

0 commit comments

Comments
 (0)