Skip to content

fix(sider): pass correct collapsed state to Title component#7302

Closed
AmateurMind wants to merge 3 commits into
refinedev:mainfrom
AmateurMind:main
Closed

fix(sider): pass correct collapsed state to Title component#7302
AmateurMind wants to merge 3 commits into
refinedev:mainfrom
AmateurMind:main

Conversation

@AmateurMind

Copy link
Copy Markdown

Problem

Users reported that ThemedTitle custom text was not working when used inside Sider's Title prop (issue #7239).

Root Cause

The mobile drawer implementation was passing collapsed={false} instead of the actual siderCollapsed state to custom Title components across all UI libraries.

Solution

Changed collapsed={false} to collapsed={siderCollapsed} in all UI libraries:

  • packages/mui/src/components/themedLayout/sider/index.tsx (line 434)
  • packages/antd/src/components/themedLayout/sider/index.tsx (line 227)
  • packages/chakra-ui/src/components/themedLayout/sider/index.tsx (line 275)
  • packages/mantine/src/components/themedLayout/sider/index.tsx (line 228)

Impact

✅ Custom Title components now receive correct collapse state on all screen sizes
✅ ThemedTitle custom text works correctly in responsive layouts
✅ All existing tests pass
✅ No breaking changes introduced

Fixes #7239

Fixes refinedev#7239 where ThemedTitle custom text was not working in mobile drawer.
Changed collapsed={false} to collapsed={siderCollapsed} in all UI libraries.

- packages/mui/src/components/themedLayout/sider/index.tsx
- packages/antd/src/components/themedLayout/sider/index.tsx
- packages/chakra-ui/src/components/themedLayout/sider/index.tsx
- packages/mantine/src/components/themedLayout/sider/index.tsx
@AmateurMind AmateurMind requested a review from a team as a code owner February 24, 2026 11:53
@changeset-bot

changeset-bot Bot commented Feb 24, 2026

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 411dd00

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@AmateurMind AmateurMind closed this Mar 2, 2026
@AmateurMind AmateurMind reopened this Mar 2, 2026
@alicanerdurmaz

Copy link
Copy Markdown
Collaborator

Hey @AmateurMind, thanks for the contribution!

collapsed={false} in the mobile drawer is intentional. The mobile drawer always opens at full width (200-240px), so the title should always show in expanded form (icon + text). siderCollapsed tracks the desktop sidebar state — if a user collapses the sidebar on desktop then switches to mobile, your change would show a collapsed title (icon only) inside a 200px wide drawer, which is broken UX.

Also, issue #7239 is about custom Title components not rendering at all — that's unrelated to the collapsed prop value. The collapsed prop only toggles the text visibility ({!collapsed && }), it doesn't control whether the custom component renders. I wasn't able to reproduce the original issue either. Closing this PR — thanks again for looking into it!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] ThemedTitle is not working

2 participants