🐛 fix(sidebar-drawer): Fix drawer positioning and title style by Innei · Pull Request #11655 · lobehub/lobehub

Innei · 2026-01-20T12:13:33Z

💻 Change Type

🔗 Related Issue

Resolves LOBE-3356

🔀 Description of Change

Fixed the SideBarDrawer component styling issues:

Added explicit width and position constraints (bottom, top, overflow, width) to the drawer's rootStyle to ensure proper positioning within the sidebar
Increased title font weight from 400 to 600 for better readability and visual hierarchy
Adjusted title padding from 4px to 8px for better spacing

These changes ensure the drawer displays correctly without overflow issues and maintains consistent styling.

🧪 How to Test

Tested locally
Added/updated tests
No tests needed

Navigate to the home page with the agent list
Open the "All Agents" drawer
Verify the drawer:
- Is properly positioned within the sidebar
- Does not overflow the sidebar container
- Has a bold title with proper spacing

📸 Screenshots / Videos

Before	After
...	...

📝 Additional Information

This fix addresses the sidebar drawer positioning and title styling issues reported in LOBE-3356.

Summary by Sourcery

Adjust sidebar drawer layout and header text styling for correct in-sidebar positioning and improved title emphasis.

Bug Fixes:

Ensure sidebar drawer is absolutely positioned within the sidebar with fixed width and constrained top/bottom to prevent overflow and misalignment.

Enhancements:

Increase sidebar drawer title prominence by using a heavier font weight and larger left padding for better readability and spacing.

- Add explicit width and position constraints to drawer root style - Set title font weight to 600 for better readability - Add debug button for all agents drawer toggle (temporary) Resolves LOBE-3356

vercel · 2026-01-20T12:13:38Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
lobehub	Error		Jan 20, 2026 2:12pm

gru-agent · 2026-01-20T12:13:46Z

TestGru Assignment

Summary

Link	CommitId	Status	Reason
Detail	`e8288ab`	🚫 Skipped	No files need to be tested {"src/features/NavPanel/SideBarDrawer.tsx":"File path does not match include patterns."}

History Assignment

Tip

You can @gru-agent and leave your feedback. TestGru will make adjustments based on your input

sourcery-ai · 2026-01-20T12:14:06Z

Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Adjusts the SideBarDrawer’s layout constraints and title styling to fix positioning/overflow issues and improve visual hierarchy within the sidebar.

Class diagram for updated SideBarDrawer layout and title styling

classDiagram

  class SideBarDrawerProps {
    +ReactNode subHeader
    +boolean open
    +function onClose
    +ReactNode children
    +ReactNode title
    +ReactNode action
  }

  class SideBarDrawer {
    +SideBarDrawerProps props
    -number size = 280
    +render()
  }

  class Drawer {
    +boolean closable
    +string destroyOnClose
    +string footer
    +string getContainer
    +string mask
    +boolean maskClosable
    +boolean open
    +string placement
    +object rootStyle
    +number size
    +object styles
    +string title
  }

  class SideBarHeaderLayout {
    +ReactNode left
    +ReactNode right
  }

  class Text {
    +boolean ellipsis
    +number fontSize
    +object style
    +number weight
  }

  SideBarDrawer ..> SideBarDrawerProps : uses
  SideBarDrawer ..> Drawer : renders
  SideBarDrawer ..> SideBarHeaderLayout : renders
  SideBarDrawer ..> Text : renders_title

  class DrawerRootStyle {
    +number bottom = 0
    +string overflow = hidden
    +string position = absolute
    +number top = 0
    +string width
  }

  DrawerRootStyle <.. Drawer : rootStyle

  class TitleStyle {
    +number paddingLeft = 8
    +number fontWeight = 600
  }

  TitleStyle <.. Text : style

File-Level Changes

Change	Details	Files
Constrain drawer positioning and sizing within the sidebar container to prevent overflow.	Introduce a local size constant and use it for the Drawer size prop instead of a magic number Extend Drawer rootStyle to be absolutely positioned with explicit top and bottom bounds Set rootStyle overflow to hidden to avoid content spilling outside the sidebar Specify a fixed width on rootStyle that matches the Drawer size to keep layout consistent	`src/features/NavPanel/SideBarDrawer.tsx`
Refine drawer title typography and spacing for better readability.	Wrap string titles with a Text component configured for ellipsis and 14px font size Increase title font weight and left padding via inline style while maintaining the existing weight prop for compatibility	`src/features/NavPanel/SideBarDrawer.tsx`

Tips and commands

Interacting with Sourcery

Trigger a new review: Comment @sourcery-ai review on the pull request.
Continue discussions: Reply directly to Sourcery's review comments.
Generate a GitHub issue from a review comment: Ask Sourcery to create an
issue from a review comment by replying to it. You can also reply to a
review comment with @sourcery-ai issue to create an issue from it.
Generate a pull request title: Write @sourcery-ai anywhere in the pull
request title to generate a title at any time. You can also comment
@sourcery-ai title on the pull request to (re-)generate the title at any time.
Generate a pull request summary: Write @sourcery-ai summary anywhere in
the pull request body to generate a PR summary at any time exactly where you
want it. You can also comment @sourcery-ai summary on the pull request to
(re-)generate the summary at any time.
Generate reviewer's guide: Comment @sourcery-ai guide on the pull
request to (re-)generate the reviewer's guide at any time.
Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
pull request to resolve all Sourcery comments. Useful if you've already
addressed all the comments and don't want to see them anymore.
Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
request to dismiss all existing Sourcery reviews. Especially useful if you
want to start fresh with a new review - don't forget to comment
@sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

Enable or disable review features such as the Sourcery-generated pull request
summary, the reviewer's guide, and others.
Change the review language.
Add, remove or edit custom review instructions.
Adjust other review settings.

Getting Help

Contact our support team for questions or feedback.
Visit our documentation for detailed guides and information.
Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

sourcery-ai

Hey - I've found 1 issue, and left some high level feedback:

The Text component now sets fontWeight: 600 in style while still passing weight={400}, which is conflicting and may be confusing; consider using a single source of truth for the font weight.
The drawer width is now hardcoded via const size = 280 and width: ${size}px``; if this width is shared or design-driven, consider centralizing it in a theme/token or constant module to avoid future divergence.

Prompt for AI Agents

Please address the comments from this code review:

## Overall Comments
- The `Text` component now sets `fontWeight: 600` in `style` while still passing `weight={400}`, which is conflicting and may be confusing; consider using a single source of truth for the font weight.
- The drawer width is now hardcoded via `const size = 280` and `width: `${size}px``; if this width is shared or design-driven, consider centralizing it in a theme/token or constant module to avoid future divergence.

## Individual Comments

### Comment 1
<location> `src/features/NavPanel/SideBarDrawer.tsx:69-70` </location>
<code_context>
+                  <Text
+                    ellipsis
+                    fontSize={14}
+                    style={{ fontWeight: 600, paddingLeft: 8 }}
+                    weight={400}
+                  >
                     {title}
</code_context>

<issue_to_address>
**issue:** Avoid conflicting font weight definitions between the `style` prop and the `weight` prop.

Here the inline style sets `fontWeight: 600` while the `weight` prop is `400`, which is confusing and may resolve inconsistently. Please keep the font weight defined in one place—either match the `weight` prop to 600 or remove the inline `fontWeight`.
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

codecov · 2026-01-20T12:18:56Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 74.60%. Comparing base (dbb9285) to head (e8288ab).
⚠️ Report is 19 commits behind head on next.

Additional details and impacted files

@@           Coverage Diff           @@
##             next   #11655   +/-   ##
=======================================
  Coverage   74.60%   74.60%           
=======================================
  Files        1187     1187           
  Lines       93621    93621           
  Branches    10811    10811           
=======================================
  Hits        69842    69842           
  Misses      23689    23689           
  Partials       90       90

Flag	Coverage Δ
app	`67.64% <ø> (ø)`
database	`93.55% <ø> (ø)`
packages/agent-runtime	`89.18% <ø> (ø)`
packages/context-engine	`85.29% <ø> (ø)`
packages/conversation-flow	`92.41% <ø> (ø)`
packages/file-loaders	`88.66% <ø> (ø)`
packages/memory-user-memory	`69.75% <ø> (ø)`
packages/model-bank	`100.00% <ø> (ø)`
packages/model-runtime	`86.70% <ø> (ø)`
packages/prompts	`79.33% <ø> (ø)`
packages/python-interpreter	`92.90% <ø> (ø)`
packages/ssrf-safe-fetch	`0.00% <ø> (ø)`
packages/utils	`93.25% <ø> (ø)`
packages/web-crawler	`95.62% <ø> (ø)`

Flags with carried forward coverage won't be shown. Click here to find out more.

Components	Coverage Δ
Store	`68.52% <ø> (ø)`
Services	`50.86% <ø> (ø)`
Server	`68.27% <ø> (ø)`
Libs	`41.13% <ø> (ø)`
Utils	`93.82% <ø> (ø)`

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

lobehubbot · 2026-01-20T14:39:51Z

❤️ Great PR @Innei ❤️

The growth of project is inseparable from user feedback and contribution, thanks for your contribution! If you are interesting with the lobehub developer community, please join our discord and then dm @arvinxx or @canisminor1990. They will invite you to our private developer channel. We are talking about the lobe-chat development or sharing ai newsletter around the world.

## [Version 2.0.0-next.325](v2.0.0-next.324...v2.0.0-next.325) <sup>Released on **2026-01-20**</sup> #### ♻ Code Refactoring - **ModelSwitchPanel**: Migrate from Popover to DropdownMenu with virtual scrolling. #### 🐛 Bug Fixes - **sidebar-drawer**: Fix drawer positioning and title style. <br/> <details> <summary><kbd>Improvements and Fixes</kbd></summary> #### Code refactoring * **ModelSwitchPanel**: Migrate from Popover to DropdownMenu with virtual scrolling, closes [#11663](#11663) ([c9d9dff](c9d9dff)) #### What's fixed * **sidebar-drawer**: Fix drawer positioning and title style, closes [#11655](#11655) ([cf5320e](cf5320e)) </details> <div align="right"> [![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top) </div>

lobehubbot · 2026-01-20T15:28:01Z

🎉 This PR is included in version 2.0.0-next.325 🎉

The release is available on:

Your semantic-release bot 📦🚀

## [Version 1.153.0](v1.152.0...v1.153.0) <sup>Released on **2026-01-23**</sup> #### ♻ Code Refactoring - **auth**: Remove NEXT_PUBLIC_AUTH_URL env variable. - **model-select**: Migrate FunctionCallingModelSelect to LobeSelect. - **ModelSwitchPanel**: Migrate from Popover to DropdownMenu with virtual scrolling. - **userMemories**: Removed un-used code. - **misc**: Improve memory data with experience and identity, move vercel-react-best-practices skills to .agents directory. #### ✨ Features - **database**: Added user memory activity. - **desktop**: Add legacy local database detection and migration guidance. - **misc**: Add platform-aware download client menu option, add server version check for desktop app, remove Clerk authentication code, skill setting page and skill store, support agent group unpublish agents, support client tasks mode, update the sandbox preinstall libs in sys role. #### 🐛 Bug Fixes - **copilot**: Pass correct scope when creating new session in PageEditor. - **desktop**: Gracefully handle missing update manifest 404 errors. - **model-runtime**: Filter unsupported image types (SVG) before sending to vision models. - **pdf**: Upgrade pdfjs-dist and react-pdf to v5.x. - **sidebar-drawer**: Fix drawer positioning and title style. - **misc**: Fix group broadcast trigger tool use, fix local system tools, fix memory schema, fix multi agent tasks issue, fix multi tasks no summary issue, fix scope issue, fix tool argument scape and improve multi task run, fixed the sandbox tools call when error should use right callback, improve e2e server and complete i18n resources, slove the agent group editor not focus in editdata area, slove the agents header switch agents the lobeAI not show problem, sloved the old removeSessionTopics not work, TypewriterEffect not refreshing on language change, updata cron job ui & fixed commnuity pagenation goto error, update the agentbuilder tools not always use humanIntervention. #### 💄 Styles - **misc**: Improve auto scroll and group profile, update og, update share style. <br/> <details> <summary><kbd>Improvements and Fixes</kbd></summary> #### Code refactoring * **auth**: Remove NEXT_PUBLIC_AUTH_URL env variable, closes [lobehub#11658](https://github.com/jaworldwideorg/OneJA-Bot/issues/11658) ([c0f9875](c0f9875)) * **model-select**: Migrate FunctionCallingModelSelect to LobeSelect, closes [lobehub#11664](https://github.com/jaworldwideorg/OneJA-Bot/issues/11664) ([ad51305](ad51305)) * **ModelSwitchPanel**: Migrate from Popover to DropdownMenu with virtual scrolling, closes [lobehub#11663](https://github.com/jaworldwideorg/OneJA-Bot/issues/11663) ([c9d9dff](c9d9dff)) * **userMemories**: Removed un-used code, closes [lobehub#11713](https://github.com/jaworldwideorg/OneJA-Bot/issues/11713) ([89750fc](89750fc)) * **misc**: Improve memory data with experience and identity, closes [lobehub#11717](https://github.com/jaworldwideorg/OneJA-Bot/issues/11717) ([bdb3eb4](bdb3eb4)) * **misc**: Move vercel-react-best-practices skills to .agents directory, closes [lobehub#11703](https://github.com/jaworldwideorg/OneJA-Bot/issues/11703) ([6df7731](6df7731)) #### What's improved * **database**: Added user memory activity, closes [lobehub#11680](https://github.com/jaworldwideorg/OneJA-Bot/issues/11680) ([0160fbd](0160fbd)) * **desktop**: Add legacy local database detection and migration guidance, closes [lobehub#11682](https://github.com/jaworldwideorg/OneJA-Bot/issues/11682) ([5664b84](5664b84)) * **misc**: Add platform-aware download client menu option, closes [lobehub#11676](https://github.com/jaworldwideorg/OneJA-Bot/issues/11676) ([55abddc](55abddc)) * **misc**: Add server version check for desktop app, closes [lobehub#11710](https://github.com/jaworldwideorg/OneJA-Bot/issues/11710) ([0cf2723](0cf2723)) * **misc**: Remove Clerk authentication code, closes [lobehub#11711](https://github.com/jaworldwideorg/OneJA-Bot/issues/11711) ([395595a](395595a)) * **misc**: Skill setting page and skill store, closes [lobehub#11665](https://github.com/jaworldwideorg/OneJA-Bot/issues/11665) ([d8c0c26](d8c0c26)) * **misc**: Support agent group unpublish agents, closes [lobehub#11687](https://github.com/jaworldwideorg/OneJA-Bot/issues/11687) ([4e060be](4e060be)) * **misc**: Support client tasks mode, closes [lobehub#11666](https://github.com/jaworldwideorg/OneJA-Bot/issues/11666) ([98cf57b](98cf57b)) * **misc**: Update the sandbox preinstall libs in sys role, closes [lobehub#11688](https://github.com/jaworldwideorg/OneJA-Bot/issues/11688) ([404c577](404c577)) #### What's fixed * **copilot**: Pass correct scope when creating new session in PageEditor, closes [lobehub#11714](https://github.com/jaworldwideorg/OneJA-Bot/issues/11714) ([0259270](0259270)) * **desktop**: Gracefully handle missing update manifest 404 errors, closes [lobehub#11625](https://github.com/jaworldwideorg/OneJA-Bot/issues/11625) ([13e95b9](13e95b9)) * **model-runtime**: Filter unsupported image types (SVG) before sending to vision models, closes [lobehub#11698](https://github.com/jaworldwideorg/OneJA-Bot/issues/11698) ([c0c99a7](c0c99a7)) * **pdf**: Upgrade pdfjs-dist and react-pdf to v5.x, closes [lobehub#11686](https://github.com/jaworldwideorg/OneJA-Bot/issues/11686) ([2b620df](2b620df)) * **sidebar-drawer**: Fix drawer positioning and title style, closes [lobehub#11655](https://github.com/jaworldwideorg/OneJA-Bot/issues/11655) ([cf5320e](cf5320e)) * **misc**: Fix group broadcast trigger tool use, closes [lobehub#11646](https://github.com/jaworldwideorg/OneJA-Bot/issues/11646) ([831a9b3](831a9b3)) * **misc**: Fix local system tools, closes [lobehub#11702](https://github.com/jaworldwideorg/OneJA-Bot/issues/11702) ([6548fc7](6548fc7)) * **misc**: Fix memory schema, closes [lobehub#11645](https://github.com/jaworldwideorg/OneJA-Bot/issues/11645) ([3baf780](3baf780)) * **misc**: Fix multi agent tasks issue, closes [lobehub#11672](https://github.com/jaworldwideorg/OneJA-Bot/issues/11672) ([9de773b](9de773b)) * **misc**: Fix multi tasks no summary issue, closes [lobehub#11685](https://github.com/jaworldwideorg/OneJA-Bot/issues/11685) ([26ce317](26ce317)) * **misc**: Fix scope issue, closes [lobehub#11719](https://github.com/jaworldwideorg/OneJA-Bot/issues/11719) ([17adde8](17adde8)) * **misc**: Fix tool argument scape and improve multi task run, closes [lobehub#11691](https://github.com/jaworldwideorg/OneJA-Bot/issues/11691) ([b13bb8a](b13bb8a)) * **misc**: Fixed the sandbox tools call when error should use right callback, closes [lobehub#11721](https://github.com/jaworldwideorg/OneJA-Bot/issues/11721) ([e8fce68](e8fce68)) * **misc**: Improve e2e server and complete i18n resources, closes [lobehub#11678](https://github.com/jaworldwideorg/OneJA-Bot/issues/11678) ([d450dd9](d450dd9)) * **misc**: Slove the agent group editor not focus in editdata area, closes [lobehub#11677](https://github.com/jaworldwideorg/OneJA-Bot/issues/11677) ([9ac84e6](9ac84e6)) * **misc**: Slove the agents header switch agents the lobeAI not show problem, closes [lobehub#11726](https://github.com/jaworldwideorg/OneJA-Bot/issues/11726) ([f45f508](f45f508)) * **misc**: Sloved the old removeSessionTopics not work, closes [lobehub#11671](https://github.com/jaworldwideorg/OneJA-Bot/issues/11671) ([06d41e5](06d41e5)) * **misc**: TypewriterEffect not refreshing on language change, closes [lobehub#11657](https://github.com/jaworldwideorg/OneJA-Bot/issues/11657) ([ba30f46](ba30f46)) * **misc**: Updata cron job ui & fixed commnuity pagenation goto error, closes [lobehub#11700](https://github.com/jaworldwideorg/OneJA-Bot/issues/11700) ([42ad2a0](42ad2a0)) * **misc**: Update the agentbuilder tools not always use humanIntervention, closes [lobehub#11696](https://github.com/jaworldwideorg/OneJA-Bot/issues/11696) ([0d3017b](0d3017b)) #### Styles * **misc**: Improve auto scroll and group profile, closes [lobehub#11725](https://github.com/jaworldwideorg/OneJA-Bot/issues/11725) ([550acc2](550acc2)) * **misc**: Update og, closes [lobehub#11709](https://github.com/jaworldwideorg/OneJA-Bot/issues/11709) ([01cf4e4](01cf4e4)) * **misc**: Update share style, closes [lobehub#11716](https://github.com/jaworldwideorg/OneJA-Bot/issues/11716) ([3c70dfa](3c70dfa)) </details> <div align="right"> [![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top) </div>

🐛 fix(sidebar-drawer): Fix drawer positioning and title style

e8288ab

- Add explicit width and position constraints to drawer root style - Set title font weight to 600 for better readability - Add debug button for all agents drawer toggle (temporary) Resolves LOBE-3356

dosubot bot added the size:S This PR changes 10-29 lines, ignoring generated files. label Jan 20, 2026

dosubot bot added the 💄 Design Design and style issues label Jan 20, 2026

sourcery-ai bot reviewed Jan 20, 2026

View reviewed changes

vercel bot had a problem deploying to Preview January 20, 2026 14:12 Failure

Innei merged commit cf5320e into next Jan 20, 2026
45 of 46 checks passed

Innei deleted the fix/sidebar-drawer-style branch January 20, 2026 14:39

lobehubbot added the released on @next label Jan 20, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

🐛 fix(sidebar-drawer): Fix drawer positioning and title style#11655

🐛 fix(sidebar-drawer): Fix drawer positioning and title style#11655
Innei merged 1 commit intonextfrom
fix/sidebar-drawer-style

Innei commented Jan 20, 2026 •

edited by sourcery-ai bot

Loading

Uh oh!

vercel bot commented Jan 20, 2026 •

edited

Loading

Uh oh!

gru-agent bot commented Jan 20, 2026 •

edited

Loading

Uh oh!

sourcery-ai bot commented Jan 20, 2026 •

edited

Loading

Reviewer's Guide

Class diagram for updated SideBarDrawer layout and title styling

File-Level Changes

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Uh oh!

codecov bot commented Jan 20, 2026 •

edited

Loading

Uh oh!

Uh oh!

lobehubbot commented Jan 20, 2026

Uh oh!

lobehubbot commented Jan 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

Innei commented Jan 20, 2026 • edited by sourcery-ai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

💻 Change Type

🔗 Related Issue

🔀 Description of Change

🧪 How to Test

📸 Screenshots / Videos

📝 Additional Information

Summary by Sourcery

Uh oh!

vercel bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

gru-agent bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

TestGru Assignment

Summary

Uh oh!

sourcery-ai bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviewer's Guide

Class diagram for updated SideBarDrawer layout and title styling

File-Level Changes

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

codecov bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Uh oh!

lobehubbot commented Jan 20, 2026

Uh oh!

lobehubbot commented Jan 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Innei commented Jan 20, 2026 •

edited by sourcery-ai bot

Loading

vercel bot commented Jan 20, 2026 •

edited

Loading

gru-agent bot commented Jan 20, 2026 •

edited

Loading

sourcery-ai bot commented Jan 20, 2026 •

edited

Loading

codecov bot commented Jan 20, 2026 •

edited

Loading